#menu-laterale {  
  width:120px;  
  background: #0033CC; 
  color: #FFF; 
  font: normal bold 10px Arial;
; clip:  rect(   );
  text-align: center;
} /* solo come ausilio per mostrare i menu */

/** MENU 1 **/
ul.menu1 { 
	list-style: none; /* elimino i punti elenco */
	margin:0; padding:0; /* elimino i rientri delle liste - padding:0 per Gecko */
	text-align: right;
}
ul.menu1 li { 
	border-top:1px solid #FFF; /* effetto bottone - gioco con i colori */
	border-bottom: 1px solid #000; /* effetto bottone - gioco con i colori */
	line-height: 1.20em; /* imposto il line-height 
													per avere un bottone grande come i font 
													più un margine - verticale - pari al 20% */
	background: #CCC; 													
}
ul.menu1 li a { 
	display: block; /* il link occuperà tutta lo spzio orizzontale.
										 Con Gecko -- Moz. NN. -- tutto lo spazio orizzontale
										 è clickabile */
	text-decoration: none; /* elimino la sottolineatura al link,
														è evidente che si tratta di un link */
	border-right: 10px solid; /* imposto dimensione e stile del bordo su cui voglio intevenire */
	padding-right: 10px; /* più leggibile */
	font-weight: bold;
}
ul.menu1 li a:link, ul.menu1 li a:visited { 
	border-color: #009; /* imposto il colore del bordo del link inattivo */
	color: #009;
}
ul.menu1 li a:hover, ul.menu1 li a:active { 
	border-color: #C00; /* effetto roll-hover modificando il colore del bordo del link */
	background: #999; /* effetto roll-hover modificando anche il colore di sfondo del link */
	color: #C00; /* effetto roll-hover modificando anche il colore del link */
}

/** MENU 2 **/
ul.menu2 { 
	list-style: none; /* elimino i punti elenco */
	margin:0; padding:0; /* elimino i rientri delle liste - padding:0 per Gecko */
	text-align: center;
}
ul.menu2 li { 										 
	line-height: 1.20em; /* imposto il line-height 
													per avere un bottone grande come i font 
													più un margine - verticale - pari al 20% */
	border-bottom: 1px solid #FFF; /* evita un errore di interpretazione di IE -- sempre lui! -- */
	margin-top:-1px; /* elimina il margine creato dalla precente regola */
	background: #999;
}
ul.menu2 li a { 
	display: block; /* il link occuperà tutta lo spzio orizzontale.
										 Con Gecko -- Moz. NN. -- tutto lo spazio orizzontale
										 è clickabile */
	text-decoration: none; /* elimino la sottolineatura al link,
														è evidente che si tratta di un link */
	font-weight: bold;
	text-transform: uppercase;
}
ul.menu2 li a:link, ul.menu2 li a:visited { 
	border:2px outset #CCC; /* effetto bottone */
	color: #003;
}
ul.menu2 li a:hover { 
	background: #666; /* effetto roll-hover modificando il colore di sfondo del link */
	color: #FFF; /* effetto roll-hover modificando anche il colore del link */
}
ul.menu2 li a:active { 
	border:2px inset #CCC; /* effetto bottone premuto */
}

/** MENU 3 **/
ul.menu3 { 
	list-style: none; /* elimino i punti elenco */
	margin:0; padding:0; /* elimino i rientri delle liste - padding:0 per Gecko */
}

ul.menu3 li { 
	border-top:1px solid #FFF; /* effetto bottone - gioco con i colori */
	border-bottom: 1px solid #000; /* effetto bottone - gioco con i colori */
	line-height: 1.2em; /* imposto il line-height 
													per avere un bottone grande come i font 
													più un margine - verticale - pari al 20% */
	background: #E2EFFE; 
}
ul.menu3 li a { 
	display: block; /* il link occuperà tutta lo spzio orizzontale.
										 Con Gecko -- Moz. NN. -- tutto lo spazio orizzontale
										 è clickabile */
	text-decoration: none; /* elimino la sottolineatura al link,
														è evidente che si tratta di un link */
	padding-left: 10px; /* più leggibile */
	color: #0000FF;
	font-weight: bold;
; font-size: 11px; font-family: Verdana;
}

ul.menu3 li a:hover {
	color: #FF0000; /* effetto roll-hover modificando il colore del link */ }