/* BANDEAU */
#bandeau {padding:0; position:fixed; left:0px; top:0px; width:100%; z-index:3000; ;}
.lg {height:/*132px*/215px;}
.sm {height:70px;}
#bandeau-mobile {display:none;}
/* Bandeau réduit */
#bandeau.sm {background:#f9fafb; }
#bandeau.sm #bandeau-contact {}
#bandeau.sm #logo {padding-top:3px;}
#bandeau.sm #logo a img {height: 60px; width:auto;}

#bandeau.sm #menu-conteneur { padding-top:30px;}
#bandeau.sm #menu {}
#bandeau.sm #menu .menu-element > a > span, 
#bandeau.sm #menu .menu-element > a:visited > span, 
#bandeau.sm #menu .menu-element > span {font-size: 14px;}
#bandeau.sm #menu .smenu-conteneur {}

/* Bandeau non réduit */
#bandeau-conteneur {position: relative; z-index: 400; width:100%; }

/* Elements du bandeau */
#bandeau #bandeau-elements {float:right; padding:0px 3px 0 0; height:100%; text-align:right;display: flex; flex-direction: column;justify-content: center;}
#bandeau #bandeau-elements > div {}
#bandeau .bandeau-element {display:inline-block; vertical-align:top;height:30px; line-height:30px; text-align:center; border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; -khtml-border-radius: 0 0 4px 4px;}
#bandeau .bandeau-element > span {font-size:0;}
#bandeau .bandeau-element a,
#bandeau .bandeau-element > span {display:inline-block; vertical-align:top;}
#bandeau .bandeau-element a,
#bandeau .bandeau-element a:visited {text-decoration:none;}

/* GOOGLE */
#bandeau #bandeau-google {width: 160px; padding: 2px 25px 0 0; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -khtml-box-sizing:border-box;}
#bandeau #bandeau-google img.mobile {display:none;}
#bandeau #bandeau-google img {width:100%; height:100%; -o-object-fit: contain;object-fit: contain;}

/* Telephone */
#bandeau #bandeau-telephone {padding: 2px 10px; height:26px; line-height:26px; margin-right:40px; font-size:0px; text-decoration:none; color:#ffffff; background:#281f5d; }
#bandeau #bandeau-telephone i {color:#ffffff; font-size: 18px; vertical-align: top; margin-top: 5px; margin-right: 8px; }
#bandeau #bandeau-telephone span,
#bandeau #bandeau-telephone a,
#bandeau #bandeau-telephone a:visited {font-size:15px; font-weight:400; color:#ffffff;}
#bandeau #bandeau-telephone a:nth-child(2n+1)::before {background:#ffffff; margin: 8px 20px 0; width: 2px; height: 11px; content:""; display:inline-block; vertical-align:top;}

/* Email */
#bandeau #bandeau-email {background:#672178; }
#bandeau #bandeau-email i {font-size:14px; margin-right: 9px;}
#bandeau #bandeau-email span,
#bandeau #bandeau-email a,
#bandeau #bandeau-email a:visited {font-size:14px; color:#ffffff;}
#bandeau #bandeau-email a {padding: 2px 10px; height: calc(100% - 4px);line-height: 25px;}


#bandeau-contact {position:relative; z-index:50; }
#bandeau-contact .global {position:relative; z-index:40; }

#bandeau #logo {float:left; padding:3px 0 0 1px; position:relative; z-index:10;}
#bandeau #logo a,
#bandeau #logo a:visited {}
#bandeau #logo a img {display:block; height:60px; width:auto;}


/* MENU */
/* Menu niveau 1 */
#menu-conteneur { padding-top:70px; }
#menu-titre, #menu-close {display:none;}
#menu-wrapper {}
#menu {list-style:none; margin:0px auto; padding: 0; }
#menu > .global {text-align:right; position:relative; z-index:30; font-size:0; padding:0 20px;}

#menu .menu-element { display:inline-block; vertical-align:top; position:relative;position:initial; z-index:30;height:50px; margin: 0 20px;}
#menu #menu-1 {margin-left:0;}
#menu #menu-2 {margin-right:0;}
#menu .menu-element > span { cursor:default;}
#menu .menu-element > a > span,
#menu .menu-element > a:visited > span,
#menu .menu-element > span {color: #022f40; text-align: center;padding: 10px 0; font-weight:300; display: block; font-size:16px; position:relative;z-index: 201;}
#menu .menu-element.menu-grand {}
#menu .menu-element.menu-grand > a > span,
#menu .menu-element.menu-grand > span{padding:0px 0 1px;}
#menu .menu-element > a,
#menu .menu-element > a:visited {text-decoration:none;}
#menu .menu-element > a:hover {text-decoration:none;}

#menu .menu-element.selected > a > span,
#menu .menu-element.selected > span,
#menu .menu-element:hover > a > span,
#menu .menu-element:hover > span {}
#menu #menu-11.menu-element.selected > a > span::after,
#menu #menu-11.menu-element.selected > span::after,
#menu #menu-11.menu-element:hover > a > span::after,
#menu #menu-11.menu-element:hover > span::after {content: '';position: absolute;left: calc(50% - 15px);bottom: -10px;width: 0;height: 0;border-style: solid;border-width: 0 15px 15px 15px;border-color: transparent transparent #edf3f8 transparent;background: none;}
#menu .menu-element:hover .smenu-conteneur {display:block;}

/* Sous menu niveau 1 */
#menu .smenu-conteneur {display:none; position:absolute;right: 0px!important; left: initial!important;z-index: 200;top: 50px;width: auto;min-height: 20px;box-shadow: 1px 5px 40px rgba(2, 3, 3, 0.3);background-color: #ffffff;    border-radius: 20px;
  overflow: hidden;}
#menu .smenu-conteneur .global {padding:0 !important;}
#menu .smenu-bas {}
#menu .smenu-centre { margin:0 !important; padding:0 !important; list-style:none; width:100%; text-align: left; }
#menu .smenu-centre-menus {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}
#menu .smenu-centre-menus .first{background: #fff;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-ms-flex-wrap: wrap;flex-wrap: wrap;}
#menu .smenu-centre-menus .last{background: #fdf8fb;}
#menu .first .smenu-element {margin: 40px 104px 36px 0px;}
#menu .first .smenu-element:first-child {margin: 40px 60px 36px 60px;}
#menu .first .smenu-element:last-child{margin: 40px 60px 36px 0px;}
#menu .first .smenu-element:nth-child(2) {margin-left:35px;}
#menu .first .smenu-element:first-child {margin-left: 60px;}

#menu .last .smenu-element {padding: 40px 136px 36px 22px;margin: 0;}
#menu .smenu-element > a {text-decoration:none;}
#menu .smenu-element > a > span,
#menu .smenu-element > span {color:#281f5d; display:block; padding:7px; width: calc(100% - 14px); font-size:19px;font-weight:600;letter-spacing: 0.06px;text-transform: uppercase;position: relative;z-index: 2;}
#menu .smenu-element:first-child > a > span,
#menu .smenu-element:first-child > span {border:none;}

/** SI EFFET VERTICAL LIGNE SOUS MENU  **/
@supports (-webkit-overflow-scrolling: touch) {
	/* CSS specific to iOS devices */ 
	  #menu .menu-element.selected > a > span,
	  #menu .menu-element.selected > span,
	  #menu .menu-element:hover > a > span,
	  #menu .menu-element:hover > span {border-bottom:1px solid #ea008a;}
  }
  
  @supports not (-webkit-overflow-scrolling: touch) {
	   /* Effect 4: bottom border enlarge */ 
	  #menu .menu-element > a > span::after,
	  #menu .menu-element > span::after { position: absolute; top: 98%; left: 0; width: 100%; height: 1px; background: #ea008a; content: ''; opacity: 0; -webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s; -moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s; transition: height 0.3s, opacity 0.3s, transform 0.3s; -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); transform: translateY(-10px); }
	  
	  #menu .menu-element.selected > a > span::after,
	  #menu .menu-element.selected > span::after,
	  #menu .menu-element:hover > a > span::after,
	  #menu .menu-element:hover > span::after { height: 1px; opacity: 1; -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); transform: translateY(-5px);}
  }
  #menu #menu-11.menu-element.selected > a > span::after, #menu #menu-11.menu-element.selected > span::after, #menu #menu-11.menu-element:hover > a > span::after, #menu #menu-11.menu-element:hover > span::after {display: none!important;}
  

#menu .ssmenu-conteneur-images {float:left;width: 143px; height: 143px; margin-top: 10px;}
#menu .ssmenu-images {display:none;}

/* Sous menu niveau 2 */
#menu .ssmenu-conteneur {padding:0px; margin:0px;}
#menu .ssmenu-element {}
#menu .ssmenu-element > a {text-decoration:none;}
#menu .ssmenu-element > a > span,
#menu .ssmenu-element > span {color:#9ca2a9;font-size: 17px; display:block; padding:7px 0 5px 7px;font-weight: 400;letter-spacing: 0.06px;line-height: 23px;position:relative;transform: translateX(0px);transition: transform .3s ease-in-out;}
#menu .ssmenu-element > a > span em,
#menu .ssmenu-element > span em{font-size: 13px;  font-weight: 300;font-style: normal;}
#menu .last .smenu-element .ssmenu-element > a > span,
#menu .last .smenu-element .ssmenu-element > span {color:#ea008a;}

#menu .ssmenu-element > a > span::after,
#menu .ssmenu-element > span::after {content: "\f105 "; position:absolute; right: 0;opacity: 0; top:9px; font-size:12px; font-family: FontAwesome;right: 0;-webkit-transform: translateZ(0);
  transform: translateZ(0);transition: .2s cubic-bezier(.19,1,.22,1);} 
#menu .ssmenu-element.selected > span,
#menu .ssmenu-element:hover > span ,
#menu .ssmenu-element.selected > a > span,
#menu .ssmenu-element:hover > a > span {color:#73787d;-webkit-transform: translateX(-7px) translateZ(0); transform: translateX(-7px) translateZ(0);}
#menu .ssmenu-element.selected > span::after,
#menu .ssmenu-element:hover > span::after,
#menu .ssmenu-element.selected > a > span::after,
#menu .ssmenu-element:hover > a > span::after{opacity: 1;-webkit-transform: translateX(17px) translateZ(0);transform: translateX(17px) translateZ(0);}
#menu .last .ssmenu-element.selected > span,
#menu .last .ssmenu-element:hover > span ,
#menu .last .ssmenu-element.selected > a > span,
#menu .last .ssmenu-element:hover > a > span {color:#281f5d;}



@media all and (max-width:1535px) {
	#menu .menu-element {margin: 0 15px;}
}
@media all and (max-width:1445px) { 

	#menu .menu-element {margin: 0 12px;}
}

@media all and (max-width:1375px) {
	.sm { height: 100px;}
	
	#global { padding-top: 100px;}
	#bandeau.sm #menu-conteneur {clear: both; padding-top: 0;}
	#menu > .global {text-align:center;} 
	#menu .menu-element > a, #menu .menu-element > a:visited {display:block; height: 38px;}
	#menu .menu-element > a > span, #menu .menu-element > a:visited > span, #menu .menu-element > span {box-sizing: border-box; height: 100%;padding: 6px 0;}
}


@media all and (max-width:1295px) {
	#menu .first .smenu-element:first-child {margin: 40px 20px 36px;}
	#menu .first .smenu-element:first-child { margin-left: 20px;} 
	#menu .last .smenu-element { padding: 40px 75px 36px 22px; }
}
@media all and (max-width:1270px) {
	#bandeau.sm #logo a img { height: 55px;}
	#menu .menu-element { margin: 0 9px;}
}

@media all and (max-width:1195px) {
    #menu .smenu-centre-menus{min-width: 713px;}
	#menu .first .smenu-element {margin: 40px 10px 36px!important;}
	#menu .last .smenu-element {padding: 40px 20px 36px;}
	#menu .first .smenu-element:first-child {margin-left: 20px!important;	}
}

@media all and (max-width:1120px) {

	#menu .menu-element {margin: 0 9px;}
	#bandeau.sm #menu .menu-element>a:visited>span, #bandeau.sm #menu .menu-element>a>span, #bandeau.sm #menu .menu-element>span {font-size: 13px;}

}

@media all and (max-width:990px) {

	/* Bandeau */	
	.noscroll #bandeau-haut{display:none;}
	
	#bandeau.sm #bandeau-elements {top: -40px;}
		
	#bandeau #bandeau-elements {position: absolute;top: -90px;right: 0;z-index: 200; height: 40px;  -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -ms-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out;}
	#bandeau #bandeau-google {padding:8px 25px 0 0; height: 100%;}	
	#bandeau #bandeau-google img.pc {display:none;}
	#bandeau #bandeau-google img.mobile {display:block;}

	#bandeau #bandeau-email,
	#bandeau #bandeau-elements > div {height:100%;}
	#bandeau #bandeau-telephone {height: calc(100% - 4px); line-height: 40px; margin-right: 10px;}
	#bandeau #bandeau-telephone i {display:none;}	
	#bandeau #bandeau-telephone a:nth-child(2n+1)::before {margin: 15px 7px 0;}
	
	#bandeau #bandeau-email {background:none;}
	#bandeau #bandeau-email a {line-height:40px;}
	#bandeau #bandeau-email i {margin:0; font-size: 17px;}
	#bandeau #bandeau-email i.fa-envelope::before {content:"\f003";}
	#bandeau #bandeau-email a > span > span {display:none;}
		
	#bandeau-contact {opacity:1;  height:auto; }
	#bandeau.sm #bandeau-contact #logo {display:none; }
	#bandeau-conteneur,
	#bandeau.sm #bandeau-conteneur {height:auto;}
		
	.lg {  height: 85px;}
	.sm { height: 35px; border:none;}
		
	#bandeau #logo {padding:10px 0 0;}
	#bandeau #logo a img {margin: 0 auto;}
	
	/* Menu mobile */
	#bandeau-mobile { min-width:inherit; width:100%; display: block; }	
	
	#menu .ssmenu-element.selected > span,
	#menu .ssmenu-element:hover > span ,
	#menu .ssmenu-element.selected > a > span,
	#menu .ssmenu-element:hover > a > span {color:#73787d;-webkit-transform: translateX(0) translateZ(0); transform: translateX(0) translateZ(0);}
	#menu .ssmenu-element > a > span::after,
	#menu .ssmenu-element > span::after {display: none;} 
	
	
	/* bas */
	#bandeau-mobile-bas {position: relative; z-index: 45; clear:both; background:#622178; height:35px; cursor:pointer; }
	#bandeau-mobile-bas > span {font-size: 18px; width: auto; text-transform: uppercase; padding-left:40px; padding-top: 3px; display: block; color: #ffffff; text-decoration: none; position:relative;}
	#bandeau-mobile-bas i {position:absolute; left:10px; top:5px; font-size:23px;}
			
	#bandeau #menu-conteneur { padding:0; position: fixed; z-index: 9999; top: 0;left: 0;  height: 100%;  width:80%;  width: calc(100% - 45px); background: #fff;    -webkit-transition: transform 0.5s;    -khtml-transition: transform 0.5s;    -moz-transition: transform 0.5s;    -ms-transition: transform 0.5s;    -o-transition: transform 0.5s;    transition: transform 0.5s;    -webkit-transform: translateX(-100%);    -khtml-transform: translateX(-100%);    -moz-transform: translateX(-100%);    -ms-transform: translateX(-100%);    -o-transform: translateX(-100%);    transform: translateX(-100%);    overflow-x: hidden;    overflow-y: scroll;}
	#bandeau #menu-conteneur.open {display: block;-webkit-transform: translateX(0%);-khtml-transform: translateX(0%);-moz-transform: translateX(0%);-ms-transform: translateX(0%);-o-transform: translateX(0%);transform: translateX(0%);}
	
	#bandeau #menu-titre { display:block; margin-bottom: 20px;}
	#bandeau #menu-titre > span {font-size: 18px; width: auto; text-transform: uppercase; padding-left:20px; padding-top: 2px; display: block; color: #622178; text-decoration: none; position:relative;}
	#bandeau #menu-titre i {position:absolute; left:0px; top:6px; font-size:20px;}
			
	#bandeau #menu-close {display: none; line-height: 45px; cursor:pointer; font-weight: 700; z-index: 999; border:1px solid #622178; text-align:center; font-size: 50px;color: #ffffff; width: 45px;height: 45px; position: fixed;  top: 0; right: 0;background: #622178;}
	#bandeau #menu-close.visible {display:block;}
	#bandeau #menu-wrapper {padding: 10px;}	
	
	
	#menu .smenu-centre-menus {min-width: 100%;}
	#menu .first .smenu-element:first-child {
		margin-left: 0px!important;
	}
	#menu .menu-element,
	#menu .menu-element.menu-grand {height:auto !important; margin:10px 0px 0 !important; display:block; padding:0 0 10px 5px; border-bottom:1px solid #edecec;}
	#menu .menu-element > a > span,
	#menu .menu-element > a:visited > span,
	#menu .menu-element > span,
	#menu .menu-element.menu-grand > a > span, 
	#menu .menu-element.menu-grand > span {padding:5px; text-align:left;  color:#622178; border:none;font-size:15px;}
	/* #menu .menu-element br {display:none;} */
	#menu .smenu-centre-menus .last {background: #fff;}
	#menu .ssmenu-element > a > span, #menu .ssmenu-element > span {font-size: 13px;color: #ea008a!important;}
	#menu .ssmenu-element.selected > span, #menu .ssmenu-element:hover > span, #menu .ssmenu-element.selected > a > span, #menu .ssmenu-element:hover > a > span {color: #622178!important;font-size: 13px;}
	
	#bandeau.sm #menu-conteneur {
		padding-top: 0px;
	}
	#menu .menu-element > a > span::after,
	#menu .menu-element > span::after,
	#menu .menu-element.selected > a > span::after,
	#menu .menu-element.selected > span::after,
	#menu .menu-element:hover > a > span::after,
	#menu .menu-element:hover > span::after {display:none !important;}	
	
	#menu .menu-element.selected > a > span,
	#menu .menu-element.selected > span {font-weight:700;}
	
	#menu .smenu-conteneur {margin-top:6px; width:100%; padding:0; display:block !important; position:relative; left:0 !important; top:0 !important; background:none; min-height: 0;box-shadow: none;    border-radius: 0; }
	#menu .smenu-centre {border:none; margin:0; width:auto;}
	#menu .ssmenu-conteneur-images {display:none !important;}
	#menu .smenu-centre-menus {float:none; width:auto;display: block;}
	#menu .smenu-conteneur .smenu-element{display:block; width:auto;margin: 0!important;padding: 0!important;width: 100%;}
	#menu .smenu-element > a > span, 
	#menu .smenu-element > span {text-align: left;padding:7px 0 7px 15px; display:block !important; border:none;width:auto; text-decoration:none;color:#000000;font-size:14px; text-transform: none; font-weight: 400;
		letter-spacing: initial;}
	#menu .smenu-element > a, #menu .smenu-element > a:hover {text-decoration:none;}
	
	#menu .smenu-element.selected > span,
	#menu .smenu-element.selected > a > span,
	#menu .smenu-element:hover > span
	#menu .smenu-element:hover > a > span {background:#622178;color:#fff;}
	
	#menu .smenu-element > a > span::after,
	#menu .smenu-element > span::after,
	#menu .smenu-element.selected > a > span::after,
	#menu .smenu-element.selected > span::after,
	#menu .smenu-element:hover > a > span::after,
	#menu .smenu-element:hover > span::after {display:none !important;}
	
	#menu .ssmenu-element > a > span, #menu .ssmenu-element > span {padding: 5px 0 10px 17px;}
	#menu .ssmenu-element > a > span::before, #menu .ssmenu-element > span::before {left: 16px; top: 9px;}
	
}
	
@media all and (max-width:930px) {
	
	#menu .menu-element > a > span, #menu .menu-element > a:visited > span, 
	#menu .menu-element > span {font-size:14px;}
	#menu #menu-11.menu-element.selected > a > span::after, 
	#menu #menu-11.menu-element.selected > span::after, 
	#menu #menu-11.menu-element:hover > a > span::after, 
	#menu #menu-11.menu-element:hover > span::after {bottom: -14px;}

}
@media all and (max-width:860px) {
	
	#bandeau.sm #menu .menu-element {margin: 0px 10px;}
}
@media all and (max-width:460px) {
	#bandeau #bandeau-google {padding:12px 5px 0 0; width:100px;}	
}

@media all and (max-width:435px) {		
	#bandeau #bandeau-telephone {margin-right: 0;}
}

@media all and (max-width:385px) {
	#bandeau-mobile-bas > span > span {display:none;}
	
	#bandeau.double #bandeau-mobile-bas { height: 55px;}
	#bandeau.double #bandeau-mobile-bas i {top: 17px;}
	#bandeau.double #bandeau-mobile-bas > span { padding-top: 15px;  height: calc(100% - 15px);}
	
	#bandeau.sm #bandeau-elements {top: -35px;}
	#bandeau.sm.double #bandeau-elements {top: -55px;}
	
	#bandeau #bandeau-elements {height:35px; top: -85px;}
	#bandeau.double #bandeau-elements { height:55px; top:-105px;}
	#bandeau #bandeau-google {padding:7px 5px 0 0;}
	#bandeau #bandeau-telephone {margin:0; line-height: 30px;}
	#bandeau.double #bandeau-telephone {line-height: 25px;}
	#bandeau #bandeau-telephone a, 
	#bandeau #bandeau-telephone a:visited { display: block;}
	#bandeau #bandeau-telephone a:nth-child(2n+1)::before {display:none;}
	#bandeau #bandeau-email a {line-height: 32px;}
	#bandeau.double #bandeau-email a {line-height: 50px;}
}