SHARE
TWEET

contact-form-CSS

tolikpunkoff Mar 1st, 2017 77 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. form#contact  {
  2.     border:1px solid #e5e5e5;
  3.     padding:10px;
  4.     background:#e9ffd0;
  5.     border-radius:5px;
  6. }
  7. #contact label {
  8.     font-size: 14px;
  9. }
  10. #contact input:required:valid {
  11.     box-shadow: 0 0 3px #BCEF89;
  12.     border-color: #BCEF89!important;
  13.     background: #fff url(images/valid.png) no-repeat 98% center;
  14. }
  15. #contact textarea:required:valid {
  16.     box-shadow: 0 0 3px #BCEF89;
  17.     border-color: #BCEF89!important;
  18. }
  19. #contact input:focus:invalid {
  20.     box-shadow: 0 0 3px #FFDF97;
  21.     border-color: #FFDF97!important;
  22.     background: #fff url(images/invalid.png) no-repeat 98% center;
  23. }
  24. #contact textarea:focus:invalid {
  25.     box-shadow: 0 0 3px #FFDF97;
  26.     border-color: #FFDF97!important;
  27. }
  28. .err {
  29.     border: 1px solid #ff8c00;
  30.     padding: 10px;
  31.     background: #FFDF97;
  32.     text-align: left;
  33.     border-radius: 3px;
  34. }
  35. .ok {
  36.     border: 1px #BCEF89 solid;
  37.     margin-bottom: 15px;
  38.     padding: 10px;
  39.     background: #f5f9fd;
  40.     text-align: center;
  41.     border-radius: 3px;
  42. }
  43. #author, #email, #url {
  44.     width: 30%;
  45.     padding: 5px;
  46.     border-radius: 5px;
  47.     border: 1px solid #e5e5e5;
  48. }
  49. #comment {
  50.     padding: 5px;
  51.     border-radius: 5px;
  52.     border: 1px solid #e5e5e5;
  53.     overflow: auto;
  54. }
  55. #submit {
  56.     font-weight: 400;
  57.     background: #393;
  58.     font-size: 15px;
  59.     color: #fff;
  60.     padding: 10px 50px;
  61.     border: none;
  62.     cursor: pointer;
  63. }
RAW Paste Data
Want to get better at CSS?
Learn to code CSS in 2017
Pastebin PRO Summer Special!
Get 40% OFF on Pastebin PRO accounts!
Top