/* CSS Document */

.show1380, .show1080,.show980 , .show1140, .show780, .show660 {display:none}
.hide1080, .hide660 {display:1}

.video-js {max-width:100% !important}


@media (max-width: 1380px) {
.show1380 {display:block;}
}


@media (max-height: 900px) {
	.cover, #slider-with-blocks-1, .rsContent {
		height:600px; max-height:600px;
	}
}

@media (max-height: 780px) {
	.cover, #slider-with-blocks-1, .rsContent {
		height:500px; max-height:500px;	}
	
}


@media screen and (max-width: 1080px) {
.hide1080 {display:none}
.show1080 {display:block;}
#historic  article { max-width:15%}
nav a{ padding:29px 20px 0 20px;   font-size:15px; letter-spacing:0.5px;}
nav a small {letter-spacing:0.5px;/* text-align:center !important*/}
.bloc1-4{ width:31%; margin:0 1%; }

}


@media screen and (max-width: 980px) {
	.logo { max-width:165px; top:6px}

.show980 {display:block}
.activities div {  max-width:28% !important;  min-width:28% !important; margin:0 2%; }
.slide1 .bContainer { width:60%; left:40%}
#slider-with-blocks-1  .rsArrow  {display:none !important;}
.coverContent h1, .coverContent .bigIco, .coverContent  p { position:absolute; top:15px; left:38%;}
footer  .bloc1-3 {display:inline-block !important; width:33% !important ; margin:0 }
.imgFooter {display:none !important}
.grid-item { width: 46% !important; margin: 0 2% 20px 2% !important}
.slide1 .bContainer, .slide1 .bContainerCenter {width:100%; margin:0; padding:0}
	
	article.newsMain, aside{display:block !important; width:100% !important; min-width:100% !important; max-width:100% !important}
aside {padding:0 !important; margin:0 !important; border:0; box-shadow:none}

}

@media screen and (max-width: 790px) {
	.spacer {display:none}
.show780 {display:block}
.hide780 {display:none !important}
.logo { max-width:150px; top:5px}
nav a{ padding:29px 15px 0 15px;   font-size:13.5px;  }
nav a small {letter-spacing:0px; font-size:10px;  }
.tLeft , .tRight, .tCenter {text-align: left !important} 
.tXCenter{text-align: center !important} 
.toFull {width:100%; max-width:100%; }
h2 {margin-top:28px; text-align:left; font-size: 32px;}
h2 br, .subTitle br {display:none}
.subTitle { text-align:left; font-size:21px}
.bloc1-2, .bloc2-2, .bloc1-3, .bloc2-3, .bloc60, .bloc40 {display:block; width:100%; margin:0 !important ; text-align:center}


.slide1 .bContainer { width:100%; left:0}
/*#blog .container {text-align:center}*/
.iconList .bloc {min-width:30%; max-width:30% ; padding-bottom: 10px} 
.blocImg {min-width:47.5%; max-width:47.5% ; padding-bottom: 10px} 
.blocImg *, #savoir-faire-logistic h2 { text-align:center !important} 
#savoir-faire .bloc1-3, .bloc2-3 { display:inline-block;  max-width:30%}
.keyBox {max-width:30%; width:30%; margin:0 1%}
.activities div {  margin:0 1%;  max-width:30%;  min-width:30%}
.activities div p {display:none !important}

#savoir-faire .bloc1-3 {max-width:33.3%}



.sticky {position:relative !important}
#bottomIconList.anim{ height:30px !important; }
.bloc60 p, .bloc40 p {max-width:100%}
.coverContent {text-align:center; top:37%}
.coverContent h1, .coverContent  p { position:absolute; top:15px; left:0; right:auto; width:96%; min-width:96%; max-width:96%; padding:02%;  text-align:center !important}
.coverContent h1 {font-size:56px}
.coverContent .bigIco { display:none}
.mapWorld { margin-left:0}
.cover, .coverPage { height:500px;   max-height:70% !important; min-height: 500px; padding:0; margin:0; overflow:hidden}
#my-video {margin:30px 0 0 0 !important; max-height:100%}
#historic , #blog, #contact {padding:10px 0}
.coverContent h1.titleBg { font-size:36px; line-height:36px;  color:#ffffff; padding:0; background-color: transparent; margin-top:0; width:100%; min-width:100%}
.bloc1-4{ width:48%; margin:0 1%; }

}

@media screen and (max-width: 660px) {
.spacer {}
.navMobile {display: block;}
.logo { max-width:140px; top:15px}
#topBan {display:none}
header {top:0}
nav a, .hide660 {display:none !important}
.show660 {display:block !important}
#topBan, header {background:#ffffff !important}
.activities div { height:210px; margin:0;  max-width:33.3% !important;  min-width:33.3% !important}
.activities div img{   max-width:45% !important;  min-width:45% !important ; margin:10px auto}
.slide1 .bContainer {  left:14%}
h2 , h2  *{ font-size: 29px !important; line-height:34px !important}

#historic  article { max-width:18%}

.cover, .coverPage { height:320px;   max-height:70%; min-height: 320px; }
.coverPage { height:420px;   min-height: 420px; }


.coverContentCenter {left:0 !important}
 .coverContentCenter strong {font-size:35px  !important}
.coverContent h1, .coverContent  p { }
.coverContent h1 {font-size:40px; top:0}
 .coverContent p.long, .coverContent p {margin:30px 0 0 0!important; font-size:20px !important; line-height:26px;}
 .coverContent p.long br, .coverContent p  br {display:none}
.iconList .bloc i {display:block; margin:17px auto 8px auto; font-size:35px}
.iconList .bloc span {font-size:16px; line-height:20px; text-transform:uppercase; display:block; padding:0 4%; letter-spacing:0px}

.activities {margin-top:0}	
.activities div  h3 { letter-spacing:0; font-size:28px;  }

#my-video {margin:30px 0 0 0 !important; max-height:100%}

.blockHeadline, .blockHeadline big, .blockSubHeadline {font-size:35px  !important; line-height:40px !important; margin:0 !important; text-align:center !important}
.blockHeadline, .blockSubHeadline  {width:100%; margin:0; text-align:center !important}
	.bContainer{margin:0 auto !important; width:100% !important; left:0 !important; text-align:center !important; top:120px !important}

.icoSlider { display:none !important}
.keyBox {max-width:100%; width:100%; margin:0}
footer .bloc1-3 { width:100% !important}
footer .bloc1-3 ul  {display: block; }
footer .bloc1-3 ul li {display: inline-block; width:47%}

.tabs tr td {display:block; width:100%}
}


@media screen and (max-width: 520px) {
	.bloc1-4{ width:98%; margin:0 1%; }

	.blocImg {min-width:100%; max-width:100% ; padding-bottom: 10px; margin:0} 

	#my-video2, #my-video3 {max-height:210px}
#my-video {margin:35px 0 0 0 !important; max-height:100%}

.coverContent h1 {font-size:36px; top:0}
 .coverContent p.long {margin:20px 0 0 0; font-size:17px}
 .cover { height:280px;  min-height: 280px; }
	
.grid-item { width: 94% !important; margin: 0 3% 20px 3% !important}	
.blockHeadline, .blockHeadline big, .blockSubHeadline,  .blockSubHeadline *, .coverContentCenter strong {font-size: 30px !important;line-height: 36px !important;letter-spacing: 1px !important; text-align:center}

	.blockHeadline br {display:none !important}
	.blockHeadline br.show660 {display:block !important}

.activities div { height:100px; width:33.3%; max-width:33.3% !important; position:relative  }
.activities div img { position:absolute; top:-22px; width:40px !important; max-width:40px !important; min-width:40px !important; left:50%; margin:0 0 0 -20px }
.activities div   img, .activities div  h3 { }
.activities div  h3 { letter-spacing:0; font-size:18px; margin:60px 0 0 0 !important }
#savoir-faire .bloc1-3 {display:block; width:100%; max-width:100%}

}