@font-face {
    font-family: "police1";
    src: url("../polices/police1.ttf");
}

::-webkit-scrollbar {
    width: 8px;
    border-radius: 4px;
    position: fixed;
}


::-webkit-scrollbar-track {
    background-color: transparent;
}


::-webkit-scrollbar-thumb {
    background-color: var(--couleur_dominante);
    border-radius: 4px;
}


    ::-webkit-scrollbar-thumb:hover {
        background-color: var(--couleur_dominante_light);
    }

body {
    background-color: var(--couleur_fond);
    color: var(--couleur_texte);
    font-family: police1;
    margin: 0;
    font-size: var(--texte);
}

header, nav {
    background: var(--degrade);
    color: var(--couleur_fond);
    z-index: 1;
}

    nav a.menu--lien {
        color: var(--couleur_fond);
        font-size: var(--texte);
        text-decoration: none;
        font-weight: bold;
        display: block;
        margin-bottom: 8px;
    }

footer {
    background-color: var(--couleur_texte);
    color: var(--couleur_fond_secondaire);
    font-size: var(--texte);
    display: flex;
}

    footer a {
        color: var(--couleur_fond_secondaire);
        text-decoration: none;
    }

        footer a img {
            height: 24px;
        }

h1 {
    font-size: var(--titre1);
    color: var(--couleur_dominante);
}

h2 {
    font-size: var(--titre2);
    color: var(--couleur_dominante_light);
}

h3 {
    font-size: var(--titre3);
    color: var(--couleur_dominante_light);
}

h4 {
    font-size: var(--soustitre);
    color: var(--couleur_texte);
    font-weight: normal;
}

p {
    font-size: var(--texte);
}

section#SlideAccueil {
    background: url("/medias/images/decoratif/arriere-plans/accueil.jpg") center center;
    background-size: cover;
    width: 100%;
}

    section#SlideAccueil h2 {
        color: var(--couleur_fond);
    }

    section#SlideAccueil h4 {
        color: var(--couleur_fond_secondaire);
        font-weight: normal;
    }

    section#SlideAccueil #SlideAccueilTexte #TexteCTA {
        color: var(--couleur_fond);
        font-weight: bold;
    }

    section#SlideAccueil #SlideAccueilTexte #LienTelephoneCTAHaut {
        color: var(--couleur_fond);
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        width: 173px;
        height: 36px;
        text-align: center;
        background: var(--degrade);
        text-decoration: none;
        border-radius: 4px;
        margin-top: 28px;
        margin-bottom: 8px;
    }

    section#SlideAccueil #SlideAccueilTexte #LienContactCTA {
        color: var(--couleur_fond_secondaire);
    }

section#Presentation {
    display: flex;
    justify-content: space-between;
}

    section#Presentation #PresentationImage .image--conteneur {
        width: 167px;
        height: 167px;
        background: url("/medias/images/decoratif/sections/ag.jpg") center center;
        background-size: cover;
        border-radius: 44px;
        box-shadow: 0px 0px 96px #FFFFFF66;
    }

    section#Presentation #PresentationImage .image--legende {
        margin-top: 4px;
        font-weight: bold;
    }

    section#Presentation h1 {
        color: var(--couleur_dominante);
        font-weight: bold;
        margin-bottom: 28px;
    }

    section#Presentation p {
        text-align: justify;
    }

section#PourquoiNous {
    background-color: var(--couleur_fond_secondaire);
}

    section#PourquoiNous #Arguments {
        display: flex;
        justify-content: space-between;
    }

    section#PourquoiNous .icone--check {
        width: 64px;
        height: 64px;
        background: url("/medias/images/icones/check.png") center center;
        background-size: cover;
    }

    section#PourquoiNous h2, section#PourquoiNous h3 {
        color: var(--couleur_dominante_light);
    }

    section#PourquoiNous h2 {
        text-align: center;
        margin-bottom: 28px;
    }

section#CTABas {
    display: flex;
    background-color: var(--couleur_dominante_light);
    color: var(--couleur_fond);
    justify-content: space-between;
}

    section#CTABas h3 {
        color: var(--couleur_fond);
        margin-bottom: 28px;
    }

    section#CTABas #CTABasImage {
        background: url("/medias/images/decoratif/arriere-plans/cta.jpg") center center;
        background-size: cover;
    }

    section#CTABas #CTABasConteneur {
        padding: 32px 192px 32px 32px;
    }

        section#CTABas #CTABasConteneur a {
            color: var(--couleur_fond);
        }

#LienTelephoneCTABas {
    margin-top: 28px;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    width: 173px;
    height: 36px;
    text-align: center;
    border: 3px solid;
    border-color: var(--couleur_fond);
    text-decoration: none;
    border-radius: 4px;
}

.titre_page {
    text-align: center;
    padding: 28px 0;
    margin: 0 32px;
}

div.service {
    display: flex;
}

    div.service:nth-child(2n+1) {
        background-color: var(--couleur_fond_secondaire);
    }

#NosServices div.service .service--image.un {
    background: url("/medias/images/decoratif/arriere-plans/design.jpg") center center;
    background-size: cover;
}

#NosServices div.service .service--image.deux {
    background: url("/medias/images/decoratif/arriere-plans/codage.jpg") center center;
    background-size: cover;
}

#NosServices div.service .service--image.trois {
    background: url("/medias/images/decoratif/arriere-plans/serveur.jpg") center center;
    background-size: cover;
}

div.service .service--texte p {
    text-align: justify;
}

section.fond_gris {
    background-color: var(--couleur_fond_secondaire);
}

section#CommentCaMarche {
    background: url("/medias/images/decoratif/arriere-plans/pays-basque.jpg") center center;
    background-size: cover;
    color: var(--couleur_fond_secondaire);
    min-height: 380px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

    section#CommentCaMarche .ccm_arguments {
        display: flex;
        justify-content: space-between;
    }

    section#CommentCaMarche h2 {
        color: var(--couleur_fond);
        padding-bottom: 28px;
    }

    section#CommentCaMarche h3 {
        color: var(--couleur_fond_secondaire);
        padding-bottom: 20px;
        text-align: center;
    }

    section#CommentCaMarche p {
        text-align: justify;
    }

#NosClients div.service .service--image.un {
    background: url("/medias/images/decoratif/partenaires/01.jpg") center center;
    background-size: cover;
}

#NosClients div.service .service--image.deux {
    background: url("/medias/images/decoratif/partenaires/02.jpg") center center;
    background-size: cover;
}

#NosClients div.service .service--image.trois {
    background: url("/medias/images/decoratif/partenaires/03.jpg") center center;
    background-size: cover;
}

#NosClients div.service .service--image.quatre {
    background: url("/medias/images/decoratif/partenaires/04.jpg") center center;
    background-size: cover;
}

#NosClients div.service .service--image.cinq {
    background: url("/medias/images/decoratif/partenaires/05.jpg") center center;
    background-size: cover;
}

#NosClients div.service .service--image.six {
    background: url("/medias/images/decoratif/partenaires/06.jpg") center center;
    background-size: cover;
}

#NosClients a {
    color: var(--couleur_texte);
}

#NosClients h5 {
    color: var(--couleur_tertiaire);
}

#ListeExemples {
    padding: 28px 32px;
}

#ListeExemplesTexte p, #ListeExemplesLien p {
    text-align: center;
}

#ListeExemplesBoutons {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    margin: 28px 0;
}

#ListeExemplesBoutons a {
    color: var(--couleur_dominante);
    border: 3px solid;
    border-color: var(--couleur_dominante);
    border-radius: 4px;
    display: block;
    text-decoration: none;
    font-weight: bold;
    line-height: 36px;
    text-align: center;
    width: 30%;
    margin: 8px;
    min-width: 271px;
}

#ListeExemplesLien a {
    color: var(--couleur_dominante_light);
}

section#SlideContact {
    background: url("/medias/images/decoratif/arriere-plans/mer.jpg") center center;
    background-size: cover;
    text-align: center;
    color: var(--couleur_fond_secondaire);
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

    section#SlideContact h1, section#SlideContact h2, section#SlideContact a {
        color: var(--couleur_fond);
    }

    section#SlideContact h3, section#SlideContact h4 {
        color: var(--couleur_fond_secondaire);
    }

section#RenseignementTel {
    height: 60px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#MoyensContact {
    display: flex;
    margin-top: 28px;
    justify-content: space-around;
}

    #MoyensContact .icone {
        border: 1px solid;
        border-color: var(--couleur_fond);
        border-radius: 50%;
    }

section.cgv {
    text-align: justify;
}

    section.cgv h2 {
        margin-top: 28px;
    }

    section.cgv h3 {
        margin-top: 12px;
    }

    section.cgv h4 {
        margin-top: 8px;
    }