#contact {
    background-color: #FFFFFF;
    border: 1px solid #000000;
    box-shadow: 0 0 5px 0 #C0C0C0;
    display: block;
    margin: 20px auto;
    max-width: 640px;
    padding: 2% 3%;
    width: 100%;
}
#contact h1 {
    text-align: center;
}
#contact fieldset {
    border: medium none;
    padding: 0;
}
#contact legend {
    border-bottom: 1px solid #ECECEC;
    border-left: none;
    border-right: none;
    border-top: none;
    color: #767676;
    font-weight: lighter;
    margin: 0 0 3%;
    padding: 0 0 3%;
    text-align: center;
    width: 100%;
}
.clear{
    clear: both;
}

/* Form style */

label { display: inline-block; float: left; height: 26px; line-height: 26px; width: 155px; font-size: 1.5em; }
input, textarea, select { margin: 0; padding: 5px; color: #666; background: #f5f5f5; border: 1px solid #ccc; margin: 5px 0; font:1.5em "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif; -moz-border-radius: 5px; -webkit-border-radius:5px; }
input:focus, textarea:focus, select:focus { border: 1px solid #999; background-color: #fff; color:#333; }
input.submit { cursor: pointer; border: 1px solid #222; background:#333; color:#fff; -moz-border-radius: 5px; -webkit-border-radius:5px; }
input.submit:hover { background:#444; }
fieldset { padding:5px; border:1px solid #eee; -moz-border-radius: 5px; -webkit-border-radius:5px; }
legend { padding:7px 10px; font-weight:bold; color:#000; border:1px solid #eee; -moz-border-radius: 5px; -webkit-border-radius:5px; }

span.required{ font-size: 13px; color: #ff0000; } /* Select the colour of the * if the field is required. */

.def-error{ font-size: 13px; color: #ff0000; } 

.not-valid{ font-size: 13px; color: #ff0000; }
#contact-form {
    margin: auto;
    width: 100%;
}
#contact-form label {
    color: #484848;
    font-weight: lighter;
    text-align: left;
    width: 100%;
}
#contact-form .required {
    font-weight: bold;
    vertical-align: super;
}
#contact-form input , #contact-form textarea , #contact-form select{
    background-color: #EFEFEF;
    border: 1px solid #C4C4C4;
    border-radius: 2px;
    margin: 2% 0;
    padding: 1.5% 0.5% 1.5% 11%;
    width: 100%;
}
#contact-form select {
    padding: 1.5% 1% 1.5% 11%;
    width: 100%;
}
.input-feild {
    display: block;
    position: relative;
    width: 100%;
}
.input-feild .fa {
    border-right: 2px solid #CDCDCD;
    color: #CDCDCD;
    left: 8px;
    min-width: 20px;
    padding: 0.5% 2% 0.5% 0;
    position: absolute;
    top: 4px;
}
#captcha {
    margin: 25px auto;
    max-width: 400px;
    width: 100%;
}
#captcha p {
    color: #484848;
    float: left;
    margin: 7px 0 0;
}
#captcha > input {
    margin: 0 7%;
    padding: 2%;
    width: 132px;
}


#captcha h1 {
    background-color: #003399;
    color: #FFFFFF;
    float: right;
    margin: 0;
    padding: 1%;
}


#captcha img {
    float: right;
    margin: 5px 0 0;
}
#contact-form .submit {
    background-color: #1A7CEA;
    border-left:  medium none;
    border-right: none;
    border-top: none;
    border-bottom: 4px solid #0e5099;
    color: #FFFFFF;
    padding: 2%;
    width: 100%;
}
.submit-wapper {
    display: block;
    margin: auto;
    width: 100%;
}
span.not-valid {
    background-color: #EFDFDF;
    border: 1px solid #FFA9A9;
    border-radius: 2px;
    color: #FF0000;
    display: block;
    margin: 0 auto 7px;
    padding: 1%;
    text-align: center;
    width: 48%;
}
span.def-error {
    background-color: #EFDFDF;
    border: 1px solid #FFA9A9;
    border-radius: 2px;
    color: #FF0000;
    display: block;
    font-family: 'Roboto',sans-serif;
    font-size: 13px;
    margin: -5px auto auto;
    padding: 1%;
    text-align: center;
    width: 82.5%;
}
span.valid-tip {
    background-color: #E1F0D9;
    border: 1px solid #46C646;
    border-radius: 2px;
    color: #008000;
    display: block;
    font-family: 'Roboto',sans-serif;
    font-size: 14px;
    margin: 0 auto 10px;
    padding: 1% 0;
    text-align: center;
    width: 40%;
}