#menuHaut {
display: inline;
position: relative;
z-index: 100;
background: #D9D7Da url(bgSousMenu.gif) repeat-x left  bottom;
float: left;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 7px;
width: 222px;
}
#menuHaut ul li ul,
#menuHaut ul.on li ul.on li ul,
#menuHaut ul.on li ul.on li ul.on li ul,
#menuHaut ul.on li ul.on li ul.on li ul.on li ul{
display:none;
}
#menuHaut ul li.on ul,
#menuHaut ul.on li ul.on li.on ul,
#menuHaut ul.on li ul.on li ul.on li.on ul,
#menuHaut ul.on li ul.on li ul.on li ul.on li.on ul{
display: block;
position: relative;
}
#backgroundMenu{
font-size: 100%;
margin: 0px 0px 0px 0px;
background: url(bgMenu.gif) repeat-y left top;
float: left;
width: 100%;
}
body.bodygenerique #backgroundMenu,
body.accueil #backgroundMenu{
background-image: none;
}
#menuHaut ul li{ 
display:inline;
}
#menuHaut ul li a:hover,
#menuHaut ul li a.on,
#menuHaut ul li a.lv1Over {
display: block;
background-position: left bottom;
}
#menuHaut ul li a {
position: absolute;
top: -132px;
right: 0px;
background-repeat: no-repeat;
background-position: left top;
width: 167px;
height: 42px;
}
body.accueil #menuHaut ul li a{
top: -95px;
}
#menu_haut_actualite a {
left: 279px;
background: url(menuVerticalActualite.png) no-repeat left top;
}
#menu_haut_actualite a:hover {
background: url(menuVerticalActualite.png) no-repeat left bottom;
}
#menu_haut_vie_quotidienne a{
left: 447px;
background: url(menuVerticalVieQuotidienne.png) no-repeat left top;
}
#menu_haut_vie_quotidienne a:hover{
background: url(menuVerticalVieQuotidienne.png) no-repeat left bottom;
}
#menu_haut_democratie a{
left: 616px;
background: url(menuVerticalDemocratie.png) no-repeat left top;
}
#menu_haut_democratie a:hover{
background: url(menuVerticalDemocratie.png) no-repeat left bottom;
}
#menu_haut_la_ville a{
left: 785px;
background: url(menuVerticalLaVille.png) no-repeat left top;
}
#menu_haut_la_ville a:hover{
background: url(menuVerticalLaVille.png) no-repeat left bottom;
}
#menuHaut ul li a span{
position: absolute;
top: -5000px;
}
#menuHaut ul ul li a span{
position: relative;
top: 0px;
}
#menuHaut ul li ul {
margin: 0px 0px 10px 0px;
padding: 0px 0px 155px 0px;
}
#menuHaut ul li.menu_haut_1 ul li a{
position: relative;
top: 0px; 
left: 0px;
width: 190px;
height: auto;
font-size: 100%;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
text-decoration: none;
}
#menuHaut ul li.menu_haut_1 ul li a:hover,
#menuHaut ul li.menu_haut_1 ul li a.on,
#menuHaut ul li.menu_haut_1 ul li.on a{
color: #996600;
}
#menuHaut ul li.menu_haut_1 ul ul li a:hover,
#menuHaut ul li.menu_haut_1 ul ul li.on a{
color: #333333;
}
#menuHaut .lire_article{
display: none;
}
#menuHaut ul ul ul{
padding: 0px 0px 0px 0px;
margin: 0px 0px 5px 0px;
}
#menuHaut ul li.menu_haut_1 ul ul li a,
#menuHaut ul li.menu_haut_1 ul ul.on li a{
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
}
#menuHaut ul li.menu_haut_1 ul ul li a:hover,
#menuHaut ul li.menu_haut_1 ul ul li.on a{
}
#menuHaut ul ul ul ul{
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 10px;
}
#menuHaut ul ul ul ul{
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
}
#menuHaut ul li.menu_haut_1 ul ul ul.on li a{
background: #FFFFFF url() no-repeat 0px 0px;
}
#menuHaut ul li.menu_haut_1 ul ul ul li a.on,
#menuHaut ul li.menu_haut_1 ul ul ul li a:hover{
background: url() no-repeat 0px 0px;
color: #333333;
}
body.accueil #menuHaut ul li ul.flip{
top: -53px;
left: 290px;
}
#menuHaut ul li ul.flip{
width: 648px;
border-top: #F7F7F7 1px solid;
background: url(bgMenuFlipFlap.png) no-repeat left bottom;
padding: 10px 3px 15px 3px;
margin: 0px 0px 0px 0px;
position: absolute;
top: -90px;
left: 290px;
display: block;
z-index: 10000;
}
body #menuHaut ul li ul.flip li{
display: block; 
position:relative;
top: 0px; 
left: 0px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
 
#menuHaut ul li ul.flip li a{
display: block;
height: auto;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
background-image: none;
text-align: left;
}
#menuHaut ul li ul.flip li a:hover{
background-image: none;
color: #FFFFFF;
}
#menuHaut ul li ul.flip li ul li a{
background-image: none;
}
#menuHaut ul li.menu_haut_1 ul.flip li ul{
display: block;
}
body #menuHaut ul li ul.flip li .remonte_article{
padding: 2px 0px 2px 2px;
margin: 0px 2px 4px 4px;
color: #333333;
} 
#menuHaut ul li ul.flip li .remonte_article:hover,
#menuHaut ul li ul.flip li .remonte_article:hover a{
color: #FFFFFF;
}
body #menuHaut ul li#menu_haut_actualite ul.flip li #actus_actualite,
body #menuHaut ul li#menu_haut_vie_quotidienne ul.flip li #actus_vie_quotidienne ,
body #menuHaut ul li#menu_haut_democratie ul.flip li #actus_democratie,
body #menuHaut ul li#menu_haut_la_ville ul.flip li #actus_la_ville{
position: relative;
top: 0px;
left: 0px;
float: left;
width: 372px;
}
body #menuHaut ul li#menu_haut_actualite ul.flip li .remonte_article{
position: relative;
top: 0px;
left: 0px;
float: left;
height: 84px;
overflow: hidden;
width: 368px;
background:  url(bgArticleActu.jpg) no-repeat -5000px  -5000px; 
}
body #menuHaut ul li#menu_haut_actualite ul.flip li .remonte_article:hover{
background: #06A9A3 url(bgArticleActu.jpg) no-repeat left top;
}
body #menuHaut ul li#menu_haut_vie_quotidienne ul.flip li .remonte_article{
background: url(bgArticleVie.jpg)  no-repeat -5000px  -5000px; 
position: relative;
top: 0px;
left: 0px;
float: left;
height: 84px;
overflow: hidden;
width: 368px;
}
body #menuHaut ul li#menu_haut_vie_quotidienne ul.flip li .remonte_article:hover{
background: #2D8AC1 url(bgArticleVie.jpg) no-repeat left top;
}
body #menuHaut ul li#menu_haut_la_ville ul.flip li .remonte_article{
background: url(bgArticleVille.jpg) no-repeat -5000px -5000px; 
position: relative;
top: 0px;
left: 0px;
float: left;
height: 84px;
overflow: hidden;
width: 368px;
}
body #menuHaut ul li#menu_haut_la_ville ul.flip li .remonte_article:hover{
background: #74C82D url(bgArticleVille.jpg) no-repeat left top;
}
body #menuHaut ul li#menu_haut_democratie ul.flip li  .remonte_article{
background: url(bgArticleDemo.jpg) no-repeat -5000px -5000px; 
position: relative;
top: 0px;
left: 0px;
float: left;
height: 84px;
overflow: hidden;
width: 368px;
}
body #menuHaut ul li#menu_haut_democratie ul.flip li  .remonte_article:hover{
background: #F26724 url(bgArticleDemo.jpg) no-repeat left top;
}
#menuHaut ul li ul.flip div.image_16_9_article,
#menuHaut ul li ul.flip div img{
width: 150px;
height: 84px;
float: left;
}
#menuHaut ul li ul.flip .description_article{
font-size: x-small;
}
#menuHaut ul li ul.flip .titre_article,
#menuHaut ul li ul.flip .description_article,
#menuHaut ul li ul.flip .lire_article{
width: 200px;
float: right;
margin: 0px 0px 0px 5px;
font-size: x-small;
}
#menuHaut ul li ul.flip .titre_article a{
color: #000000;
text-transform: none;
font-weight: bold;
font-size: 110%;
}
#menuHaut ul li ul.flip #menu_content_haut_1,
#menuHaut ul li ul.flip #menu_content_haut_2,
#menuHaut ul li ul.flip #menu_content_haut_3,
#menuHaut ul li ul.flip #menu_content_haut_4 {
position: relative;
top: 0px;
left: 0px;
float: right;
width: 250px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
#menuHaut ul li ul.flip #menu_content_haut_1 ul,
#menuHaut ul li ul.flip #menu_content_haut_2 ul,
#menuHaut ul li ul.flip #menu_content_haut_3 ul,
#menuHaut ul li ul.flip #menu_content_haut_4 ul {
position: relative;
width: 250px;
top: 0px;
left: 0px;
padding: 0px 0px 0px 0px;
}
#menuHaut ul li ul.flip ul li a {
width: 230px;
padding: 0px 5px 5px 13px;
background-position: left 4px;
background-repeat : no-repeat;
font-weight: bold;
font-size: 110%;
}
#menuHaut ul li ul.flip ul li a:hover{
background-position: 2px 4px;
color: #666666;
}
#menuHaut ul li ul.flip #menu_content_haut_1 ul li a {
background-image: url(puceArticleActu.gif);
}
#menu_haut_democratie #menu_content_haut_2 ul li a{
background-image: url(puceArticleDemo.gif);
}
#menu_haut_la_ville #menu_content_haut_3 ul li a{
background-image:url(puceArticleVille.gif);
}
#menu_haut_vie_quotidienne #menu_content_haut_4 ul li a{
background-image: url(puceArticleVie.gif);
}
/*--------------------------------------------------------------------------------------------------------------*/
/*--- MENU GAUCHE ---*/ 
body.accueil #menuGauche,
body.bodygenerique #menuGauche{
display: none;
}
#menuGauche ul li ul,
#menuGauche ul.on li ul.on li ul,
#menuGauche ul.on li ul.on li ul.on li ul,
#menuGauche ul.on li ul.on li ul.on li ul.on li ul{
display:none;
}
#menuGauche ul li.on ul,
#menuGauche ul.on li ul.on li.on ul,
#menuGauche ul.on li ul.on li ul.on li.on ul,
#menuGauche ul.on li ul.on li ul.on li ul.on li.on ul{
display: block;
position: relative;
}
body.accueil #menuGauche{
padding: 0px 0px 0px 0px;
}
#menuGauche {
float: left;
width: 222px;
margin: 0px 0px 0px 7px;
display: inline;
background: #d9d7da url(bgSousMenu.jpg) repeat-x left bottom;
padding: 0px 0px 170px 0px;
}
#menuGauche ul li{
float: left;
}
#menuGauche ul li a {
color: #352b37;
text-decoration: none;
padding: 5px 5px 2px 5px;
margin: 0px 0px 0px 2px;
float: left;
width: 208px;
}
#menuGauche ul li.menu_gauche_1 a { 
color: #352b37;
text-decoration: none;
padding: 5px 5px 0px 5px;
margin: 0px 0px 2px 0px;
width: 212px;
}
#menuGauche ul li.menu_gauche_1 a,
#menuGauche ul li.menu_gauche_1 a:hover{
text-align: center;
font-size: large;
color: #FFFFFF;
text-transform: uppercase;
background-repeat: no-repeat;
background-position: left top;
float: left;
}
#menu_gauche_la_ville  li.menu_gauche_1 a,
#menu_gauche_la_ville  li.menu_gauche_1 a:hover{
background-image: url(bgEnteteVille.gif) ;
}
#menu_gauche_democratie li.menu_gauche_1 a,
#menu_gauche_democratie li.menu_gauche_1 a:hover{
background-image: url(bgEnteteDemocratie.gif) ;
}
#menu_gauche_vie_quotidienne li.menu_gauche_1 a,
#menu_gauche_vie_quotidienne li.menu_gauche_1 a:hover{
background-image: url(bgEnteteQuotidienne.gif) ;
}
#menu_gauche_actualite li.menu_gauche_1 a,
#menu_gauche_actualite li.menu_gauche_1 a:hover{
background-image: url(bgEnteteActualite.gif);
}
#menuGauche ul ul li a{
border-left: #2D8AC1 1px solid; 
margin-left: 11px;
width: 198px;
color: #2D8AC1;
}
#menuGauche ul ul ul li a{
padding-left: 20px;
width: 185px;
border-left: #2D8AC1 1px solid; 
}
#menuGauche ul li a:hover,
#menuGauche ul li a.on{
background: #2D8AC1;
color: #FFFFFF
}
#menuGauche ul ul li a{
background: #D9D7DA;
color: #352b37;
}
#menuGauche ul ul ul li.on a.on,
#menuGauche ul ul ul li a:hover{
background: #D9D7DA;
color: #2D8AC1;
}
/*--------------------------------------------------------------------------------------------------------------*/
/*--- MENU FOOTER ---*/
.titre{
color: #FFFFFF;
font-size: medium;
text-transform: uppercase;
}
#menuBas ul,
#outilsFooter ul,
#vosDemarches ul{
width: 140px;
float: left;
margin: 0px 7px 0px 0px;
}
#outilsFooter ul{
margin: 0px 0px 0px 0px;
}
#menuBas ul li,
#outilsFooter ul li,
#vosDemarches ul li{
color: #FFFFFF;
font-size: medium;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
float: left;
width: 100%;
}
#menuBas ul li span,
#outilsFooter ul li span,
#vosDemarches ul li span{
display: block;
margin-bottom: 10px;
background-position: left 2px;
background-repeat: no-repeat;
padding: 0px 0px 0px 20px;
}
#menuBas ul li#menu_bas_democratie span{
background-image: url(bgMenuFooterOrange.gif);
}
#menuBas ul li#menu_bas_la_ville span{
background-image: url(bgMenuFooterVert.gif);
}
#menuBas ul li#menu_bas_vie_quotidienne span{
background-image: url(bgMenuFooterBleu.gif);
}
#outilsFooter ul li span,
#vosDemarches ul li span{
background-image: url(bgMenuFooterGris.gif);
}
#menuBas ul ul,
#outilsFooter ul ul,
#vosDemarches ul ul{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
float: none;
}
#outilsFooter ul li li,
#menuBas ul li li,
#vosDemarches ul li li{
color: #352B37;
font-size: x-small;
background-image: none;
float: left;
padding: 0px;
margin: 0px;
}
#outilsFooter ul li li a,
#menuBas ul li li a,
#vosDemarches ul li li a{
float: left;
padding: 0px;
margin: 0px;
}
/*--------------------------------------------------------------------------------------------------------------*/
/*--- MENU HORIZONTAL---*/
body.accueilHorizontal #menu {
position: absolute;
top: -5000px;
left: -5000px;
}
#menuSlide {
margin: 24px 0px 0px 0px;
height: 75px;
position: fixed;
z-index: 9999;
float: left;
top: 450px;
left: 5px;
width: 960px;
background: url(bgMenuSlide.gif) no-repeat left bottom;
}
#menuSlide ul li{
float: left;
background-image: none;
padding: 0px 0px 0px 0px;
}
#menuSlide ul li a{
float: left;
display: block;
padding: 0px 0px 0px 0px;
height: 48px;
text-transform: uppercase;
font-weight: bold;
font-size: 105%;
text-decoration: none;
position: absolute;
top: 0px;
text-align: center;
}
#menuSlide li.uneMH a{
left: 50px;
color: #06A9A3;
top: 55px;
padding-right: 30px;
height: 20px;
line-height: 20px;
}
#menuSlide ul li.aLaUneMH a{
left: 130px;
color: #06A9A3;
}
#menuSlide ul li.actusMH a{
left: 170px;
color: #06A9A3;
top: 55px;
padding-left: 30px;
height: 20px;
line-height: 20px;
}
#menuSlide li.pratiqueMH a{
color: #FFFFFF;
left: 675px;
}
#menuSlide li.vieMH a{
color: #2D8AC1;
left: 240px;
}
#menuSlide li.democratieMH a{
color: #F26724;
left: 390px;
}
#menuSlide li.villeMH a{
color: #74C82D;
left: 540px;
}
#menuSlide ul li.retrouverMH a{
top: -16px;
color: #FFFFFF;
left: 785px;
height: 60px;
}
#menuSlide ul li.retourMH a{
width: 25px;
right: 0;
text-transform: none;
font-weight: normal;
font-size: x-small;
color: #FFFFFF;
padding-top: 55px;
height: 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;
}
