/*--- LEFT ---*/
body.bodygenerique #left{
background-image: none;
}
/*---------------------- IMAGE DU HAUT DU MENU GAUCHE DECLINE -------------------*/
body.body01 #left{
background-image: url(bg_arrondi_menu_body01.gif);
background-repeat: no-repeat;
background-position: top left;
float: left;
width: 176px;
padding: 0px 0px 0px 0px;
}
body.body02 #left{
background-image: url(bg_arrondi_menu_body02.gif);
background-repeat: no-repeat;
background-position: top left;
float: left;
width: 176px;
padding: 0px 0px 0px 0px;
}
body.body03 #left{
background-image: url(bg_arrondi_menu_body03.gif);
background-repeat: no-repeat;
background-position: top left;
float: left;
width: 176px;
padding: 0px 0px 0px 0px;
}
body.body04 #left{
background-image: url(bg_arrondi_menu_body04.gif);
background-repeat: no-repeat;
background-position: top left;
float: left;
width: 176px;
padding: 0px 0px 0px 0px;
}
body.body05 #left{
background-image: url(bg_arrondi_menu_body05.gif);
background-repeat: no-repeat;
background-position: top left;
float: left;
width: 176px;
padding: 0px 0px 0px 0px;
}
body.bodyaccueil #left {
height: 0px;
width: 0px;
padding: 0px;
}

/*--------------------------------------------------------------------------------------------------------------*/
/*--- MENU ---*/
#menu {
display: inline;
position: relative;
z-index: 100;
float: left;
padding: 50px 0px 0px 0px;
margin: 0px 0px 0px 0px;
width: 176px;
min-height:50px;
height:auto !important;
height:50px;
}

body.bodyaccueil #menu{
min-height:0px;
height:auto !important;
height:0px;
padding: 0px;
}
#menu ul li{ /* -- supprime la hauteur des li pour IE quand elles sont vides--*/
display:inline;
}
/*
#menu ul li a:hover,
#menu ul li a.on,
#menu ul li a.lv1Over {
display: block;
}
*/
#menu ul ul li a{
float: left;
}
#menu ul li a:hover,
#menu ul li a.on,
#menu ul li a.lv1Over {/*lv1Over permet de garder le hover sur les parents*/
display: block;
}
#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;
}
/*--------------POSITIONNEMENT DU MENU HORIZONTAL-----------------*/
#menu ul li a {
position: absolute; 
top: -60px;
height: 35px;
display: block;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
background-repeat: no-repeat;
background-position:center top;
border-bottom: #CCCCCC 1px dotted;
}
#menu ul li a:hover,
#menu ul li a.lv1Over{
background-repeat: no-repeat;
background-position:center bottom;
}
#menu ul li.lien01 a {
width: 165px;
left: 143px;
background-image: url(menu_vie_municipale.gif);
}
#menu ul li.lien01 a:hover{
background-image: url(menu_vie_municipale.gif);
}
#menu ul li.lien02 a {
left: 308px;
width: 172px;
background-image: url(menu_decouvrir_ave.gif);
}
#menu ul li.lien02 a:hover{
background-image: url(menu_decouvrir_ave.gif);
}
#menu ul li.lien03 a {
left: 480px;
width: 170px;
background-image: url(menu_st_ave_pratique.gif);
}
#menu ul li.lien03 a:hover{
background-image: url(menu_st_ave_pratique.gif);
}
#menu ul li.lien04 a {
left: 650px;
width: 150px;
background-image: url(menu_loisirs_culture.gif);
}
#menu ul li.lien04 a:hover{
background-image: url(menu_loisirs_culture.gif);
}
#menu ul li.lien05 a {
left: 800px;
width: 155px;
background-image: url(menu_economie.gif);
}
#menu ul li.lien05 a:hover{
background-image: url(menu_economie.gif);
}
/*---  ouvre et ferme le 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: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
#menu ul li ul li a{
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,
#menu ul li.lien05 ul li a,
#menu ul li.lien06 ul li a{
width: 154px;
position: relative;
top: 0px; 
left: 0px;
height: auto; /*contrari le height:20px du li a au dessus */
font-size: 100%;
background: url(puce_menu_niveau2_body01.gif);
background-repeat: no-repeat;
background-position: 1px -10px;
padding: 5px 0px 5px 20px;
margin: 0px 0px 0px 0px;
text-decoration: none;
text-align: left;
color: #727272;
font-weight: bold;
}
#menu ul li.lien01 ul li a:hover,
#menu ul li.lien01 ul li a.on, /*  verifier l'utilité */
#menu ul li.lien01 ul li.on a{
background: url(puce_menu_niveau2_body01.gif);
background-repeat: repeat-y;
background-position: 1px -150px;
text-align: left;
}
#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(puce_menu_niveau2_body02.gif);
background-repeat: repeat-y;
background-position: 1px -150px;
text-align: left;
}
#menu ul li.lien03 ul li a:hover,
#menu ul li.lien03 ul li a.on,
#menu ul li.lien03 ul li.on a,
#menu ul li.lien04 ul li a:hover,
#menu ul li.lien04 ul li a.on,
#menu ul li.lien04 ul li.on a,
#menu ul li.lien05 ul li a:hover,
#menu ul li.lien05 ul li a.on,
#menu ul li.lien05 ul li.on a,
#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() no-repeat 0px 0px;
}
#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 li.lien05 ul ul li a:hover,
#menu ul li.lien05 ul ul li.on a,
#menu ul li.lien06 ul ul li a:hover,
#menu ul li.lien06 ul ul li.on a{
color: #333333;
}
/* --- SOUS MENU  --- */
#menu ul ul ul{
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
background-image: none;
}
#menu ul li.lien01 ul ul li a,
#menu ul li.lien01 ul ul.on li a{
background: url(puce_menu_niveau3_body01.gif);
background-repeat: repeat-y;
background-position: 1px -10px;
padding: 0px 0px 0px 25px;
}
#menu ul li.lien02 ul ul li a,
#menu ul li.lien02 ul ul.on li a{
background: url(puce_menu_niveau3_body02.gif);
background-repeat: repeat-y;
background-position: 1px -10px;
}
#menu ul li.lien03 ul ul li a,
#menu ul li.lien03 ul ul.on li a{
background: url(puce_menu_niveau3_body03.gif);
background-repeat: repeat-y;
background-position: 1px -10px;
}
#menu ul li.lien04 ul ul li a,
#menu ul li.lien04 ul ul.on li a{
background: url(puce_menu_niveau3_body04.gif);
background-repeat: repeat-y;
background-position: 1px -10px;
}
#menu ul li.lien05 ul ul li a,
#menu ul li.lien05 ul ul.on li a{
background: url(puce_menu_niveau3_body05.gif);
background-repeat: repeat-y;
background-position: 1px -10px;
}
#menu ul li.lien01 ul ul li a:hover,
#menu ul li.lien01 ul ul li.on a{
background: url(puce_menu_niveau3_body01.gif);
background-repeat: repeat-y;
background-position: 1px -116px;
}
#menu ul li.lien02 ul ul li a:hover,
#menu ul li.lien02 ul ul li.on a{
background: url(puce_menu_niveau3_body02.gif);
background-repeat: repeat-y;
background-position: 1px -116px;
}
#menu ul li.lien03 ul ul li a:hover,
#menu ul li.lien03 ul ul li.on a{
background: url(puce_menu_niveau3_body03.gif);
background-repeat: repeat-y;
background-position: 1px -116px;
}
#menu ul li.lien04 ul ul li a:hover,
#menu ul li.lien04 ul ul li.on a{
background: url(puce_menu_niveau3_body04.gif);
background-repeat: repeat-y;
background-position: 1px -116px;
}
#menu ul li.lien05 ul ul li a:hover,
#menu ul li.lien05 ul ul li.on a{
background: url(puce_menu_niveau3_body05.gif);
background-repeat: repeat-y;
background-position: 1px -116px;
}
/*------------------NIVEAU 4 ------------------------*/
#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,
#menu ul li.lien05 ul ul ul.on li a{
background:  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;
}
#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;
}
#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;
}
#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;
}
#menu ul li.lien05 ul ul ul li a.on,
#menu ul li.lien05 ul ul ul li a:hover{
background: url() no-repeat 0px 0px;
}
/* --- SOUS MENU FLIP FLAP  --- */
#menu ul li ul.flip{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
position: absolute;
top: -37px;
display: block;
z-index: 10000;
background-image: none;
background-color: #FFFFFF;
border-width: 1px;
border-style: solid;
}
#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;
}
#menu ul li ul.flip li a{
display: block;
width: 226px;
height: auto;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 21px;
background-image: none;
text-align: left;
float: none;
}
#menu ul li ul.flip li a.lv1Over,
#menu ul li ul.flip li a:hover{
color: #ffffff;
}
/* --- SOUS MENU FLIP FLAP PAR LIEN --- */

#menu ul li ul.flip{
position: absolute;
top: -26px;
}
#menu ul li.lien01 ul.flip{
position: absolute;
left:143px;
border-color: #FF9900;
}
#menu ul li.lien01 ul.flip li a{
background-image: url(flip_puce01_orange.gif);
background-position: 0px -5px;
}
#menu ul li.lien01 ul.flip li a:hover,
#menu ul li.lien01 ul.flip li a.lv1Over{
background: #FF9900;
background-image: url(flip_puce01_orange.gif);
background-repeat: no-repeat;
background-position: 0px -104px;
}
#menu ul li.lien02 ul.flip{
position: absolute;
left: 308px;
border-color: #97B314;
}
#menu ul li.lien02 ul.flip li a{
background-image: url(flip_puce01_vert.gif);
background-position: 0px -5px;
}
#menu ul li.lien02 ul.flip li a:hover,
#menu ul li.lien02 ul.flip li a.lv1Over{
background: #97B314;
background-image: url(flip_puce01_vert.gif);
background-repeat: no-repeat;
background-position: 0px -104px;
}
#menu ul li.lien03 ul.flip{
position: absolute;
left: 502px;
border-color: #0099CC;
}
#menu ul li.lien03 ul.flip li a{
background-image: url(flip_puce01_bleue.gif);
background-position: 0px -5px;
}
#menu ul li.lien03 ul.flip li a:hover,
#menu ul li.lien03 ul.flip li a.lv1Over{
background: #0099CC;
background-image: url(flip_puce01_bleue.gif);
background-repeat: no-repeat;
background-position: 0px -104px;
}
#menu ul li.lien04 ul.flip{
position: absolute;
left: 683px;
border-color: #B215A2;
}
#menu ul li.lien04 ul.flip li a{
background-image: url(flip_puce01_violet.gif);
background-position: 0px -5px;
}
#menu ul li.lien04 ul.flip li a:hover,
#menu ul li.lien04 ul.flip li a.lv1Over{
background: #B215A2;
background-image: url(flip_puce01_violet.gif);
background-repeat: no-repeat;
background-position: 0px -104px;
}
#menu ul li.lien05 ul.flip{
position: absolute;
left: 683px;
border-color: #CD071E;
}
#menu ul li.lien05 ul.flip li a{
background-image: url(flip_puce01_rouge.gif);
background-position: 0px -5px;
}
#menu ul li.lien05 ul.flip li a:hover,
#menu ul li.lien05 ul.flip li a.lv1Over{
background: #CD071E;
background-image: url(flip_puce01_rouge.gif);
background-repeat: no-repeat;
background-position: 0px -104px;
}
#menu ul li ul.flip li ul li a:hover{
color: #ffffff;
}

/* pour le troisieme niveau */
#menu ul li ul.flip li ul li a{
background-image: none;
}
/*positionne le 3eme niveau*/
#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: 247px;
top: -2px;
display: none; /* bride au 1er niveau */
}