﻿.form-container {
    background: linear-gradient(180deg, #0061AE 0%, #031F3B 100%);
}
.form-left-side-question, p.form-left-side-answer, .form-right-side-button.submit.show.homepage-contact-us{
    color: white;
}
h2.form-left-side-question, p.form-left-side-answer strong {
    font-weight: 500;
}
h2.form-left-side-question span {
    color: #ff7b02;
    font-weight: 800;
}
p.form-left-side-answer {
    font-weight: 100;
}
.form-field-wrapper.checkbox {
    display: flex;
    align-items: center;
}
.form-right-side-button.submit.show.homepage-contact-us{
    background: #ff7b02;
    font-weight: 800;
    text-transform: uppercase;
    text-align: center;
}
@media (width <= 550px){
    h2.form-left-side-question {
        font-size: 8.2vw;
        line-height: 8.2vw;
    }
    p.form-left-side-answer.homepage-contact-us, .form-right-side-button.submit.show.homepage-contact-us {
        font-size: 4.5vw;
    }
    .form-right-side-button.submit.show.homepage-contact-us{
        padding-block: 3.5vw;
        border-radius: 1.5vw;
    }
}
@media (width >= 551px) and (width <= 766.9px){
    h2.form-left-side-question {
        font-size: 7.2vw;
        line-height: 7.2vw;
    }
    p.form-left-side-answer.homepage-contact-us, .form-right-side-button.submit.show.homepage-contact-us {
        font-size: 3.9vw;
    }
    .form-right-side-button.submit.show.homepage-contact-us{
        border-radius: 1vw;
    }
}
@media (width >= 551px) and (width <= 899.9px){
    .form-right-side-button.submit.show.homepage-contact-us{
        padding-block: 2vw;
    }
}
@media (width <= 766.9px){
    h2.form-left-side-question {
        padding-bottom: 5vw;
    }
    p.form-left-side-answer.homepage-contact-us {
        margin: 0 auto 5vw;
    }
    .form-right-side-button.submit.show.homepage-contact-us{
        margin-top: 5vw;
    }
}
@media (width >= 767px) and (width <= 899.9px){
    h2.form-left-side-question {
        font-size: 5.17vw;
        line-height: 5.2vw;
    }
    p.form-left-side-answer.homepage-contact-us, .form-right-side-button.submit.show.homepage-contact-us {
        font-size: 2.83vw;
    }
    p.form-left-side-answer.homepage-contact-us {
        width: 68vw;
        margin: 0 auto 3vw;
    }
    .form-right-side-button.submit.show.homepage-contact-us{
        border-radius: 0.7vw;
    }
}
@media (width >= 767px) and (width <= 1099.9px){
    h2.form-left-side-question {
        padding-bottom: 3vw;
    }
    .form-right-side-button.submit.show.homepage-contact-us{
        margin-top: 3vw;
    }
}
@media (width <= 899.9px){
    .form-left-side {
        text-align: center;
    }
}
@media (width >= 900px){
    .form-container {
        position: relative;
    }
    .form-container__image {
        position: absolute;
        opacity: 0.4;
        width: 100%;
        height: 100%;
        z-index: 0;
        top: 0;
        left: 0;
    }
    .form-container__image-car {
        background: url('/static/images/footer/contact-car.png');
        background-repeat: no-repeat;
        width: 100%;
        height: 100%;
        position: absolute;
        transform: scaleX(-1);
    }
    .form-left-side {
        z-index: 1;
        position: relative;
    }
    .form-right-side.homepage-contact-us {
        position: relative;
        z-index: 1;
    }
}
@media (width >= 900px) and (width <= 1099.9px){
    .form-container__image-car {
        background-size: 70vw;
    }
    .form-right-side.homepage-contact-us {
        width: 50vw;
    }
    h2.form-left-side-question {
        font-size: 4.41vw;
        line-height: 4.41vw;
    }
    p.form-left-side-answer.homepage-contact-us, .form-right-side-button.submit.show.homepage-contact-us {
        font-size: 2.41vw;
    }
    p.form-left-side-answer.homepage-contact-us {
        width: 49vw;
        margin: 0 0 3vw;
    }
    .form-right-side-button.submit.show.homepage-contact-us{
        border-radius: 0.5vw;
        padding-block: 1.5vw;
    }
}
@media (width >= 900px) and (width <= 1400px){
    .form-container__image-car {
        background-position: -22vw 21vw;
    }
}
@media (width >= 1100px) {
    .form-container {
        padding-block: 5vw 8vw;
    }
    h2.form-left-side-question {
        padding-bottom: 2vw;
    }   
    p.form-left-side-answer.homepage-contact-us {
        margin: 0 0 2vw;
    }
   .form-right-side-button.submit.show.homepage-contact-us{
        margin-top: 2vw;
    }
}
@media (width >= 1100px) and (width <= 1400px){
    .form-container__image-car {
        background-size: 67vw;
    }
    h2.form-left-side-question {
        font-size: 3.6vw;
        line-height: 3.6vw;
    }
    p.form-left-side-answer.homepage-contact-us, p.form-left-side-answer.homepage-contact-us {
        font-size: 2vw;
    }
    p.form-left-side-answer.homepage-contact-us {
        width: 48vw;
    }
    .form-right-side-button.submit.show.homepage-contact-us{
        border-radius: 0.4vw;
        padding-block: 1vw;
    }
}
@media (width >= 1401px){
    .form-container__image-car {
        background-size: 65vw;
        background-position: -20vw 14vw;
    }
    h2.form-left-side-question {
        font-size: 2.87vw;
        line-height: 2.9vw;
    }
    p.form-left-side-answer.homepage-contact-us, .form-right-side-button.submit.show.homepage-contact-us {
        font-size: 1.57vw;
    }
    p.form-left-side-answer.homepage-contact-us {
        width: 38vw;
    }
    .form-right-side-button.submit.show.homepage-contact-us{
        border-radius: 0.3vw;
        padding-block: 0.8vw;
    }
}


/*.form-container { background-color: var(--lightGrey); display: flex; justify-content: space-between; padding-inline: 100px; padding-top: 100px; position: relative }
.form-left-side { width: calc(50% - 130px); color: #FFF; font-family: 'Open Sans', sans-serif; position: relative; }
.form-left-side-question-wrapper { margin-left: 20px; color: var(--mainBlue) }
.form-left-side-question { font-size: 2.5rem; line-height: 2.8rem }
.form-left-side-answer { font-size: 1.5rem; font-weight: 300; margin-top: 20px; line-height: 2rem }
.form-left-side-answer > strong { font-weight: 500 }
.form-left-side-image { width: 140%; height: auto; opacity: 0.8; position: absolute; top: 30px; right: 30px }
.form-right-side { width: 50%; position: relative }
.form-right-side-container { position: relative; display: flex; padding: 70px; max-width: 750px; row-gap: 50px; column-gap: 25px; font-family: 'Open Sans', sans-serif; background-color: #FFF; border-radius: 10px; z-index: 200; flex-wrap: wrap; box-shadow: 0 3px 6px #00000029; }
.form-right-side-title { display: block; width: 100%; color: #0057A5; font-size: 2rem; font-weight: 700; }
.form-right-side-button { display: none; padding: 15px 30px; width: 190px; color: #FFF; font-size: .75rem; text-align: center; text-transform: uppercase; background-color: #0057A5; border-radius: 8px; cursor: pointer; user-select: none; transition: .25s; }
.form-right-side-button.submitting { opacity: .75; }
.form-right-side-button.show { display: unset; }

@media (pointer: fine) {
    .form-right-side-button:hover { filter: brightness(115%); }
}

@media (min-width: 2550px) {
    .form-right-side-container { max-width: 1000px }
}

@media (max-width: 1600px) {
    .form-left-side-image { top: 60px }
}

@media (max-width: 1500px) {
    .form-left-side-question-wrapper { margin-left: 20px }
}

@media (max-width: 1400px) {
    .form-left-side-question-wrapper { margin-left: 0 }
    .form-left-side-image { width: 200%; left: -300px }
    .form-right-side-title { font-size: 1.8rem }
}

@media (min-width: 1200px) and (max-width: 1300px) {
    .form-right-side-title { font-size: 1.6rem }
}

@media (max-width: 1200px) {
    .form-container { flex-direction: column; align-items: center; padding-top: 50px; }
    .form-left-side,
    .form-right-side { display: contents; }
    .form-left-side-question-wrapper,
    .form-left-side-image { z-index: 120 }
    .form-left-side-question-wrapper { margin-left: 0px; text-align: center; margin-bottom: 40px }
    .form-left-side-image { display: none }
    .form-right-side-container { position: relative; right: 0; z-index: 100; margin-bottom: 50px }
    .form-right-side-container:after { content: ''; width: 100%; height: 60%; position: absolute; top: 0; right: 0; background-image: url(/static/images/footer/contact-car.png); background-repeat: no-repeat; opacity: 0.2; z-index: 50 }
}

@media (max-width: 1025px) {
    .form-right-side-container:after { content: ''; width: 110%; }
}

@media (max-width: 767px) {
    .form-container { padding-inline: 20px }
    .form-right-side-container { width: 90%; max-width: fit-content; }
    .form-right-side-container:after { content: ''; width: 110%; }
}

@media (max-width: 600px) {
    .form-right-side-container { width: 100%; padding: 35px }
}

@media (max-width: 480px) {
    .form-container { padding-top: 40px; scroll-margin-top: -20px; }
    .form-left-side-question { font-size: 2rem; line-height: 2.3rem; }
    .form-left-side-question-wrapper { margin-bottom: 0px }
    .form-left-side-answer { font-size: 1.1rem; line-height: 1.5rem }
    .form-right-side-container { top: 0; margin-top: 30px; padding: 25px; }
    .form-right-side-container:after { width: 120% }
    .form-right-side-title { font-size: 1.3rem }
    .form-right-side-button { margin-top: 40px }
}*/