/*--------------------------------------------------------------------------------------------------------------*/
/*--- MENU ---*/
#menu {
display: inline;
position: relative;
z-index: 1000;
background-color: transparent;
float: left;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
width: 223px;
}
#menu ul li{ /* -- supprime la hauteur des li pour IE --*/
display:inline;
}
#menu ul li a {
text-align: center;
position: absolute; 
top: -60px;
height: 50px;
display: block;
padding: 10px 0px 0px 0px;
text-decoration: none;
color: #FFFFFF;
text-transform: uppercase;
font-weight: bold;
}
#menu ul li a:hover,
#menu ul li a.on,
#menu ul li.on a,
#menu ul li a.lv1Over {
display: block;
background-position: left -65px;
}
#menu ul li.lien01 a{
left: 369px;
width:119px;
background-image: url(menuLien01.gif);
}
#menu ul li.lien01 a:hover,
#menu ul li.lien01_on a,
#menu ul li.lien01 a.lv1Over{
color: #018F62;
}
#menu ul li.lien02 a{
left: 490px;
width:188px;
background-image: url(menuLien02.gif);
}
#menu ul li.lien02 a:hover,
#menu ul li.lien02_on a,
#menu ul li.lien02 a.lv1Over{
color: #90BE7A;
}
#menu ul li.lien03 a{
left: 680px;
width:154px;
background-image: url(menuLien03.gif);
}
#menu ul li.lien03 a:hover,
#menu ul li.lien03_on a,
#menu ul li.lien03 a.lv1Over{
color: #014F36;
}
#menu ul li.lien04 a{
left: 836px;
width:123px;
background-image: url(menuLien04.gif);
}
#menu ul li.lien04 a:hover,
#menu ul li.lien04_on a,
#menu ul li.lien04 a.lv1Over{
color: #0F8EB3;
}
/* --- SOUS MENU  --- */
#menu ul li ul,
#menu ul.on li ul.on li ul,
#menu ul.on li ul.on li ul.on li ul,
#menu ul.on li ul.on li ul.on li ul.on li ul{
display:none;
}
#menu ul li.on ul,
#menu ul.on li ul.on li.on ul,
#menu ul.on li ul.on li ul.on li.on ul,
#menu ul.on li ul.on li ul.on li ul.on li.on ul{
display: block;
position: relative;
}
#menu ul li ul {
margin: 45px 0px 10px 0px;
padding: 0px 0px 0px 0px;
}
#menu ul li.lien01 ul li a,
#menu ul li.lien02 ul li a,
#menu ul li.lien03 ul li a,
#menu ul li.lien04 ul li a{
position: relative;
top: 0px; 
left: 0px;
width: 200px;
height: auto;
font-size: 100%;
padding: 9px 5px 9px 20px;
margin: 0px 0px 2px 0px;
text-decoration: none;
text-transform: none;
text-align: left;
color: #FFFFFF;
font-weight: normal;
background: url(bgMenuUl.png) no-repeat left top;
}

#menu ul li.lien01 ul li a:hover,
#menu ul li.lien01 ul li a.on,
#menu ul li.lien01 ul li.on a{
background: url(bgMenuUl.png) no-repeat left -70px;
color: #FFFFFF;
}
#menu ul li.lien02 ul li a:hover,
#menu ul li.lien02 ul li a.on,
#menu ul li.lien02 ul li.on a{
background: url(bgMenuUlLien02.png) no-repeat left -70px;
color: #FFFFFF;
}
#menu ul li.lien03 ul li a:hover,
#menu ul li.lien03 ul li a.on,
#menu ul li.lien03 ul li.on a{
background: url(bgMenuUlLien03.png) no-repeat left -70px;
color: #FFFFFF;
}
#menu ul li.lien04 ul li a:hover,
#menu ul li.lien04 ul li a.on,
#menu ul li.lien04 ul li.on a{
background: url(bgMenuUlLien04.png) no-repeat left -70px;
color: #FFFFFF;
}



#menu ul li.lien01 ul ul li a:hover,
#menu ul li.lien01 ul ul li.on a,
#menu ul li.lien02 ul ul li a:hover,
#menu ul li.lien02 ul ul li.on a,
#menu ul li.lien03 ul ul li a:hover,
#menu ul li.lien03 ul ul li.on a,
#menu ul li.lien04 ul ul li a:hover,
#menu ul li.lien04 ul ul li.on a{
}
#menu ul ul ul{
padding: 0px 0px 0px 0px;
margin: 0px 0px 5px 0px;
}
#menu ul li.lien01 ul ul li a,
#menu ul li.lien01 ul ul.on li a,
#menu ul li.lien02 ul ul li a,
#menu ul li.lien02 ul ul.on li a,
#menu ul li.lien03 ul ul li a,
#menu ul li.lien03 ul ul li a.on,
#menu ul li.lien03 ul ul.on li a,
#menu ul li.lien04 ul ul li a,
#menu ul li.lien04 ul ul.on li a{
width: 175px;
font-size: 90%;
padding: 9px 2px 9px 20px;
margin: 0px 0px 2px 26px;
text-decoration: none;
background-position: left top;
}
#menu ul li.lien01 ul ul li a:hover,
#menu ul li.lien01 ul ul li.on a,
#menu ul li.lien02 ul ul li a:hover,
#menu ul li.lien02 ul ul li.on a,
#menu ul li.lien03 ul ul li a:hover,
#menu ul li.lien03 ul ul li.on a,
#menu ul li.lien04 ul ul li a:hover,
#menu ul li.lien04 ul ul li.on a{
background-position: left -70px;
}
#menu ul ul ul ul{
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 10px;
}
#menu ul ul ul ul{
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
}
#menu ul li.lien01 ul ul ul.on li a,
#menu ul li.lien02 ul ul ul.on li a,
#menu ul li.lien03 ul ul ul.on li a,
#menu ul li.lien04 ul ul ul.on li a{
background: #FFFFFF url() no-repeat 0px 0px;
}
#menu ul li.lien01 ul ul ul li a.on,
#menu ul li.lien01 ul ul ul li a:hover{
background: url() no-repeat 0px 0px;
color: #333333;
}
#menu ul li.lien02 ul ul ul li a.on,
#menu ul li.lien02 ul ul ul li a:hover{
background: url() no-repeat 0px 0px;
color: #333333;
}
#menu ul li.lien03 ul ul ul li a.on,
#menu ul li.lien03 ul ul ul li a:hover{
background: url() no-repeat 0px 0px;
color: #333333;
}
#menu ul li.lien04 ul ul ul li a.on,
#menu ul li.lien04 ul ul ul li a:hover{
background: url() no-repeat 0px 0px;
color: #333333;
}

/* --- SOUS MENU FLIP FLAP  --- */

#menu ul li ul.flip{
margin: 0px 0px 0px 0px;
padding: 10px 0px 10px 0px;
position: absolute;
width: 188px;
top: -7px;
display: block;
z-index: 10000;
background: url(menuBottom.gif) no-repeat left bottom;
}
#menu ul li ul.flip li{
display: block; /* --- permet de contrarier le display inline qui supprime la hauteur des li pour IE pour corriger un bug d'affichage en mode flip ---*/
position:relative;
top: 0px; 
left: 0px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
border-top: #F2F2F2 1px dotted;
}
#menu ul li ul.flip li:first-child{
border-top: none;
}
#menu ul li ul.flip li a{
display: block;
width: 176px;
height: auto;
margin: 0px 1px 0px 1px;
padding: 0px 0px 0px 10px;
background-image: none;
text-align: left;
color: #000000;
text-transform: none;
font-weight: normal;
}
#menu ul li ul.flip li a:hover{
background: #90BE7A;
color: #FFFFFF;
}
/* --- SOUS MENU FLIP FLAP PAR LIEN --- */
#menu ul li.lien01 ul.flip{
position: absolute;
left:370px;
}
#menu ul li.lien01 ul.flip li a:hover,
#menu ul li.lien01 ul.flip li a.lv1Over{
background: #018F62;
}
/* ---- */
#menu ul li.lien02 ul.flip{
position: absolute;
left: 490px;
}
#menu ul li.lien02 ul.flip li a:hover,
#menu ul li.lien02 ul.flip li a.lv1Over{
background: #90BE7A;
}
/* ---- */
#menu ul li.lien03 ul.flip{
position: absolute;
left: 680px;
}
#menu ul li.lien03 ul.flip li a:hover,
#menu ul li.lien03 ul.flip li a.lv1Over{
background: #014F36;
}
/* ---- */
#menu ul li.lien04 ul.flip{
position: absolute;
left: 771px;
}
#menu ul li.lien04 ul.flip li a:hover,
#menu ul li.lien04 ul.flip li a.lv1Over{
background: #0F8EB3;
}
/* pour le troisieme niveau */
#menu ul li ul li ul.flip li a{
padding: 0px 0px 0px 10px;
}
#menu ul li ul li ul.flip{
display: none;
background: url(menuBottom2.gif) no-repeat right bottom;
}
#menu ul li ul.flip li ul li a{
background-image: none;
}
#menu ul li.lien01 ul.flip li ul,
#menu ul li.lien02 ul.flip li ul,
#menu ul li.lien03 ul.flip li ul,
#menu ul li.lien04 ul.flip li ul{
position: absolute;
left: 180px;
top: -10px;
padding: 10px 0px 0px 0px;
}
/*--------------------------------------------------------------------------------------------------------------*/
/*--- LIENS ---*/
li.lien01, .Lien01, .lien01 {
color: #663333;
}
li.lien02, .Lien02, .lien02 {
color: #3366CC;
}
li.lien03, .Lien03, .lien03 {
color: #797979;
}
li.lien04, .Lien04, .lien04 {
color: #FF6600;
}
li.lien05, .Lien05, .lien05 {
color:#CC0000;
}
li.lien06, .Lien06, .lien06 {
color: #FF6600;
}
li.lien07, .Lien07, .lien07 {
color:#FF9900;
}
