.main-menu {position:fixed;width:100%;z-index:999999;top:0px;height:auto;}
.container {position:relative;right:0px;margin:auto;}
header .principal{display:flex;flex-direction:column;margin:auto;height:100%;justify-content:center;max-width:2440px;}
.main-menu a {color:black;text-decoration:none;}

/*-----------------
.container {
    position: relative;
    text-align: left;
    width: 80%;
    max-width: 1080px;
    margin: auto;
}
.menu-tittle {float: right;}
----------------*/
.container_logo {}
.btnmenumobile {display:flex;flex-direction:column;color: #fff;background:var(--couleur-verte);cursor: pointer;margin:0px;padding:20px;position:absolute;right:0px;border:solid var(--couleur-blanche)2px;box-sizing:border-box;border-radius:50%;width:70px;height:auto;}

.btnmenumobile i{width:20px;height:5px;background:var(--couleur-jaune);margin:.1em auto .2em;border-radius:50px;box-sizing:border-box;}


.menu-tittle{display:none;height:100vh;margin:77px 0px;transform: translateX(-500px);transform: translateY(-77px);padding:0 10px 0;color:white;}

/* SOUS MENU
************************************/
.subbtnmenu a{margin:10px 0px;padding:10px 0px;text-align:center;}


/* MEDIA QUERIES
--------------------------*/
@media screen and (min-width:950px){
.main-menu{height:77px;background:rgba(255, 255, 255, 0.8);display:flex;}
.container {margin: 0 auto;width:100%;}
.btnmenumobile{display:none;}
.subbtnmenu{display:flex;height:100%;margin:0;transform:none;justify-content: space-around;margin:0 auto;}
.subbtnmenu a{padding:10px 20px;width:100%;}
.header{margin-top:77px;}
.main-menu a {font-weight:bold;box-sizing: border-box;max-width:200px;display:flex;align-items:center;justify-content:center;transition: 2s;position:relative;}

.main-menu a::after {content:"";width:0%;position:absolute;height:5px;transition:1.5s;bottom:0;}
.main-menu a:hover::after {content:"";transition: 1s;width:100%;background:var(--couleur-verte);}
}
@media screen and (min-width:1920px){
.subbtnmenu{width:60%;}
}
@media screen and (max-width: 1215px){
}
@media screen and (max-width: 1150px){
}
@media screen and (max-width: 990px){
}
@media screen and (max-width: 950px){
.btnmenumobile:focus + .subbtnmenu,.subbtnmenu:active {display: flex;}
.subbtnmenu{overflow:scroll;flex-direction: column;translate:0;background:var(--couleur-verte);}
.subbtnmenu a{color:var(--couleur-blanche);font-size:20px;font-weight:bolder;border:dotted var(--couleur-jaune) 5px;border-radius:20px;}

}
