@charset "utf-8";
/* CSS Document */
#container{background-image:url(../img/fd_presentation.png); background-position:top left; background-repeat:no-repeat;}
.contenu{display:block;}
#fil_pres{width:100%; display:flex; padding-bottom:5%; padding-top:2%;}
.titre{padding-top:20px; padding-bottom:20px; font-size:36px;}
#filiales{/*background-image:url(../img/filiales.png); background-repeat:no-repeat; */background-color:rgba(255, 255, 255, 0.7); padding:10px;min-width:248px; flex:1; margin-left:8%;}
#filiales ul{padding-left:40px;}
#filiales ul li{list-style-image:url(../img/pictos.png) no-repeat; list-style-position:-60px 0px;}
#filiales ul li a{text-decoration:none; color:inherit;}
#filiales ul li a:hover{ /*color:#485b78;*/ color:#00654a; text-decoration:underline;}
#presentation{flex:4;padding-left:60px; margin-right:8%;background-color:rgba(255, 255, 255, 0.7); padding:10px;}
#presentation p{padding:10px;}
.couleur{/*color:#485b78;*/ color:#00654a; font-weight:bold;}

/*#trait{ border:2px solid }*/
.bloc{float:left; max-width:300px; max-height:auto; margin:1%;}
#bloc_img{/*display:flex; padding-top:20px;*/justify-content:center;align-items: center; width:100%; /*position:relative;*/}
#bloc_img div a img:hover{opacity:0.8;}
#bloc_img div a{text-decoration:none; border:none;}
/*#dev, #inno, #trans{flex:1;text-align:center;}*/
#dev img, #inno img, #trans img{box-shadow:5px 5px 5px #b2b2b2;width:300px; height:auto; }

@media only screen and (max-width : 1200px) {
	/*#bloc_metiers{display:block;}
	#bloc_img{display:inline-block;}*/
	#dev img, #inno img, #trans img{margin:10px;}
}
@media only screen and (max-width : 800px) {
	/*#fil_pres{display:block;}
	#fil_pres div{display:inline-block;}*/
	#filiales{margin:0px auto;}
	#presentation{ text-align:justify; padding-left:5px; padding-right:5px;}
	
}
@media only screen and (max-width : 320px){
	#dev img, #inno img, #trans img{width:250px; height:157px;}	
	#presentation, #filiales{padding-left:5px; margin:0;}
}