input[type=text] {
 width: 100%;
 padding: 12px 20px;
 margin: 8px 0;
 box-sizing: border-box;
 border: 1px solid #ccc;
 outline: none;
}
input[type=text]:focus {
 border: 1px solid #307E75;
 box-shadow:0 0 10px #9ecaed;
}
input[type=tel]:focus {
 border: 1px solid #307E75;
 box-shadow:0 0 10px #9ecaed;
}
.input-error{
 border: 1px solid #d9534f !important;
 background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23d9534f' viewBox='0 0 500 500'%3e%3cpath d='M354.492 325.195l-75.195-75.195 75.195-75.195-29.297-29.297-75.195 75.195-75.195-75.195-29.297 29.297 75.195 75.195-75.195 75.195 29.297 29.297 75.195-75.195 75.195 75.195zM250 41.992c115.234 0 208.008 92.773 208.008 208.008s-92.773 208.008-208.008 208.008-208.008-92.773-208.008-208.008 92.773-208.008 208.008-208.008z'%3e%3c/path%3e%3c/svg%3e") no-repeat right center !important;
 background-size: 25px !important;
 background-position: right 10px center !important;
 padding-right: 35px !important;
}
.input-valid{
 border: 1px solid #5cb85c !important;
 background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%235cb85c' viewBox='0 0 500 500'%3e%3cpath d='M208.008 354.492l187.5-187.5-29.297-30.273-158.203 158.203-74.219-74.219-29.297 29.297zM250 41.992c115.234 0 208.008 92.773 208.008 208.008s-92.773 208.008-208.008 208.008-208.008-92.773-208.008-208.008 92.773-208.008 208.008-208.008z'%3e%3c/path%3e%3c/svg%3e") no-repeat right center !important;
 background-size: 25px !important;
 background-position: right 10px center !important;
 padding-right: 35px !important;
}
.input-required-mark{
 color: #d9534f;
 font-weight: bolder;
}