/*--------------------------------------------------------------------------------------------------------------*/
/*--- MENU ---*/
#menu {
display: inline;
position: relative;
z-index: 10000;
float: left;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
width:175px;
}
#menu ul li{ /* -- supprime la hauteur des li pour IE --*/
display:inline;
}

/*--- MENU HAUT NIVEAU 1 PAR COMMUN ---*/
#menu ul li a {
position: absolute; 
top: -58px;
height: 55px;
display: block;
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
background-position:left top;
background-color: #FFFFFF;
font-size: medium;
}

#menu ul li a:hover,
#menu ul li.on a,
#menu ul li a.lv1Over {
display: block;
background-repeat: no-repeat;
background-position:left bottom;
}
#menu ul li  a span{
position: absolute; 
top: -5000px ;
}
/*On contrarie le fait d'avoir mis les span en absolu*/
#menu ul ul li  a span{
position: relative; 
top: 0px;
left: 0px;
}

/*--- MENU HAUT NIVEAU 1 PAR LIEN ---*/
#menu ul li.lien01 a{
left: 0px;
width:153px;
background-image: url(bg_flip_over_niv1_body01.gif);
font-size: small;
}
#menu ul li.lien01 a:hover,
#menu ul li.lien01_on a,
#menu ul li.lien01 a.lv1Over{
background-image: url(bg_flip_over_niv1_body01.gif);
}
#menu ul li.lien02 a {
width: 155px;
left: 154px;
background-image: url(bg_flip_over_niv1_body02.gif);
font-size: small;
}
#menu ul li.lien02 a:hover{
background-image: url(bg_flip_over_niv1_body02.gif);
}
#menu ul li.lien03 a {
width: 155px;
left: 310px;
background-image: url(bg_flip_over_niv1_body03.gif);
font-size: small;
}
#menu ul li.lien03 a:hover{
background-image: url(bg_flip_over_niv1_body03.gif);
}
#menu ul li.lien04 a {
width: 155px;
left: 466px;
background-image: url(bg_flip_over_niv1_body04.gif);
font-size: small;
}
#menu ul li.lien04 a:hover{
background-image: url(bg_flip_over_niv1_body04.gif);
}
#menu ul li.lien05 a {
width: 155px;
left: 622px;
background-image: url(bg_flip_over_niv1_body05.gif);
font-size: small;
}
#menu ul li.lien05 a:hover{
background-image: url(bg_flip_over_niv1_body05.gif);
}
#menu ul li.lien06 a {
width: 152px;
left: 778px;
background-image: url(bg_flip_over_niv1_body06.gif);
font-size: small;
}
#menu ul li.lien06 a:hover{
background-image: url(bg_flip_over_niv1_body06.gif);
}

/*--- MENU DEROULANT ---*/
#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 GAUCHE NIVEAU 2 COMMUN---*/

#menu ul li ul {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
#menu ul li ul li a{
font-size: medium;
}
#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,
#menu ul li.lien05 ul li a,
#menu ul li.lien06 ul li a{
position: relative;
top: 0px; 
left: 0px;
width: 149px;
height: auto;
padding: 5px 0px 5px 26px;
margin: 0px 0px 0px 0px;
text-decoration: none;
text-align: left;
color: #414141;
}
/*--- MENU GAUCHE NIVEAU 2 PAR LIENS---*/

#menu ul li.lien01 ul.on li a{
background: url(bg_puce_menu_niv2_body01.gif);
background-repeat: no-repeat;
background-position: 5px -5px;
background-color: transparent;
}
#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(bg_puce_menu_niv2_body01.gif);
background-repeat: no-repeat;
background-position: 5px -105px;
width:150px;
background-color: #9bd1ed;
}
#menu ul li.lien02 ul.on li a{
background: url(bg_puce_menu_niv2_body02.gif);
background-repeat: no-repeat;
background-position: 5px -5px;
background-color: transparent;

}
#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(bg_puce_menu_niv2_body02.gif);
background-repeat: no-repeat;
background-position: 5px -105px;
width:150px;
background-color: #bce0b3;
}
#menu ul li.lien03 ul.on li a{
background: url(bg_puce_menu_niv2_body03.gif);
background-repeat: no-repeat;
background-position: 5px -5px;
background-color: transparent;
}
#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(bg_puce_menu_niv2_body03.gif);
background-repeat: no-repeat;
background-position: 5px -105px;
width:150px;
background-color: #dde498;
}
#menu ul li.lien04 ul.on li a{
background: url(bg_puce_menu_niv2_body04.gif);
background-repeat: no-repeat;
background-position: 5px -5px;
background-color: transparent;
}
#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(bg_puce_menu_niv2_body04.gif);
background-repeat: no-repeat;
background-position: 5px -105px;
width:150px;
background-color: #f9e085;
}
#menu ul li.lien05 ul.on li a{
background: url(bg_puce_menu_niv2_body05.gif);
background-repeat: no-repeat;
background-position: 5px -5px;
background-color: transparent;
}
#menu ul li.lien05 ul li a:hover,
#menu ul li.lien05 ul li a.on,
#menu ul li.lien05 ul li.on a{
background: url(bg_puce_menu_niv2_body05.gif);
background-repeat: no-repeat;
background-position: 5px -105px;
width:150px;
background-color: #f8a6a3;
}
#menu ul li.lien06 ul.on li a{
background: url(bg_puce_menu_niv2_body06.gif);
background-repeat: no-repeat;
background-position: 5px -5px;
background-color: transparent;
}
#menu ul li.lien06 ul li a:hover,
#menu ul li.lien06 ul li a.on,
#menu ul li.lien06 ul li.on a{
background: url(bg_puce_menu_niv2_body06.gif);
background-repeat: no-repeat;
background-position: 5px -105px;
width:150px;
background-color: #cfa2e9;
}

/*--- MENU GAUCHE NIVEAU 3 COMMUN---*/
#menu ul ul ul{
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
}
#menu ul ul ul li a{
font-size: small;
}
/*--- MENU GAUCHE NIVEAU 3 PAR LIENS ---*/
#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,
#menu ul li.lien05 ul ul li a,
#menu ul li.lien05 ul ul.on li a,
#menu ul li.lien06 ul ul li a,
#menu ul li.lien06 ul ul.on li a{
padding: 5px 0px 5px 32px;
margin: 0px 0px 0px 0px;
width: 143px;
}
#menu ul li.lien01 ul ul li a,
#menu ul li.lien01 ul ul.on li a{
background: url(bg_puce_menu_niv3_body01.gif);
background-repeat: no-repeat;
background-position: 15px -103px;
}
#menu ul li.lien01 ul ul li a:hover,
#menu ul li.lien01 ul ul li.on a{
background: url(bg_puce_menu_niv3_body01.gif);
background-repeat: no-repeat;
background-position: 15px -3px;
color: #414141;
width:145px;
background-color: #9bd1ed
}
#menu ul li.lien02 ul ul li a,
#menu ul li.lien02 ul ul.on li a{
background: url(bg_puce_menu_niv3_body02.gif);
background-repeat: no-repeat;
background-position: 15px -103px;
}
#menu ul li.lien02 ul ul li a:hover,
#menu ul li.lien02 ul ul li.on a{
background: url(bg_puce_menu_niv3_body02.gif);
background-repeat: no-repeat;
background-position: 15px -3px;
color: #414141;
width:145px;
background-color: #bce0b3;
}
#menu ul li.lien03 ul ul li a,
#menu ul li.lien03 ul ul.on li a{
background: url(bg_puce_menu_niv3_body03.gif);
background-repeat: no-repeat;
background-position: 15px -103px;
}
#menu ul li.lien03 ul ul li a:hover,
#menu ul li.lien03 ul ul li.on a{
background: url(bg_puce_menu_niv3_body03.gif);
background-repeat: no-repeat;
background-position: 15px -3px;
color: #414141;
width:145px;
background-color: #dde498;
}
#menu ul li.lien04 ul ul li a,
#menu ul li.lien04 ul ul.on li a{
background: url(bg_puce_menu_niv3_body04.gif);
background-repeat: no-repeat;
background-position: 15px -103px;
}
#menu ul li.lien04 ul ul li a:hover,
#menu ul li.lien04 ul ul li.on a{
background: url(bg_puce_menu_niv3_body04.gif);
background-repeat: no-repeat;
background-position: 15px -3px;
color: #414141;
width:145px;
background-color: #f9e085;
}
#menu ul li.lien05 ul ul li a,
#menu ul li.lien05 ul ul.on li a{
background: url(bg_puce_menu_niv3_body05.gif);
background-repeat: no-repeat;
background-position: 15px -103px;
}
#menu ul li.lien05 ul ul li a:hover,
#menu ul li.lien05 ul ul li.on a{
background: url(bg_puce_menu_niv3_body05.gif);
background-repeat: no-repeat;
background-position: 15px -3px;
color: #414141;
width:145px;
background-color: #f8a6a3;
}
#menu ul li.lien06 ul ul li a,
#menu ul li.lien06 ul ul.on li a{
background: url(bg_puce_menu_niv3_body06.gif);
background-repeat: no-repeat;
background-position: 15px -103px;
}
#menu ul li.lien06 ul ul li a:hover,
#menu ul li.lien06 ul ul li.on a{
background: url(bg_puce_menu_niv3_body06.gif);
background-repeat: no-repeat;
background-position: 15px -3px;
color: #414141;
width:145px;
background-color: #cfa2e9;
}
/*--- MENU GAUCHE NIVEAU 4 COMMUN---*/
#menu ul ul ul ul{
padding: 5px 0px 0px 0px;
margin: 0px 0px 5px 10px;
}
/*--- MENU GAUCHE NIVEAU 4 PAR LIENS ---*/
#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 7px;
}
#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 8px;
color: #414141;
}
#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 8px;
color: #414141;
}
#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 8px;
color: #414141;
}
#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 8px;
color: #414141;
}
/* ---  MENU FLIP FLAP NIVEAU 1 --- */
/*--- COMMUN ---*/
#menu ul li ul.flip{
margin: 0px 0px 0px 0px;
padding: 3px 0px 0px 0px;
position: absolute;
top: -3px;
display: block;
z-index: 10000;
}
#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 laisser en commentaire car sinon ça provoque un bug---*/
position:relative;
top: -3px; 
left: 0px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
background-color: #ffffff;
}
#menu ul li ul.flip li a{
width: 170px;
margin: 0px 0px 0px 0px;
padding: 5px 0px 5px 18px;
background-image: none;
text-align: left;
border-right :2px transparent solid;
border-bottom :2px transparent solid;
background-color: #ffffff; /*sinon fond transparent sous firefox*/
}
#menu ul li ul.flip li a:hover{
background-image: none;
color: #FFFFFF;
width: 170px;
border-right :2px transparent solid;
border-bottom :2px transparent solid;
}
/* --- MENU FLIP FLAP NIVEAU 1 PAR LIEN --- */
#menu ul li.lien01 ul.flip{
position: absolute;
left:0px;
border-top: 2px solid #39a4da;
}
#menu ul li.lien01 ul.flip li a{
background-position: 0px -5px;
background-repeat: repeat-y;
background-image: url(bg_flip_niv2_body01.gif);
border-color: #39a4da; 
}
#menu ul li.lien01 ul.flip li a:hover,
#menu ul li.lien01 ul.flip li a.lv1Over{
background-image: none;
background-color: #39a4da;
border-color: #39a4da; 
}
#menu ul li.lien02 ul.flip{
position: absolute;
left: 154px;
border-top: 2px solid #79c167;
}
#menu ul li.lien02 ul.flip li a{
background-position: 0px -5px;
background-repeat: repeat-y;
background-image: url(bg_flip_niv2_body02.gif);
border-color:  #79c167;
}
#menu ul li.lien02 ul.flip li a:hover,
#menu ul li.lien02 ul.flip li a.lv1Over{
background-color: #79c167;
background-image: none;
border-color:  #79c167;
}
#menu ul li.lien03 ul.flip{
position: absolute;
left: 310px;
border-top: 2px solid #bbc830;
}
#menu ul li.lien03 ul.flip li a{
background-position: 0px -5px;
background-repeat: repeat-y;
background-image: url(bg_flip_niv2_body03.gif);
border-color: #bbc830;
}
#menu ul li.lien03 ul.flip li a:hover,
#menu ul li.lien03 ul.flip li a.lv1Over{
background-color: #bbc830;
background-image: none;
border-color: #bbc830;
}
#menu ul li.lien04 ul.flip{
position: absolute;
left: 466px;
border-top: 2px solid #f3c10b;
}
#menu ul li.lien04 ul.flip li a{
background-position: 0px -5px;
background-repeat: repeat-y;
background-image: url(bg_flip_niv2_body04.gif);
border-color: #f3c10b;
}
#menu ul li.lien04 ul.flip li a:hover,
#menu ul li.lien04 ul.flip li a.lv1Over{
background: #f3c10b;
border-color: #f3c10b;
}
#menu ul li.lien05 ul.flip{
position: absolute;
left: 622px;
border-top: 2px solid #f14c46;
}
#menu ul li.lien05 ul.flip li a{
background-position: 0px -5px;
background-repeat: repeat-y;
background-image: url(bg_flip_niv2_body05.gif);
border-color: #f14c46;
}
#menu ul li.lien05 ul.flip li a:hover,
#menu ul li.lien05 ul.flip li a.lv1Over{
background: #f14c46;
border-color: #f14c46;
}

#menu ul li.lien06 ul.flip{
position: absolute;
left: 740px;
border-top: 2px solid #9e44d3;
}
#menu ul li.lien06 ul.flip li a{
background-position: 0px -5px;
background-repeat: repeat-y;
background-image: url(bg_flip_niv2_body06.gif);
border-color: #9e44d3;
}
#menu ul li.lien06 ul.flip li a:hover,
#menu ul li.lien06 ul.flip li a.lv1Over{
background: #9e44d3;
border-color: #9e44d3;
}
/* ---  MENU FLIP FLAP NIVEAU 2 --- */
/*--- COMMUN ---*/
#menu ul li ul.flip li ul li a{
width: 170px;
height: auto;
margin: 0px 0px 0px 0px;
padding: 5px 0px 5px 18px;
background-image: none;
text-align: left;
}

#menu ul li ul.flip li ul li a{
background-image: none;
background-color: #ffffff; /*sinon fond transparent sous firefox*/
}
#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,
#menu ul li.lien05 ul.flip li ul,
#menu ul li.lien06 ul.flip li ul{
position: absolute;
left: 188px;
top: -18px;

}
#menu ul li ul.flip li ul li a:hover{
background-image: none;
color: #FFFFFF;
width: 170px;
}
/*--- PAR LIENS ---*/
#menu ul li.lien06 ul.flip li ul{
position: absolute;
left:-188px;
border-top: 2px solid #9e44d3;
}
/*--------------------------------------------------------------------------------------------------------------*/
/*--- LIENS ---*/
li.lien01, .Lien01, .lien01 {
color: #39A4DA;
}
li.lien02, .Lien02, .lien02 {
color: #79C167;
}
li.lien03, .Lien03, .lien03 {
color: #BBC830;
}
li.lien04, .Lien04, .lien04 {
color: #F3C10B;
}
li.lien05, .Lien05, .lien05 {
color:#F14C46;
}
li.lien06, .Lien06, .lien06 {
color: #9E44D3;
}
/*----------------------------------------------------------------------------------------------------------------*/
/*--- MENUEXTRANET ---*/
/*--- MENU DEROULANT ---*/
#menuExtranet ul li ul,
#menuExtranet ul.on li ul.on li ul,
#menuExtranet ul.on li ul.on li ul.on li ul,
#menuExtranet ul.on li ul.on li ul.on li ul.on li ul{
display:none;
}
#menuExtranet ul li.on ul,
#menuExtranetul.on li ul.on li.on ul,
#menuExtranet ul.on li ul.on li ul.on li.on ul,
#menuExtranet ul.on li ul.on li ul.on li ul.on li.on ul{
display: block;
position: relative;
}

#menuExtranet {
display: inline;
position: relative;
z-index: 10000;
float: left;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
width:175px;
}
#menuExtranet ul {
background: #CCCCCC;
}
#menuExtranet ul li{ /* -- supprime la hauteur des li pour IE --*/
display:inline;
}
#menuExtranet ul li a {
display: block;
padding: 2px 5px 2px 10px;
color: #272727;
}
#menuExtranet ul li.on a,
#menuExtranet ul li a.lv1Over,
#menuExtranet ul li a:hover {
display: block;
padding: 2px 5px 2px 15px;
color: #000000;
background-color: #EFEFEF;
}

#menuExtranet ul.on li ul {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
#menuExtranet ul.on li ul li{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

#menuExtranet ul.on li ul li a {
display: block;
color: #272727;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 25px;


}
#menuExtranet ul li ul li.on a,
#menuExtranet ul li ul li a.lv1Over,
#menuExtranet ul.on li ul li a:hover {
display: block;
color: #272727;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 30px;
background-color: #FFFFFF;
width: 145px;

}