@media (max-width: 900px) {

    /* Bouton burger visible */
    .burger {
        display: block;
    }

    #menu {
        display: none;
        flex-direction: column;
        gap: 10px;
    }

    #menu.show {
        display: flex;
    }

    /* Conteneur en colonne */
    .container {
        flex-direction: column;
        align-items: center;
    }

    /* Images adaptatives */
    .opacite,
    .affiche {
        width: 100%;
        max-width: 100%;
    }

    /* Texte lisible */
    .form {
        width: 95%;
        font-size: 1rem;
    }

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

    #cours tr {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    #cours td {
        width: 100%;
    }

    .page-cours {
        width: 95%;
        font-size: 1rem;
    }

    .page-cours p {
        font-size: 1rem;
        text-align: left;
        padding: 0 10px;
    }

    .button,
    .button1 {
        width: 100%;              /* Le bouton prend toute la largeur disponible */
        white-space: normal;      /* Autorise le retour à la ligne */
        word-wrap: break-word;    /* Coupe les mots trop longs si nécessaire */
        text-align: left;         /* Optionnel : texte aligné à gauche */
        padding: 10px 10px;       /* Pour éviter que le texte touche les bords */
        font-size: 14px;          /* Taille adaptée au mobile */
    }

    #cahier li {
        margin-bottom: 10px;      /* Espacement propre entre les boutons */
    }

}