/* MENU CSS Document */ /****************************** *** MENU HORIZONTAL ******************************/ #menu-horizontal {width:970px;margin:0;padding:0;color:#000;font-size:12px;} /* NIVEAU 1 */ #menu-horizontal li {position:relative;float:left;padding:0;margin:0;background:none;} #menu-horizontal li a {width:242px;display:block;padding:90px 0 0 0;overflow:hidden;height:0px !important;} /* Mon maire et son équipe */ #menu-horizontal li.item7 a {background:url(../images/btn-menu-principal-maire.gif) left top no-repeat;} #menu-horizontal li.act7 a, #menu-horizontal li.item7 a:hover, #menu-horizontal li.item7selected a:hover {background:url(../images/btn-menu-principal-maire-hover.png) left top no-repeat;} #menu-horizontal li.item7selected a {background:url(../images/btn-menu-principal-maire-select.gif) left top no-repeat;} /* Découvrir ma ville */ #menu-horizontal li.item6 a {background:url(../images/btn-menu-principal-decouvrir.gif) left top no-repeat;} #menu-horizontal li.act6 a, #menu-horizontal li.item6 a:hover, #menu-horizontal li.item6selected a:hover {background:url(../images/btn-menu-principal-decouvrir-hover.png) left top no-repeat;} #menu-horizontal li.item6selected a {background:url(../images/btn-menu-principal-decouvrir-select.gif) left top no-repeat;} /* Des services à mon service */ #menu-horizontal li.item5 a {background:url(../images/btn-menu-principal-services.gif) left top no-repeat;} #menu-horizontal li.act5 a, #menu-horizontal li.item5 a:hover, #menu-horizontal li.item5selected a:hover {background:url(../images/btn-menu-principal-services-hover.png) left top no-repeat;} #menu-horizontal li.item5selected a {background:url(../images/btn-menu-principal-services-select.gif) left top no-repeat;} /* Les loisirs */ #menu-horizontal li.item23 a {background:url(../images/btn-menu-principal-loisirs.gif) left top no-repeat;} #menu-horizontal li.act23 a, #menu-horizontal li.item23 a:hover, #menu-horizontal li.item23selected a:hover {background:url(../images/btn-menu-principal-loisirs-hover.png) left top no-repeat;} #menu-horizontal li.item23selected a {background:url(../images/btn-menu-principal-loisirs-select.gif) left top no-repeat;} #menu-horizontal li.act7 a {background:url(../images/btn-menu-principal-maire-hover.png) left top no-repeat;} #menu-horizontal li.act6 a {background:url(../images/btn-menu-principal-decouvrir-hover.png) left top no-repeat;} #menu-horizontal li.act5 a {background:url(../images/btn-menu-principal-services-hover.png) left top no-repeat;} #menu-horizontal li.act23 a {background:url(../images/btn-menu-principal-loisirs-hover.png) left top no-repeat;} /* NIVEAU 2 */ #menu-horizontal li ul {position:absolute;top:90px;left:0;width:242px;margin:0;padding:0;} #menu-horizontal li ul li {float:none;display:inline;width:242px;margin:0;padding:0;border:none;} #menu-horizontal li ul li a, #menu-horizontal li ul li a:hover, #menu-horizontal li.act ul li a, #menu-horizontal li.act ul li a:hover, #menu-horizontal li ul li.bas a {display:block;width:217px;height:26px;padding:5px 0 21px 25px;color:#FFF;font-size:13px;font-weight:bold;text-transform:none;line-height:13px;border:none;} #menu-horizontal li.item7 ul li a, #menu-horizontal li.item7selected ul li a {background:url(../images/bg-btn-menu-principal-maire.png) left top no-repeat;} #menu-horizontal li.item6 ul li a, #menu-horizontal li.item6selected ul li a {background:url(../images/bg-btn-menu-principal-decouvrir.png) left top no-repeat;} #menu-horizontal li.item5 ul li a, #menu-horizontal li.item5selected ul li a {background:url(../images/bg-btn-menu-principal-services.png) left top no-repeat;color:#fff;} #menu-horizontal li.item23 ul li a, #menu-horizontal li.item23selected ul li a {background:url(../images/bg-btn-menu-principal-loisirs.png) left top no-repeat;} #menu-horizontal li.item7selected ul li.selected2 a, #menu-horizontal li.item7 ul li a:hover, #menu-horizontal li.item7selected ul li a:hover {background:url(../images/bg-btn-menu-principal-maire-select.png) left top no-repeat;color:#cd6f00;} #menu-horizontal li.item6selected ul li.selected2 a, #menu-horizontal li.item6 ul li a:hover, #menu-horizontal li.item6selected ul li a:hover {background:url(../images/bg-btn-menu-principal-decouvrir-select.png) left top no-repeat;color:#4e6e19;} #menu-horizontal li.item5selected ul li.selected2 a, #menu-horizontal li.item5 ul li a:hover, #menu-horizontal li.item5selected ul li a:hover {background:url(../images/bg-btn-menu-principal-services-select.png) left top no-repeat;color:#3e3e8d;} #menu-horizontal li.item23selected ul li.selected2 a, #menu-horizontal li.item23 ul li a:hover, #menu-horizontal li.item23selected ul li a:hover {background:url(../images/bg-btn-menu-principal-loisirs-select.png) left top no-repeat;color:#a92c6a;} #menu-horizontal li ul li.bas a {width:242px;height:35px;padding:0 0 35px 0;cursor:default;} #menu-horizontal li.item7 ul li.bas a, #menu-horizontal li.item7 ul li.bas a:hover, #menu-horizontal li.item7selected ul li.bas a, #menu-horizontal li.item7selected ul li.bas a:hover {background:url(../images/bg-menu-principal-maire-bas.png) left top no-repeat;} #menu-horizontal li.item6 ul li.bas a, #menu-horizontal li.item6 ul li.bas a:hover, #menu-horizontal li.item6selected ul li.bas a, #menu-horizontal li.item6selected ul li.bas a:hover {background:url(../images/bg-menu-principal-decouvrir-bas.png) left top no-repeat;} #menu-horizontal li.item5 ul li.bas a, #menu-horizontal li.item5 ul li.bas a:hover, #menu-horizontal li.item5selected ul li.bas a, #menu-horizontal li.item5selected ul li.bas a:hover {background:url(../images/bg-menu-principal-services-bas.png) left top no-repeat;} #menu-horizontal li.item23 ul li.bas a, #menu-horizontal li.item23 ul li.bas a:hover, #menu-horizontal li.item23selected ul li.bas a, #menu-horizontal li.item23selected ul li.bas a:hover {background:url(../images/bg-menu-principal-loisirs-bas.png) left top no-repeat;} /****************************** *** MENU VERTICAL ******************************/ #menu-vertical {width:210px;font-size:14px;list-style:none;} /* NIVEAU 1 */ #menu-vertical li {} #menu-vertical li.selected1 {margin:12px 0 7px 0;padding:0;background:url(../images/bg-menu-vertical-select.gif) right bottom no-repeat #efede5;} #menu-vertical li a {padding:3px 0 4px 13px;display:block;color:#000;text-decoration:none;background:url(../images/pointilles-beige.gif) repeat-x left bottom;} #menu-vertical li a:hover {color:#fff;background:url(../images/bg-btn-menu-vertical-hover.gif) left top repeat-x #000;} #menu-vertical li.selected1 a, #menu-vertical li.selected1 a:hover {color:#fff;background:url(../images/bg-btn-menu-vertical-select.gif) left top repeat-x #6b8725;border-bottom:1px solid #fff;font-weight:bold;} /* NIVEAU 2 */ #menu-vertical li.selected1 ul {padding:20px 0 17px 0;} #menu-vertical li.selected1 ul li {margin:0;padding:0;list-style-image:none;background:none;} #menu-vertical li.selected1 ul li a {padding:3px 0 4px 25px;display:block;font-weight:normal;color:#000;background:url(../images/pointilles-marron.gif) repeat-x left bottom;border:none;} #menu-vertical li.selected1 ul li a:hover {padding:3px 0 3px 25px;background:#d0dbaa;border-bottom:1px solid #f4f3ee;font-weight:normal;color:#000;} #menu-vertical li.selected1 ul li.selected2 a, #menu-vertical li.selected1 ul li.selected2 a:hover {padding:3px 0 3px 25px;background:url(../images/picto-fleche07.gif) left top no-repeat #d0dbaa;border-bottom:1px solid #f4f3ee;color:#000;font-weight:bold;} /* NIVEAU 3 */ #menu-vertical li.selected1 ul ul {padding:5px 0 5px 17px;} #menu-vertical li.selected1 ul ul li {padding:0;margin:0;font-size:12px;background:none;} #menu-vertical li.selected1 ul li.selected2 li a {padding:2px 0 3px 9px;font-weight:normal;color:#92918c;border:none;background:none;} #menu-vertical li.selected1 ul li.selected2 li a:hover {padding:2px 0 3px 9px;background:url(../images/picto-fleche08.gif) left 6px no-repeat;font-weight:normal;border:none;} #menu-vertical li.selected1 ul ul li.selected3 a, #menu-vertical li.selected1 ul ul li.selected3 a:hover {font-weight:bold;font-size:12px;color:#000;background:url(../images/picto-fleche08.gif) left 6px no-repeat;} /* NIVEAU 4 */ #menu-vertical li.selected1 ul ul ul {padding:5px 0 5px 17px;} #menu-vertical li.selected1 ul ul ul li {padding:0;margin:0;font-size:12px;background:none;} #menu-vertical li.selected1 ul li.selected2 li.selected3 li a {padding:2px 0 3px 9px;font-weight:normal;color:#92918c;border:none;background:none;} #menu-vertical li.selected1 ul li.selected2 li.selected3 li a:hover {padding:2px 0 3px 9px;background:url(../images/picto-fleche08.gif) left 6px no-repeat;font-weight:normal;border:none;} #menu-vertical li.selected1 ul ul ul li.selected4 a, #menu-vertical li.selected1 ul ul ul li.selected4 a:hover {font-weight:normal;font-size:12px;color:#000;background:url(../images/picto-fleche08.gif) left 6px no-repeat;} /* BOUTON DECONNEXION PRESSE */ #menu-vertical #formulaire-deconnexion {margin:35px 0 0 0;} #menu-vertical #formulaire-deconnexion li {background:url(../images/picto-deconnexion.gif) no-repeat 10px 4px;} #menu-vertical #formulaire-deconnexion li a {padding:3px 0 4px 30px;font-weight:bold;width:180px;} #menu-vertical #formulaire-deconnexion li a:hover {color:#fff;background:url(../images/bg-deconnexion.gif) left top no-repeat #1a1a1a;} /****************************** *** MENU DE GAUCHE - PIED DE PAGE ******************************/ #menu-bas-gauche {width:449px;float:left;height:49px;padding:20px 0 0 0;background:url(../images/pointilles-beige-vertical.gif) top right repeat-y;} /* NIVEAU 1 */ #menu-bas-gauche li {display:inline-block;float:left;list-style:none;width:121px;padding:0 0 0 24px;} #menu-bas-gauche li a {padding:0 0 0 10px;background:url(../images/picto-fleche04.gif) left 3px no-repeat;line-height:14px;text-decoration:none;font-size:10px;color:#cbc7b9;text-transform:uppercase;} #menu-bas-gauche li a:hover, #menu-bas-gauche li.selected a, #menu-bas-gauche li.selected a:hover {color:#69675e;background:url(../images/picto-fleche02.gif) left 3px no-repeat;} /****************************** *** MENU DE DROITE - LA VALETTE PRATIQUE ******************************/ #colonne-droite #la-valette-pratique {margin:25px 0 0 0;background:url(../images/bg-la-valette-pratique.gif) left 28px repeat-x #fff;} #colonne-droite #la-valette-pratique ul {padding:10px 0 10px 25px;} #colonne-droite #la-valette-pratique li {padding:5px 0;background:url(../images/pointilles-beige.gif) left bottom repeat-x;} #colonne-droite #la-valette-pratique li a {width:160px;display:block;padding:0 0 0 22px;color:#92918c;font-size:13px;font-weight:bold;text-decoration:none;} #colonne-droite #la-valette-pratique li a:hover {color:#000;} #colonne-droite #la-valette-pratique li.item155 a {background:url(../images/picto-annuaire.gif) left top no-repeat;} #colonne-droite #la-valette-pratique li.item156 a {background:url(../images/picto-plan-interactif.gif) left top no-repeat;} #colonne-droite #la-valette-pratique li.item157 a {background:url(../images/picto-flash-travaux.gif) left top no-repeat;} #colonne-droite #la-valette-pratique li.item158 a {background:url(../images/picto-formalites.gif) left top no-repeat;} #colonne-droite #la-valette-pratique li.item159 a {background:url(../images/picto-mediatheque.gif) left top no-repeat;} #colonne-droite #la-valette-pratique li.item160 a {background:url(../images/picto-jeunesse.gif) left top no-repeat;} #colonne-droite #la-valette-pratique li.item161 a {background:url(../images/picto-action-sociale.gif) left top no-repeat;} #colonne-droite #la-valette-pratique li.item195 a {background:url(../images/picto-foyer.gif) left top no-repeat;} #colonne-droite #la-valette-pratique li.item162 a {background:url(../images/picto-environnement.gif) left top no-repeat;} /****************************** *** CONFIG ACCESSIBILITE DES MENUS ******************************/ .hidden {position: absolute;left: -10000em;width: 20em;} .dfn {position: absolute;left: -10000em;width: 20em;}