/****************************/
/* Contact Form
/****************************/
form input.field-input, form textarea.field-input {
	display: block;
    width: 100%;
    background: #fff;
    outline: none;
    border-radius: 5px;
    -webkit-box-shadow: hsla(0,0%,79.2%,.5) 0 2px 6px 1px;
    box-shadow: 0 2px 6px 1px hsla(0,0%,79.2%,.5);
    border: 1px solid transparent;
    color: #666;
    padding: 1.25em .75em .375em;
    padding-left: 2.625em;
    padding-right: 2.625em;
    line-height: 1.2;
    height: auto;
}
form input.field-input:focus { border-color: #0d6366; }

.cf7sr-g-recaptcha { margin-bottom: 15px; }

/*form.wpcf7-form {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-sizing: border-box;
}*/

.input-animation {
    position: relative;
    display: inline-block;
    width: 100%;
    vertical-align: top;
}

.input-animation br { display: none !important; }

.input-animation > i:first-of-type {
    left: .8125em;
    right: auto;
    position: absolute;
    top: 35%;
    -webkit-transform: translateY(-35%);
    transform: translateY(-35%);
    width: 18px;
    height: 18px;
}

.input-animation > i.icon-user:first-of-type { background: url(../images/user.svg) no-repeat 50% 50% / contain transparent; }
.input-animation > i.icon-email:first-of-type { background: url(../images/email-dark.svg) no-repeat 50% 50% / contain transparent; }
.input-animation > i.icon-phone:first-of-type { background: url(../images/phone-dark.svg) no-repeat 50% 50% / contain transparent; }
.input-animation > i.icon-business:first-of-type { background: url(../images/suit-case.svg) no-repeat 50% 50% / contain transparent; }
.input-animation > i.icon-comment:first-of-type { background: url(../images/comment.svg) no-repeat 50% 50% / contain transparent; }
.input-animation > i.icon-check-mark:last-of-type { background: url(../images/check.svg) no-repeat 50% 50% / contain transparent; }

form textarea.field-input {
    padding-left: 42px;
    padding-top: 20px;
    height: 125px;
}
.input-animation > i.icon-comment:first-of-type {
	top: 0;
    -webkit-transform: translateY(80%);
    transform: translateY(80%);
}
form div { position: relative; }
.input-animation label {
    color: #848484;
    cursor: text;
    left: 2.625em;
    line-height: 1.2;
    margin-top: 1px;
    pointer-events: none;
    position: absolute;
    top: .8125em;
    -webkit-transform-origin: left top;
    transform-origin: left top;
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
    font-size: 1em;
    transform: translateY(0);
}
form input.field-input:focus + label, form textarea.field-input:focus + label {
	transition: all .25s ease-in-out;
	-webkit-transform: translateY(-9px) scale(.75);
    transform: translateY(-9px) scale(.75);
    color: #0d6366;
}
form .input-animation.filled input + label, form .input-animation.filled textarea + label {
    -webkit-transform: translateY(-9px) scale(.75);
    transform: translateY(-9px) scale(.75);
    color: #0d6366;
}
form .input-animation.not-filled input:focus + label, form .input-animation.not-filled textarea:focus + label {
	color: red;
	-webkit-transform: translateY(-9px) scale(.75);
    transform: translateY(-9px) scale(.75);
}
form .input-animation.not-filled input + label, form .input-animation.not-filled textarea + label { color: red; }
form .input-animation.not-filled input, form .input-animation.not-filled textarea { border-color: red; }
.input-animation > i:last-of-type {
    right: .8125em;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-90%);
    transform: translateY(-90%);
    width: 18px;
    height: 18px;
}
.input-animation.filled > i:last-of-type { display: block !important; }

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
input:-webkit-autofill, 
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #fff inset;
  transition: background-color 5000s ease-in-out 0s;
}
/*input[type=submit] {
    background: #0d6366;
    color: #fff;
    border: 2px solid #0d6366;
    padding: 8px 28px;
    border: none;
    border-radius: 0;
}
input[type=submit]:hover {
    background: #5b6f76;
    border-color: #5b6f76;
    color: #fff;
    cursor: pointer;
}*/
#form button { margin-bottom: 25px; }

div.wpcf7-validation-errors, div.wpcf7-acceptance-missing, div.wpcf7-spam-blocked, div.wpcf7-mail-sent-ok {
    display: table !important;
    position: relative;
    top: 15px;
    width: 100%;
    text-align: center;
}

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

    .contact-page .medium-9, .become-a-retailer-page .medium-9 { width: 100%; }
    .contact-page .medium-3, .become-a-retailer-page .medium-3 { width: 100%; }

}