@charset "utf-8";

/* honeypot field - hidden from users */
.hp-field { position: absolute; left: -9999px; height: 0; overflow: hidden; }

h1{ color: #0b5394; font-size: 3.4rem; font-weight: bold; text-align: center; }

@media only screen and (max-width: 1119px){
  h1{ font-size: 3.0rem; }
}

@media only screen and (max-width: 640px){
  h1{ font-size: 2.8rem; }
}


.contact{ width: 100%; max-width: 640px; margin: 0px auto; padding: 50px 0px; }

p.thanks-message{ text-align: center; }
p.thanks-message.error{ color: #ff0000; }

@media only screen and (max-width: 640px){
  .contact{ width: auto; max-width: auto; margin: 0px 15px; }
}
form dl{ margin: 40px auto 0px; text-align: left; }
form dl dt{ margin: 20px 0px 0px; padding: 10px; font-size: 1.6rem; font-weight: bold; border-radius: 5px; line-height: 1.4; background: #efefef; }
form dl dt span{ display: inline-block; margin: 0px 7.5px 0px 0px; padding: 2.5px 7.5px; color: #fff; font-size: 1.2rem; vertical-align: top; border-radius: 3px; background-color: #ce3b2a; }
form dl dt span.nini{ background-color: #a0a0a0; }
form.confirm dl dt{ font-weight: 500; }
form dl dd{ position: relative; margin: 10px 0px 0px; }
form.confirm dl dd{ margin: 20px 15px 0px; font-weight: bold; }
form dl dd span{ display: block; margin: 5px 0px 0px; color: #808080; font-size: 1.4rem; }
form input[type="text"]{ width: 100%; padding: 7.5px 12.5px; font-size: 1.7rem; border: 1px #d0d0d0 solid; border-radius: 3px; outline: 0; }
form select{ padding: 10px 15px; color: #3f3f3f; font-size: 1.7rem; border: 1px #d0d0d0 solid; border-radius: 3px; outline: 0; }
form textarea{ width: 100%; height: 300px; margin: 0px; padding: 7.5px 12.5px; font-size: 1.8rem; border: 1px #d0d0d0 solid; border-radius: 3px; outline: 0; }
form input[type="text"]:hover,
form select:hover,
form textarea:hover{ border: 1px #0b5394 solid; background-color: #f6f6f6; }
form input[type="text"]:focus,
form select:focus,
form textarea:focus{ border: 1px #00aa00 solid; background-color: #ffffcc; }
::placeholder{ color: #9f9f9f; font-size: 1.7rem; font-weight: normal; }
form input[type="text"]:focus::placeholder,
form textarea:focus::placeholder{ opacity: 0; }

form ul{ margin: 15px 0px 0px 0px; }
form ul li{ margin: 5px 0px 0px; }

form label{ font-size: 1.7rem; cursor: pointer; }
form label:hover{ color: #0b5394; text-decoration: underline; }

form input[type=radio],
form input[type=checkbox]{ display: inline-block; width: 18px; height: 18px; margin: 0px 0px 0px 10px; vertical-align: top; cursor: pointer; opacity: 0; }

form input + label::before{ display: inline-block; margin-left: -12px; margin-bottom: 4px; padding-right: 7px; content: "\f0c8"; color: #afafaf; font-size: 2.0rem; font-weight: 400; font-family: "Font Awesome 6 Free";  line-height: 1; vertical-align: middle; }
form input[type="radio"] + label::before{ content: "\f111"; }

form input:checked + label::before{ content: "\f14a";  color: #0b5394; font-weight: 900; }
form input[type="radio"]:checked + label::before{ content: "\f058"; }

form input[type="radio"]:hover + label,
form input[type="radio"]:focus + label,
form input[type="checkbox"]:hover + label,
form input[type="checkbox"]:focus + label{ color: #0b5394; font-weight: bold; text-decoration: underline; }

form input[type="radio"]:hover + label::before,
form input[type="radio"]:focus + label::before,
form input[type="checkbox"]:hover + label::before,
form input[type="checkbox"]:focus + label::before{ color: #0b5394; }

form input[type="radio"]:disabled{ cursor: auto; }
form input[type="radio"]:disabled + label{ color: #9f9f9f; text-decoration: line-through; cursor: auto; }
form input[type="radio"]:disabled:hover + label{ color: #9f9f9f; font-weight: normal; }
form input[type="radio"]:disabled + label:before{ content: "\f111"; color: #dfdfdf; font-weight: 900; }

form button[type=submit]{ display: block; width: 500px; margin: 50px auto 0px; padding: 15px 0px 12px; color: #fff; font-size: 1.8rem; font-weight: 700; text-align: center; border: 2px #0b5394 solid; border-radius: 3px; background: #0b5394; cursor: pointer; transition: all 0.3s; }
form button[type=submit]:after{ display: inline-block; padding-left: 10px; font-family: "Font Awesome 6 Free"; content: '\f101'; color: #fff; font-size: 1.8rem; font-weight: 900; }
form button[type=submit]:hover{ color: #0b5394; background: #fff; }
form button[type=submit]:hover::after{ color: #fff; }

form span.attention{ display: inline; }

@media only screen and ( max-width: 1119px ){
  form input[type=radio],
  form input[type=checkbox]{ width: 16px; height: 16px; }
  form button[type=submit]{ width: 100%; margin: 50px 0px 0px; font-size: 1.7rem; }
  form span.attention{ display: block; margin: 2.5px 0px 0px 35px; }

  .confirm form dl dt{ color: #6f6f6f; font-weight: 700; }
  .confirm form dl dd{ padding: 10px; font-weight: bold; }
  .confirm form button[type="submit"]{ margin-top: 0px; }
}


@media only screen and (max-width: 640px){
  form dl dt{ font-size: 1.5rem; }
  form dl dt span{ font-size: 1.2rem; }
  form input[type="text"]{ font-size: 1.5rem; }
  form select{ padding: 8px 10px; font-size: 1.5rem; }
  form textarea{ height: 200px; font-size: 1.5rem; }
  form label{ font-size: 1.5rem; }
  form input[type=radio], form input[type=checkbox]{ margin: 0px 0px 0px 7.5px; }
  form button[type=submit]{ padding: 10px 0px; font-size: 1.7rem; }
  ::placeholder{ font-size: 1.5rem; }
}


/* Z-INDEX */
.formError { z-index: 990; }
.formError .formErrorContent { z-index: 991; }
.formError .formErrorArrow { z-index: 996; }
.ui-dialog .formError { z-index: 5000; }
.ui-dialog .formError .formErrorContent { z-index: 5001; }
.ui-dialog .formError .formErrorArrow { z-index: 5006; }
.inputContainer { position: relative; float: left; }
.formError { position: absolute; top: 300px; left: 300px; display: block; cursor: pointer; text-align: left; }
.formError.inline { position: relative; top: 0; left: 0; display: inline-block; }
.ajaxSubmit { padding: 20px; background: #55ea55; border: 1px solid #999; display: none; }
.formError .formErrorContent { width: 100%; background: #ee0101; position:relative; color: #fff; min-width: 100px; font-size: 11px; border: 2px solid #ddd; box-shadow: 0 0 6px #000;
  -moz-box-shadow: 0 0 6px #000;  -webkit-box-shadow: 0 0 6px #000; -o-box-shadow: 0 0 6px #000;padding: 4px 10px 4px 10px; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; -o-border-radius: 6px; }
.formError.inline .formErrorContent { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; border: none; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; -o-border-radius: 0; }
.greenPopup .formErrorContent { background: #33be40; }
.blackPopup .formErrorContent { background: #393939; color: #FFF; }
.formError .formErrorArrow { width: 15px; margin: -2px 0 0 20px; position:relative; }
body[dir='rtl'] .formError .formErrorArrow, body.rtl .formError .formErrorArrow { margin: -2px 13px 0 0; }
.formError .formErrorArrowBottom { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; margin: 0px 0 0 12px; top:2px; }
.formError .formErrorArrow div { border-left: 2px solid #ddd; border-right: 2px solid #ddd; box-shadow: 0 2px 3px #444; -moz-box-shadow: 0 2px 3px #444; -webkit-box-shadow: 0 2px 3px #444; -o-box-shadow: 0 2px 3px #444; font-size: 0px; height: 1px; background: #ee0101; margin: 0 auto; line-height: 0; font-size: 0; display: block; }
.formError .formErrorArrowBottom div { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; }
.greenPopup .formErrorArrow div { background: #33be40; }
.blackPopup .formErrorArrow div { background: #393939; color: #FFF; }
.formError .formErrorArrow .line10 { width: 13px; border: none; }
.formError .formErrorArrow .line9 { width: 11px; border: none; }
.formError .formErrorArrow .line8 { width: 11px; }
.formError .formErrorArrow .line7 { width: 9px; }
.formError .formErrorArrow .line6 { width: 7px; }
.formError .formErrorArrow .line5 { width: 5px; }
.formError .formErrorArrow .line4 { width: 3px; }
.formError .formErrorArrow .line3 { width: 1px; border-left: 2px solid #ddd; border-right: 2px solid #ddd; border-bottom: 0 solid #ddd; }
.formError .formErrorArrow .line2 { width: 3px; border: none; background: #ddd; }
.formError .formErrorArrow .line1 { width: 1px; border: none; background: #ddd; }
form .formError + input, form .formError + select, form .formError + textarea{ border-color: #c8151e; background-color: #fff4f4; }
form .formError + input::placeholder, form .formError + textarea::placeholder{ color: #c8151e; }