@font-face {
    font-family: "Creato Display Bold";
    src: url(../../fonts/CreatoDisplay-Bold.otf);
}

@font-face {
    font-family: "Creato Display Light";
    src: url(../../fonts/CreatoDisplay-Light.otf);
}

@font-face {
    font-family: "Creato Display Regular";
    src: url(../../fonts/CreatoDisplay-Regular.otf);
}

@font-face {
    font-family: "Creato Display Black";
    src: url(../../fonts/CreatoDisplay-Black.otf);
}

::-webkit-scrollbar {
    display: none;
}

body {
    padding: 0;
    margin: 0;
    overflow-x: hidden;
    overflow-y: scroll;
    background: #F3F3FF;
    width: 100vw;
    min-height: 100vh;
}

.header {
    width: 100vw;
    height: 10vh;
    background-color: white;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
}

.logo_header {
    height: 5.3vh;
    width: 20vw;
    background-image: url(https://ad-wise.fr/images/logo_header.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 6vw;
}

.logo_header:hover {
    height: 5.3vh;
    width: 20vw;
    background-image: url(https://ad-wise.fr/images/logo_header.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 6vw;
    cursor: pointer;
}

.content {
    width: 100vw;
    height: 90vh;
    background-image: url('https://ad-wise.fr/images/image_fond_accueil.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
}

.content_box {
    width: 93.75vw;
    height: 83.5vh;
    background-color: white;
    border-radius: 1vw;
    display: flex;
    flex-direction: column;
}

.avancement {
    width: 93.75vw;
    height: 9.7vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.avancement_element {
    font-family: 'Creato Display Light';
    font-size: 1.1vw;
    color: #AAAAAA;
    margin-left: 1vw;
}

.avancement_element:hover {
    font-family: 'Creato Display Light';
    font-size: 1.1vw;
    color: #AAAAAA;
    cursor: pointer;
    text-decoration: underline solid 2px #3A5DA8;
}

.avancement_element_ligne {
    font-family: 'Creato Display Bold';
    font-size: 1.1vw;
    color: #AAAAAA;
    margin-left: 1vw;
}

.avancement_element_actuel {
    font-family: 'Creato Display Light';
    font-size: 1.1vw;
    color: #3A5DA8;
    margin-left: 1vw;
}

.avancement_element_actuel:hover {
    font-family: 'Creato Display Light';
    font-size: 1.1vw;
    color: #3A5DA8;
    cursor: pointer;
    text-decoration: underline solid 2px #3A5DA8;
}

.bouton_suivant {
    height: 6.2vh;
    width: 7.8vw;
    border: none;
    border-radius: 0.5vw;
    font-family: 'Creato Display Regular';
    font-size: 1.25vw;
    color: #0D052D;
    background-color: #EAEAEA;
    margin-left: 8vw;
}

.bouton_suivant:hover {
    height: 6.2vh;
    width: 7.8vw;
    border: none;
    border-radius: 0.5vw;
    font-family: 'Creato Display Regular';
    font-size: 1.25vw;
    color: #0D052D;
    background-color: #B7CFFF;
    cursor: pointer;
}

.bouton_precedent {
    height: 6.2vh;
    width: 7.8vw;
    border: none;
    border-radius: 0.5vw;
    font-family: 'Creato Display Regular';
    font-size: 1.25vw;
    color: #0D052D;
    background-color: white;
    margin-right: 8vw;
}

.titre {
    width: 93.75vw;
    height: 8.3vh;
    font-family: 'Creato Display Light';
    font-size: 2vw;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0D052D;
}

.titre_bleu {
    font-family: 'Creato Display Bold';
    font-size: 2vw;
    color: #3A5DA8;
}

.error_message {
    font-family: 'Creato Display Regular';
    font-size: 1vw;
    color: #DF4646;
    text-align: center;
    display: none;
}

.carrosseries {
    width: 93.75vw;
    height: 65.5vh;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-content: space-around;
}

.boutons_selection {
    width: 18.5vw;
    height: 23.5vh;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

.bouton_tout_selectionner {
    width: 18.5vw;
    height: 6.4vh;
    border: none;
    background: #B7CFFF;
    border-radius: 0.5vw;
    font-family: 'Creato Display Regular';
    font-size: 1vw;
    color: #0D052D;
}

.bouton_tout_selectionner:hover {
    width: 18.5vw;
    height: 6.4vh;
    border: none;
    background: #B7CFFF;
    border-radius: 0.5vw;
    font-family: 'Creato Display Regular';
    font-size: 1vw;
    cursor: pointer;
    color: #0D052D;
}

.bouton_tout_deselectionner {
    width: 18.5vw;
    height: 6.4vh;
    border: none;
    background: #71A1FE;
    border-radius: 0.5vw;
    font-family: 'Creato Display Regular';
    font-size: 1vw;
    color: #0D052D;
}

.bouton_tout_deselectionner:hover {
    width: 18.5vw;
    height: 6.4vh;
    border: none;
    background: #71A1FE;
    border-radius: 0.5vw;
    font-family: 'Creato Display Regular';
    font-size: 1vw;
    cursor: pointer;
    color: #0D052D;
}

.petits_gabarits {
    width: 23.75vw;
    height: 23.5vh;
    border: 0.3vw solid #FEC700;
    border-radius: 1vw;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.petits_gabarits::after {
    position: absolute;
    display: block;
    background-color: white;
    content: 'Petits gabarits';
    font-size: 1vw;
    font-family: 'Creato Display Bold';
    color: #FEC700;
    transform: translateX(-7vw) translateY(-12vh);
    padding-left: 0.5vw;
    padding-right: 0.5vw;
}

.sportives_cabriolets {
    width: 33.9vw;
    height: 23.5vh;
    border: 0.3vw solid #993333;
    border-radius: 1vw;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.sportives_cabriolets::after {
    position: absolute;
    display: block;
    background-color: white;
    content: 'Sportives / Cabriolets';
    font-size: 1vw;
    font-family: 'Creato Display Bold';
    color: #993333;
    transform: translateX(-10.3vw) translateY(-12vh);
    padding-left: 0.5vw;
    padding-right: 0.5vw;
}

.familiales {
    width: 55.6vw;
    height: 23.5vh;
    border: 0.3vw solid #3A5DA8;
    border-radius: 1vw;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.familiales::after {
    position: absolute;
    display: block;
    background-color: white;
    content: 'Familiales';
    font-size: 1vw;
    font-family: 'Creato Display Bold';
    color: #3A5DA8;
    transform: translateX(-24vw) translateY(-12vh);
    padding-left: 0.5vw;
    padding-right: 0.5vw;
}

.pickup_utilitaires {
    width: 23.75vw;
    height: 23.5vh;
    border: 0.3vw solid #D3CCA7;
    border-radius: 1vw;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.pickup_utilitaires::after {
    position: absolute;
    display: block;
    background-color: white;
    content: 'Pick-ups / Utilitaires';
    font-size: 1vw;
    font-family: 'Creato Display Bold';
    color: #D3CCA7;
    transform: translateX(-5.5vw) translateY(-12vh);
    padding-left: 0.5vw;
    padding-right: 0.5vw;
}

.citadine {
    height: 10vh;
    width: 6.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/citadine_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.citadine:hover {
    height: 10vh;
    width: 6.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/citadine_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.citadine_clic {
    height: 10vh;
    width: 6.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/citadine_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.berline_compacte {
    height: 10vh;
    width: 8.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/berline_compacte_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.berline_compacte:hover {
    height: 10vh;
    width: 8.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/berline_compacte_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.berline_compacte_clic {
    height: 10vh;
    width: 8.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/berline_compacte_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.coupe {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/coupe_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.coupe:hover {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/coupe_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.coupe_clic {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/coupe_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.cabriolet {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/cabriolet_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.cabriolet:hover {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/cabriolet_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.cabriolet_clic {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/cabriolet_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.supercar {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/supercar_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.supercar:hover {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/supercar_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.supercar_clic {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/supercar_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.berline {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/berline_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.berline:hover {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/berline_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.berline_clic {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/berline_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.break {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/break_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.break:hover {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/break_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.break_clic {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/break_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.suv_crossover {
    height: 10vh;
    width: 7.9vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/suv_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.suv_crossover:hover {
    height: 10vh;
    width: 7.9vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/suv_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.suv_crossover_clic {
    height: 10vh;
    width: 7.9vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/suv_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.monospace {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/monospace_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.monospace:hover {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/monospace_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.monospace_clic {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/monospace_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.van {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/van_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.van:hover {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/van_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.van_clic {
    height: 10vh;
    width: 7.1vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/van_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.pickup {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/pickup_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.pickup:hover {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/pickup_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.pickup_clic {
    height: 10vh;
    width: 7.2vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/pickup_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.utilitaire {
    height: 10vh;
    width: 7.5vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/base/utilitaire_base.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.utilitaire:hover {
    height: 10vh;
    width: 7.5vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/utilitaire_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.utilitaire_clic {
    height: 10vh;
    width: 7.5vw;
    background-image: url('https://ad-wise.fr/images/icones/filtres/carrosserie/clic/utilitaire_clic.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}