/* responsive */

@media print {
    nav.main-menu {
        display: none;
    }

}

@media screen {
    body.az {
        overflow: hidden;
    }
    .conte {
        height: 100vh;
        height: 100dvh;
        overflow-y: scroll;
        scroll-snap-type: y mandatory;
        scroll-behavior: smooth;
      }
}

@media only screen and (min-width: 1300px) {
    body {
        font-size: 1.8vw;
    }
    article {
        padding: 5vw 20vw;
    }
    footer {
        font-size: 0.6em;
        padding: 1vw 20vw 3vw 20vw;
    }
    nav.main-menu {
        position: fixed;
    }
    body.page nav.main-menu ul {
        display: block !important;
        background-color: rgba(255,255,255,0.5);
    }
}

@media only screen and (max-width: 1299px) {
    body {
        font-size: 2.5vw;
    }
}

@media only screen and (min-width: 761px) {
    .ada-portrait-matthias {
        float: left;
        width: 40%;
        margin-top: 1.5em;
        margin-right: 1em;
    }
    .ada-portrait-sandra {
        float: right;
        width: 40%;
        margin-left: 1em;
    }
    
}


@media only screen and (max-width: 760px) {
    body {
        font-size: 3vw;
    }
    article {
        padding: 15vw 10vw;
        font-size: 0.9em;
        line-height: 1.5em;
    }

    nav.main-menu {
        font-size: 16px;
    }

    figure.horizontal-scroll {
        text-align: left;
        overflow-x: auto;
    }
    figure.horizontal-scroll.on-screen:before {
        position: absolute;
        content:"👉";
        text-shadow: 5px 5px 7px rgba(0,0,0,0.3);
        font-size: 3em;
        right: 10px;
        top: 45%;
        z-index: 150;
        animation: 1s ease-out 0.5s forwards to-right;
    }
    figure.horizontal-scroll.reverse.on-screen:before {
        content:"👈";
        right: auto;
        left: 10px;
        animation: 1s ease-out 0.5s forwards to-left;
    }
    figure.horizontal-scroll.reverse {
        direction: rtl;
    }
    figure.horizontal-scroll img {
        width: auto;
        height: 100%;
        object-fit: contain;
        padding: 15% 0;
    }
    p.auteur {
        text-align: right;
    }
    a.cta {
        margin: 1em 0;
    }
    .editions figure img {
        max-width: 100%;
        margin: 0.5em auto;
    }
}

@media only screen and (max-width: 845px) and (orientation:landscape) {
    body {
        font-size: 2.5vw;
    }
    figure.horizontal-scroll.on-screen:before {
        display: none;
    }
    figure img, figure.horizontal-scroll img  {
        padding: 0
    }
    figure.horizontal-scroll img {
        width: 100%;
        height: 100%;
    }

}

@media only screen and (max-width: 400px) {
    body {
        font-size: 4.2vw;
    }
    article {
        padding: 10vw;
        font-size: 1em;
        line-height: 1.5em;
    }
    article h1 {
        text-align: right;
    }
}