#menu{
width:auto;
top:30px;
right:180px;
display:inline-block;
position:absolute;
box-sizing:border-box;
text-align:center;
margin-bottom:2px;
transition:all ease 0.5s;
}
#menu li{
font-size:1em;
padding:0 !important;
margin:0!important;
list-style-type:none;
display:inline;
position:relative;
float:left;
}
#menu li:first-child,
#menu li:first-child a{
}
#menu li:last-child,
#menu li:last-child a{
}

#menu li a{
float:left;
cursor:pointer;
text-decoration:none;
color:var(--text);
font-size:1.3em;
font-weight:500;
margin:0px 10px !important;
padding-bottom:2px;
transition:all ease 0.2s;
padding:8px 0;
}

#menu li a:hover{
color:var(--moutarde);
text-decoration:underline;
}
#menu .activated a,
#menu .activated a:hover{
color:var(--rouge);
text-decoration:none;
}

#social {
position:absolute;
display:block; 
margin-bottom:20px;
z-index:999;
right:30px;
top:28px;
}
#social a{
display:inline-block;
margin-right:10px;    
}
#social svg{
height:35px;
width:35px; 
transition:all ease 0.3s;
}
#social a svg .fill2{
fill:var(--rouge)!important;
}
#social a:hover svg .fill2{
fill:var(--text)!important;
}
#social a svg .fill,
#social a #facebook path{
fill:var(--moutarde)!important;
}
#social a:hover svg .fill,
#social a:hover #facebook path{
fill:var(--rouge)!important;
}
@media screen and (max-width: 980px){
#menu li a{font-size:1.1em;margin:0px 6px !important;}
}