/* CSS Document - Don't prefix gradients for: Chrome 26+, Firefox 16+, Opera 12.10+, IE10+ */
#form_warning { background: rgba(231, 76, 60, 0.75); color: #FFF; text-align: center; font: 600 13px/18px "Open Sans", Arial, sans-serif; width: 312px; padding: 5px 8px; border: 1px solid rgba(231, 76, 60, 0.5); margin: 0 auto 5px; border-radius: 5px; }

#contact_form { background: #FFF; position: relative; width: 336px; border: 1px solid #AAA; margin: 0 auto; border-radius: 3px; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.4); }
#contact_form fieldset { position: relative; }
#contact_form label { position: relative; top: 0; left: 0; height: 60px; margin: 0 8px 0; display: block; }
#contact_form label span { position: absolute; top: 0; left: 0; font: 600 13px/30px "Open Sans", Arial, sans-serif; }
#contact_form label span strong { color: #D45252; margin-left: 2px; }
#contact_form label input { background-color: #F7F7F7; position: absolute; top: 30px; left: 0; height: 28px; width: 308px; padding: 0 5px; border: 1px solid #AAA; font: 13px/28px "Open Sans", Arial, sans-serif; border-radius: 3px; }
#contact_form label input.name, #contact_form label input[type="email"], #contact_form label input[type="url"] { background-image: url("../style/Contact_Sprite.png"); background-repeat: no-repeat; width: 278px; padding: 0 10px 0 30px; }
#contact_form label input.name { background-position: 5px 4px; }
#contact_form label input[type="email"] { background-position: 5px 50%; }
#contact_form label input[type="url"] { background-position: 5px -76px; }
#contact_form label[for="message"] { height: 140px; }
#contact_form label textarea { position: absolute; top: 30px; left: 0; height: 100px; width: 310px; padding: 4px; border: 1px solid #AAA; background-color: #F7F7F7; font: 13px/20px "Open Sans", Arial, sans-serif; border-radius: 3px; resize: horizontal; }
#contact_form #form_head { height: 34px; border-bottom: 1px solid #AAA; margin: 0 8px 0; }
#contact_form #form_head h2 { position: absolute; top: 0; left: 0; height: 34px; margin: 0 0 0 4px; font: 700 1.5em/34px "Open Sans", Arial, sans-serif; }
#contact_form #form_head .required_notification { position: absolute; top: 0; right: 0; height: 34px; margin: 0 4px 0 0; color: #D45252; font: 600 11px/34px "Open Sans", Arial, sans-serif; }
#contact_form #msg { height: 140px; }
#contact_form #btns { height: 30px; width: 320px; margin: 5px 8px; }
#contact_form #btns input { color: #FFF; position: absolute; top: 0; width: 143px; padding: 4px 5px; border: 1px solid #AAA; border-radius: 3px; text-align: center; font: 600 16px/20px "Open Sans", Arial, sans-serif; }
#contact_form #btns input[type="reset"] { background: linear-gradient(180deg, #B10000 0%, #910000 100%); box-shadow: 0 1px 0 0 #D50000 inset; left: 0; border-color: #910000 #910000 #900; text-shadow: 0 -1px 0 #670000; }
#contact_form #btns input[type="submit"] { background: linear-gradient(180deg, #68B12F 0%, #50911E 100%); box-shadow: 0 1px 0 0 #9FD574 inset; right: 0; border-color: #509111 #509111 #5B992B; text-shadow: 0 -1px 0 #396715; }
#contact_form #btns input[type="reset"]:hover, #contact_form #btns input[type="submit"]:hover { opacity: 0.85; }

section p { margin: 8px 0 0 0; text-align: center; font-weight: 600; font-size: 14px; }

/*  MEDIA QUERIES  */
@media screen and (min-width: 1024px) { #contact_form { width: 666px; }
  #contact_form label { width: 320px; margin: 0 0 0 8px; }
  #contact_form label[for="surname"] { position: absolute; right: 0; left: auto; margin: 0 8px 0 0; }
  #contact_form label[for="website"] { position: absolute; top: 60px; right: 0; left: auto; margin: 0 8px 0 0; }
  #contact_form label[for="message"] { width: 650px; margin: 0 8px; }
  #contact_form label textarea { width: 640px; }
  #contact_form label[for="human"] { margin: 0 auto; }
  #contact_form #btns { margin: 5px auto; } }