@media screen and (min-width: 768px) and (max-width: 1024px) {

    .container {
        max-width: 1024px;
        margin: 0 1rem;
    }


    /* NAV */

    .menuderoulant {
        flex-direction: column;
        transform: translateX(-20px)
    }

    nav {
        padding: 10px 0;
        position: relative;
        flex-direction: column;
    }

    .menuderoulant li.active > .sousmenuderoulant {
        display: block;
    }


    /* SECTION 1 */


    .tuesenceinte {
        width: 200px;
    }

    .div101 {
        flex-direction: column;
    }

    .div101 div {
        margin: 30px;
    }
    

    /* SECTION TEST, TEST1, TEST2 et TEST3 */


    #test ul {
        width: 300px;
        text-align: left;
        
    }
    
    #test1 ul {
        width: 300px;
        text-align: left;
    }
    
    #test2 ul {
        width: 300px;
        text-align: left;
    }
    
    #test3 ul {
        width: 300px;
        text-align: left;
    }


    /* SECTION 5 */

    #div6 {
        width: 600px;
    }

    #div104 {
        display: flex;
        justify-content: space-evenly;
    }

    #div104 li {
        font-size: 20px;
    }

    #div104 div {
        width: 250px;
        display: block;
        justify-content: space-between;
    }

    /* SECTION 9 */


    #section9 {
        transform: none;
    }


    /* SECTION TEST6 */


    #test6 h2 {
        width: 600px;
    }

    #div102 {
        margin: 0 auto;
    }

    .fleche2 {
        transform: translateX(-20px) translateY(150px) rotate(280deg) scaleX(-1);
    }


    /* SECTION TEST8 */


    #div103 {
        display: flex;
        flex-direction: column;
    }

    #div103 h3 {
        width: 180px;
        margin: 0 auto;
        margin-top: 20px;
    }

    .test9 {
        width: 300px;
    }


    /* SECTION 26 */


    #div1033 {
        flex-direction: column-reverse;
        margin: 20px 0;
        gap: 3rem;
    }

    #div1033 div {
        margin: 0 auto;
    }

    .card-container {
        width: 600px;
        height: 400px;
        margin: 0 auto;
    }

    .cartecadeau {
        width: 600px;
        height: 400px;
    }

    #div23 p {
        width: 700px;
    }


    /* SECTION 27 */

    #div52 {
        flex-direction: column;
    }

    #div54 {
        width: 300px;
    }
}