@charset "UTF-8";
/* CSS MEDIA QUERIES */
@media screen and (max-width: 1420px) {
	
	#cabines{background-position:650px bottom;}
	#accessoires{background-position:-100px center;}
	.accessoire{width:47%;}
	
}
@media screen and (max-width: 1150px) {
	
	#produits .box a{height:275px;}
	#accessoires{background-position:-200px center;}
	.hover-album li{height:100px;}
}

@media screen and (max-width: 1030px) {
	
	.wrap{width:100%;}
	.toplogo{width:365px;}
	.title{margin-top:-110px; font-size:2em;}
	#produits .box a{height:235px;}
	#mainblock .left{width:98%; height:auto !important;}
	#mainblock .right{width:98%;}
	#contactpage{width:96%; padding:60px 2%;}
	.hover-album li{height:75px;}
	
	.verylong{font-size:1.3em !important;}
	
	.accessoire{width:97%;}
	
}

@media screen and (max-width: 870px) {
	#accessoires{background-position:-350px center;}
	.mobile{display:block;}
	#topbar .left, #topbar .right{display:none;}
	
	.mobile a.menu{display:inline-block; float:left; width:45px; height:45px;}
	.mobile a.tel{display:inline-block; float:right; height:45px; line-height:45px; padding:0 15px; color:#58595b; font-family:Arial, Helvetica, sans-serif; font-size:1.2em;}
	#mobilemenu{display:block;}
	
	#produits .box a{height:450px;}
	#produits .box:last-child{display:none;}
	.hover-album li{width:22%;}
}

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

.wrap{width:100%;}

/* ############################################################################################################################################################ */

#home {padding-top:0 !important; height: 500px; width:100%;}
#contact{padding:15px 0;}
#footer{height:auto;}

/*****************************/

.socialbar{position:relative; width:100%; top:0; left:0px; padding:0;}

/*****************************/

.image-0{
	background: url('../img/bg/1.jpg') no-repeat center center scroll;
	
	 -webkit-transition: background 500ms linear;
	 -moz-transition: background 500ms linear;
	 -o-transition: background 500ms linear;
	 -ms-transition: background 500ms linear;
	 transition: background 500ms linear;
}

.image-1{
	background: url('../img/bg/2.jpg') no-repeat center center scroll;
	
	 -webkit-transition: background 500ms linear;
	 -moz-transition: background 500ms linear;
	 -o-transition: background 500ms linear;
	 -ms-transition: background 500ms linear;
	 transition: background 500ms linear;
}

.image-2{
	background: url('../img/bg/3.jpg') no-repeat center center scroll;
	
	 -webkit-transition: background 500ms linear;
	 -moz-transition: background 500ms linear;
	 -o-transition: background 500ms linear;
	 -ms-transition: background 500ms linear;
	 transition: background 500ms linear;
}

.image-3{
	background: url('../img/bg/4.jpg') no-repeat center center scroll;
	
	 -webkit-transition: background 500ms linear;
	 -moz-transition: background 500ms linear;
	 -o-transition: background 500ms linear;
	 -ms-transition: background 500ms linear;
	 transition: background 500ms linear;
}

.image-4{
	background: url('../img/bg/5.jpg') no-repeat center center scroll;
	
	 -webkit-transition: background 500ms linear;
	 -moz-transition: background 500ms linear;
	 -o-transition: background 500ms linear;
	 -ms-transition: background 500ms linear;
	 transition: background 500ms linear;
}

/*.image-5{
	background: url('../img/bg/6.jpg') no-repeat center center scroll;
	
	 -webkit-transition: background 500ms linear;
	 -moz-transition: background 500ms linear;
	 -o-transition: background 500ms linear;
	 -ms-transition: background 500ms linear;
	 transition: background 500ms linear;
}

.image-6{
	background: url('../img/bg/7.jpg') no-repeat center center scroll;
	
	 -webkit-transition: background 500ms linear;
	 -moz-transition: background 500ms linear;
	 -o-transition: background 500ms linear;
	 -ms-transition: background 500ms linear;
	 transition: background 500ms linear;
}

.image-7{
	background: url('../img/bg/8.jpg') no-repeat center center scroll;
	
	 -webkit-transition: background 500ms linear;
	 -moz-transition: background 500ms linear;
	 -o-transition: background 500ms linear;
	 -ms-transition: background 500ms linear;
	 transition: background 500ms linear;
}

.image-8{
	background: url('../img/bg/9.jpg') no-repeat center center scroll;
	
	 -webkit-transition: background 500ms linear;
	 -moz-transition: background 500ms linear;
	 -o-transition: background 500ms linear;
	 -ms-transition: background 500ms linear;
	 transition: background 500ms linear;
}*/

#pagetop {
	position: relative;
}


/*.toplogo{width:100%;}

.title {
	margin-left:25px;
	margin-right:25px;
	font-size: 2em;
}*/

.espwhite{ margin-top:200px; }

/* ############################################################################################################################################################ */

/*#topbar{position:relative;height:auto;}
#topbar .left{position:relative;line-height:10px;  float:none; display:block; text-align:center;}
#topbar .right{display:block;position:relative;line-height:10px; float:none;text-align:center;}*/

/* ############################################################################################################################################################ */

/*#slogan1{top:100px;}
#slogan2{top:100px;}
#slogan3{top:100px;}*/

/* ############################################################################################################################################################ */

#blocks .column{ float:none; width:100%; margin-bottom:45px;}

/* ############################################################################################################################################################ */

#blocs-secteurs a{float:none; width:100%; }
#blocs-secteurs .avantages{background-position:90% 50%;}
#blocs-secteurs .avantages span{ padding-left:30px;}

#pageblocks .bloc{ float:none; width:100%; }
#pageblocks .bloc .img{ width:100%; }

/* ############################################################################################################################################################ */

#blocs-avantages a{float:none; width:100%; }
#blocs-avantages .soumission{ background-position:95% 50%;}
#blocs-avantages .soumission span{ padding-left:40px;margin-top:0px; padding-top:55px;}
#blocs-avantages .climatisation p, #blocs-avantages .ventilation p, #blocs-avantages .panneaux p, #blocs-avantages .portesfenetres p, #blocs-avantages .options p{display:block; padding:0 10px; font-size:0.9em; color:#fff; padding-bottom:20px; display:none;}

/* ############################################################################################################################################################ */

#contact .left h2{text-transform:uppercase; color:#fff; font-size:1.6em;text-align:center; margin-bottom:20px;}
#contact .left{position:relative; width:100%;float:none; margin-bottom:100px;}
#contact .right{position:relative; width:100%; float:none; text-align:center;}
#contact .right img{margin-bottom:40px; width:80%;}


/* ############################################################################################################################################################ */
#mainblockpage h1{ font-size:2.3em; }
#mainblockpage h3{ font-size:1.9em;  }
/* ############################################################################################################################################################ */


#contactpage .left{position:relative; width:100%; float:none; text-align:center;}
#contactpage .right{position:relative; width:100%; float:none; text-align:center;}
#contactpage {
	height:auto;
	
}


#contactpage .left img{width:50%;}
#contactpage .right .soumission{ display:block;padding-right:25px; padding-left:51px;  font-size:1.1em;}


/* ############################################################################################################################################################ */

#produits .box{width:48%; margin:0 1%;}
#produits .box:last-child{width:98% !important; margin:0 1% !important;}

/* ############################################################################################################################################################ */

.video-size{height:400px; width:96%; margin:20px 2%;}
.inpage-video{height:200px;}

/* ############################################################################################################################################################ */

.h1-look-for{
	font-size:1.4em !important;
	margin-bottom:160px !important;}

.look-for{}

	.look-for h3{
		color:#000 !important;
		font-size:1.8em !important;
		text-align:left !important;
		margin-top:80px !important;
		margin-bottom:15px !important;}
	
	.look-for ul{
		margin-left:60px;
		padding-right:20px;
		font-size:1.5em;
		line-height:1.8em;}
	
		.look-for li{}
		
.look-for-contact{
	background-color:#f3f3f3;
	height:430px;
	text-align:center;}

	.look-for-contact h3{
		color:#000 !important;
		font-size:2em !important;
		line-height:1.8em;
		padding-top:20px;
		padding-bottom:20px;}
	
	.look-for-contact a{
		font-family: 'colaborate-boldregular' ;
		background-color:#7d1416;
		color:#FFF;
		width:80%;
		height:64px;
		font-size:1.6em;
		line-height:64px;
		padding:0 15px;
		margin-bottom:10px;
		display:inline-block;}
		
.video-destination{
	width:100%;
	height:300px;
	margin-top:50px;}

/* ############################################################################################################################################################ */

.benefits .benefit{margin: 0 5% 30px; width:90%;}

.heightlpae{height: 450px !important;}

.look-for-contact .esplp{margin-top:0; width: 80% !important; height:auto !important; line-height:1.6em; padding:10px 15px;}

/* ############################################################################################################################################################ */

.forceleftalign{width:96% !important;}
.textstrd{width:96%;}
.cabine-industrielle{width:96%; margin:40px auto;}

.cabine-industrielle .box-img{width:100%;}
.cabine-industrielle .box-text{width:100%;}

#subprod{display:block !important; position:relative; top:auto; left:auto; width:auto; padding:0;}
#subprod.fr{left:auto; width:auto;}

/* ############################################################################################################################################################ */

#infolettre .text{height:30px; line-height:30px; width:42%; margin:8px 2%; padding:0 1%;}
#infolettre .btn{border:0; height:40px; line-height:40px; margin-top:20px; padding:0 45px;}

#accessoires{background:none; padding:100px 4%;}
#cabines p{width:auto;}

.page-left-col{float:none; width:94%; height:auto !important;}
.page-right-col{float:none; width:94%; height:auto !important;}

.box-apropos-33{float:none;}
.redbar-page a{float:none;}

.page-col-50b, .page-col-50w{width:96%; height:auto !important;}
.uses-box{border-bottom:1px solid #fff;}
.uses-box .maintextlist{width:100%;}
.uses-box .maintextlist .left, .uses-box .maintextlist .right{float:none; width:96%; text-align:center;}

.inpage-video2{height:320px;}
.otherproduct{line-height:normal; height:auto; padding:20px;}

.redbar-page h1{height:auto; line-height:normal; padding:20px 0;}
.redbar-page h1 img{display:none;}

}

@media screen and (max-width: 595px) {
	
	.hover-album li{width:30%;}
	
}

@media screen and (max-width: 510px) {
	#produits .box a{height:350px;}
	#blocs-avantages .soumission span{padding-top:90px;}
	.top-section-btns{right:0; left:0; margin:0 auto; width:225px;}
	.top-section-social{right:0; left:0; margin:0 auto; width:220px; bottom:80px; z-index:99999;}
	#home .larrow, #home .rarrow{display:none;}
	.video-size{height:265px;}
	
	.hover-album li{width:98%; height:auto;}
}

@media screen and (max-width: 350px) {
	#produits .box a{height:250px;}
	#contactpage .left img{width:80%;}
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
	
/* ######################################################################################################################################################### */

.image-0{background: url('../img/bg/1.jpg') no-repeat center center scroll;}
.image-1{background: url('../img/bg/2.jpg') no-repeat center center scroll;}
.image-2{background: url('../img/bg/3.jpg') no-repeat center center scroll;}
.image-3{background: url('../img/bg/4.jpg') no-repeat center center scroll;}
.image-4{background: url('../img/bg/5.jpg') no-repeat center center scroll;}
.image-5{background: url('../img/bg/6.jpg') no-repeat center center scroll;}
.image-6{background: url('../img/bg/7.jpg') no-repeat center center scroll;}
.image-7{background: url('../img/bg/8.jpg') no-repeat center center scroll;}
.image-8{background: url('../img/bg/9.jpg') no-repeat center center scroll;}

#home .larrow{z-index:9999999;}
#home .rarrow{z-index:9999999;}

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

#avantages{background: url('../img/big/avantages.jpg') no-repeat center center scroll;}
/*#contact{background: url('../img/big/contact.jpg') no-repeat center center scroll;}*/
#contactpage{background: url('../img/big/contact.jpg') no-repeat center center scroll; height: auto;}

/* ######################################################################################################################################################### */
	
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
	
/* ######################################################################################################################################################### */

.h1-look-for{
	font-size:2.8em !important;
	margin-bottom:90px !important;}

/* ######################################################################################################################################################### */

.textstrd{width:90%;}
.textliststrd{width:90%; margin:0 0 35px 17px;}

.cabine-industrielle{width:90%;}

.forceleftalign{width:90% !important;}
.cabine-industrielle h2{width:100% !important;}

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */

/* ######################################################################################################################################################### */
	
}


/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {

.wrap{width:100%;}

#topbar .left{width:100%; text-align:center;}

/*****************************/

.socialbar{position:relative; width:100%; top:0; left:0px; padding:0;}

/*****************************/

/* ######################################################################################################################################################### */

#produits .box{width:18%; margin:0 1%;}
#produits .box h3{line-height:15px !important;}
#produits .box h3.twoline{padding-top:0px; margin-bottom:5px;}

/* ######################################################################################################################################################### */

.video-size{height:400px;}

/* ######################################################################################################################################################### */

#blocks .column{width:50%; text-align:center; margin-bottom:25px;}
#blocks .column p{width:90%;}
.maintext{width:90%;}

/* ######################################################################################################################################################### */

#blocs-secteurs a{width:49%;}
#blocs-secteurs .sep{width:2%; height:10px;}
#blocs-secteurs .avantages{background-position: 95% 50%;}
#blocs-secteurs .avantages span{font-size: 2.4em; padding-left: 15px;}

#avantages{min-height:0;}
#blocs-avantages a{width:49%;}
#blocs-avantages .sep{width:2%; height:10px;}

#blocs-avantages .soumission{background-position: 93% 50%;}
#blocs-avantages .soumission span{font-size: 1.8em; padding-left: 20px; margin-top: 65px;}

#contact{min-height:0; top:0;}

/* ######################################################################################################################################################### */

#pagetop{height:255px; background: url('../img/big/pagetop.jpg') no-repeat center center scroll;}
.rangee{width:100%;}

#pageblocks .bloc{width:49%;}
#pageblocks .sep{width:2%; height:10px;}
#pageblocks .bloc .img{width:100%; height:auto;}

/* ######################################################################################################################################################### */

#contactpage .right{width:60%;}

/* ######################################################################################################################################################### */

.galprod{height:60px;}

/* ######################################################################################################################################################### */

.h1-look-for{
	font-size:2.8em !important;
	margin-bottom:130px !important;}

.look-for{}

	.look-for h3{
		color:#000 !important;
		font-size:2em !important;
		text-align:left !important;
		margin-top:80px !important;
		margin-bottom:15px !important;}
	
	.look-for ul{
		margin-left:126px;
		font-size:1.5em;
		line-height:1.8em;}
	
		.look-for li{}
		
.look-for-contact{
	background-color:#f3f3f3;
	height:330px;
	text-align:center;}

	.look-for-contact h3{
		color:#000 !important;
		font-size:2em !important;
		padding-top:20px;
		padding-bottom:20px;}
	
	.look-for-contact a{
		font-family: 'colaborate-boldregular' ;
		background-color:#7d1416;
		color:#FFF;
		width:382px;
		height:64px;
		font-size:1.6em;
		line-height:64px;
		padding:0 15px;
		display:inline-block;
		margin-bottom:10px;}
		
.video-destination{
	width:100%;
	height:400px;
	margin-top:50px;}

/* ######################################################################################################################################################### */


.benefits .benefit{margin: 0 2% 30px; width:45%;}

.heightlpae{height: 450px !important;}

.look-for-contact .esplp{margin-top:0; width: 80% !important; height:auto !important; line-height:1.6em; padding:10px 15px;}

/* ######################################################################################################################################################### */

.video-size{height:200px; width:96%; margin:20px 2%;}
.inpage-video{height:200px;}

/* ############################################################################################################################################################ */

.forceleftalign{width:96% !important;}
.textstrd{width:96%;}
.cabine-industrielle{width:96%; margin:40px auto;}

.cabine-industrielle .box-img{width:100%;}
.cabine-industrielle .box-text{width:100%;}

#subprod{display:block !important; position:relative; top:auto; left:auto; width:auto; padding:0;}
#subprod.fr{left:auto; width:auto;}

/* ######################################################################################################################################################### */

}