nav{
    position: fixed;
    top: 50px;
    right: 50px;
    display: flex;
    flex-direction: column;
    gap: 25px;
}

#navGlobal{
    z-index: 1000 !important;
    background-color: var(--bleu);
    height: 100vh;
    width: 100%;
    max-width: 250px;
    position: fixed;
    top: 0;
    right: -255px;
    display: flex;
    flex-direction: column;
    align-items: center;    
    justify-content: center;
    gap: 30px;
    transition: .3s ease;
    text-align: center;
    box-shadow: -5px 0px 5px #00000066;
    ul{
        display: flex;
        flex-direction: column;
        align-items: center;    
        justify-content: center;
        gap: 10px;
    }
    a{
        text-decoration: none;
        transition: all ease 0.3;
    }
    i{
        font-size: 2em;
    }
    a#fermerNav:hover{
        transform: scale(1.3);
    }
}
#navGlobal.actif{
    right: 0;
}

#ouvrirNav.actif{
    top: -50px;
}


@media (max-width: 650px) {
    nav{
        top: 15px;
        right: 15px;
    }
}