/* ====================================================

 @company: Siteimprove
 @contributors: Rickard Andersson, ria@siteimprove.com
 @content: Form elements

======================================================= */

/****************************************
  ==== RESETS
****************************************/

input, select, textarea, button {
  outline: none; -webkit-appearance: none;
}
button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner {
  padding: 0;
}

/****************************************
  ==== INPUTS, TEXTAREAS & LABELS
****************************************/

input[type="text"], input[type="tel"], input[type="email"], input[type="url"], input[type="number"], input[type="password"], input[type="search"], select, textarea {
  width: 100%; display: block; line-height: 20px; padding: 12px 15px; border: #e1e2e5 1px solid; outline-width: 0; outline: none; background: #fff; resize: vertical; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 0 2px 0 rgba(60,72,94,0.05); -moz-box-shadow: 0 2px 0 rgba(60,72,94,0.05); box-shadow: 0 2px 0 rgba(60,72,94,0.05);
}
textarea {
  height: 150px;
}
input[type="text"]:focus, input[type="tel"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, select:focus, textarea:focus {
  border-color: #0e38b1;
}
input[type="text"].error, input[type="tel"].error, input[type="email"].error, input[type="url"].error, input[type="number"].error, input[type="password"].error, input[type="search"].error, textarea.error {
  border-color: #f0134c !important;
}
input[type="text"]:disabled, input[type="tel"]:disabled, input[type="email"]:disabled, input[type="url"]:disabled, input[type="number"]:disabled, input[type="password"]:disabled, input[type="search"]:disabled, select:disabled, textarea:disabled {
  cursor: not-allowed; border-color: #e1e2e5; font-style: italic; color: #8e8f92;
}

/****************************************
  ==== FORM LABELS & MESSAGES
****************************************/

label {
  display: block; margin: 0 0 10px 0; cursor: pointer; font-weight: 700;
}
label .info-icon {
  position: relative; top: 3px;
}

small.form-error {
  background-color: #f0134c; color: #fff; padding: 0 5px 1px 7px; margin: 10px 0 0 0; display: inline-block; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
}

/****************************************
  ==== CHECKBOXES
****************************************/

input[type="checkbox"]:not(:checked), input[type="checkbox"]:checked {
  position: absolute; left: -9999px;
}
input[type="checkbox"]:not(:checked) + label, input[type="checkbox"]:checked + label {
  position: relative; padding: 0 0 0 32px; margin: 0; line-height: 22px; display: inline-block; font-weight: 400; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
}
input[type="checkbox"]:not(:checked) + label:before, input[type="checkbox"]:checked + label:before {
  content: ''; width: 20px; height: 20px; position: absolute; left: 0; top: 0; border: #e1e2e5 1px solid; background: #fff; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 0 2px 0 rgba(60,72,94,0.05); -moz-box-shadow: 0 2px 0 rgba(60,72,94,0.05); box-shadow: 0 2px 0 rgba(60,72,94,0.05);
}
input[type="checkbox"]:not(:checked) + label:after, input[type="checkbox"]:checked + label:after {
  content: ''; width: 20px; height: 20px; line-height: 20px; position: absolute; top: 1px; left: 1px; text-align: center; font-family: 'icons8'; font-size: 100%;
}
input[type="checkbox"]:checked + label:before {
  border-color: #0e38b1;
}
input[type="checkbox"]:checked + label:after {
  content: '\f106'; background: #0e38b1; color: #fff;
}
input[type="checkbox"]:checked:focus + label:before, input[type="checkbox"]:not(:checked):focus + label:before {
  border-color: #0e38b1; background: #fff;
}
input[type="checkbox"].error:not(:checked) + label:before {
  border-color: #f0134c;
}
input[type="checkbox"]:disabled:not(:checked) + label:before, input[type="checkbox"]:disabled:checked + label:before {
  cursor: not-allowed; border-color: #e1e2e5;
}
input[type="checkbox"]:disabled + label {
  cursor: not-allowed; color: #8e8f92; font-style: italic;
}

/****************************************
  ==== RADIO BUTTONS
****************************************/

input[type="radio"]:not(:checked), input[type="radio"]:checked {
  position: absolute; left: -9999px;
}
input[type="radio"]:not(:checked) + label, input[type="radio"]:checked + label {
  position: relative; padding: 0 0 0 32px; margin: 0 0 15px 0; line-height: 22px; display: inline-block; font-weight: 400; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
}
input[type="radio"]:not(:checked) + label:before, input[type="radio"]:checked + label:before {
  content: ''; width: 20px; height: 20px; position: absolute; left: 0; top: 0; border: #e1e2e5 1px solid; background: #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 2px 0 rgba(60,72,94,0.05); -moz-box-shadow: 0 2px 0 rgba(60,72,94,0.05); box-shadow: 0 2px 0 rgba(60,72,94,0.05);
}
input[type="radio"]:not(:checked) + label:after, input[type="radio"]:checked + label:after {
  content: ''; width: 12px; height: 12px; position: absolute; top: 5px; left: 5px; text-align: center; background: #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;
}
input[type="radio"]:checked + label:before {
  background: #fff;
}
input[type="radio"]:checked + label:after {
  background: #0e38b1;
}
input[type="radio"]:checked:focus + label:before, input[type="radio"]:not(:checked):focus + label:before {
  border-color: #0e38b1;
}
input[type="radio"].error:not(:checked) + label:before, input[type="radio"].error:checked + label:before {
  border-color: #f0134c;
}
input[type="radio"]:disabled:not(:checked) + label:before, input[type="radio"]:disabled:checked + label:before {
  cursor: not-allowed; border-color: #e1e2e5;
}
input[type="radio"]:disabled + label {
  cursor: not-allowed; color: #8e8f92; font-style: italic;
}

/****************************************
  ==== SELECTS
****************************************/

.bootstrap-select {
  width: 100%; position: relative; display: block; vertical-align: middle;
}
.bootstrap-select .dropdown-toggle {
  width: 100%; line-height: 20px; padding: 12px 45px 12px 15px; position: relative; z-index: 1; color: #3c485e; text-align: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; background: #fff; border: #e1e2e5 1px solid; outline: none; cursor: pointer; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 0 2px 0 rgba(60,72,94,0.05); -moz-box-shadow: 0 2px 0 rgba(60,72,94,0.05); box-shadow: 0 2px 0 rgba(60,72,94,0.05);
}
.bootstrap-select .dropdown-toggle:focus, .bootstrap-select .dropdown-toggle:active, .bootstrap-select.open .dropdown-toggle {
  border-color: #0e38b1; background: #fff; outline: none;
}
.bootstrap-select select {
  width: 0.5px !important; height: 100% !important; padding: 0 !important; position: absolute !important; bottom: 0; left: 50%; display: block !important; opacity: 0 !important; border: none;
}
.bootstrap-select > select.mobile-device {
  width: 100% !important; display: block !important; top: 0; left: 0; z-index: 2;
}
.bootstrap-select .dropdown-toggle:before {
  content: ""; width: 36px; height: 46px; line-height: 46px; display: block; position: absolute; top: 0; right: 0; z-index: 9; font-family: 'icons8'; content: "\f103"; font-size: 100%;
}
.bootstrap-select.open .dropdown-toggle:before {
  -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); transform: rotateX(180deg);
}
.bootstrap-select .dropdown-menu {
  width: 100%; display: none; list-style: none; background: #fff; border: #e1e2e5 1px solid; position: absolute; top: 51px; left: 0; z-index: 1003; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 0 2px 0 rgba(60,72,94,0.05); -moz-box-shadow: 0 2px 0 rgba(60,72,94,0.05); box-shadow: 0 2px 0 rgba(60,72,94,0.05);
}
.bootstrap-select.open .dropdown-menu {
  display: block;
}
.bootstrap-select .dropdown-menu.inner {
  max-height: 300px !important; overflow: auto; position: static; float: none; border: 0; padding: 0; margin: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;
}
.bootstrap-select .bs-searchbox {
  padding: 15px; border-bottom: #e1e2e5 1px solid;
}
.bootstrap-select .bs-searchbox input {
  border: 0; background: #f4f4f4;
}

.bootstrap-select .dropdown-menu li {
  margin: 0; padding: 0; font-size: 1.6em; text-align: left;
}
.bootstrap-select .dropdown-menu li:before {
  display: none;
}
.bootstrap-select .dropdown-menu li a {
  width: 100%; font-size: 1em; display: block; padding: 10px 15px; color: #3c485e; text-decoration: none; cursor: pointer; outline: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
}
.bootstrap-select .dropdown-menu li a:hover, .bootstrap-select .dropdown-menu li a:focus, .bootstrap-select .dropdown-menu li a:active, .bootstrap-select .dropdown-menu li.active a {
  text-decoration: none; background: #f4f4f4; color: #283142;
}
.bootstrap-select .dropdown-menu li.selected a {
  font-weight: 700; background: #f4f4f4; color: #283142;
}
.bootstrap-select .dropdown-menu li.hidden {
  display: none;
}
.bootstrap-select .dropdown-menu .disabled a, .bootstrap-select .dropdown-menu .disabled a:hover, .bootstrap-select .dropdown-menu .disabled a:focus {
  color: #8e8f92; font-style: italic;
}
.bootstrap-select .dropdown-menu .disabled > a:hover, .bootstrap-select .dropdown-menu .disabled > a:focus {
  text-decoration: none; cursor: not-allowed; background-color: #fff; background-image: none; filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.bootstrap-select.error .dropdown-toggle {
  border-color: #f0134c;
}
.bootstrap-select.disabled .dropdown-toggle {
  color: #8e8f92; cursor: not-allowed; border-color: #e1e2e5; font-style: italic;
}
.bootstrap-select.disabled .dropdown-toggle:hover, .bootstrap-select.disabled .dropdown-toggle:active, .bootstrap-select.disabled .dropdown-toggle:focus {
  border-color: #e1e2e5; background: #f4f4f4;
}
.bootstrap-select.disabled .dropdown-toggle:before {
  color: #e1e2e5;
}

.bootstrap-select.slim .dropdown-toggle {
  line-height: 20px; padding: 0 30px 12px 0; background: transparent; border: 0; border-bottom: #e1e2e5 2px solid; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;
}
.bootstrap-select.slim .dropdown-toggle:focus, .bootstrap-select.slim .dropdown-toggle:active, .bootstrap-select.slim.open .dropdown-toggle {
  border-color: #0e38b1;
}
.bootstrap-select.slim .dropdown-toggle:before {
  width: 20px; height: 20px; line-height: 20px;
}
.bootstrap-select.slim .dropdown-menu {
  background: #0e38b1; top: 34px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;
}
.bootstrap-select.slim .dropdown-menu.inner {
  border: 0; 
}
.bootstrap-select.slim .dropdown-menu li {
  margin: 0; padding: 0; font-size: 1.6em; text-align: left;
}
.bootstrap-select.slim .dropdown-menu li a {
  color: #fff; background: #0e38b1;
}
.bootstrap-select.slim .dropdown-menu li a:hover, .bootstrap-select.slim .dropdown-menu li a:focus, .bootstrap-select.slim .dropdown-menu li a:active, .bootstrap-select.slim .dropdown-menu li.active a {
  background: #13317b; color: #fff;
}
.bootstrap-select.slim .dropdown-menu li.selected a {
  font-weight: 700; background: #0e38b1; color: #fff;
}


/****************************************
  ==== FILE
****************************************/

.field-file {
  width: 100%; position: relative;
}
.field-file input[type=file] {
  width: 100%; height: 46px; margin: 0; opacity: 0; filter: alpha(opacity=0); position: absolute; left: 0; top: 0; z-index: 5; cursor: pointer;
}
.field-file .file-input {
  width: 100%; height: 46px; line-height: 46px; display: block; padding: 0 15px; font-size: 1.8em; color: #3c485e; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; border: #e1e2e5 1px solid; outline-width: 0; outline: none; background: #fff; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 0 2px 0 rgba(60,72,94,0.05); -moz-box-shadow: 0 2px 0 rgba(60,72,94,0.05); box-shadow: 0 2px 0 rgba(60,72,94,0.05);
}
.field-file input[type=file]:focus + .file-input {
  border-color: #0e38b1;
}
.field-file .file-btn {
  height: 30px; line-height: 30px; padding: 0 10px; color: #fff; font-size: 1.2em; background: #3c485e; position: absolute; right: 8px; top: 8px; z-index: 4; cursor: pointer; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
}
.field-file .file-input.error {
  border-color: #f44336 !important;
}

/****************************************
  ==== SHOW/HIDE PWD ICON
****************************************/

.toggle-pwd {
  position: absolute !important; top: 14px; right: 14px; cursor: pointer;
}
.toggle-pwd:before {
  font-size: 200%;
}
.toggle-pwd.visible:after {
  content: ''; width: 2px; height: 20px; display: block; position: absolute; top: 0; left: 50%; margin: 0 0 0 -1px; visibility: visible; background: #5a5a5b; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg);
}
.toggle-pwd span.s, .toggle-pwd.visible span.h {
  display: block;
}
.toggle-pwd span.h, .toggle-pwd.visible span.s {
  display: none;
}

/****************************************
  ==== PASSWORD HELPER
****************************************/

div.password-helper div.lbls small {
  line-height: 24px; margin: 0 0 5px 0; padding: 0 0 0 34px; position: relative;
}
div.password-helper div.lbls small span {
  width: 24px; height: 24px; line-height: 24px; position: absolute; top: 0; left: 0; text-align: center; background: #f4f4f4; color: #f4f4f4;
}
div.password-helper div.lbls small.fulfilled span {
  background: #0e38b1; color: #fff;
}

/****************************************
  ==== HUBSPOT HACKS
****************************************/

.hubspot-form ul.inputs-list {
  margin: 10px 0 0 0; padding: 0;
}
.hubspot-form ul.inputs-list li {
  margin: 0; padding: 0; font-size: 1em;
}
.hubspot-form ul.inputs-list li:before {
  display: none;
}
.hubspot-form ul.hs-error-msgs li label {
  background-color: #f0134c; color: #fff; font-size: 1.6em; font-weight: 400; margin: 0 0 1px 0; padding: 0 5px 1px 7px; display: inline-table; clear: both; cursor: auto; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
}
.hubspot-form ul.hs-error-msgs li label:after {
  visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;
}
.hubspot-form ul.hs-error-msgs li label a {
  color: #fff;
}
.hubspot-form input.error {
  margin: 0 0 10px 0;
}
div.submitted-message {
  font-size: 1.8em; position: relative; z-index: 10; padding: 0 0 0 47px;
}
div.submitted-message:before {
  content: '\f106'; font-family: 'icons8'; position: absolute; left: 15px; top: 5px; width: 22px; height: 22px; line-height: 22px; text-align: center; display: block; text-decoration: none; cursor: pointer; font-size: 16px; color: #fff; background: #0e38b1; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;
}

/****************************************
  ==== BREAKPOINT: 1024px
****************************************/

@media only screen and (max-width: 1024px){

input[type="text"], input[type="tel"], input[type="email"], input[type="url"], input[type="number"], input[type="password"], select, textarea {
  padding: 9px 12px;
}
.bootstrap-select .dropdown-toggle {
  padding: 9px 45px 9px 12px;
}


}

/****************************************
  ==== BREAKPOINT: 480px
****************************************/

@media only screen and (max-width: 479px){

.g-recaptcha {
  -webkit-transform: scale(0.85); -moz-transform: scale(0.85); transform: scale(0.85); -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; transform-origin: 0 0;
}

}