@media screen and (min-width: 1101px)
{
    nav ul li a.box::before,
    nav ul li a.box::after{
        content: '';
        position: absolute;
        width: 100%;
        height: 2px;
        background-color: white;
        left: 0;
        transform: scaleX(0);
        transition: all .5s;
    }

    /*Ligne du haut*/
    nav ul li a.box::before{
        top: 0;
        transform-origin: left;
    }

    /*Ligne du Bas*/
    nav ul li a.box::after{
        bottom: 0;
        transform-origin: right;
    }

    /*Lancement de l'animation*/
    nav ul li a.box:hover::before,
    nav ul li a.box:hover::after{
        transform: scaleX(1);
    }


}

@media screen and (max-width: 1101px){
    .navbar-link.active
    {
        opacity:0;
        animation: transition 1s ease-in-out 0.1s forwards;
    }
}

@keyframes transition {
    0%   { margin-left: -80px;opacity:0; }
    100% { margin-left: 0;opacity:1; }
}