:root{
    --bg-color-rgb:187, 247, 208;
    --bg-opacity: 0.80;
    --blur-level: 25px;

    --button-color : #169d53;

    --logo-color: 22, 163, 74;
}

nav{
    padding: 3px 0;
    background-color: rgba(var(--bg-color-rgb), var(--bg-opacity));
    backdrop-filter: blur(var(--blur-level));
}

nav a{
    color: rgb(3, 7, 18);
}

nav ul{
    background-color: rgb(134, 239, 172);
}


nav ul.sub-menu{
    background-color: rgb(82, 232, 137);
}

nav a.logo{
    color: rgb(var(--logo-color) );
}
/* 
nav a.logo:hover{
    color: rgb(74, 222, 128);
} */

nav ul li a.compte{
    background-color: rgb(var(--logo-color) );
}

nav ul li a.compte:hover{
    /* background-color: ; */
    opacity: 1;
}

nav ul li a.login{
    opacity: 1;
}

nav ul li a.compte:hover, a.login:hover{
    background-color: rgb(21, 128, 61);
}

.button-button{
    background-color: var(--button-color);
}


.button-button:hover{
    background-color: rgb(21, 128, 61);
}

span.tag{
    background-color: transparent;
}

footer{
    color: #ffffff;
}