@media screen and (max-width: 768px) {
    #text, #nom {
        font-size:70px;
        text-align: center;
    }

    nav {
        display: flex;
        flex-direction: column;
        justify-content: start;
    }

    .nav-left, .nav-right {
        display:flex;
        flex-direction: column;
        justify-content: flex-start;
        margin-left: 0;
    }

    .nav-left{
        margin-bottom:5px;
    }

    .nav-right{
        gap:5px;
    }

    .about-container {
        margin-top:-5em;
    }

    .about-card {
        flex-direction: column;
        text-align: center;
    }

    .about-card img {
        width: 200px;
    }

    .about-card p{
        display: flex;
        justify-content: center;
        align-items:center;
        text-align: left;
        margin-left:0;
        font-size:20px;
        padding-top:20px;
        margin-inline: 10px;
    }
    
    #border {
        margin:0;
        margin-inline:20px;
    }

    .project-card{
        flex-direction:column;
        margin-inline:20px;
    }

    .project-card a{
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .skills{
        flex-direction: column;
        justify-content: center;
    }

    .skillsFront {
        margin-right:0;
        justify-content: center;
        margin-bottom:20px;
    }

    .skillsBack {
        justify-content: center;
        align-items: center;
    }

    .skillsBack i, .skillsFront i {
        padding-right: 15px;
    }
    .burger-icon {
        display: flex;
    }

    .nav-right, .nav-left {
        display: none; /* Cache le menu classique */
    }
}