@media (min-device-aspect-ratio: 16/11) and (max-device-aspect-ratio: 16/10) { /*MACBOOK*/

}


@media (min-width: 1025px) { /* Desktop */


}

/* Tablette */
@media (min-width: 768px) and (max-width: 1024px) {

    #chiffrescle .figures .figure .chiffre { font-size: 4em; font-weight: 800; }
    #chiffrescle .logos .logo img { width: 12em; }

    #contactForm { padding: 4em 2em; }


    #apropos .foreground { height: 45em; }
    #apropos .background { height: 45em; padding-top: 0; left: initial; top: -25em; overflow: visible; }

}

/* Mobile */
@media (max-width: 767px) {

    h2 {
        font-size: 1.5em;
        font-weight: normal;
    }

    #splash { flex-direction: column; padding: 1em;  }
    #splash .pic { width: 100%; aspect-ratio: 1/1;
        border-radius: 2em; background-position: calc( 50% + -2.5em) center;
        margin-left: 0;
    }
    #splash .pic gradient { background-image: none; }
    #splash .texte { width: 100%; margin-left: 0; margin: 2em 0; }

    #slideMid slide { aspect-ratio: 4/3; min-height: 30em; }
    #slideMid .slidetext { padding: 1em; text-align: center; }
    #slideMid .slidetext br { display: none; }
    #slideMid nav.onglets a { font-size: 1em; }
    #slideMid .slide-content { padding: 2em; text-align: center; align-items: center; gap: 2em; justify-content: center; }
    #slideMid .slide-content .more-button { margin-top: 0; }



    #chiffrescle { padding: 1em; }
    #chiffrescle .logos { padding: 0 0 2em 0; gap:1.5em; }
    #chiffrescle .logos span img { height: 4.25em; }
    #chiffrescle .figures .figure { width: 50%; }
    #chiffrescle .figures .figure .chiffre { font-size: 3em; font-weight: 800; }
    #chiffrescle .logos .logo img { width: 4em; }



    #apropos .background { height: 35em; padding-top: 0; left: initial; }
    #apropos .background span { width: 100%; }
    #apropos .background .left { margin-left: -45%; margin-top: -10em; }
    #apropos .background .right { margin-right: -79%; margin-top: 8em; }
    #apropos .foreground { padding: 0.5em 2em; height: 35em; }
    #apropos .foreground br { display: none; }

    #contactForm { flex-direction: column; padding: 1.5em 1.5em 3em; }
    #contactForm .texte { width: 100%; margin-bottom: 1em; }
    #contactForm .form { width: 100%; }

}