:root {
    --cf-login-icon-width: 24px;
    --cf-login-icon-height: 24px;
    --cf-form-grid-margin: 24px;
}

.cf-header .cf-contact-text h3 {
    color: var(--cf-color-dark-blue);
    margin-bottom: var(--cf-form-grid-margin);
    display: flex;
}

    .cf-header .cf-contact-text h3 i {
        width: var(--cf-login-icon-width);
        height: var(--cf-login-icon-height);
        margin-top: 2px;
        margin-right: 8px;
    }

.cf-header .cf-contact-text .cf-back-to-home {
    display: flex;
    margin-bottom: var(--cf-form-grid-margin);
}

.cf-header .cf-contact-text p.cf-p3 {
    color: var(--cf-color-black);
}

    .cf-contact-form.cf-contact-text p.cf-p3 a {
        color: var(--cf-color-button-blue);
        font-weight: 700;
    }

.cf-header .cf-show-success .cf-success {
    background-color: rgba(77, 211, 55, .1);
    padding: 16px 20px;
    margin-bottom: 24px;
    width: 50%
}

.cf-header .cf-contact-text {
    grid-row-start: 1;
    grid-column: span 12;
}

.cf-contact-form .cf-name {
    grid-row-start: 3;
    grid-column: span 4;
    margin-bottom: var(--cf-form-grid-margin);
}

.cf-contact-form .cf-email {
    grid-row-start: 4;
    grid-column: span 4;
    margin-bottom: var(--cf-form-grid-margin);
}

.cf-contact-form .cf-message {
    grid-row-start: 5;
    grid-column: span 4;
    margin-bottom: var(--cf-form-grid-margin);
}

.cf-header .help-text {
    margin-bottom: var(--cf-form-grid-margin);
}

.cf-contact-form .cf-contact-submit {
    grid-row-start: 6;
    grid-column: span 4;
    margin-bottom: var(--cf-form-grid-margin);
}

.cf-contact-form .message textarea {
    height: 100%;
}

.cf-contact-form .cf-show-success .cf-success {
    background-color: rgba(77, 211, 55, .1);
    padding: 16px 20px;
}


@media only screen and (max-width: 1024px) {
    .cf-contact-form .cf-name, .cf-contact-form .cf-email, .cf-contact-form .cf-message, .cf-contact-form .cf-contact-submit {
        grid-column: span 6;
    }

    .cf-header .cf-show-success .cf-success {
        width: 100%
    }
}

@media only screen and (max-width: 768px) {
    .cf-contact-form .cf-name, .cf-contact-form .cf-email, .cf-contact-form .cf-message, .cf-contact-form .cf-contact-submit {
        grid-column: span 12;
    }
}