@charset "iso-8859-1";
/* CSS Document */
/*regole per avere un menu di navigazione verticale  partendo da una lista*/
/*MenuVerticale.css   ultima modifica 26-03-2009  */

div.menuversotto {
width:167px;  /*larghezza di ogni voce del menu, porre uguale alla larghezza del pulsante come in width di div.menuversotto li riga26*/
height:67px; /*altezza di ogni voce del menu, porre uguale all'altezza del pulsante*/
line-height:67px;/*porre uguale al valore precedente height per dare la centratura verticale del testo nel pulsante rispetto al suo box contenitore*/
text-align:center;  /*da l'allineamento orizzontale del testo nel menu principale: se ci sono pulsanti grafici è meglio posizionarlo al centro del pulsante con text-align:center , se invece non voglio pulsanti ma rettangoli, è meglio text-align:left */
margin: 0 ;/*non cambiare*/
padding: 0;/*non cambiare*/
font-family:Verdana, Arial,Helvetica,sans-serif;/*scegliere a piacere*/
font-size:11px;/*scegliere a piacere*/
font-weight:600;/*scegliere a piacere*/
 
 /*a questo punto sarebbe bene poter inserire un bordo colorato che raccolga il menu per intero border: 1px solid black ma ie non gradisce la cosa, per ora si rinuncia*/
}
div.menuversotto ul {  
margin: 0;
padding: 0;
list-style-type: none;/*per eliminare il selettore nella lista*/
/*background: green; colore della striscia verticale del menu sotto i pulsanti, facoltativa*/
}
div.menuversotto li { /*definisce il modo di apparire delle voci principali del menu*/

margin: 0;  /* azzera i margini, non modificabile */
padding: 0;
background-color: green;/*colore dello sfondo dei singoli pulsanti */
margin-top: 2px;/*inserisce una piccola distanza rispetto al pulsante superiore, inserire a piacere*/
background-image:url("immaginiPulsanti/pulsante.gif"); /*se non si vuole il pulsante immagine ma solo il rettangolo impostare background-image:none */

/* i seguenti codici aggiungono un bordo  attorno ad ogni singolo pulsante, modificabile */
border-right: 1px solid black;  
border-bottom: 1px solid black;
border-right: 1px solid black; 
border-top: 1px solid black;
border-left: 1px solid black;/*fine bordo pulsante*/
}



div.menuversotto a { /* definisce gli stili per i link testuali*/
display: block;
padding: 0;
color: black;
text-decoration: none; /*toglie la sottolineatura sotto il link*/

/*padding-left:5px; da inserire se si è messo text-align:left dentro il div.menuversotto per staccare un poco il testo dal bordo sinistro del rettangolo di menu*/
margin: 0;  /* azzera i margini, non modificabile */ 
}

div.menuversotto a:hover { /* definisce il rollover al passaggio del mouse */ 
background-color: blue;/*colore dello sfondo al passaggio del mouse, impostare a piacere*/
color:white; /*colore del testo al passaggio, impostare a piacere*/
background-image:url("immaginiPulsanti/pulsanteOver.gif"); /* se non si vuole il pulsante ma il rettangolo impostare background-image:none*/
}