@font-face {
    font-family: 'Nexa_Free_Light';
    src: url('fonts/Nexa_Free_Light-webfont.woff2') format('woff2'),
         url('fonts/Nexa_Free_Light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;}

@font-face {
    font-family: 'Nexa_Free_Bold';
    src: url('fonts/Nexa_Free_Bold-webfont.woff2') format('woff2'),
         url('fonts/Nexa_Free_Bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;}

@font-face {
    font-family: 'arial_blackregular';
    src: url('fonts/arial_black-webfont.woff2') format('woff2'),
         url('fonts/arial_black-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;}

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

html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset {
	margin: 0;
	padding: 0;
	text-decoration: none; }

img, fieldset {
	border: 0;}

/* set image max width to 100% */
img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */}

/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display: block;}

ul li {
	list-style-type: none;}

#human{display:none !important;}

html, body {font-family: 'Nexa_Free_Light'; width: 100%;}

/********************************************************************************************************************/
/* 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
	
transition: all 0.4s ease-in;
-ms-transition: all 0.4s ease-in;
-moz-transition: all 0.4s ease-in;
-webkit-transition: all 0.4s ease-in;

transition: all 0.4s ease-out;
-ms-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
	
-webkit-box-shadow: 0 10px 10px 0 rgba(0,0,0,0.3); box-shadow: 0 10px 10px 0 rgba(0,0,0,0.3);

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

	.wrap{width:1200px; margin:0 auto; position:relative;}

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

	.top-bar{position:absolute; top:0; width:100%; height:100px; z-index:3000;}
	.top-bar .wrap{height:100%;}
	.top-bar .wrap .left{text-align:left; align-self:bottom; width:50%;}
	.top-bar .left a{margin-top:20px; display:block;}
	.top-bar .wrap .right{text-align:right; align-self:middle; width:50%;}
	.top-bar .wrap .right a{color:#FFF; text-shadow: 2px 2px 3px rgba(0,0,0,0.3); font-size:1.2em; margin-top:20px; display:block;}
	.top-bar .wrap .right a span{font-family: 'Nexa_Free_Bold'; display:block; font-size:1.2em;}
	.top-bar .wrap .right a:hover span{color:#f27432;}
			
/********************************************************************************************************************/

	.header{
		position:relative; width:100%; height:650px;
		background:url(img/topbg.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
	
	.header .wrap{height:100%;}

	.header .header-truck{position:absolute; left:0; bottom:50px; z-index:2000;}
	
	.header .text-area{position:absolute; width:45%; right:0; top:50%; margin-top:-140px; width:400px; text-align:right;}
	
	.header .text-area h1{font-family: 'Nexa_Free_Bold'; color:#FFF; text-shadow: 2px 2px 3px rgba(0,0,0,0.3); font-size:3em; margin-bottom:15px;}
	
	.header .text-area h2{color:#FFF; text-shadow: 2px 2px 3px rgba(0,0,0,0.3); font-weight:300; margin-bottom:25px;}
	
	.header .text-area p{color:#FFF; text-shadow: 2px 2px 3px rgba(0,0,0,0.3); font-size:1.2em;}
	
	.header .text-area p span{font-size:0.8em}
	
	.header .text-area a{
		font-family: 'Nexa_Free_Bold'; color:#FFF; text-transform:uppercase; background:#f27432;
		padding:10px 20px; display:inline-block; margin:20px 0 5px;
		transition: all 0.4s ease-in;
		-ms-transition: all 0.4s ease-in;
		-moz-transition: all 0.4s ease-in;
		-webkit-transition: all 0.4s ease-in;
	}
	
	.header .text-area a:hover{
		background:#FFF; color:#333;
		transition: all 0.4s ease-out;
		-ms-transition: all 0.4s ease-out;
		-moz-transition: all 0.4s ease-out;
		-webkit-transition: all 0.4s ease-out;
	}
							
/********************************************************************************************************************/
	
	#features{position:relative; padding:60px 0; background:url(img/texture-bois.png) repeat;}
	#features .flex{display:flex;}
	#features > .flex{justify-content:space-around; align-items:center;}
	#features .left{width:35%;}
	#features .right{width:40%; flex-wrap:wrap; justify-content:space-between;}
	#features h2{font-family: 'Nexa_Free_Bold'; font-size:1.6em; line-height:1.4em; margin-bottom:60px;}
	#features p{color:#000; line-height:1.4em; font-size:1.2em; margin-bottom:60px;}
	#features ul{margin:0 0 0 21px;}
	#features ul li{color:#000; line-height:2em; font-size:1.2em; list-style:disc;}
	#features .right img{width:48%; margin-bottom:15px;}
						
/********************************************************************************************************************/
	
	#intro{position:relative; padding:100px 0;}
	#intro > .flex{display:flex; justify-content:space-around; align-items:center;}
	#intro .left{width:25%;}
	#intro .left img{}
	#intro .right{width:68%;}
	#intro .right p{color:#000; font-size:1.4em; line-height:1.4em;}
	#intro .right a{font-family: 'Nexa_Free_Bold'; color:#FFF; text-transform:uppercase; background:#f27432;
		padding:10px 20px; display:inline-block; margin:30px 0 0;
		transition: all 0.4s ease-in;
		-ms-transition: all 0.4s ease-in;
		-moz-transition: all 0.4s ease-in;
		-webkit-transition: all 0.4s ease-in;}
	#intro .right a:hover{background:#333; color:#fff;
		transition: all 0.4s ease-out;
		-ms-transition: all 0.4s ease-out;
		-moz-transition: all 0.4s ease-out;
		-webkit-transition: all 0.4s ease-out;}
						
/********************************************************************************************************************/

	#modeles{position:relative; padding:60px 0; background:url(img/texture-bois2.jpg) repeat;}
	#modeles h2{font-family: 'Nexa_Free_Light'; color:#fff; font-size:1.6em; line-height:1.4em; text-align:center; margin-bottom:60px;}
	#modeles h2 strong{font-family: 'Nexa_Free_Bold';}
	#modeles ul{list-style:none; display:flex; justify-content:space-between;}
	#modeles ul li{width:23%; text-align:center;}
	#modeles ul li img{width:100%; height:auto;}
	#modeles ul li a{display:block;}
	#modeles ul li a:hover{opacity:0.7;}
	#modeles ul li p{color:#fff; margin-top:10px;}
							
/********************************************************************************************************************/
	
	#terrains{position:relative; padding:80px 0; background:#333;}
	#terrains .center{text-align:center;}
	#terrains h2{font-family: 'Nexa_Free_Bold'; color:#fff; font-size:1.6em; margin-bottom:60px;}
	#terrains .flex{display:flex; justify-content:space-between; align-items:center;}
	#terrains .flex .left{width:48%;}
	#terrains .flex .left img{width:100%; height:auto;}
	#terrains .flex .right{width:48%;}
	#terrains .flex .right p{color:#fff; margin-bottom:30px; font-family: 'Nexa_Free_Bold';}
	#terrains .flex .right a{
		font-family: 'Nexa_Free_Bold'; color:#FFF; text-transform:uppercase; background:#f27432;
		padding:10px 20px; display:block; margin:15px 0 0;
		transition: all 0.4s ease-in;
		-ms-transition: all 0.4s ease-in;
		-moz-transition: all 0.4s ease-in;
		-webkit-transition: all 0.4s ease-in;	
	}
	#terrains .flex .right a:hover{
		background:#fff; color:#333;
		transition: all 0.4s ease-out;
		-ms-transition: all 0.4s ease-out;
		-moz-transition: all 0.4s ease-out;
		-webkit-transition: all 0.4s ease-out;
	}
					
/********************************************************************************************************************/
							
/********************************************************************************************************************/
							
/********************************************************************************************************************/

	.icons-section{
		position:relative; padding:110px 0 40px; background:#333; z-index:2900;
		-webkit-box-shadow: 3px 5px 10px 0 rgba(0,0,0,0.3);
		box-shadow: 3px 5px 10px 0 rgba(0,0,0,0.3);
	}

	.icons-section .wrap{position:relative;}
	
	.icons-section ul{position:relative; display:flex; flex-wrap:wrap;}
	.icons-section ul li{width:27%; margin:0 3.16% 70px; align-self:top; text-align:center;}
	.icons-section ul li img{display:inline-block; margin-bottom:30px;}
	.icons-section ul li p{display:block; text-align:center; color:#fff; line-height:1.4em; font-size:1.1em;}
			
/********************************************************************************************************************/

	.video{
		position:relative; padding:90px 0; z-index:2800;
		-webkit-box-shadow: 3px 5px 10px 0 rgba(0,0,0,0.3);
		box-shadow: 3px 5px 10px 0 rgba(0,0,0,0.3);
		background:url(img/bg1.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

	.video .flex{position:relative; justify-content:space-around;}
	.video .flex .left{width:54%;}
	.video .flex .left .vid-container{position:relative; width:100%; padding-bottom:67%;}
	.video .flex .left .vid-container iframe{position:absolute; top:0; left:0; width:100%; height:100%;}
	.video .flex .right{width:40%; align-self:center;}
	.video .flex .right h3{font-size:2em; margin-bottom:20px; font-family: 'Nexa_Free_Bold';}
	.video .flex .right p{line-height:1.4em; font-size:1.2em;}
			
/********************************************************************************************************************/

	.ex-use{
		position:relative; padding:60px 0; background:#eee; z-index:2700;
		-webkit-box-shadow: 3px 5px 10px 0 rgba(0,0,0,0.3);
		box-shadow: 3px 5px 10px 0 rgba(0,0,0,0.3);
	}

	.ex-use h2{font-weight:300; display:block; width:550px; margin:0 auto 50px; text-align:center; line-height:1.4em; font-size:1.2em;}
	.ex-use h2 span{font-family: 'Nexa_Free_Bold'; font-weight:700;}
	.ex-use ul{position:relative; display:flex; justify-content:space-between;}
	.ex-use ul li{width:22.72%; margin:0 1%; text-align:center; display:inline-block;}
	.ex-use ul li img{margin-bottom:2px;}
	.ex-use ul li p{font-size:1em;}
			
/********************************************************************************************************************/

	.ex-text{
		position:relative; padding:100px 0; z-index:2600;
		-webkit-box-shadow: 3px 5px 10px 0 rgba(0,0,0,0.3);
		box-shadow: 3px 5px 10px 0 rgba(0,0,0,0.3);
		background:url(img/bg2.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

	.ex-text ul{position:relative; display:flex; justify-content:space-between;}
	.ex-text ul li{display:inline-block; width:29%; margin:0 4%; text-align:center;}
	.ex-text ul li h3{font-family: 'Nexa_Free_Bold'; font-weight:700; margin-bottom:30px; color:#fff; font-size:1.6em;}
	.ex-text ul li p{color:#fff; font-size:1.1em; line-height:1.4em;}
			
/********************************************************************************************************************/

	.testimonials{
		position:relative; padding:55px 0 115px; z-index:2500;
		background:url(img/bg3.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

	.testimonials h2{font-family: 'Nexa_Free_Bold'; font-weight:700; margin-bottom:45px; color:#fff; font-size:1.6em; text-align:center;}
	
	.testimonials .testimonial{position:relative; display:flex; justify-content:space-around;}
	.testimonials .testimonial .left{position:relative;}
	.testimonials .testimonial img{width:100%; height:auto;}
	.testimonials .testimonial .right{width:525px; align-self:center;}
	.testimonials .testimonial p{color:#fff; font-size:1.1em; line-height:1.4em;}
	.testimonials .testimonial p span{font-family: 'Nexa_Free_Bold';}
		
	#arrow-left{position:absolute; top:50%; margin-top:-24px; left:90px;}
	#arrow-left:hover{opacity:0.7; cursor:pointer;}
	
	#arrow-right{position:absolute; top:50%; margin-top:-24px; right:90px;}
	#arrow-right:hover{opacity:0.7; cursor:pointer;}
	
	#tem2, #tem3{display:none;}
			
/********************************************************************************************************************/

	.footer1{position:relative; padding:50px 0; z-index:2400;}
	.footer1 .wrap{text-align:center;}
	.footer1 .wrap img{margin:0 40px;}

	.order-now{display:inline-block; background:#ff7c00; color:#fff; font-family: 'Nexa_Free_Bold';  font-size:1.4em; padding:0 40px; height:66px; line-height:66px; margin-right:40px; border:2px solid #ff7c00;}
	
		.order-now:hover{background:#fff; color:#000;}
		
	.recycling{
		display:inline-block; height:70px; line-height:70px; font-weight:300; font-size:1.4em;
		background:url(img/reclying-logo.jpg) no-repeat left center; padding-left:90px; color:#000;
	}

	.footer2{position:relative; background:#000; z-index:2300;}

	.footer2 p{display:block; height:50px; line-height:50px; text-align:center; color:#fff;}

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

.ulmargin{margin-left:17px;}
.center{text-align:center;}
.clear{clear:both;}
.table{display:table;}
.flex{display:flex;}





/********************************************************************************************************************/
/* MEDIA-QUERIES */
/********************************************************************************************************************/

@media screen and (max-width: 1550px) {
	.wrap{width:1100px;}
	.header .header-truck{bottom:100px; width:800px;}
	.ex-use ul li{width:22.7%;}
	#arrow-left{left:15px;}
	#arrow-right{right:15px;}
}

@media screen and (max-width: 1200px) {
	.wrap{width:950px;}
	.header .header-truck{left:-160px;}
	.ex-use ul li{width:22.6%;}
	.testimonials .testimonial .right{width:335px;}
	
	#features h2, #features p{margin-bottom:30px;}
	#features ul li{line-height:1.4em;}
	#intro .right{width:60%;}
	#intro .right p{font-size:1.2em;}
}

@media screen and (max-width: 1050px) {
	.wrap{width:750px;}
	.top-bar .left a{width:270px;}
	.header .header-truck{left:-325px;}
	.icons-section ul li p{font-size:1em;}
	.testimonials .testimonial .left{width:45%;}
	
	.header .text-area{margin-top:-90px;}
	.header .text-area h1{font-size:1.8em;}
	#features .left{width:50%;}
	#intro .right a{font-size:0.9em;}
	#modeles h2{font-size:1.2em; margin-bottom:20px;}
	.carte{height:350px;}
}

@media screen and (max-width: 850px) {
	.wrap{width:575px;}
	.ex-text{padding:50px 0;}
	.ex-text ul li{width:31%; margin:0 2%;}
	.ex-text ul li h3{font-size:1.3em;}
	.ex-text ul li p{font-size:1em;}
	.testimonials .testimonial{flex-direction:column;}
	.testimonials .testimonial .left{width:90%; margin:0 5% 20px;}
	.testimonials .testimonial .right{width:90%; margin:0 5%;}
	.recycling{margin-top:40px; font-size:1.2em;}
	
	.header{height:475px;}
	.top-bar .wrap .right a{font-size:1em;}
	
	.header .text-area{text-align:center; width:90%; margin:-90px auto 0;}
	#features > .flex{flex-direction:column;}
	#features .left{width:100%; order:2;}
	#features .right{width:100%; order:1;}
	#intro > .flex{flex-direction:column;}
	#intro .left{width:75%; text-align:center; margin-bottom:30px;}
	#intro .right{width:95%; text-align:center;}
	#modeles ul{flex-wrap:wrap;}
	#modeles ul li{width:48%; text-align:center; margin-bottom:20px;}
	#terrains .flex{flex-direction:column;}
	#terrains .flex .left{width:100%; margin-bottom:30px;}
	#terrains .flex .right{width:100%; text-align:center;}
	.footer1 .wrap img{margin:0 10px;}
}

@media screen and (max-width: 625px) {
	.wrap{width:96%;}
	.top-bar .wrap{height:auto; flex-direction:column;}
	.top-bar .wrap .left, .top-bar .wrap .right{text-align:center; width:100%;}
	.top-bar .left a{width:75%; margin:20px auto 0;}
	.top-bar .wrap .right a{margin-top:0; font-size:1em;}
	.header .text-area{width:100%; top:155px; margin-top:0; text-align:center;}
	.header .text-area h1{margin-bottom:5px; font-size:2em;}
	.header .text-area h2{font-size:1.2em; margin:0 auto 20px; width:240px;}
	.header .header-truck{left:0; bottom:30px; width:98%;}
	.icons-section{padding:50px 0;}
	.icons-section ul{flex-direction:column;}
	.icons-section ul li{width:80%; margin:0 10% 35px;}
	.icons-section ul li img{margin-bottom:10px;}
	.video{padding:45px 0;}
	.video .flex{flex-direction:column;}
	.video .flex .left{width:90%; margin:0 5% 30px;}
	.video .flex .right{width:90%; margin:0 5%; text-align:center;}
	.ex-use h2{width:90%;}
	.ex-use ul{flex-direction:column;}
	.ex-use ul li{width:98%; margin:0 1% 30px;}
	.ex-text{padding:50px 0 10px;}
	.ex-text ul{flex-direction:column;}
	.ex-text ul li{width:96%; margin:0 2% 40px;}
	.ex-text ul li h3{margin-bottom:10px;}
	.testimonials{padding:55px 0;}
	.testimonials h2{font-size:1.2em; margin-bottom:20px;}
	#arrow-left{left:0; top:40%;}
	#arrow-right{right:0; top:40%;}
	.footer1{padding:35px 0;}
	.order-now{margin-right:0;}
	.recycling{background-position:top center; padding:70px 40px 0; height:auto; line-height:1.4em;}
}