@charset "utf-8";
/* CSS Document */

/* partie positionnement et déco */  
#menu {
	margin: 0px;
	padding: 0px;
}
#menu a {
	display: block;
	color: #333333;
	text-decoration: none;
	font-family: Arial;
	font-size: 12px;
}
#menu a:hover    {
	display: block;
	color: #006489;
	text-decoration: none;
	font-family: Arial;
	font-size: 12px;
}
/*bt actif*/
#menu .actif    {
	display: block;
	color: #006489;
	text-decoration: none;
	font-family: Arial;
	font-size: 12px;
}
/*fin bt actif*/

#menu > li {
	position: relative;
	display: inline-block;
	width: auto;
	left: 0px;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 16px;
	padding-left: 10px;
	bottom: 0px;
}
#menu > li li {
	padding: 6px 8px;
}
/*Taille et couleur texte deroulant*/
#menu > li li a {
	color: #ffffff;
	font-family: Arial;
	font-size: 12px;
}
/*couleur fond deroulant roll over*/
#menu > li li:hover {
	background-color: rgb(30, 30, 20);
	background-color: rgba(0, 0, 0, 0.8);
}
#menu > li:first-child {
/*	border-right: 1px solid #777777;
	-webkit-border-radius:*/
				/* valeurs hori */	/* valeurs vert */
 /*              3px 0px 0px 3px / 3px 0px 0px 3px;
	-moz-border-radius: 3px 0px 0px 3px / 3px 0px 0px 3px;
	border-radius: 3px 0px 0px 3px / 3px 0px 0px 3px;
	behavior: url(http://www.arjo-systems.com/css/css/pie/PIE.php);*/
}
#menu > li + li {
	/*border-left: 1px solid #aaaaaa;
	border-right: 1px solid #777777;*/
}
#menu > li:last-child {
/*	border-right: 0;
	border-left: 1px solid #aaaaaa;
	-webkit-border-radius:*/
				/* valeurs hori */	/* valeurs vert */
/*               0px 3px 3px 0px / 0px 3px 3px 0px;
	-moz-border-radius: 0px 3px 3px 0px / 0px 3px 3px 0px;
	border-radius: 0px 3px 3px 0px / 0px 3px 3px 0px;
	behavior: url(http://www.arjo-systems.com/css/css/pie/PIE.php);*/
}
#menu > li:hover {
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: #006489;
	/*	background-color: #999999;
	background-image: linear-gradient(#cccccc, #aaaaaa 50%, #999999 50%, #bbbbbb);
	background-image: -o-linear-gradient(#cccccc, #aaaaaa 50%, #999999 50%, #bbbbbb);
	background-image: -moz-linear-gradient(#cccccc, #aaaaaa 50%, #999999 50%, #bbbbbb);
	background-image: -webkit-linear-gradient(#cccccc, #aaaaaa 50%, #999999 50%, #bbbbbb);
	background-image: -ms-linear-gradient(#cccccc, #aaaaaa 50%, #999999 50%, #bbbbbb);*/
	/*background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.5, rgb(136,136,136)), color-stop(0.5, rgb(153,153,153)));*/
	/*filter:  progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#888888', endColorstr='#999999');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#888888', endColorstr='#999999')";*/
}
/* (presque) fin de la partie positionnement/déco */  
/* dans cette déclaration, on fixe le max-height et couleur de fond des déroulant + la transparence*/  
#menu ul {
	position: absolute;
	top: 120px;
	left: 0;
	max-height: 0em;
	margin: 0;
	padding: 0;
	overflow: hidden;
	text-align: left;
	font-family: Arial;
	font-size: 12px;
	line-height: 16px;
	color: #000000;
	text-decoration: none;
	background-color: rgb(230, 230, 230);
	background-color: rgba(20, 20, 20, 0.8);
	transition: 0.5s max-height 0.2s;
	-webkit-transition: 0.5s max-height 0.2s;
	-moz-transition: 0.5s max-height 0.2s;
	-o-transition: 0.5s max-height 0.2s;
	-ms-transition: 0.5s max-height 0.2s;
}
/* ici on change la largeur des menus déroulants */
#menu ul li {
	width: 225px;
}
/* ici on change la valeur de max-height au :hover */  
#menu > li:hover ul {
	/* need an adaptation, lower is better, but see it large   */  
	max-height: 13em;
}