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

    :root{
        --inter: "Inter", serif;
        --blue: #2D2D80;
        --light-gray: #f8f8f8;
    }

        /* Accueil */

        .apps-container {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 20px;
            padding: 20px;
        }

        .apps-container {
            grid-template-columns: repeat(2, 1fr);
            grid-template-rows: repeat(4, auto);
        }

        .app-container {
            border-radius: 8px;
        }

        /* Absences */

        .page-absences table{
            font-size: 1rem;
        }
        
        .page-absences td button{
            font-size: 1rem;
        }
        
        .page-absences td textarea{
            font-size: 1rem;
        }
}