/* ********************************************************************************************************  */
/*                                 Feuille de style des menus de navigation                                  */
/* ********************************************************************************************************  */
/*
  Les menus haut et gauche sont écrits de la même façon en html et utilisent les mêmes javascript montre()
  et cache() pour les rendre dynamiques. Ce sont les feuilles de styles qui leur donnent leurs aspects
  respectifs.
  Voici un exemple de menu associé à la feuille de style:
  <DIV id=menuhaut>
	<DL>
	  <DT><A title="Retour à l'accueil" 
	  href="#">Accueil</A> 
	  </DT>
	 </DL>
	<DL>
	  <DT onmouseover="montre('smenu1');" onmouseout="cache('smenu1');" >Menu 1 
	  <DD id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');" >
	  <UL onmouseover="montre('smenu1');" onmouseout="cache('smenu1');" >
	    <LI><A href="#">Sous-Menu 1.1</A></LI>
	    <LI><A href="#">Sous-Menu 1.2</A></LI>
	    <LI><A href="#">Sous-Menu 1.3</A></LI>
	    <LI><A href="#">Sous-Menu 1.4</A></LI>
	    <LI><A href="#">Sous-Menu 1.5</A></LI>
	    <LI><A href="#">Sous-Menu 1.6</A></LI></UL></DD></DL>
	<DL class="rubriqueSel" >
	  <DT  class="rubriqueSel" onMouseOver="javascript:montre('smenu2');" onmouseout="cache('smenu2');" >Menu 2 sel
	  <DD  class="rubriqueSel" id="smenu2" onMouseOver="javascript:montre('smenu2');" onmouseout="cache('smenu2');">
	  <UL  class="rubriqueSel" onMouseOver="javascript:montre('smenu2');" onmouseout="cache('smenu2');">
	   	<LI><A href="#">Sous-Menu 2.1</A></LI>
	    <LI><A href="#">Sous-Menu 2.2</A></LI>
	    <LI><A href="#">Sous-Menu 2.3</A></LI>
	  </UL></DD></DL>
	<DL>
	  <DT onMouseOver="javascript:montre('smenu3');" onmouseout="cache('smenu3');">Menu 3 
	  <DD id=smenu3 onMouseOver="javascript:montre('smenu3');" onmouseout="cache('smenu3');">
	  <UL onMouseOver="javascript:montre('smenu3');" onmouseout="cache('smenu3');">
	    <LI><A href="#">Sous-Menu 3.1</A></LI>
	    <LI><A href="#">Sous-Menu 3.2</A></LI>
	    <LI><A href="#">Sous-Menu 3.3</A></LI>
	    <LI><A href="#">Sous-Menu 3.4</A></LI>
	    <LI><A href="#">Sous-Menu 3.5</A></LI>
	  </UL></DD></DL></DIV>
*/

/* ********************************************************************************************************  */
/*                                 Elements de base des menus de navigation                                  */
/* ********************************************************************************************************  */
DL {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}
DT {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}
DD {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}
UL {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}
LI {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}
/* Fix IE. Hide from IE Mac \*/
* html ul li { height: 1%; }
* html ul li a { height: 1%; }
/* End */
/* ********************************************************************************************************  */
/*                                 MENU GAUCHE ou menu vertical                                  */
/* ********************************************************************************************************  */
/*
 Ce style permet de personnaliser la DIV qui contient le menu gauche
 Sa position : LEFT , TOP
 Sa taille : WIDTH, HEIGHT
 Sa POSITION :  relative ou absolue
*/
#menugauche {
	Z-INDEX: 100; LEFT: 0px; TOP: 0px; WIDTH: 100px ; POSITION: absolute; 
}
#menugauche A:hover {
	
}
/* Bloc de la rubrique+elements  #menugauche.DL */
/*
 DT Style de l'affichage de la rubrique
*/
#menugauche DT {
	BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BORDER-LEFT: gray 1px solid;BORDER-BOTTOM: gray 1px solid;
	FONT-WEIGHT: bold; ; TEXT-ALIGN: center;
	LINE-HEIGHT: 20px;  HEIGHT: 20px;
	BACKGROUND: #EEEEEE; BACKGROUND-COLOR: #008000; 
	MARGIN: 2px 0px;  
	CURSOR: pointer; 
}
#menugauche DT A {
	BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; 
	DISPLAY: block; COLOR: #000; HEIGHT: 100%; TEXT-DECORATION: none
}
#menugauche DT A:hover {
	BACKGROUND: #eee
}
/* 
 DD Style du conteneur des elements 
*/
#menugauche DD {
	BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BORDER-LEFT: gray 1px solid; BORDER-BOTTOM: gray 1px solid
}
/* 
 LI Affichage des elements du menu (pages) 
*/
#menugauche LI {
	BACKGROUND: #fff; TEXT-ALIGN: center
}
#menugauche LI A {
	BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; 
	DISPLAY: block; COLOR: #000; HEIGHT: 100%; TEXT-DECORATION: none
}
#menugauche LI A:hover {
	BACKGROUND: #eee
}

/*
 Style de la rubrique sélectionnée 
*/
#menugauche .rubriqueSel DT {
	Z-INDEX: 100;PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px;
	FONT: bold 110% Arial; COLOR: white;  
	BACKGROUND-COLOR: blue; 
	TEXT-ALIGN: center;
	cursor:pointer
}
/* Affichage des elements du menu (pages) de la rubrique selectionnée
	IMPORTANT : pour que le javascript de déroulement du menu puisse marcher, ne pas modifier les éléments :
	PADDING-BOTTOM: 0px; PADDING-TOP: 0px;
*/
#menugauche .rubriqueSel LI {
	BACKGROUND: red; TEXT-ALIGN: center;
	BACKGROUND-COLOR: blue;
}
#menugauche .rubriqueSel LI A {
	BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; 
	DISPLAY: block; COLOR: #000; HEIGHT: 100%; TEXT-DECORATION: none;
	BACKGROUND-COLOR: blue;
}
#menugauche .pageSel LI {
	BACKGROUND: red; TEXT-ALIGN: center;
	BACKGROUND-COLOR: blue;
}
#menugauche .pageSel LI A {
	BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; 
	DISPLAY: block; COLOR: #000; HEIGHT: 100%; TEXT-DECORATION: none;
	BACKGROUND-COLOR: blue;
}
/* ********************************************************************************************************  */
/*                                 MENU HAUT ou menu horizontal                                  */
/* ********************************************************************************************************  */
/*
 Ce style permet de personnaliser la DIV qui contient le menu du haut horizontal
 Sa position : LEFT , TOP
 Sa taille : WIDTH, HEIGHT
 Sa POSITION :  relative ou absolute 
 ATTENTION : il est fortement recommandé de laisser la position à ABSOLUTE sinon les éléments
 de la page sont décalés sous le menu !!! 
 */
#menuhaut {
	Z-INDEX: 100; LEFT: 0px; TOP: 50px; WIDTH: 600px; POSITION: ABSOLUTE; 
}
/*
 DL Style pour un bloc rubrique + sous-menus
 Float permet de faire décaler les rubriques horizontalement
*/
#menuhaut DL {
	Z-INDEX: 100; FLOAT: left; MARGIN: 0px 1px; WIDTH: 12em
}
/*
  DT Style de l'affichage de la rubrique
*/
#menuhaut DT {
	Z-INDEX: 100;PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px;
	FONT: bold 100% Arial; COLOR: white;  
	BACKGROUND-COLOR: #008000; 
	TEXT-ALIGN: center;
	cursor:pointer
}
#menuhaut DT A {
	Z-INDEX: 100;BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px;BORDER-BOTTOM: 0px; HEIGHT: 100%; 
	DISPLAY: block;  COLOR: #000; TEXT-DECORATION: none
}
#menuhaut DT A:hover {
	Z-INDEX: 100;BACKGROUND: #51b906
}
/* 
 DD Style du conteneur des elements 
*/
#menuhaut DD {
	Z-INDEX: 100;BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BORDER-LEFT: gray 1px solid; BORDER-BOTTOM: gray 1px solid; 
	MARGIN: 0px 0px 0px 0px
}
/* LI Affichage des elements du menu (pages) 
	IMPORTANT : pour que le javascript de déroulement du menu puisse marcher, ne pas modifier les éléments :
	PADDING-BOTTOM: 0px; PADDING-TOP: 0px;
*/
#menuhaut LI {
	Z-INDEX: 100;PADDING-RIGHT: 2px; PADDING-LEFT: 2px; 
	PADDING-BOTTOM: 0px; PADDING-TOP: 0px;
	FONT:  Arial; COLOR: white;  BACKGROUND-COLOR: #008000; 
	TEXT-ALIGN: center
}
#menuhaut LI A {
	Z-INDEX: 100;BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-BOTTOM: 0px; BORDER-LEFT: 0px; HEIGHT: 100%;
	DISPLAY: block; COLOR: #000; TEXT-DECORATION: none
}
#menuhaut LI A:hover {
	Z-INDEX: 100;BACKGROUND: #51b906
}

/*
 Style de la rubrique sélectionnée 
*/
#menuhaut .rubriqueSel DT {
	Z-INDEX: 100;PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px;
	FONT: bold 110% Arial; COLOR: white;  
	BACKGROUND-COLOR: red; 
	TEXT-ALIGN: center;
	cursor:pointer
}
/* Affichage des elements du menu (pages) de la rubrique selectionnée
	IMPORTANT : pour que le javascript de déroulement du menu puisse marcher, ne pas modifier les éléments :
	PADDING-BOTTOM: 0px; PADDING-TOP: 0px;
*/
#menuhaut .pageSel LI {
	Z-INDEX: 100;PADDING-RIGHT: 2px; PADDING-LEFT: 2px; 
	PADDING-BOTTOM: 0px; PADDING-TOP: 0px;
	FONT: bold 110% Arial; COLOR: white;  BACKGROUND-COLOR: red;
	TEXT-ALIGN: center
}
/* ************************************ exemple de redéfinition des styles pour les sous menus i */

/* sous menu gauche 3 avec image*/
/*
#menugauche .smenugauche3 DT {
	BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; FONT-WEIGHT: bold; BACKGROUND: #EEEEEE; BACKGROUND-COLOR: #008000; MARGIN: 2px 0px; BORDER-LEFT: gray 1px solid; CURSOR: pointer; LINE-HEIGHT: 20px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 20px; TEXT-ALIGN: center; background-image: url(http://www.unibail.com/corp/images/pictos/picto-groupe.gif);
}
#menugauche .smenugauche3 DD {
	BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BORDER-LEFT: gray 1px solid; BORDER-BOTTOM: gray 1px solid
}
#menugauche .smenugauche3 LI {
	BACKGROUND: #fff; TEXT-ALIGN: center
}
#menugauche .smenugauche3 LI A {
	BORDER-RIGHT: 0px; BORDER-TOP: 0px; DISPLAY: block; BORDER-LEFT: 0px; COLOR: #000; BORDER-BOTTOM: 0px; HEIGHT: 100%; TEXT-DECORATION: none
}
#menugauche .smenugauche3 DT A {
	BORDER-RIGHT: 0px; BORDER-TOP: 0px; DISPLAY: block; BORDER-LEFT: 0px; COLOR: #000; BORDER-BOTTOM: 0px; HEIGHT: 100%; TEXT-DECORATION: none
}
#menugauche .smenugauche3 LI A:hover {
	BACKGROUND: #eee
}
#menugauche .smenugauche3 DT A:hover {
	BACKGROUND: #eee
}
*/

/* sous menu haut 1 */
/*
#menuhaut .smenuhaut1 DT {
	Z-INDEX: 100;PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; FONT: bold 110% Arial; COLOR: white; PADDING-TOP: 2px; BACKGROUND-COLOR: #008000; TEXT-ALIGN: center;cursor:pointer
}
#menuhaut .smenuhaut1 DD {
	Z-INDEX: 100;BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BORDER-LEFT: gray 1px solid; BORDER-BOTTOM: gray 1px solid; MARGIN: 5px auto 10px 18px
}
#menuhaut .smenuhaut1 LI {
	Z-INDEX: 100;PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; FONT: bold 110% Arial; COLOR: white; PADDING-TOP: 2px; BACKGROUND-COLOR: #008000; TEXT-ALIGN: center
}
#menuhaut .smenuhaut1 LI A {
	Z-INDEX: 100;BORDER-RIGHT: 0px; BORDER-TOP: 0px; DISPLAY: block; BORDER-LEFT: 0px; COLOR: #000; BORDER-BOTTOM: 0px; HEIGHT: 100%; TEXT-DECORATION: none
}
#menuhaut .smenuhaut1 DT A {
	Z-INDEX: 100;BORDER-RIGHT: 0px; BORDER-TOP: 0px; DISPLAY: block; BORDER-LEFT: 0px; COLOR: #000; BORDER-BOTTOM: 0px; HEIGHT: 100%; TEXT-DECORATION: none
}
#menuhaut .smenuhaut1 LI A:hover {
	Z-INDEX: 100;BACKGROUND: #51b906
}
#menuhaut .smenuhaut1 DT A:hover {
	Z-INDEX: 100;BACKGROUND: #51b906
}
*/