@charset "UTF-8";
/* CSS Document */


header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: #fff;
	z-index: 10000;
	height: 100px;
	overflow: hidden;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	padding:20px 0;
	-webkit-box-shadow: 0px 0px 6px 1px rgba(50, 50, 50, 0.28);
	-moz-box-shadow:    0px 0px 6px 1px rgba(50, 50, 50, 0.28);
	box-shadow:         0px 0px 6px 1px rgba(50, 50, 50, 0.28);
	}

header h1.logo, header #navMenu, header #mobile-header {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	 transform-origin: left top;
}

header.shrink {height: 50px;padding:5px 0 20px}
header.shrink h1.logo{transform:scale(0.7);margin-top:5px}
header.shrink #navMenu{margin-top:5px}
header.shrink #mobile-header{top:2px}

#mobile-header {
	display:none;
	position:absolute;
	top:10px;
	right:10px;
    z-index: 10001}


header .container{padding:0 40px}


h1.logo{width:220px;float:left;margin:15px 0 0;line-height:0}

#navMenu{float:right;margin-top:20px}
#navMenu li.fb img{max-height:31px;margin-top:1px}
#navMenu li.langue a{font-weight:700;color:#3d8900;}


#navMenu li{display:inline-block;background:none;text-transform:uppercase;font-weight:300;margin:0}
#navMenu li a {position: relative;color: #000;-webkit-transition: color 0.4s;transition: color 0.4s;padding:0 0 5px 0;}
#navMenu li a:hover{color: #b8b8b8;}
#navMenu li a.active::after,
#navMenu li a.active::before {-webkit-transition-delay: 0s;transition-delay: 0s;-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
#navMenu ul li a.active{color: #3d8900;}

#navMenu li a:hover::before{
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}
#navMenu li a::before,
#navMenu li a::after {
	content: '';
	position: absolute;
	bottom: -9px;
	left: 0;
	width: 100%;
	height: 8px;
	-webkit-transform: scale3d(0, 1, 1);
	transform: scale3d(0, 1, 1);
	-webkit-transform-origin: center left;
	transform-origin: center left;
	-webkit-transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
	transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
}
#navMenu li a::before {background: #b8b8b8;-webkit-transition-delay: 0.4s;transition-delay: 0.4s;}
#navMenu li a::after {background: #3d8900;}







/* MENU */
.sidr{
	display:none;
	position:absolute;
	position:fixed;
	top:0;height:100%;
	z-index:999999;
	width:230px;
	overflow-x:hidden;
	overflow-y:auto;
	text-transform:uppercase;
	background:#fff;
		-webkit-box-shadow: 0px 0px 6px 1px rgba(50, 50, 50, 0.28);
	-moz-box-shadow:    0px 0px 6px 1px rgba(50, 50, 50, 0.28);
	box-shadow:         0px 0px 6px 1px rgba(50, 50, 50, 0.28);
}
	

.sidr-inner{margin-top:20px;background:#fff;}

.sidr.right{left:auto;right:-260px}
.sidr.left{left:-260px;right:auto}

.sidr ul{margin:0}
.sidr li{display:block;color:#000;background:none;margin: 2px 0;padding: 0;}
.sidr li a{display:block;color:#000;padding:7px 0 10px 15px;font-size:16px;font-weight:500;border-bottom:1px solid #87bf2f;}
.sidr li:hover a, .sidr li a:hover, .sidr li a.active{color:#87bf2f;border-left:10px solid #87bf2f;}
.sidr-class-fb img{max-height:18px}




@media only screen and (max-width: 1080px) {
	

header .container{padding:0 20px}

h1.logo{max-width:170px;}

#navMenu li{font-size:15px}	
#navMenu li.fb img{max-height:18px;margin-top:3px}


}


@media only screen and (max-width: 830px) {
	

#navMenu li{font-size:13px}	
#navMenu li.fb img{max-height:18px;margin-top:3px}


}


@media only screen and (max-width: 768px) {
header .container{padding:0 20px}
#mobile-header {display: block;}
nav#navMenu{display:none;}
header.shrink h1.logo{margin-top:10px}

}



@media only screen and (max-width: 480px) {
	
header .container{padding:0 20px}
	
header{height: 50px;padding:5px 0 20px}
header h1.logo{transform:scale(0.7);margin-top:10px}

header #mobile-header{top:1px}


}