/* =============================================================================
   BASE
========================== =================================================== */
*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

html,body {margin:0; padding:0;height: 100%;	width:100%;}

body{
	font-family: 'Roboto', sans-serif; 
	color:#ffffff;
	font-weight: 300;
	font-size: 15px;
	line-height: 20px;
	background-color:#070707;
	overflow:hidden;	

}

ul,li, ol{padding:0;margin:0;list-style:none;}
h1,h2,h3,h4{padding:0;margin:0;line-height:45px;}
h1{font-weight:normal; font-size:30px; }
h2{font-weight:normal; font-size: 16px;}
p{ padding:5px 0; margin:0;}

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

ul, ol { margin:0; padding: 0 0 0 0; }
dd { margin: 0 0 0 0px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

a { color:#1d1d1b; outline:none; text-decoration:none; border:none;}
a:visited { }
a:hover { color: #e10f21; }
a:focus { outline: none; }
a:hover, a:active { outline: 0; }


.font-98{font-size:98px;}
.font-38{font-size:38px;}
.font-28{font-size:28px;}
.font-18{font-size:18px;}
.blue{color:#0088ce;}
.red{color:#fb2626;}

.clear{clear:both}

/* =============================================================================
   GLOBAL
========================== =================================================== */

.webpage{width:100%;height:100%;position:fixed;overflow:hidden;}

header{width:100%; height:75px;	z-index: 4000; background-color:#202020; position:absolute; top:-75px;  transition:all 0.5s ease; }
footer{
	width:100%;
	/*height:3%; */
	/*height: 15px;*/
	line-height:32px;
	position: absolute;
	bottom: 0;
	z-index: 10000;
	background: #000000;
	opacity:0.50;
	color:#BCBDBD;
	text-align:left;
	font-size:12px;
	padding-left:10px;
}

footer .social{ display:inline-block; list-style:none; margin:0;padding:0; margin-right:5px;float:right }
footer .social li{ display:inline-block; list-style:none; margin:0;padding:0;margin-right:10px; }
footer .social li a{ display:block; width:20px; height:20px;  background-repeat:no-repeat;  background-image:url(../img/social-footer.png); transition:all 0.5s ease; }
footer .social li a.tw{background-position:top left; }
footer .social li a.tw:hover{background-position:bottom left; }
footer .social li a.fb{background-position:-31px top; }
footer .social li a.fb:hover{background-position:-31px bottom; }

footer .social li a.linkedin{background-position:top right; }
footer .social li a.linkedin:hover{background-position:bottom right; }




.container{width:100%;height:100%; position:relative;overflow:hidden;text-align:center;}

#loader-container{width:100%;height:200%;overflow:hidden;position:absolute; top:0; left:0;}
.pages-loader{width:100%;height:50%;overflow:hidden;position:absolute; top:0; left:0; visibility:hidden}
.pages-loader.readyToShow{visibility:visible}



.content{ height:100%; }

.inner{width:100%;height:100%;overflow:hidden;position:absolute; top:0;left:0; padding-top:75px;}
#categoryMenuLoader{position:absolute;bottom:0;width:100%; height:100%; overflow:hidden; z-index: 1000;pointer-events: none;}
#categoryMenu{position:absolute;bottom:0;width:100%; height:100%; overflow:hidden; z-index: 1000; pointer-events: none;}

.scroll-container{ width:100%;height:100%;overflow:hidden; position:relative;padding:0 10px}

/* =============================================================================
   HEADER
========================== =================================================== */

.btn-global{display:block; border-right:1px solid #2c2c2c;  position:relative;height:100%; width:5%; float:left; position:relative;overflow:hidden; max-width:95px}
.btn-global .icon{display:block; padding:25px 35%; position:relative; z-index:100; opacity:1; transition:all 0.5s ease;}
.btn-global .icon .white-spacer{display:block;height:3px; background:#ffffff; margin-top:20%; transition:all 0.5s ease;}
.btn-global .icon .white-spacer:first-child{margin-top:0px !important;}

.btn-global .icon-close{ background:#202020 url(../img/icon-close3.png) no-repeat center; opacity:0; padding:25px 35%; font-size:20px;color:#000000; height: 100%;text-align: center; font-family: verdana; /*background:#ffffff;*/ position:absolute; left:0px; top:74px;width:100%;  transition:all 0.5s ease; z-index:200 }

.btn-global.activ .icon{ }
.btn-global.activ .icon-close{ top:0px; left:0; opacity:1; }

.btn-global-mobile{ display:none; background:#202020; overflow:visible; max-width:100% }
.btn-global-mobile .icon{padding:0 !important; margin-top: 30px; text-align: center;}
.btn-global-mobile .icon span.txt-icon{ padding-right: 30px; height: 26px; padding-top: 0px;background:url(../img/icon2.png) no-repeat center right; margin:auto; color:#ffffff; font-weight: 500; z-index:100;  position:relative; display: inline-block;/*line-height:15px;*/}
.btn-global-mobile:hover .icon span.txt-icon{ background:url(../img/icon2-over.png) no-repeat center right; }

.btn-global-mobile .icon-close{ background:#FFFFFF; margin-top:0;height:100%; top:0;padding:0; text-align:right; font-family: 'Roboto', sans-serif; font-weight: 500; font-size: 15px; }
.btn-global-mobile .icon-close span{ background:url(../img/icon-close2.png) no-repeat right; color:#7f7f7f; width:74px; display:inline-block; text-align:left; margin-top: 25px; margin-right: 20px; }
.btn-global-mobile.activ .icon-close{ top:0; opacity:1; }

header .btn-global.over  .icon .white-spacer{ background:#000000; }

.logo{
	width:15%; height:100%; display:block;  border-right:1px solid #2c2c2c; float:left;
	background:url(../img/logo.png) no-repeat center;
  -webkit-background-size:  89%; /* pour Chrome et Safari */
  -moz-background-size:  89%; /* pour Firefox */
  -o-background-size:  89%; /* pour Opera */
  background-size: 89%; /* version standardisée */
}

.navigation-tablette{display:none;}

.navigation{list-style:none; width:80%; height:75px;float:left; display:block !important; }
.navigation li, .navigation-tablette li{list-style:none;float:left; min-width:8%; height:100%; }

.navigation li a, .navigation-tablette li a{ padding-left:25px;padding-right:25px; display:block; /*padding:30px 10%;*/height:100%;line-height:75px; font-size:14px; /*text-transform:uppercase; */color:#ffffff; text-align:center; border-right:1px solid #2c2c2c; position:relative; transition:all 0.5s ease; height:75px; overflow:hidden; }

.navigation li a.over, .navigation-tablette li a.over, a.rollover.over span{ color:#000000 !important;}
/*.navigation li.red a.over, .navigation li.blue a.over{color:#ffffff}*/

.navigation li a .txt, .navigation-tablette li a .txt{ font-weight: 500; z-index:100;  position:relative; vertical-align: middle; display: inline-block;line-height:15px; }
.navigation li.red .txt, .navigation li.blue .txt,.navigation-tablette li.red .txt, .navigation-tablette li.blue .txt {line-height:14px;}
.navigation li a .txt .num, .navigation-tablette li a .txt .num { transition:all 0.5s ease; font-weight:700; color:#000000; display:block; float:left; line-height:22px; margin-top:-5px; background:#0d9df6; border-radius:50%;  width:23px;  height:23px; -webkit-border-radius:11px;	-moz-border-radius:11px; -o-border-radius:11px;	border-radius:11px; }
.navigation li a.over .txt .num, .navigation-tablette li a.over .txt .num{background:#101010 !important;color:#ffffff !important}

.navigation li.blue a, .navigation-tablette li.blue a{border-top:2px solid #0d9df6 }
.navigation li.red a, .navigation-tablette li.red a{border-top:2px solid #ec4a3f }


header .roll{opacity:0; display:block; background-color:#ffffff; position:absolute; left:0; top:0; bottom:auto; width:100%;height:0%; transition:all 0.5s ease; z-index:0}

.navigation li.blue .roll, .navigation-tablette li.blue .roll{ background-color:#0d9df6;}
.navigation li.red .roll, .navigation-tablette li.red .roll{ background-color:#ec4a3f; }

.language-navigation{ position:absolute; right:0px;height:100%; width:8%; max-width:119px; overflow:hidden; transition: all 0.5s ease;  }
.language-navigation.open{height:200%;}
 
.navigation li.language-navigation-mobile{display:none; }
 
 
 @media screen and (min-width: 700px) {	
	.language-navigation{ top:0px !important;}
 }
 
.language-navigation a{ width:100%; line-height:75px; font-size:14px; margin:0; background:#202020; margin:0; border-left:1px solid #2c2c2c; color:#ffffff; transition:all 0.5s ease; height:75px; text-align:center; display:block }

.language-navigation a.active span{background:url(../img/arrow-lng.png) no-repeat right center; padding-right:10px;display:block; margin : 0 auto;width: 55px;}
.language-navigation a.active:hover span{background:url(../img/arrow-lng-black.png) no-repeat right center;}

.language-navigation a:hover, .language-navigation a.activ{
	 background:#ffffff;
	 color:#000000;
	 
}

header .over .roll{opacity:1; height:100%;  top:auto; bottom:0}


/* =============================================================================
   NAVIGATION TABLETTE VIEW
========================== =================================================== */

.tablette-view .btn-global{width:15%;}
.tablette-view .btn-global .icon{display:block; padding:25px 35%; position:relative; z-index:100}
.tablette-view .btn-global .icon .white-spacer{display:block;height:3px; background:#ffffff; margin-top:20%; transition:all 0.5s ease;}
.tablette-view .btn-global .icon .white-spacer:first-child{margin-top:0px !important;}
	
.tablette-view .btn-global-mobile .icon-close{ width: 150%; }
.tablette-view .btn-global-mobile.activ .icon-close{ left: -50%; }

.tablette-view .btn-global-mobile{display:block; float:right; border-right:none; border-left:1px solid #2c2c2c;width:20%;border-left:none}

header.tablette-view .btn-global.over  .icon .white-spacer{ background:#000000; }

.tablette-view .navigation{
	/*list-style:none;width:80%; height:100%;float:left; */
	
	transition:all 0.5s ease;
	
	float:right;
	/*width:230px;*/
	
	width: 30%;
	height:auto;

	background:#1b1b1b;
	/*display:none;*/
	display:none !important;
	opacity:0;		
	z-index: 1000;
}

.tablette-view .navigation.open{
	display:block !important;
	opacity:1;
}

.tablette-view .navigation li{/*list-style:none;float:left; width:8%; height:100%;*/ width:100%; height:auto; border-bottom:1px solid #2c2c2c;}


.tablette-view .navigation li a{
	/*display:block;padding:25% 10%;height:100%; font-size:14px; text-transform:uppercase; color:#ffffff; text-align:center; border-right:1px solid #2c2c2c; position:relative; transition:all 0.5s ease; position:relative;*/
	border-right:none;
	/*padding:10px 30px;*/
	text-align:left;
	/*line-height:initial;*/
	font-size:12px;		
	height:100%;
	overflow: visible;
}

.tablette-view .navigation li a.over{color:#000000;}
.tablette-view .navigation li a .txt{ z-index:100;  position:relative; text-align:center }

.tablette-view .navigation li a .txt .num{ /*margin-left:-45px;*/}
.tablette-view .navigation li a.over .txt .num{background:#ffffff;}

.tablette-view .navigation li.blue a{ /*color:#0d9df6; border-top:2px solid #0d9df6*/   border-top:none;  border-left:2px solid #0d9df6}
.tablette-view .navigation li.red a{ /*color:#ec4a3f;  border-top:2px solid #ec4a3f*/  border-top:none; border-left:2px solid #ec4a3f}

.tablette-view .navigation li.blue, .tablette-view .navigation li.red{display:none}

.tablette-view .navigation li.language-navigation-mobile{display:block; padding-left: 25px;border-bottom:none;}	
.tablette-view .navigation li.language-navigation-mobile a{display:inline-block; padding:0;  width:auto}

.tablette-view .language-navigation{display:none}

header.tablette-view .roll{opacity:0; display:block; background-color:#ffffff; position:absolute; left:0; top:0; bottom:auto; width:100%;height:0%; transition:all 0.5s ease; z-index:0}
header.tablette-view .over .roll{opacity:1; height:100%; top:auto; bottom:0}

.tablette-view .logo{
	width:35%; 
	border-right:none;
	
	-webkit-background-size: 70% auto; /* pour Chrome et Safari */
	-moz-background-size:  70% auto; /* pour Firefox */
	-o-background-size:  70% auto; /* pour Opera */
	background-size:  70% auto; /* version standardisée */		
	
	background-position: 20px center;
}

.tablette-view .navigation-tablette{
	display:block;
	float:right;
	width:30%;
	border-left:1px solid #2c2c2c;
	height:75px;
}

.tablette-view .navigation-tablette li{
	min-width:50%;
	width:50%;
}
.tablette-view .navigation-tablette li a{
	padding-left:0;
	padding-right: 0;
}

/* =============================================================================
   GRID
========================== =================================================== */

/* =============================================================================
   CATEGORY + CONTENT
========================== =================================================== */

.scroll-down-arrow, .scroll-down-arrow2{ background:url(../img/arrow-scroll.png) center no-repeat; height:34px; width:60px; position:absolute; right:0; left:auto;}
.scroll-down-arrow3{background:url(../img/arrow-scroll.png) center no-repeat; height: 94px;width: auto;position: absolute;font-size: 25px;text-align: center;}


.grid-content{ position:relative; width:55%; margin:auto;/*padding-top:15%;*/ pointer-events: auto; }
.scrollContent .grid-content{ pointer-events: auto; }
.grid-content a{pointer-events: auto; color:#FFFFFF; text-decoration:underline}

.grid-content img{max-width:100%}

.grid-content .content{opacity:0; visibility:hidden;margin-top:40px; pointer-events: none; background: rgba(0, 0, 0, 0.60);padding:40px;}
.grid-content .content.open{opacity:1; visibility:visible}

.btn-widgets.GlobalMenu.Open{ bottom: 32px !important;  }

.btn-widgets{position:absolute; bottom:-64px; width:100%; transition:all 0.5s ease; z-index:100; pointer-events: auto }
.btn-widgets a{
	transition:all 0.5s ease; display:block; background:url(../img/btn-widgets-background.png) center no-repeat; height:64px; margin:auto; width:55%; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.btn-widgets a span{ background:url(../img/arrow.png) center no-repeat;display:block; width:100%;height:100% }
.btn-widgets a:hover{  background: #ffffff !important;  }
.btn-widgets a:hover span{ background:url(../img/arrow-w.png) center no-repeat !important }

.btn-widgets.open{ bottom:32px !important; }

.toScroll{ /*opacity: 0;*/ position: relative; z-index:100; padding:1px 10px; overflow:hidden  }
.animate{position: relative; width:100%; z-index:100;opacity: 0; /*margin-top:15%;*/ }
.toScroll.scrollContent .animate { /*margin-top:2%;*/ }

.content-container { width:100%; height:100%; overflow:hidden; position:absolute; top:0; }
.content-container figure{ padding:0; margin:0 }
.content-container .slide{ width:100%; height:100%; }
.content-container .slide figure.content{
	width:100%;
	height:100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.content-loader{
	top:0;
	left:0;
	position: absolute;	
	width: 100%;
	height: 100%;
	z-index: 0;
	visibility:hidden;	
}

.content-loader.open{
	visibility:visible;	
}


.back-btn{ display:none; padding:0; margin:0;width:100%; height:100%; background:#000000 url(../img/arrow-back.png) no-repeat center; position: absolute; top:0; left:0; z-index:100;  }
.back .back-btn{ display:block; }


.next-container{position:absolute; height:100%;right:0px;}
.prev-container{position:absolute; height:100%;left:0px;}

.arrow{position:absolute; top:40%; width:45px; height:115px;background-color:rgba(16,16,14,0.45);background-repeat:no-repeat; background-position:center;transition:all 0.5s ease;}
.prev-container .arrow{right:-45px;background-image:url(../img/arrow-white-left-big.png)}
.next-container .arrow{left:-45px;background-image:url(../img/arrow-white-right-big.png)}

.next-container.activ .arrow{background-color:rgba(16,16,14,0);}
.prev-container.activ .arrow{background-color:rgba(16,16,14,0);}

.next{
	-webkit-background-size: cover; /* pour Chrome et Safari */
	-moz-background-size: cover; /* pour Firefox */
	-o-background-size: cover; /* pour Opera */
	background-size: cover; /* version standardisée */
	height:100%;
	width:110px;
	background-repeat:no-repeat;
	padding:0;
	margin:0;
	display:block;
}


@media screen and (max-width: 1400px) {
	/* =============================================================================
	   HEADER
	========================== =================================================== */

	.btn-global{width:10%; }
	.logo{ width:20%;}
	
	.navigation{width:70%;}
	.navigation li{width:15%;}
	
}

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

	.grid-content{ width:100%; pointer-events: auto; }
	
}


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

	.grid-content{width:98% !important;}	
	.arrow{display:none}
	
	.tablette-view .navigation{ width: 50%; }
	.tablette-view .btn-global-mobile .icon-close{ width: 250%; }
	.tablette-view .btn-global-mobile.activ .icon-close{ left: -200%; margin-left: 50%; }	
	
}


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

	.container{ position:absolute; }
	
	/* =============================================================================
	   HEADER
	========================== =================================================== */

	.tablette-view .logo{	
		width:70%; 
		-webkit-background-size: 80% auto; /* pour Chrome et Safari */
		-moz-background-size: 80%  auto; /* pour Firefox */
		-o-background-size: 80%  auto; /* pour Opera */
		background-size: 80%  auto; /* version standardisée */		
		background-position: center;
	 }
	 
	.tablette-view .navigation-tablette{display:none}
	.tablette-view .navigation li.blue, .navigation li.red{display:block}
	.tablette-view .btn-global-mobile{width:15%;border-left:1px solid #2c2c2c;}
	.tablette-view .btn-global-mobile .icon{padding:25px 35% !important; margin-top:0}
	.tablette-view .btn-global-mobile .icon span.txt-icon{padding-right:16px;}		
	.tablette-view .btn-global-mobile .icon span.txt-icon span.label{display:none}
	.tablette-view .btn-global-mobile .icon-close{ width: 350%; }
	.tablette-view .btn-global-mobile.activ .icon-close{ left: -300%; margin-left: 60%; }
	
	.category-select{width:80% !important}
}

@media screen and (max-width: 580px) {
	
	.grid-content{ width:100%; }
	
}


/* =============================================================================
   DEFAULT INDEX
========================== =================================================== */


.video-container{
	width:100%;
	height:100%;
	position:absolute;
	z-index:0;
	top:0;
	left:0;
}

.video-container .image-bk{
	width:100%;
	height:100%;
	position:relative;
	z-index:0;
	top:0;
	left:0;
	padding:0;
	margin:0;  
}

.video-container .image-bk figure{
	padding:0;
	margin:0;
	
	background-repeat:no-repeat;
	
	-webkit-background-size: cover; /* pour Chrome et Safari */
	-moz-background-size: cover; /* pour Firefox */
	-o-background-size: cover; /* pour Opera */
	background-size: cover; /* version standardisée */	
}

.video-container .video-bk{
	width:100%;
	height:100%;
	position:relative;
	z-index:0;
	top:0;
	left:0;
	
	-webkit-transition: all 0.6s;
    transition: all 0.6s;
}
.video-container .video-loader{
	position:absolute;
}

.video-container .trame, .content-container .trame{
	width:100%;
	height:100%;
	position:absolute;
	z-index:1;
	top:0;
	left:0;	
	background:url(../img/trame.png);
	
	padding:0;margin:0;
}


.blur{	
	
	/*filter: url(../filter.svg#blur);*/	
	filter: blur(15px);
	-webkit-filter: blur(15px);
	-moz-filter: blur(15px);
	-o-filter: blur(15px);
	-ms-filter: blur(15px);
	/*filter: url(blur.svg#blur);
	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='10');*/
}

.blur2{
	filter: blur(3px);
	-webkit-filter: blur(3px);
	-moz-filter: blur(3px);
	-o-filter: blur(3px);
	-ms-filter: blur(3px);
}

.video-bk.close{}

/* =============================================================================
   DEBUG
========================== =================================================== */

.btn-blur{
	text-align:center;
	padding:10px 10px;
	display:block;
	background:#ffffff;
	color:#000000;
	margin-top:	20px;
}

#debug{
	background:rgba(0, 0, 0, 0.5);
	position:absolute;
	top:0;
	left:0;
	color:#ffffff;
	padding:20px;
	
	/*display:none*/
}


/* =============================================================================
   SCROLL OVERRIDE
========================== =================================================== */
.content-container .mCSB_inside > .mCSB_container{margin-right:0 !important}
.content-container .mCSB_scrollTools{right:20px;}

/*#menu-global .mCSB_inside > .mCSB_container{margin-right:0 !important}
#menu-global .mCSB_scrollTools{right:20px;}*/

#menu-global {padding:0 10px; overflow:hidden}

@media screen and (max-width: 960px) {
	.content-container .mCSB_inside > .mCSB_container{margin-right:0 !important}
	.content-container .mCSB_scrollTools{right:0px;}

	/*#menu-global .mCSB_inside > .mCSB_container{margin-right:0 !important}
	#menu-global .mCSB_scrollTools{right:0px;}*/
	/*#menu-global {padding-right:0px;}*/
}

/* =============================================================================
  SPINNER
========================== =================================================== */

/*#spinner{ position:absolute; }
#spinner img{ display:block; margin-left:-20px; position:relative; }*/

#spinner {
  display: inline-block;
  width: 30px;
  height: 30px;
  margin-left: -15px;
  margin-top: -15px;
  position: absolute;
  border: 4px solid #FBFBFB;  
  z-index:10000; 
  top:50%;
  left:50%;
  animation: spinner 4s infinite ease;
  -webkit-animation: spinner 4s infinite ease;
}

.spinner-inner {
  vertical-align: top;
  display: inline-block;
  width: 100%;
  background-color: #FBFBFB;
  animation: spinner-inner 4s infinite ease-in;
  -webkit-animation : spinner-inner 4s infinite ease-in;
}

@keyframes spinner {
  0% { transform: rotate(0deg); }  
  25% { transform: rotate(180deg); }  
  50% {  transform: rotate(180deg); }  
  75% { transform: rotate(360deg); }  
  100% { transform: rotate(360deg); }
}

@keyframes spinner-inner {
  0% {  height: 0%; }
  25% { height: 0%;  }  
  50% {  height: 100%; }  
  75% {  height: 100%; }  
  100% {  height: 0%; }
}


@-webkit-keyframes spinner {
  0% { transform: rotate(0deg);-webkit-transform:rotate(0deg); }  
  25% { transform: rotate(180deg);-webkit-transform: rotate(180deg); }  
  50% {  transform: rotate(180deg);-webkit-transform: rotate(180deg); }  
  75% { transform: rotate(360deg);-webkit-transform: rotate(360deg); }  
  100% { transform: rotate(360deg);-webkit-transform: rotate(360deg); }
}

@-webkit-keyframes spinner-inner {
  0% {  height: 0%; }
  25% { height: 0%;  }  
  50% {  height: 100%; }  
  75% {  height: 100%; }  
  100% {  height: 0%; }
}


/* =============================================================================
  LIST (news & jobs)
========================== =================================================== */

.list{ color:#000000;margin-top: 10%; transition:all 0.5s ease; }
/*.list.open{ margin-top: 5%; }
.list.open-more{ margin-top: 0%; }*/

.list .row{ }
.list .wrapper{max-width: 65%;display: block; width: 100%;margin: auto;}

.list-header{ padding-top:34px; padding-bottom:16px; background:rgba(255,255,255,0.90);}
.list-header h1{font-size:50px;font-weight:100 !important}
.list-header p{font-size:14px;font-weight:700 !important; padding-top:30px;}

.list-content{background:rgba(255,255,255,0.90);}
.list.open .list-content{margin-top:5px;background:rgba(255,255,255,1);}

.list-content ul li{position: relative;overflow:hidden}
.list-content ul li:first-child{}
.list-content ul li .spacer{width:10px; height:1px; background:#000000; display:block;margin:auto}

.list-content ul li h2.job-title{ margin:0; padding:0; height:45px; transform-style: preserve-3d; perspective: 1000px; position:relative}

.list-content ul li a .roll{opacity:0; display:block; background-color:#ff572f; position:absolute; left:0; top:auto; bottom:0; width:100%;height:0%; transition:all 0.5s ease; z-index:0}
.list-content ul li.over a.rollover .roll{opacity:1; height:100%;  top:0; bottom:auto; }
.list-content ul li.over a.rollover .txt{ color:#ffffff; z-index:10; position:relative; transition:all 0.5s ease; }

.list-content ul li h2.job-title .close, .list-content ul li h2 .open{position:absolute; width:100%; display:block;font-size:15px; font-weight:700 !important; text-transform:uppercase; transition:all 0.5s ease; height:100%; }

.list-content ul li h2.job-title .close{ transform-origin: top center; transform: rotateX( 90deg ) translateZ( 0px ) translateY( -45px );  opacity:0 }
.list-content ul li h2.job-title .close.activ{ background-color:transparent; transform: rotateX( 0deg ) translateZ( 0px ) translateY( 0px ); opacity:1 }

.list-content ul li h2.job-title .open{  cursor:pointer; display:block; width:100%; height:100%; font-size:15px;text-align:left; color:#ee5b3d !important; background:#ffefe7; font-weight:700; text-transform:uppercase; position:relative; z-index:20;/*overflow:hidden*/}
.list-content ul li h2.job-title .open .txt{ font-weight:500;background:url(../img/arrow-orange-down.png) no-repeat left center; padding-left:28px; color:#ee5b3d !important; }
.list-content ul li h2.job-title .open .title{font-weight:900; color:#ee5b3d !important;}
.list-content ul li h2.job-title .open .ref{font-weight:100; color:#ee5b3d !important;text-transform:normal}

.list-content ul li h2.job-title .open{transform-origin: bottom center; transform: rotateX( -90deg ) translateZ( 0px ) translateY( 45px ); visibility:hidden; opacity:0}
.list-content ul li h2.job-title .open.activ{  transform: rotateX( 0deg ) translateZ( 0px ); visibility:visible; opacity:1 }

.list-content ul li h2.job-title .open .apply{ position:absolute; top: 0; color:#ffffff; background:#ff572f; height:100%; width:26% }
.list-content ul li h2.job-title .open .apply.opened{ right:0 !important; }

.list-content ul li h2.job-title .open .apply .txt{ background:url(../img/arrow-white-left.png) no-repeat right center; color:#ffffff !important; padding:0;margin:0; display: block; width: 70px; margin: auto; }

.list-content ul li .job-links-container{ position:absolute; top: 45px; color:#ffffff; padding-top: 4px;background: #ffefe7; height:45px; width:26%; right:0;text-align:center}


.list-content ul li .description{ display:none;margin-top:20px; }
.list-content ul li .description h2{ font-weight:700; }
.list-content ul li .description *{font-family:'Roboto', Arial !important }

.list-content ul li.over .spacer{background:rgba(255,255,255,0.90); transition:all 0.5s ease;}

.form-submit{display:none;}

.confirmation{ color: #ff572f; font-size: 12px;line-height: 15px;margin-top:10px !important;margin-top:10px !important; }
.error{color: #ff572f; font-size: 12px;line-height: 15px; margin-top:5px; display:block; width: 100%; float: left;}


.field{ width:45%; float:left; text-align:left;margin-top:10px;}
.field.r{ margin-left:10%  }
.field.large{ width:100%; }

.field.textarea, .field.submit{width:100%}
.field.submit{margin-top:20px;}

.field label{ display:block;font-style:italic;font-weight:500; font-size:13px; }
.field span, .field a{ font-style:italic;font-weight:500; font-size:13px; }

.field input[type="text"], .field textarea, .field select, .chosen-container-multi .chosen-choices{ background-image:none !important; width:100%;border:none  !important; border-top:1px solid #e0e0e0 !important; border: 1px solid #F2F2F2 !important; height:30px; margin-top:3px;padding:5px 10px; font-family: 'Roboto', Arial; font-style:italic;font-weight:700; font-size:13px; }
.chosen-container-multi .chosen-choices{min-height:30px !important}
.field select{ padding:0px; }
.field textarea{height:100px}

.field.checkbox{/*margin-top: 30px;*/}
.field.checkbox input{display:inline-block;margin-top:3px;vertical-align: top;}
.field.checkbox label{display:inline-block; margin-left:5px;width:90%}
.field .captcha_reload{ display:inline-block; margin-left:10px; }

.chosen-container{width:100% !important}
.chosen-container .search-field input{width:204px !important}


.field input[type="submit"]{
	font-size: 15px;
	padding:0;
	margin:0;
	font-weight:700;
	border:none;
	display:block;
	background-color:#ff572f; 
	color:#ffffff;
	height:45px;
	text-align:center;
	width:100%;
	cursor:pointer;
	font-family: 'Roboto', Arial;
}


.field input[type="submit"].disabled{
	background-color:#a9a9a9;
	pointer-events:none;
}

.category-select{
	width:26%;
	float:none;
	margin: 0 auto;
	padding: 15px 0; 	
}


.field .btn-upload{ background:url(../img/btn-upload.png) no-repeat center left; padding-left:40px; margin-top: 25px; display: block; float: left;font-style:italic;font-weight:700; }
.field .filename{font-size: 12px;line-height: 15px; margin-top:10px; display:block; width: 100%; float: left;}

.jobs-informations{ background:#000000; color:#ffffff; margin:0; padding-top:20px; padding-bottom:20px; font-size: 12px; line-height: 17px; font-weight:700;  }
.jobs-informations .address{ font-weight:300 }


#news-list .row{max-width:620px}

#news-list .list-header{ border-bottom:1px solid #000000; padding-bottom:34px; /*background:rgba(255,255,255,1);*/ }

#news-list .list-content{background:none;}
#news-list .list-content ul li{margin-top:50px;}
#news-list .list-content ul li .background{background:#ffffff}
#news-list .list-content ul li:first-child{margin-top:0;}
#news-list .list-content ul li .picture{float:left; width:50%; display:block; max-width:400px;}
#news-list .list-content ul li .description-container{padding:10px 20px;float:right; width:50%}
#news-list .list-content ul li .description-container h1{width:100%; padding-bottom:20px;font-size:24px;}
#news-list .list-content ul li .description-container p{text-align:justify}


#news-list .list-content ul li .links-container{ background:rgba(0,0,0,0.5); color:#ffffff;text-align:right; font-size:11px; padding:0; width:100%; line-height:0 }
#news-list .list-content ul li .links-container a.know-more{ float:left; margin-top: 20px; margin-left: 20px; }
#news-list .list-content ul li .links-container a{ color:#ffffff !important;}


#contact-list .roll{background:#0088ce}
#contact-list .list-content ul li h2.job-title { height:85px; }
#contact-list .list-content ul li.activ h2{height:45px}
#contact-list .list-content ul li h2.job-title .close{ height:100%; text-transform: initial; font-style:italic; color:#0088ce; }
#contact-list .list-content ul li h2.job-title .close .txt{ font-weight:300; height:100%; width:100%; text-align:center; display:block; background-repeat:no-repeat; background-image:url(../img/icon-contact-out.jpg);  background-position:center 50px; }
#contact-list .list-content ul li h2.job-title .open{ background-color:transparent !important; }
#contact-list .list-content ul li h2.job-title .open .txt{ color:#0088ce !important;background: url(../img/arrow-blue-down.png) no-repeat left center; }
#contact-list .list-content ul li.over h2.job-title .close .txt{ background-image:url(../img/icon-contact.jpg); }
#contact-list .field input[type="submit"]{background-color:#0088ce !important; }
#contact-list .list-content ul li .spacer{background:#0088ce}

#contact-list .contact-informations{background:rgba(255,255,255,0.90);}
#contact-list .list.open .contact-informations{margin-top:5px;background:rgba(255,255,255,1);}


#contact-list .contact-informations{ font-weight:300; font-size:13px; padding-top:15px; padding-bottom: 0;}
#contact-list .contact-informations .bold{ font-weight:900 }
#contact-list .contact-informations .medium{ font-weight:500 }

#contact-list .contact-informations .title{margin-bottom:10px;display:block}
#contact-list .contact-informations .address{ margin-bottom:10px;display:block}
#contact-list .contact-informations .phone{margin-bottom:20px;display:block}
#contact-list .contact-informations .plane-access{background:url(../img/icon-plane.png) no-repeat center top; padding-top:20px; margin-bottom:10px;display:block}
#contact-list .contact-informations .metro-access{background:url(../img/icon-metro.png) no-repeat center top; padding-top:20px; margin-bottom:10px;display:block}
#contact-list .contact-informations .map{background:url(../img/contact-map.jpg) no-repeat center; display:block; height:300px; width:100%;  -webkit-background-size: cover; /* pour Chrome et Safari */
  -moz-background-size: cover; /* pour Firefox */
  -o-background-size: cover; /* pour Opera */
  background-size: cover; /* version standardisée */}
  
#contact-list .confirmation{ color: #000000; font-size: 13px;line-height: 15px;margin-top:10px !important;margin-bottom:10px !important; text-align:left}

@media screen and (max-width: 700px) {
	#news-list .list-content ul li .description-container,#news-list .list-content ul li .picture{ float:none; width:100%;  max-width:100%;}
	.list .wrapper{max-width:80%}	
	
}

@media screen and (max-width: 450px) {
	#contact-list .list-content ul li h2.job-title .open .txt{font-size:13px}	
	.list .wrapper{max-width:95%}
}



.st_facebook_large .stButton .stLarge{ background:url(../img/fb-out.png) !important; width:36px !important; height:36px !important;   }
.st_twitter_large .stButton .stLarge{ background:url(../img/twitter-out.png) !important; width:36px !important; height:36px !important;   }
.st_linkedin_large .stButton .stLarge{ background:url(../img/linkedin-out.png) !important; width:36px !important; height:36px !important;   }

#news-list .st_facebook_large .stButton .stLarge { background:url(../img/fb2-out.png) !important; width:36px !important; height:36px !important;   }
#news-list .st_twitter_large .stButton .stLarge { background:url(../img/twitter2-out.png) !important; width:36px !important; height:36px !important;   }
#news-list .st_linkedin_large .stButton .stLarge { background:url(../img/linkedin2-out.png) !important; width:36px !important; height:36px !important;   }

.list-content .st_facebook_large .stButton .stLarge{ background:url(../img/fb3-out.png) !important; width:36px !important; height:36px !important;   }
.list-content .st_twitter_large .stButton .stLarge{ background:url(../img/twitter3-out.png) !important; width:36px !important; height:36px !important;   }
.list-content .st_linkedin_large .stButton .stLarge{ background:url(../img/linkedin3-out.png) !important; width:36px !important; height:36px !important;   }


.st_facebook_large .stButton .stLarge:hover, #news-list .st_facebook_large .stButton .stLarge:hover{background-position:0 !important; background-image:url(../img/fb-over.png) !important; width:36px !important; height:36px !important;  opacity:1  }
.st_twitter_large .stButton .stLarge:hover, #news-list .st_twitter_large .stButton .stLarge:hover{ background-position:0 !important; background-image:url(../img/twitter-over.png) !important; width:36px !important; height:36px !important;opacity:1  }
.st_linkedin_large .stButton .stLarge:hover, #news-list .st_linkedin_large .stButton .stLarge:hover{ background-position:0 !important; background-image:url(../img/linkedin-over.png) !important; width:36px !important; height:36px !important; opacity:1  }


.youtube{height:50%}