.hidden-scroll{width: 100%; height: 100%;overflow: hidden;}
#menu #menu-list,
#menu #menu-search{
    display:none;
    width: 100%;
    position: fixed;
    top: 0;
    right: 0; 
    height: 100%; 
    background: #002565 0% 0% no-repeat padding-box;
    opacity: 0.91; 
}



/***********************************************************************************/
/*** Menu - Barre
/***********************************************************************************/ 
#menu{z-index:9999;position:fixed;top:0px;bottom:0;}
body.mfp-zoom-out-cur #menu{z-index:10;} 
#menu #menu-bar{ width:60px; background-color:#002565; height:100%; position:relative; z-index:1; } 
#menu #menu-bar button.icon{
    padding:0 0 0 0;
    text-align: center;
    width: 100%;
    background: transparent;
    color: #fff;
    font-size: 23px;

}
#menu #menu-bar button.button-list{ z-index:2; height:100%; position:absolute; display:block; margin:0 auto; top:0; left:0; right:0; bottom:0;  width:100%;  }
#menu #menu-bar button.button-list #hamburger{position:absolute; display:block; margin:auto; top:20px; left:0; right:0; width:20px; height:16px;}
#menu #menu-bar button.button-search{    
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0; 
    display:block;
    margin:auto;
    z-index:5;
    width:60px;
    height:60px;
}
#menu #menu-bar button.button-search img{height:20px; width:20px; display:block; margin:auto;}
#menu #menu-bar button.button-search .big{display:none; visibility:hidden;}
#menu #menu-bar .name{
    position:absolute; 
    top:0;
    bottom:0;
    left:0; 
    right:0; 
    z-index:1; 
    display:flex; 
    align-items: center; 
    justify-content: center;
    width:60px;
    text-align: 
    center;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
#menu #menu-bar .name div{transform: rotate(-90deg); position:absolute; left:0; right:0;}
#menu #menu-bar .name.close{opacity:0;}
body.hidden-scroll #menu #menu-bar .name.open{opacity:0;}  
body.hidden-scroll #menu #menu-bar .name.close{opacity:1;}


/***********************************************************************************/
/*** Menu - Navigation
/***********************************************************************************/ 
#menu #menu-list{overflow: auto; align-items: center;}
#menu #menu-list .menu-list-wrapper .calcoolateur{display:none;} 

#menu #menu-list .menu-list-wrapper{  overflow: auto; text-align: center; display: flex;  flex-direction: column;  height: 100%; width:100%; justify-content: center;}

#menu #menu-list .menu-list-wrapper .wrap{  } 
#menu #menu-list .menu-list-wrapper .wrap > div{display:block; width:100%;}
#menu #menu-list .menu-list-wrapper .wrap > div:first-child{padding-top:60px;}
#menu #menu-list .menu-list-wrapper .wrap > div:last-child{padding-bottom:60px;}

#menu #menu-list .menu-list-wrapper .wrap > div.calcoolateur{display:none;}
#menu #menu-list .menu-list-wrapper .wrap > div.secondary{padding-bottom:60px;}
#menu #menu-list .menu-list-wrapper .primary-menu{margin:0 0 0 0; padding:0 0 0 0;}
#menu #menu-list .menu-list-wrapper .primary-menu li{margin:0 0 18px 0; padding:0 0 0 0; text-align:center;}
#menu #menu-list .menu-list-wrapper .primary-menu li:last-child{margin-bottom:60px;}
#menu #menu-list .menu-list-wrapper .primary-menu li:before{display:none;}
#menu #menu-list .menu-list-wrapper .primary-menu li a{
    text-decoration: none; 
    color:#fff; 
    font-size:40px; 
    line-height:47px; 
    font-weight:400;
    font-family: 'Volkhov', serif; 
} 
#menu #menu-list .menu-list-wrapper .primary-menu li.home{margin-bottom:40px;}
#menu #menu-list .menu-list-wrapper .primary-menu li.home a{
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
    text-transform: uppercase; 
    font-family: 'Montserrat', sans-serif;
    letter-spacing: 0.35px;
    color:#99B2D9;
    text-decoration: none;
}


#menu #menu-list .menu-list-wrapper .primary-menu .sub-menu{display:none;}
#menu #menu-list .menu-list-wrapper .secondary{display: block;}
#menu #menu-list .menu-list-wrapper .secondary .secondary-menu{display:flex; margin:0 0 0 0; padding:0 0 0 0; text-align:center; justify-content:center;} 
#menu #menu-list .menu-list-wrapper .secondary .secondary-menu li{margin:0 20px 0 20px; padding:0 0 0 0; text-align:center;}
#menu #menu-list .menu-list-wrapper .secondary .secondary-menu li:before{display:none;}
#menu #menu-list .menu-list-wrapper .secondary .secondary-menu li a{
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
    text-transform: uppercase; 
    font-family: 'Montserrat', sans-serif;
    letter-spacing: 0.35px;
    color:#99B2D9;
    text-decoration: none;
}
#menu #menu-list .menu-list-wrapper .secondary .secondary-menu li:first-child{margin-left:0;}
#menu #menu-list .menu-list-wrapper .secondary .secondary-menu li:last-child{margin-right:0;}

/***********************************************************************************/
/*** Menu - Recherche
/***********************************************************************************/ 
#menu #menu-search .menu-search-wrapper{text-align: center;position:absolute;width:100%;top:50%;margin-top: -100px; padding:0 30px; }
#menu #menu-search .menu-search-wrapper .title{display:block; text-align:center; color:#fff; font-size:40px; line-height:47px; font-weight:400; font-family: 'Volkhov', serif; }
#menu #menu-search .menu-search-wrapper #searchform > div{display:flex; justify-content: center; max-width:570px; width:100%; margin:0 auto; border-bottom:2px solid #fff; height:70px;}
#menu #menu-search .menu-search-wrapper #searchform > div input{
    font-family: 'Volkhov', serif;
    font-weight: 400;
    font-size: 40px; 
    letter-spacing: 0;  
    padding:0 10px 0 0;
    line-height:70px; 
    flex:1;
    width:100%;
    color:#fff; 
    background-color:transparent;
}
#menu #menu-search .menu-search-wrapper #searchform > div input::placeholder{color:#fff; }
#menu #menu-search .menu-search-wrapper #searchform > div button{

    background-color:transparent; 
    border-radius: initial;
    padding:0 0 0 0;
    margin:0 0 0 0; 
    position:relative;
}
#menu #menu-search .menu-search-wrapper #searchform > div button img{display:block;  width:46px; }
#menu #menu-search .menu-search-wrapper #searchform > div button
#menu #menu-search .menu-search-wrapper #searchform > div button svg{width:48px;}  
#menu #menu-search .menu-search-wrapper .tags{ flex-wrap: wrap;}
#menu #menu-search .menu-search-wrapper .tags div{padding-top:40px; color:#99B2D9; padding-bottom:15px;}
#menu #menu-search .menu-search-wrapper .tags ul{padding:0 0 0 0; margin:0 0 0 0; display:flex; justify-content: center; flex-wrap: wrap;  }
#menu #menu-search .menu-search-wrapper .tags ul li{padding:0 4px 0 4px; margin:0 0 8px 0; float:left;}
#menu #menu-search .menu-search-wrapper .tags ul li:before{display:none;}
#menu #menu-search .menu-search-wrapper .tags a{
    font-size:10px; 
    line-height:16px; 
    font-weight: 700; 
    text-decoration:none; 
    letter-spacing: 0.2px;
    font-family: 'Montserrat', sans-serif;
    color:#002565;
    padding:4px 12px 2px 12px;
    background-color:#99B2D9;
    display:block;
    border-radius: 30px;
    text-transform: uppercase;
}





/***********************************************************************************/
/*** Menu - Hamburger
/***********************************************************************************/ 
#hamburger{ display:flex; justify-content: center; align-items:center; z-index: 2000000;}
#hamburger .wrap{   
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    z-index:100;
    cursor: pointer; 
    text-align:left; 
    display: flex;
    flex-direction: column;
    flex-wrap: wrap; 
    width:20px;    
}   
#hamburger .wrap .line{
    width: 20px;
    height: 2px;
    background-color: #99b2d9;
    display: block;  
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    z-index:4;
    position:relative;
}
#hamburger .wrap .line:nth-child(2){width:14px;} 
#hamburger .wrap .line:nth-child(1){ margin-bottom:5px; }
#hamburger .wrap .line:nth-child(3){ margin-top:5px; }

body.hidden-scroll #hamburger .wrap .line:nth-child(1),
body.hidden-scroll #hamburger .wrap .line:nth-child(3){width:24px;}
body.hidden-scroll #hamburger .wrap .line:nth-child(2){ opacity: 0; }
body.hidden-scroll #hamburger .wrap  .line:nth-child(1){
    -webkit-transform: translateY(7px) rotate(45deg);
    -ms-transform: translateY(7px) rotate(45deg);
    -o-transform: translateY(7px) rotate(45deg);
    transform: translateY(7px) rotate(45deg);
}
body.hidden-scroll #hamburger .wrap .line:nth-child(3){
    -webkit-transform: translateY(-7px) rotate(-45deg);
    -ms-transform: translateY(-7px) rotate(-45deg);
    -o-transform: translateY(-7px) rotate(-45deg);
    transform: translateY(-7px) rotate(-45deg);
}   


/*** Style des flèches */

#header.intro .wrapper .navigation{height:80px; padding-left:40px; padding-right:40px; border-top:1px solid #1B4CA0; overflow:hidden;}
#header.intro .wrapper .navigation .owl-carousel .owl-stage{
    display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    display: box;
} 
#header.intro .wrapper .navigation .item.all{position:relative}
#header.intro .wrapper .navigation .owl-carousel .owl-nav{float:left;}
#header.intro .wrapper .navigation .item{margin-top:20px;}
#header.intro .wrapper .navigation .item a{
    display:inline-block;
    border:2px solid transparent; 
    border-radius:30px;
    height:40px; 
    line-height:37px;
    padding:0 26px 0 26px;
} 
#header.intro .wrapper .navigation .item.all{padding-left:15px;}
#header.intro .wrapper .navigation .item.current a{  border:2px solid #fff; }  
#header.intro .wrapper .navigation .owl-carousel .owl-nav .owl-next{ position: absolute; right:-40px;  top: 0;}
#header.intro .wrapper .navigation .owl-carousel .owl-nav .owl-prev{
    position: absolute;
    left: -40px;
    top:0;
}
#header.intro .wrapper .navigation .owl-carousel .owl-nav button {background-color:#003da5;}
#header.intro .wrapper .navigation .owl-carousel .owl-nav button div.prev{position:relative;z-index:2;}
#header.intro .wrapper .navigation .owl-carousel .owl-nav .owl-prev:before {
    position: absolute;
    content: "";
    height: 80px;
    width:40px;
    box-shadow: 10px 0 8px #003da5;
    left: 0;
    top: -20px; 
    background:#003da5;
    z-index:1;
}

#header.intro .wrapper .navigation .owl-carousel .owl-nav button div.next{position:relative;z-index:2;}
#header.intro .wrapper .navigation .owl-carousel .owl-nav .owl-next:before {
    position: absolute;
    content: "";
    height: 80px;
    width:55px;
    box-shadow: -8px 0 8px #003da5;
    right: 0;
    top: -20px; 
    background:#003da5;
    z-index:2;
}

.no-js .owl-carousel, .owl-carousel.owl-loaded{height:80px;}


#header.intro .wrapper .navigation .owl-carousel .owl-nav{ display:block; z-index:5; }
#header.intro .wrapper .navigation .owl-carousel .owl-nav button{
    position:relative;  
    height:40px; 
    width:40px; 
}
#header.intro .wrapper .navigation .owl-carousel .owl-nav button div{ 
 width:100%;
 height:100%;
 position:relative;  
 color:#fff;  
 line-height:40px; 
 z-index:2;
}
#header.intro .wrapper .navigation .owl-carousel .owl-nav button img{ position:absolute; top:0; bottom:0; right:0; left:0; }
#header.intro .wrapper .navigation .owl-carousel .owl-nav button div.prev{ transform: rotate(180deg); }   
#header.intro .wrapper:nth-child(2){overflow: initial; }


@media screen and (max-width: 1024px){
    #menu #menu-list .menu-list-wrapper .secondary .secondary-menu{ justify-content: initial; display:block; margin-top:30px;} 
    #menu #menu-list .menu-list-wrapper .secondary .secondary-menu li{margin:0 0 14px 0!important; display:flex; justify-content: center;}
    #menu #menu-list .menu-list-wrapper .secondary .secondary-menu{display:block;}
    #menu #menu-list .menu-list-wrapper .primary-menu li a{font-size:30px; line-height:38px;}
    #menu #menu-list .menu-list-wrapper .primary-menu li:last-child{margin-bottom:35px;}
}

@media screen and (max-height:840px){
  #menu #menu-list .menu-list-wrapper .primary-menu li{margin-bottom:8px;} 
  #menu #menu-list .menu-list-wrapper .primary-menu li a{ font-size:24px; line-height:28px; }
  #menu #menu-list .menu-list-wrapper .primary-menu li:last-child{margin-bottom:20px;}
}

@media screen and (max-width: 840px) and (orientation: portrait){ 
    #menu #menu-bar button.button-search{bottom:0; left:auto; right:0; }
    #menu #menu-bar button.button-list #hamburger{top:0; bottom:0; display:block; margin:auto 0; left:20px;}
    #menu{top:auto; left:0; right:0;}
    #menu #menu-bar{height:60px; width:100%;}
    #menu #menu-bar button.icon{  }
    #menu #menu-bar button.button-list{ position:absolute; left: auto; right: 0; padding-right: 0; width:100%; }
    #hamburger{justify-content:flex-end;} 
    #menu #menu-bar button.button-search{z-index:4;}
    footer .bot .wrapper{padding-bottom:95px;} 
    #menu #menu-list .menu-list-wrapper .wrap > div:last-child{padding-bottom:120px;}
    #menu #menu-bar .name div{transform: rotate(0); top:2px; position:relative;}
    #menu #menu-bar .name{margin:auto;}


}

/***********************************************************************************/
/*** Menu - Barre - Mobile
/***********************************************************************************/ 

#menu #menu-bar-mobile{ width:60px; background-color:#002565; height:100%; position:relative; z-index:1; } 
#menu #menu-bar-mobile button.icon{
    padding:0 0 0 0;
    text-align: center;
    width: 100%;
    background: transparent;
    color: #fff;
    font-size: 23px;

}
#menu #menu-bar-mobile button.button-list{ z-index:2; height:100%; position:absolute; display:block; margin:0 auto; top:0; left:0; bottom:0;  width:100%;  }
#menu #menu-bar-mobile button.button-list #hamburger{position:absolute; display:block; margin:auto; top:20px; left:0; right:0; width:20px; height:16px;}
#menu #menu-bar-mobile button.button-search{    
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0; 
    display:block;
    margin:auto;
    z-index:5;
    width:60px;
    height:60px;
}
#menu #menu-bar-mobile button.button-search img{height:20px; width:20px; display:block; margin:auto;}
#menu #menu-bar-mobile button.button-search .big{display:none; visibility:hidden;}
#menu #menu-bar-mobile .name{
    position:absolute; 
    top:0;
    bottom:0;
    left:0; 
    right:0; 
    z-index:1; 
    display:flex; 
    align-items: center; 
    justify-content: center;
    width:150px;
    text-align: center;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
#menu-bar-mobile .small.name-mobile,
#menu-bar-mobile .small.name-mobile a{
    line-height:60px;
	display:block;
}
#menu #menu-bar-mobile .name div{transform: rotate(-90deg); position:absolute; left:0; right:0;}
#menu #menu-bar-mobile .name.close{opacity:0;}
body.hidden-scroll #menu #menu-bar-mobile .name.open{opacity:0;}  
body.hidden-scroll #menu #menu-bar-mobile .name.close{opacity:1;}

@media screen and (max-width: 840px) and (orientation: portrait){ 
    #menu #menu-bar-mobile button.button-search{bottom:0; left:auto; right:0; }
    #menu #menu-bar-mobile button.button-list #hamburger{top:0; bottom:0; display:block; margin:auto 0; left:20px;}
    #menu{top:auto; left:0; right:0;}
    #menu #menu-bar-mobile{height:60px; width:100%;}
    #menu #menu-bar-mobile button.icon{  }
    #menu #menu-bar-mobile button.button-list{ position:absolute; left:0; width:50px; }
    #hamburger{justify-content:flex-end;} 
    #menu #menu-bar-mobile button.button-search{z-index:4;}
    footer .bot .wrapper{padding-bottom:95px;} 
    #menu #menu-list .menu-list-wrapper .wrap > div:last-child{padding-bottom:120px;}
    #menu #menu-bar-mobile .name div{transform: rotate(0); top:2px; position:relative;}
    #menu #menu-bar-mobile .name{margin:auto;}

}

@media screen and (min-width: 841px) and (orientation: portrait){
	#menu-bar {display:block;}
	#menu-bar-mobile {display:none;}
}
@media screen and (max-width: 840px) and (orientation: portrait){
	#menu-bar {display:none;}
	#menu-bar-mobile {display:block;}
}



