/* CSS Document */


h1{margin-top:20px;background-image:url(../images/ligne-h1.png); background-repeat:no-repeat; background-position:170px 22px;}

#notre-histoire{float:left; width:505px}
#notre-histoire p{width:490px; color:#363636; margin-right:15px;}
.qualite-juste-prix{text-align:center;margin:50px 0 50px;}
.qualite-juste-prix span{color:#E55424;font-size:23px;}

#col-droite{float:right; width:319px;}
	#focus{float:right; background-image:url(../images/bg-focus.jpg); background-repeat:no-repeat; width:319px; height:200px; padding:50px}
	#focus p{background-image:url(../images/puce-fleche); background-repeat:no-repeat; background-position:left 3px; padding-left:15px; font-weight:bold; font-style:italic; line-height:15px; margin-bottom:15px; font-size:17px}
	#focus span{color:#E55424}
	

#contenu-notre-metier{float:left; margin-bottom:10px;}
#contenu-notre-metier p:nth-child(2){margin-bottom:20px;}
#contenu-notre-metier img{float:left; margin-right:20px}
	.notre-metier{background-image:url(../images/ligne-h1.png); background-repeat:no-repeat; background-position:160px 22px; margin-bottom:20px}
	#col-droite-2{float:left; width:510px;}
	#col-droite-2 img{float:left;}
	#col-droite-2 h4:nth-child(2){line-height:160px}
	#col-droite-2 p:nth-child(3){margin-bottom:40px;}
	#col-droite-2 h4:nth-child(5){line-height:100px}

#sous-menu{width:540px;}
#sous-menu ul{width:540px;}
	#sous-menu ul li:first-child a:first-child{width:auto !important}
	#sous-menu ul li:first-child img{max-height:30px; margin:5px 0 5px 0}
	

@media screen and (max-width:1150px){
	h1{margin-top:16px; }
	
	#notre-histoire{width:402.5px}
	#notre-histoire p{width:390.5px;margin-right:12px; font-size:12.7px}
	.titre-notre-histoire{background-position:135.5px 17.5px;}
	.qualite-juste-prix{margin:39.8px 0 39.8px;}
	.qualite-juste-prix span{font-size:18.3px}
	
	#col-droite{width:254.2px;}
	#col-droite img{width:346px}
		#focus{width:254.2px; height:159.4px; padding:39.8px; background-size:334px}
		#focus p{padding-left:12px;line-height:12px; margin-bottom:12px; font-size:13.5px; background-size:7.17px;}
		
		
	#contenu-notre-metier{margin-bottom:20px;}
	#contenu-notre-metier p{font-size:12.7px}
	#contenu-notre-metier p:nth-child(2){margin-bottom:16px;}
	#contenu-notre-metier img{float:left; margin-right:16px}
	#contenu-notre-metier img:nth-child(4){max-width:340px}
		.notre-metier{background-position:127.5px 17.5px; margin-bottom:16px}
		#col-droite-2{width:380px;}
		#col-droite-2 img:nth-child(1){max-width:59.8px}
		#col-droite-2 h4:nth-child(2){line-height:127.5px}
		#col-droite-2 img:nth-child(4){max-width:71px;}
		
	#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;}
	
	h1{margin-top:16px; }
	
	#notre-histoire{width:350px}
	#notre-histoire p{width:340px;margin-right:12px; font-size:12.7px}
	.titre-notre-histoire{background-position:135.5px 17.5px;}
	.qualite-juste-prix{margin:39.8px 0 39.8px;}
	.qualite-juste-prix span{font-size:18.3px}
	
	#col-droite{width:254.2px;}
	#col-droite img{width:300px}
		#focus{width:254.2px; height:200px; padding:40px 20px 20px 20px; background-size:300px; background-position:right}
		#focus p{padding-left:12px;line-height:12px; margin-bottom:12px; font-size:13.5px; background-size:7.17px;}
		
		
	#contenu-notre-metier{margin-bottom:20px;}
	#contenu-notre-metier p{font-size:12.7px}
	#contenu-notre-metier p:nth-child(2){margin-bottom:16px;}
	#contenu-notre-metier img{float:left; margin-right:16px}
	#contenu-notre-metier img:nth-child(4){max-width:300px; margin-top:50px;}
		.notre-metier{background-position:127.5px 17.5px; margin-bottom:16px}
		#col-droite-2{width:330px;}
		#col-droite-2 p:nth-child(3){margin-bottom:20px;}
		#col-droite-2 img:nth-child(1){max-width:50px}
		#col-droite-2 h4:nth-child(2){line-height:100px}
		#col-droite-2 img:nth-child(4){max-width:60px;margin-top:0;}
		#col-droite-2 h4:nth-child(5){line-height:80px}
		
	#sous-menu{width:475px; height:45px}
	#sous-menu ul{width:475px;}
		#sous-menu li:first-child a{min-width:165px !important; margin-left:0;}
		#sous-menu li:first-child img{margin-left:-20px !important;}
		#sous-menu li:first-child a.active{background-position:44% bottom !important;}
		#sous-menu li:nth-child(2) a img{margin:0 auto 0 auto !important;}
		#sous-menu li:last-child a.active{ background-position:40% bottom !important;}
		#sous-menu ul li:first-child img{max-height:19.35px; margin:2px 0 1px 0}
		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;}
	
	h1{margin-top:2% !important; width:100% !important;background-position: auto center !important; background-size: contain}
	
	#notre-histoire{width:100%}
	#notre-histoire p{width:90%;margin-right:0; font-size:0.8em}
	.qualite-juste-prix{margin:10% 0 10% 0;}
	.qualite-juste-prix span{font-size:2em}
	
	#col-droite{width:100%;}
	#col-droite img{width:100%; display: none;}
		#focus{width:65%; height:200px; padding:10% 10% 10% 25%; background-size: contain; background-position:center;}
		#focus p{padding-left:12px;line-height:12px; margin:0 auto 5% auto; font-size:15px; background-size:7.17px; width: auto}
	
	#contenu-notre-metier{margin-bottom:10%;}
	#contenu-notre-metier p{font-size:0.8em}
	#contenu-notre-metier p:nth-child(2){margin-bottom:10%;}
	#contenu-notre-metier img{float:left; margin-right:10%}
	#contenu-notre-metier img:nth-child(4){display:none !important}
		.notre-metier{background-position:127.5px 17.5px; margin-bottom:10%}
		#col-droite-2{margin:0 10% 0 10%; width:80%;}
		#col-droite-2 p:nth-child(3){margin-bottom:10%;}
		#col-droite-2 img:nth-child(1){display: block; max-width:50px}
		#col-droite-2 h4:nth-child(2){line-height:100px}
		#col-droite-2 img:nth-child(4){display: block !important; max-width:60px; margin-top:0;}
		#col-droite-2 div h4:nth-child(5){line-height:80px}
	
	#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.active{background-position:50% bottom !important}
		#sous-menu li:first-child a span span:first-child{display: none;}
		#sous-menu ul li:first-child a img{max-height:19.35px; margin:2px auto 1px auto !important}
		#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;}
	
	h1{margin-top:2% !important; width:100% !important;background-position: auto center !important; background-size: contain}
	
	#notre-histoire{width:100%}
	#notre-histoire p{width:90%;margin-right:0; font-size:0.5em}
	.qualite-juste-prix{margin:10% 0 10% 0;}
	.qualite-juste-prix span{font-size:2em}
	
	#col-droite{width:100%;}
	#col-droite img{width:100%; display: none;}
		#focus{width:70%; height:200px; padding:10% 10% 10% 20%; background-size: contain; background-position:center;}
		#focus p{padding-left:12px;line-height:12px; margin:0 auto 5% auto; font-size:15px; background-size:7.17px; width: auto}
	
	#contenu-notre-metier{margin-bottom:10%;}
	#contenu-notre-metier p{font-size:0.5em}
	#contenu-notre-metier p:nth-child(2){margin-bottom:10%;}
	#contenu-notre-metier img{float:left; margin-right:10%}
	#contenu-notre-metier img:nth-child(4){display:none !important}
		.notre-metier{background-position:127.5px 17.5px; margin-bottom:10%}
		#col-droite-2 p:nth-child(3){margin-bottom:10%;}
		#col-droite-2 img:nth-child(1){display: block; max-width:50px}
		#col-droite-2 h4:nth-child(2){line-height:100px}
		#col-droite-2 img:nth-child(4){display: block !important; max-width:60px; margin-top:0;}
		#col-droite-2 div h4:nth-child(5){line-height:80px}
	
	#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:first-child img{margin-left:auto !important;}
		#sous-menu li:first-child 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:380px){
		.qualite-juste-prix span{font-size:2em}
		#notre-histoire p{font-size:0.75em}
		#contenu-notre-metier p{font-size:0.75em}
	
		#focus{width:80%; height:200px; padding:10% 10% 10% 10%; background-size: contain; background-position:center}
		#focus p{padding-left:12px;line-height:12px; margin:0 auto 5% auto; font-size:13.5px; background-size:7.17px; width: auto}
		
		#col-droite-2 img:nth-child(4){margin-right:0;}
		
}