/****************************************************************/
/******************* début styles wrap par défaut ***************/
/****************************************************************/



#wrap_accueil, #wrap_contacts{
	
	
	background-color:#594D47;
	background-image:
	-moz-linear-gradient(10% 100% 85deg,#EEEAF7, #796a5e, #B5B9BA 84%)
	;
	background-image:
	/*-webkit-gradient(linear, 50% 10%, 10% 50%, from(#796A5E), to(#EEEAF7), color-stop(.5,#B5B9BA))*/
	-webkit-gradient(linear, 10% 50%, 50% 10%, from(#796A5E), to(#EEEAF7), color-stop(.5,#B5B9BA))
	;
	background-image:
	-ms-linear-gradient(top left, #796A5E 15%, #EEEAF7 70%)
	;
	
	border-radius: 2px;
	font-style: normal;
	font-family:sans-serif;	
}

#wrap_accueil{
	margin:0%;
	padding:0%;
	
	height:/*130%*/1300px; 
	width:99.9%;
	
}


#wrap_contacts {
	margin:0%;
	padding:0%;
	
	height:/*130%*/2150px; 
	width:99.9%;
}



#wrap_metiers,#wrap_pi {
	
	margin:0%;
	padding:0% 0% 0.5% 0%;
	
	height:3500px;
	width:99.9%;
	
	background-color:#594D47;
		
	background-image:
	-moz-linear-gradient(10% 100% 85deg,#EEEAF7, #796a5e, #B5B9BA 84%)
	;
	background-image:
	-webkit-gradient(linear, 50% 10%, 10% 50%, from(#796A5E), to(#EEEAF7), color-stop(.5,#B5B9BA))
	;
	background-image:
	-ms-linear-gradient(top left, #796A5E 10%, #EEEAF7 100%)
	;
	border-radius: 2px;
	font-style: normal;
	font-family:sans-serif;	
	
}


/***************** fin styles wrap par défaut ****************************/




/***********************************************************/
/*************** media queries *****************************/
/***********************************************************/



@media screen and (min-width:395px) 
/* menu horizontal activé (1er niveau) sans cases ni icones*/
/* sous menus verticaux */
{
	#wrap_accueil{
		height:1500px;
	}
	

	#wrap_contacts{
		height:2050px;
	}
	
	#wrap_metiers,#wrap_pi {
		height:3510px;
	}

} /* fim media querie pour ecran de largeur >= 365 px */





@media screen and (min-width:860px) /*mode 3 colonnes */
/* la hauteur se règle avec overflow:auto */
/* on pourrait ici rajouter les cases et icones pour menu horizontal */

{
	
	#wrap_accueil {
		height:/*1050px*//*80%*//*700px*//*130%*/900px;
	}
	
	#wrap_metiers,#wrap_pi {
		height:1500px;
	}
	
	#wrap_contacts{
		height:1230px;

	}
				
} /* fin media queries pour mode 3 colonnes */
/*fin media querie pour ecran de largeur >=800px */



@media screen and (min-width:1225px) 
/* présentation header et menu pincipal en mode horizontal */
{
	

#wrap_metiers,#wrap_pi {
		height:1500px;
	}		

	
	
	
} /*fin media querie pour ecran de largeur >=1225px */



 

@media screen and (min-width:1405px) 
/* activation full des sous menus et présentation horizontale full*/
{	

#wrap_metiers,#wrap_pi {
		height:1100px;
	}
		
	#wrap_contacts{
		height:1140px;

	}

} /* fin media querie pour full ecran >=1315px */






/***************** fin media queries **********************/