/* CSS Document */

#nos-engagements{float:left; width:100%; height:264px; margin-top:30px;}
#nos-engagements p{float:right; width:706px; font-size:18px; color:#363636; margin-top:40px;}
#nos-engagements img:first-child{float:left;}

.box-photo-droite{float:left; width:100%; height:auto; border-bottom:1px solid #CCC; margin-bottom:20px; padding:30px 0 30px 0; }
.box-photo-droite div{float:left; width:600px; padding-top:15px;}
.box-photo-droite img{float:right;}
.box-photo-gauche{float:left; width:100%; height:auto; border-bottom:1px solid #CCC; margin-bottom:20px; padding:30px 0 30px 0; }
.box-photo-gauche div{float:right;width:580px; padding-top:25px}
.box-photo-gauche img{float:left}

.box-environnement{float:left; border:none; margin-bottom:0; height:auto;width:100%; height:221px; margin-top:10px; background-image:url(../images/photo_terre.jpg); background-repeat:no-repeat; background-position:right;}
.box-environnement div:first-child{float:left; height:45px; width:300px; margin-top:10px;}
.box-environnement div:nth-child(2){float:left; width:600px; margin-bottom:15px; vertical-align:middle;}
.box-environnement div:nth-child(2) img{max-height:45px; margin:5px 0 0 5px;}
.box-environnement p:last-child{float:left; width:580px;}

#contenu h1{font-size:20px; color:black; line-height:15px; font-weight:bold; margin:0; padding:0;}
#contenu h2{font-size:20px; font-weight:lighter; color:#E55424; margin-bottom:10px; padding:0}

#sous-menu{width:540px;}
#sous-menu ul{width:540px;}
	#sous-menu ul li:first-child img{max-height:30px; margin:5px 0 5px 0}
	
@media screen and (max-width:1150px){
	#nos-engagements{height:210.4px; margin-top:23.9px;}
	#nos-engagements p{width:562.7px; font-size:14.3px; margin-top:31.8px;}
	#nos-engagements img:first-child{max-width:169.7px}
	
	.box-photo-droite{margin-bottom:16px; padding:23.9px 0 23.9px 0; }
	.box-photo-droite:nth-child(6) div{margin-top:30px}
	.box-photo-droite div{max-width:450px}
	.box-photo-droite div p{font-size:12.7px;}
	.box-photo-droite img{max-width:280px;}
	.box-photo-gauche{margin-bottom:16px; padding:23.9px 0 23.9px 0; }
	.box-photo-gauche:nth-child(7) div{margin-top:20px}
	.box-photo-gauche div{max-width:450px}
	.box-photo-gauche div p{font-size:12.7px;}
	.box-photo-gauche img{max-width:280px;}
	
	.box-environnement{height:200px; margin-top:10px; background-size:auto 176.15px}
	.box-environnement div:first-child{height:35.8px; width:239.13px; margin-top:8px;}
	.box-environnement div:nth-child(2){width:478.2px; margin-bottom:12px;}
	.box-environnement div:nth-child(2) img{max-height:35.8px; margin:4px 0 0 4px;}
	.box-environnement p:last-child{width:462.3px; font-size:12.7px}
	
	#contenu h1{font-size:16px; line-height:12px;}
	#contenu h2{font-size:16px; margin-bottom:8px;}
		
	#sous-menu{width:430.4px;}
	#sous-menu ul{width:430.4px;}
		#sous-menu ul li:first-child img{max-height:23.9px; margin:3px 0 2px 0}
}

@media screen and (max-width:895px){
	#conteneur{margin-top:-15px; padding:30px 0 0 0;}
	
	#nos-engagements{float:right;width:475px; height:210.4px; margin-top:30px; margin-bottom: -30px}
	#nos-engagements p{width:315px; font-size:13px; margin-top:0;}
	#nos-engagements img:first-child{max-width:150px}
	
	.box-photo-droite{margin:0; padding:23.9px 0 23.9px 0; vertical-align: middle !important}
		.box-photo-droite:nth-child(4) div{margin:0 0 20px 0}
		.box-photo-droite:nth-child(4) img{margin-top:20px}
		.box-photo-droite:nth-child(6) div{margin-top:12px}
		.box-photo-droite:nth-child(6) img{margin-top:10px}
		.box-photo-droite div{max-width:420px}
		.box-photo-droite div p{font-size:12.7px;}
		.box-photo-droite img{max-width:210px;}
	
	.box-photo-gauche{margin-bottom:0; padding:23.9px 0 23.9px 0; vertical-align: middle !important}
		.box-photo-gauche:nth-child(5) div{margin:20px 0 20px 0 !important ; padding-top: 0 !important; height:auto}
		.box-photo-gauche:nth-child(7) div{margin-top:30px}
		.box-photo-gauche div{max-width:420px}
		.box-photo-gauche div p{font-size:12.7px;}
		.box-photo-gauche img{max-width:210px;}
	
	.box-environnement{height:200px; margin-top:20px; background-size:auto 176.15px; width:auto; margin-bottom:30px}
		.box-environnement div:first-child{float:left; height:35.8px; width:239.13px; margin-top:15px;}
		.box-environnement div:nth-child(2){width:350px; margin:13px 0 10px 0;}
		.box-environnement div:nth-child(2) img{float:left; max-height:25.8px; margin:2px 0 0 2px;}
		.box-environnement p:last-child{width:350px; font-size:12.7px}
	
	#contenu h1{font-size:16px; line-height:12px;}
	#contenu h2{font-size:16px; margin-bottom:8px;}
		
	#sous-menu{width:475px; height:45px}
	#sous-menu ul{width:475px;}
		#sous-menu ul li:first-child img{max-height:19.35px; margin:2px 0 1px 0}
		#sous-menu li:nth-child(2) a.active{background-position:49% bottom !important}
		a.active{height:45px !important}
}

@media screen and (max-width:650px){
	body{background-color:white !important; background-image:none;}
	
	#conteneur{margin:0 !important; padding:0 !important;}
	
	#nos-engagements{float:right;width:100%; height:auto; margin:0;}
	#nos-engagements p{float:left; width:90%; font-size:13px; margin-top:0;}
	#nos-engagements img:first-child{float:none; max-width:35%; margin:2% auto 2% 32%  !important}
	
	.box-photo-droite{margin:0; padding:2% 0 2% 0; vertical-align: middle !important}
		.box-photo-droite h1{margin-left:2% !important; width:98% !important; font-size:1em !important}
		.box-photo-droite h2{margin-left:2%; width:98%; font-size:1em !important}
		.box-photo-droite p{width:100%; font-size:.8em !important}
		.box-photo-droite:nth-child(4) div{margin:0}
		.box-photo-droite:nth-child(4) img:last-child{margin-top:0;}
		.box-photo-droite:nth-child(6) div{margin-top:0}
		.box-photo-droite:nth-child(6) img{margin-top:0; max-width:40%}
		.box-photo-droite div{max-width:100%; margin:0}
		.box-photo-droite div p{float:left;font-size:.8em !important;}
		.box-photo-droite img{float:left; margin:0 auto 0 30%; max-width:50%;}
		.box-photo-droite img:last-child{margin-top:0; display: none;}
		
	.box-photo-gauche{margin-bottom:0; padding:2% 0 2% 0; vertical-align: middle !important}
		.box-photo-gauche h1{margin-left:2% !important; width:98% !important; font-size:1em !important}
		.box-photo-gauche h2{margin-left:2%; width:98%; font-size:1em !important}
		.box-photo-gauche:nth-child(5) div{margin:0; padding-top: 0}
		.box-photo-gauche:nth-child(7) div{margin-top:0;}
		.box-photo-gauche:nth-child(7) img{max-width:40%; margin-left:30%}
		.box-photo-gauche div{float:left; max-width:100%}
		.box-photo-gauche div p{font-size:.8em !important; margin:0;}
		.box-photo-gauche img{float:left; margin:0 auto 0 25%; max-width:50%;}
		
	.box-environnement{height:auto; margin-top:0; background-size:50%; background-position:top center; width:100%; margin-bottom:0; padding:25% 0 0 0}
		.box-environnement h1{margin-left:5% !important}
		.box-environnement h2{margin-left:5%; width:100%}
		.box-environnement div:first-child{float:left; height:auto; width:auto; margin-top:0;}
		.box-environnement div:nth-child(2){float:right; width:20%; margin:0;}
		.box-environnement div:nth-child(2) img{float:left; max-height:25.8px; margin:2px 0 0 2px;}
		.box-environnement p:last-child{width:90%; font-size:.8em !important}
	
	#sous-menu{width:100%; height:45px}
	#sous-menu ul{width:95% !important; margin-left:2.5%}
		#sous-menu li:first-child a{min-width:0  !important; width:auto !important; margin: 0 !important}
		#sous-menu li:first-child a span span:first-child{display: none;}
		#sous-menu li:nth-child(2) a.active{background-position:center bottom !important}
		#sous-menu ul li:first-child img{max-height:19.35px; margin:2px 0 1px 0}
		#sous-menu li:nth-child(2) a{ margin:0 !important}
		a.active{height:45px !important}
}

@media screen and (max-width:540px){
	body{background-color:white !important; background-image:none;}
	
	#conteneur{margin:0 !important; padding:0 !important;}
	
	#nos-engagements{float:right;width:100%; height:auto; margin:0;}
	#nos-engagements p{float:left; width:90%; font-size:.5em !important; margin-top:0;}
	#nos-engagements img:first-child{float:none; max-width:35%; margin:2% auto 2% 32%  !important}
	
	.box-photo-droite{margin:0; padding:2% 0 2% 0; vertical-align: middle !important}
		.box-photo-droite h1{margin-left:2% !important; width:98% !important; font-size:.75em !important}
		.box-photo-droite h2{margin-left:2%; width:98%; font-size:.75em !important}
		.box-photo-droite p{width:100%; font-size:.5em !important}
		.box-photo-droite:nth-child(4) div{margin:0}
		.box-photo-droite:nth-child(4) img:last-child{margin-top:0;}
		.box-photo-droite:nth-child(6) div{margin-top:0}
		.box-photo-droite:nth-child(6) img{margin-top:0; max-width:40%}
		.box-photo-droite div{max-width:100%}
		.box-photo-droite div p{float:left;font-size:.5em !important}
		.box-photo-droite img{float:left; margin:0 auto 0 30%; max-width:50%;}
		.box-photo-droite img:last-child{margin-top:0; display: none;}
		
	.box-photo-gauche{margin-bottom:0; padding:2% 0 2% 0; vertical-align: middle !important}
		.box-photo-gauche h1{margin-left:2% !important; width:98% !important; font-size:.75em !important}
		.box-photo-gauche h2{margin-left:2%; width:98%; font-size:.75em !important}
		.box-photo-gauche p{width:100%; font-size:.5em !important}
		.box-photo-gauche:nth-child(5) div{margin:0; padding-top: 0}
		.box-photo-gauche:nth-child(7) div{margin-top:0;}
		.box-photo-gauche:nth-child(7) img{max-width:40%; margin-left:30%}
		.box-photo-gauche div{max-width:100%}
		.box-photo-gauche div p{font-size:.5em !important;}
		.box-photo-gauche img{float:left; margin:0 auto 0 25%; max-width:50%;}
		
	.box-environnement{height:auto; margin-top:0; background-size:50%; background-position:top center; width:100%; margin-bottom:0; padding:25% 0 0 0}
		.box-environnement h1{margin-left:5% !important; font-size:1.25em !important; line-height: 1em !important;}
		.box-environnement h2{margin-left:5%; width:100%; font-size:1.25em !important; line-height: 1em !important;}
		.box-environnement div:first-child{float:left; height:auto; width:auto; margin-top:0;}
		.box-environnement div:nth-child(2){float:right; width:20%; margin:0;}
		.box-environnement div:nth-child(2) img{float:left; max-height:25.8px; margin:2px 0 0 2px;}
		.box-environnement p:last-child{width:90%; font-size:.5em !important}
	
	#sous-menu{width:100%; height:45px}
	#sous-menu ul{width:95% !important; margin-left:2.5%}
		#sous-menu li:first-child a{min-width:0  !important; width:auto !important; margin: 0 !important}
		#sous-menu li:first-child a span span:first-child{display: none;}
		#sous-menu ul li:first-child img{max-height:19.35px; margin:2px 0 1px 0}
		#sous-menu li:nth-child(2) a{ margin:0 !important}
		a.active{height:45px !important}
}

@media screen and (max-width:380px){
	.box-photo-droite h1{font-size:.75em !important}
	.box-photo-droite h2{font-size:.75em !important}
	
	.box-photo-gauche h1{font-size:.75em !important}
	.box-photo-gauche h2{font-size:.75em !important}
	
	.box-environnement h1{font-size:.75em !important}
	.box-environnement h2{font-size:.75em !important}
}