/*
*	Auteur : Igor Milovidoff < Mathieu Gautheret
*	Société : 100% Net
*	Date de réalisation : Mars 2009
*	Inspiré de l'article : http://www.pompage.net/pompe/deroulants/
*	Description :
*		Ce fichier CSS associé au fichier JavaScript menu_deroulant.js permet de transformer un menu Joomla en menu déroulant.
*		Cet exemple peut être simplifié si tous les onglets de niveau 1 possède la même mise en forme.
*/

/************************************
*		Général            			*
************************************/
DIV#menu_deroulant A, DIV#menu_deroulant A:hover
{
	text-decoration:none;
}

/************************************
*		Menu            			*
************************************/
DIV#onglet_home
{
	width:998px;
	font-size: 13px;
	font-family: Verdana, Arial, Helvetica, Sans-Serif;
}

DIV.onglet_home
{
	float:left;
	clear:left;
	width:35px;
	height:35px;
	_height:35px;
	border-right:1px solid #481d14;
	text-align:center;
	background:url('../img/fond_onglet.jpg') repeat;
}
/************************************
*		Onglets         			*
************************************/
DIV#menu_onglets_deroulants
{
	width:100%;
	color:#ffffff;
	float:left;
	background:url('../img/fond_onglet.jpg') repeat;
	background-color:blue;
}

/************************************
*		Liste de niveau 1 			*
************************************/
/* Listes de niveau 1 et 2 */
UL.menu_deroulant, UL.menu_deroulant UL 
{
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 1;
	text-align:center;
}

/* Liens de niveau 1 */
UL.menu_deroulant LI
{
	border-right:1px solid #924205;
}


UL.menu_deroulant LI A:link, UL.menu_deroulant LI A:active, UL.menu_deroulant LI A:visited
{
	display: block;
	width: 85px;
	height:35px;
	!height:35px;
	line-height: 15px;
	color:#ffffff;
	font-size:0.85em;
	text-decoration:none;
}

div #menu_onglets_deroulants UL.menu_deroulant LI A:hover
{
	background:url('../img/fond_onglet_on.jpg') 100% 100% ;
	color:#D5EE52;
}

div #menu_onglets_deroulants UL.menu_deroulant LI LI A:hover
{
	background:none;
	color:#D5EE52;
}

/* Eléments de niveau 1 */
UL.menu_deroulant LI 
{
	float:left;
	width:85px;
	min-height:20px;
	font-weight:normal;
}

/************************************
*		Liste de niveau 2 			*
************************************/
/* Listes de niveau 2 qui se déroulent */
UL.menu_deroulant LI UL
{
	width:150px;
	!margin-left:-43px;
	_margin-left:-43px;
	text-align:left;
	border-top:1px solid #924205;
	background-color:#ED7C11;
	z-index: 9999;
}

/* Eléments de niveau 2 */
UL.menu_deroulant LI UL LI
{
	margin:0;
	padding:0;
	height:25px;
	width:149px;
	line-height:12px;
	border-left:1px solid #924205;
	border-right:1px solid #924205;
	border-bottom:1px solid #924205;
	background:none;
}

/* Liens actifs de niveau 2 */
UL.menu_deroulant LI UL LI A:link, 
UL.menu_deroulant LI UL LI A:active, 
UL.menu_deroulant LI UL LI A:visited
{
	margin:0;
	padding:0;
	width:150px;
	padding-left:3px;
	font-weight:normal;
	color:#000000;;
	height:25px;
	line-height:12px;
	background:none;
}

/* Liens actifs de niveau 2 */
UL.menu_deroulant LI UL LI A:hover
{
	color:#D5EE52;
}

/************************************
*		Liste de niveau 3 			*
************************************/
/* Listes de niveau 3 */
UL.menu_deroulant LI UL UL 
{
	margin: -1.85em 0 0 11.5em;
}

UL.menu_deroulant LI A 
{
	color:#000000;
}

UL.menu_deroulant LI UL LI UL LI A:link, 
UL.menu_deroulant LI UL LI UL LI A:active, 
UL.menu_deroulant LI UL LI UL LI A:visited
{
	color: black;
	font-weight:normal;
	text-decoration: none;
	margin:0;
	padding:0;
	width:100%;
	padding-left:3px;
	height:25px;
	line-height:12px;
	background:none;
}

UL.menu_deroulant LI UL LI UL LI A:hover
{
	color: #D5EE52;
	text-decoration: none;
}

/************************************
*		Liste de niveau 4 			*
************************************/
/* Listes de niveau 4 */
UL.menu_deroulant LI UL UL UL
{
	margin: -1.85em 0 0 11.4em;
}

UL.menu_deroulant LI UL LI A 
{
	color:#000000;
}

UL.menu_deroulant LI UL LI UL LI UL LI A:link, 
UL.menu_deroulant LI UL LI UL LI UL LI A:active, 
UL.menu_deroulant LI UL LI UL LI UL LI A:visited
{
	color: black;
	font-weight:normal;
	text-decoration: none;
	margin:0;
	padding:0;
	width:100%;
	padding-left:3px;
	height:25px;
	line-height:12px;
	background:none;
}

UL.menu_deroulant LI UL LI UL LI UL LI A:hover
{
	color: #D5EE52;
	text-decoration: none;
}

/************************************
*		Liste de niveau 5 			*
************************************/
/* Listes de niveau 5 */
UL.menu_deroulant LI UL UL UL UL
{
	margin: -1.85em 0 0 11.4em;
}

UL.menu_deroulant LI UL LI UL LI A 
{
	color:#000000;
}

UL.menu_deroulant LI UL LI UL LI UL LI UL LI A:link, 
UL.menu_deroulant LI UL LI UL LI UL LI UL LI A:active, 
UL.menu_deroulant LI UL LI UL LI UL LI UL LI A:visited
{
	color: black;
	font-weight:normal;
	text-decoration: none;
	margin:0;
	padding:0;
	width:100%;
	padding-left:3px;
	height:25px;
	line-height:12px;
	background:none;
}

UL.menu_deroulant LI UL LI UL LI UL LI UL LI A:hover
{
	color: #D5EE52;
	text-decoration: none;
}

/************************************
*		Mémorisation des styles		*
*		des niveaux supérieurs  	*
************************************/

UL.menu_deroulant LI:hover A, UL.menu_deroulant LI.sfhover1 A
{
	color:#D5EE52;
	background:url('../img/fond_onglet_on.jpg') 100%;
}
     
UL.menu_deroulant LI UL LI:hover A, UL.menu_deroulant LI UL LI.sfhover1 A
{
	color:#D5EE52;
	background:none;
}

UL.menu_deroulant LI UL LI UL LI:hover A, UL.menu_deroulant LI UL LI UL LI.sfhover1 A
{
	color:#D5EE52;
	background:none;
}

UL.menu_deroulant LI UL LI UL LI UL LI:hover A, UL.menu_deroulant LI UL LI UL LI  UL LI.sfhover1 A
{
	color:#D5EE52;
	background:none;
}

/************************************
*	Cacher/Afficher les sous-menus 	*
************************************/

/* Pour cacher les sous-menus de niveau 1 on utilise la propriété left plus accessible 
(sur certains lecteurs d'écran) que display. */
UL.menu_deroulant LI UL
{
	position: absolute;
	width:150px;
	left: -999em;
}

/* Pour cacher les sous-menus de niveau supérieur à 1 on utilise la propriété left plus accessible 
(sur certains lecteurs d'écran) que display. */
UL.menu_deroulant LI:hover UL UL, 
UL.menu_deroulant LI:hover UL UL UL, 
UL.menu_deroulant LI:hover UL UL UL UL, 
UL.menu_deroulant LI.sfhover1 UL UL, 
UL.menu_deroulant LI.sfhover1 UL UL UL,  
UL.menu_deroulant LI.sfhover1 UL UL UL UL 
{
	left: -999em;
}

/* Pour rendre visible les sous-menus cachés. */
UL.menu_deroulant LI:hover UL, 
UL.menu_deroulant LI LI:hover UL, 
UL.menu_deroulant LI LI LI:hover UL,  
UL.menu_deroulant LI LI LI LI:hover UL,  
UL.menu_deroulant LI.sfhover1 UL, 
UL.menu_deroulant LI LI.sfhover1 UL, 
UL.menu_deroulant LI LI LI.sfhover1 UL
UL.menu_deroulant LI LI LI LI.sfhover1 UL
{
	left: auto;
}

UL.menu_deroulant LI:hover
{
    position: static; /* IE7 Fix pour que le menu disparaisse  */
}