﻿.contact-form { width: 100%; }

    .contact-form *,
    .contact-form *::before,
    .contact-form *::after { box-sizing: border-box; }

    .contact-form p { margin: 20px 0 6px; padding: 0; color: #222; font-size: 16px; }

        .contact-form p.desc { margin: 2px 0 8px; padding: 0; color: #555; font-size: 14px; font-style: italic; }

        .contact-form p .manditory { color: #d32222; font-size: 15px; font-weight: bold; }

    .contact-form input,
    .contact-form textarea,
    .contact-form select { width: 100%; margin: 0; padding: 12px 14px; color: #111; font: 16px Arial, Verdana, sans-serif; }

    .contact-form input,
    .contact-form textarea,
    .contact-form select { max-width: none; background-color: #fff; border: 1px solid #c8c8c8; border-radius: 4px; outline: none; transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease; -webkit-appearance: none; }

        .contact-form input:focus,
        .contact-form textarea:focus,
        .contact-form select:focus { background-color: #fafafa; border-color: #888; box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.07); }

        .contact-form input[type="file"] { padding: 10px; }

        .contact-form input[type="radio"],
        .contact-form input[type="checkbox"] { width: auto; padding: 0; margin-right: 6px; vertical-align: middle; }

    .contact-form textarea { min-height: 180px; resize: vertical; }

    .contact-form label { display: inline-block; margin: 0; padding-left: 6px; font-size: 16px; line-height: 1.5; }

    .contact-form input.validationerror,
    .contact-form textarea.validationerror,
    .contact-form select.validationerror,
    .contact-form .validationerror { background-color: #fdefef; border-color: #dfc5c5; color: #c14949; }

    .contact-form .validationerror { padding: 8px; }

    .contact-form input[type="submit"] { width: 100%; margin-top: 24px; padding: 14px 22px; background: #eee; border: 1px solid #ccc; border-bottom-color: #bbb; border-radius: 4px; color: #333; font-size: 16px; font-weight: bold; cursor: pointer; transition: background-color 0.15s ease, border-color 0.15s ease; -webkit-appearance: none; }

        .contact-form input[type="submit"]:hover { background-color: #e6e6e6; border-color: #bbb; }

        .contact-form input[type="submit"]:active { background-color: #ddd; }

    .contact-form .errorlist,
    .contact-form .okmessage { width: 100%; padding: 14px; margin: 16px 0 0; border: 1px solid; font-size: 15px; font-weight: bold; }

    .contact-form .errorlist { background-color: #fdefef; border-color: #dfc5c5; color: #c14949 !important; }

        .contact-form .errorlist ul,
        .contact-form .errorlist li { color: #c14949 !important; }

    .contact-form .okmessage { background-color: #f0fdef; border-color: #cfe5c8; color: #669b2f !important; }

        .contact-form .okmessage ul,
        .contact-form .okmessage li { color: #669b2f !important; }

        .contact-form .errorlist li,
        .contact-form .okmessage li { font-weight: normal !important; }

.wecaptcha { width: 100%; line-height: 48px; font-size: 22px; }

.wecaptcha-image { vertical-align: middle; border: 1px solid #ddd; }

.wecaptcha input[type="text"].wecaptcha-tbx { width: 70px; height: 48px; padding: 0 12px; border: 1px solid #ddd; text-align: center; font-size: 22px; line-height: 48px; vertical-align: middle; }

@media only screen and (max-width: 480px) {
    .contact-form input,
    .contact-form textarea,
    .contact-form select,
    .contact-form .errorlist,
    .contact-form .okmessage { width: 100% !important; }
}
