/****************************************************************/
/************* début styles little header par défaut ************/
/****************************************************************/


#little_header_wrap{
	margin:0%;
	background-color:#594D47;
	border-radius: 2px;

	top:0%;
	left:0%;
	position:fixed;

	height:7%;
	width:99.5%;
	opacity:0.90;
	z-index: 11;
	
}


.little_header
{
	margin:0%;
	
	height:100%;
	width:100%;
	
	background-color:#EEEAF7;
	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 50%)
	;
	color:white;
	border-radius: 2px;
	font-size: 0.75em;
	font-weight:500;
	letter-spacing:0.08em;
	border:1px solid #c0d346;
}


.little_header ul
{
	margin:0.3% 0% 0% 0%;
}

.little_header #left_part ul
{
	padding:0% 0% 0% 0.3%;
}

.little_header #right_part ul
{
	padding:0% 0.3% 0% 0%;
}

.little_header li
{
	list-style:none;
	color:black;
	
}

.little_header a
{
	color:white;
	font-style:normal;
	text-decoration: none;
	line-height:25px;
	margin:0px 0px 0px 5px;
}


.little_header_ico {
	width:30px;
	height:30px;
	float:left;
	/*border:1px solid red;*/
}

.little_header_ico img {
	width:30px;
	height:30px;
	border:#000000;
	/*border:1px solid red;*/
}



#left_part li {
	float:none;
	background-color:#9f8d7c;
	border-radius: 5px;
	margin:3px 5px 0px 0px;
	padding:5px 0px 8px 0px;
	min-height:25px;
}



#right_part li{
	float:none;
	background-color:#9f8d7c;
	border-radius: 5px;
	margin:3px 5px 0px 0px;
	padding:5px 0px 8px 0px;
	height:25px;
}


#left_part ul li ul{
	display:none;
}


#left_part ul li ul li{
	margin:3px 0px 0px 0px;
	background-color:#ffe3be;
	opacity:0.8;
	position:relative;
}


#left_part ul li ul li a{
	color:black;
	font-weight:500;
}




#left_part ul li:hover ul {
	display:block;
	opacity:1;
	
}



#left_part li:hover,#left_part li:focus,
#left_part ul li ul li:hover,#left_part ul li ul li:focus,
#right_part li:hover,#right_part li:focus
{
	color:#352f2b;
	font-weight:550;
	background-color:  #e8f87a ;
	
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.42);
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.42);
	
	border-radius:5px;
	
	transition: 
		background-color 0.25s ease 0s, 
		color 0.25s ease 0s, 
		box-shadow 0.25s ease 0s,
		text-shadow 0.25s ease 0s
		;
		
	-webkit-transition: 
		background-color 0.25s ease-in-out, 
		color 0.25s ease-in-out, 
		box-shadow 0.25s ease-in-out, 
		text-shadow 0.2s ease-in-out
		;
	opacity:1;
}

#left_part li:hover,#left_part li:focus
	{
		background-color:  #594D47;
	}
	
	
	#left_part ul li ul li:hover,
	#left_part ul li ul li:focus
	{
		background-color:  #e8f87a;
	}
	



#left_part a:hover,#left_part a:focus,
#right_part a:hover,#right_part a:focus
 {
	color:black;
	font-weight:500;
}




/************* fin styles little header par défaut ************/





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



@media screen and (min-width:395px) 
/* menu activé en vertical (1er niveau) */
/* sous menus verticaux */
{
	
	.little_header
	{
		font-size:0.75em;
	}
	
} /* fim media querie pour ecran de largeur >= 365 px */





@media screen and (min-width:860px) 
/*mode 3 colonnes pour métiers et pi*/
/* la hauteur se règle avec overflow:auto */
/* sous menus verticaux */


{

	#left_part li {
		float:left;
		/*border:1px solid blue;*/
	}

	#right_part li{
		float:right;
	}
	
	
	#left_part ul li ul li{
		/*clear:both;*/
		float:none;
		max-width:99%;
		margin:2px 0px 0px 0px;
		
	}
	
	
	#left_part li:hover,#left_part li:focus
	{
		background-color:  #594D47;
	}
	
	
	#left_part ul li ul li:hover,
	#left_part ul li ul li:focus
	{
		background-color:  #e8f87a;
	}
	

			
} /* 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 */
/* rajout des cases pour menu 1er niveau*/
{
	
	
} /*fin media querie pour ecran de largeur >=1225px */



 

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

#left_part ul li {
	height:35px;
	padding:5px 0px 5px 0px;
}

#left_part ul li ul{
	margin:0px 0px 0px 0px;
	/*border:1px solid black;*/
}

#left_part ul li ul li{
	float:left;
	margin:14px 0px 0px 0px;

}





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





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