/*******************************
    N A V  P R I N C I P A L E
********************************/
/*******************************/
#menu-haut{/*position:absolute; top:69px; right:0px; width:74%;*/ z-index:100; display:  flex; flex-wrap: wrap; align-items:  center}
#menu-haut ul ul{display:none; z-index:2;}
/*#menu-haut li:hover > ul{display:block; z-index:10;}*/
.subMenu a{font-size: 15px; text-transform: uppercase;}


#header-wrapper.small #menu-haut{position:absolute; top:15px; right:60px; }
#header-wrapper.small #menu-haut .ul1{ top:30px; }


/*********************
Niveau 00 
*********************/ 
.displayMenu{ display:none;}

#menu-haut .ul0{ position:relative; margin-bottom:0}
#menu-haut .ulHome{ position:relative; float:left;}
#menu-haut .li0 { display:inline-block; margin:0 20px 0 0; padding:0; position: relative }
#menu-haut .li0:last-child{ margin:0; }
#menu-haut .li0:hover, #menu-haut .li0.selected{ }
#menu-haut .li0:hover .lien0, #menu-haut .li0.selected .lien0, #menu-haut ul > li[class*="li0 idCat-"]:hover:after{ background: var(--vert-clair); color: #FFFFFF; cursor: pointer} 
#menu-haut ul > li[class*="li0 idCat-"]:after{ 
	-webkit-transition: all 350ms ease-in-out;
    -moz-transition: all 350ms ease-in-out;
    -o-transition: all 350ms ease-in-out;
    transition: all 350ms ease-in-out
}
#menu-haut .li0:hover:first-child .lien0, #menu-haut .li0.selected:first-child .lien0{ border-bottom:0px #b49400 solid; } 
#menu-haut .lien0{ display:block; padding: 29px 5px; color:#fff; font-size: 12px; text-decoration:none; text-transform: uppercase;}
#menu-haut .lien0:hover{cursor: default}

/*#menu-haut #debdrag li:nth-child(1) a{ padding-left:15px}
*/
/*********************
Niveau 01 
*********************/
#menu-haut .ul1    {position:absolute; top:75px; left:0px; text-align:left;
    margin: 0;
    border-radius: 0;
    border: 0;
        border-bottom-color: currentcolor;
        border-bottom-style: none;
        border-bottom-width: 0px;
    background: #f9f9f9;
    z-index: 1;

    width: 900px;
    padding-bottom: 10px;
    padding-top: 10px;
}

#menu-haut .ul1 li{
    list-style: none;
    width: 420px;
    display: inline-block;
    vertical-align: top;
    border-bottom: 1px solid #f4f4ef;
    float: left;
    margin-right: 30px;
}

#menu-haut .ul1:before{ content:""; position: absolute; z-index:-1; top:0; bottom: 0; left:-100vw; right:-100vw; background: #fff; width: 1000vw; border-bottom: 1px solid #E0E0E0}

#menu-haut .li1 {position:relative; width:260px; background:#f4f4f4; list-style: none}
#menu-haut .li1:hover, #menu-haut .li1.selected{background: #F4F4EF; color: #645926 }
#menu-haut .lien1{
    display:block;
    padding:10px 20px 10px 5px;
    color: #645926;
    font-size: 14px;
    list-style: none;
    text-decoration:none;
    position: relative
}
#menu-haut .lien1:after {
    content: "\e903";
    color: var(--vert-clair);
    font-family: "icomoon";
    position: absolute;
    right: 5px;
    top: 10px;
    transform: rotate(180deg);
    font-size: 15px;
}
#menu-haut .lien1:hover{background: #F4F4EF; color: #645926;}

#debdrag{ padding-left:0}


@media only screen and (max-width:1320px){
	#menu-haut .li0{margin:0 20px 0 0}
}

		
/* max-width:960px */
@media only screen and (max-width:1024px){
.displayMenu{ display:block; position:absolute; top:35px; right:5px; cursor:pointer; }
#header-wrapper.small .displayMenu{ top:12px; right:30px; }

#menu-haut {display:none;}
#menu-haut { position:absolute; top:102px; left:0; width:100%; margin:0px; background:#004372; }
#header-wrapper.small #menu-haut { top:46px;}

#menu-haut ul ul{display:block;}

#menu-haut .ul0{ width:100%; text-align:left; }
#menu-haut .li0 { display:block; width:100%; margin:0px 0; }

#menu-haut .ul1{ position:relative; width:100%; top:auto; left:auto; }
#menu-haut .li1 { width:100%;}
#menu-haut .lien1{ display:block; color: var(--vert-clair) }

}



@media only screen and (max-width:480px) {
.displayMenu{ display:block; position:absolute; top:6px; right:5px;}
}

/*********************
Niveau 02 
*********************/
#menu-haut .ul2    {position:absolute; top:0px; left:100%; padding-left: 0; max-height: 90vh; overflow-y: scroll}
#menu-haut .ul2 li {position:relative; width:260px; background:#f2f2f2; display:  block}
#menu-haut .ul2 li:first-child{}
#menu-haut .ul2 li:last-child{}
#menu-haut .ul2 li:hover, #menu-haut .ul2 li.selected{background:#c7c7c7;}
#menu-haut .lien2{display:block; padding:14px 35px 14px 25px; color: #645926; font-size: 16px; list-style: none; text-decoration:none; position: relative}
#menu-haut .lien2:after {
    content: "\e903";
    color: var(--vert-clair);
    font-family: "icomoon";
    position: absolute;
    right: 25px;
    top: 15px;
    transform: rotate(180deg);
    font-size: 15px;
}#menu-haut .ul2 li .lien2:hover{background: #F4F4EF; color: var(--vert-clair);}

/*********************
Niveau 03 
*********************/
#menu-haut .ul3    {position:absolute; top:0px; left:230px;}
#menu-haut .ul3 li {position:relative; width:230px; background:#f2f2f2;}
#menu-haut .ul3 li:first-child{}
#menu-haut .ul3 li:last-child{}
#menu-haut .ul3 li:hover, #menu-haut .ul3 li.selected{background:#c7c7c7;}
#menu-haut .lien3{display:block; padding:14px 0 14px 25px; color: #645926; font-size: 16px; list-style: none; text-decoration:none; position: relative}
#menu-haut .lien3:after {
    content: "\e903";
    color: var(--vert-clair);
    font-family: "icomoon";
    position: absolute;
    right: 5px;
    top: 15px;
    transform: rotate(180deg);
    font-size: 15px;
}#menu-haut .ul3 li .lien3:hover{background: #F4F4EF; color: #645926;}

.txtblanc{color:#fff;font-size: 1.1rem;font-weight: normal;text-transform: uppercase;}

@media(max-width: 1600px){

    #menu-haut .lien0{padding: 29px 5px;    }
}

@media(min-width:1121px) {
#menu-haut{display: flex!important}
}