@media screen and (min-width: 320px) and (max-width: 767px) {
    .container {
        max-width: 767px;
        margin: 0 1rem;
    }

    /* NAV BARRE */

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

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

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

    /* FORMULAIRE */


    form {
        margin: 0 auto;
        max-width: 300px;
    }


    /* SECTION 10 */


    #section10 {
        padding: 0 1rem;
    }

    #div31 {
        padding: 1rem;
    }

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