@charset "utf-8";
/* CSS Document */

#menu_css_orizzontale{
/*specificare qui un width per un menu orizzontale a larghezza fissa*/
/*1. rimuoviamo i marcatori della lista*/
list-style:none;
/*2. usiamo questo metodo per evitare che lo sfondo dell'elemento contenitore collassa con elementi floatati*/
overflow:hidden;
/*3. relativo al metodo applicato sopra, per Internet Explorer 6, specifichiamo una larghezza di 100%*/
width:100%;
/*4. azzeriamo le margine – richiesto per Internet Explorer*/
margin:0;
/*5. impostiamo un spazio cuscinetto (padding) di 1 px tra i bordi della lista e il suo contenuto*/
padding:0px; 
/*6. aggiungiamo un colore di sfondo al menu*/
background-color: #BFBFBF;
	

}

#menu_css_orizzontale li{
display:inline;
}

#menu_css_orizzontale a{
	/*1. convertiamo i link da elementi inline a elemento di blocco, per potere poi specificare altezza/larghezza*/
display:block;
	/*2. usiamo la proprietà   float per allineare gli elementi orizzontalmente*/
float:left;
	/*3. specifichiamo una larghezza per link di stessa larghezza nel caso di questo esempio*/
/*per link di larghezza relativa alla larghezza del testo, usare padding-right invece di width*/
	padding-right: 19px;
	padding-left: 19px;
	padding-top: 37px;
	/*4. e un altezza*/
height:25px;
	/*9. specifichiamo il tipo di carattere usato*/
font-family:arial;
	/*10. e la misura del carattere*/
font-size:14px;
	/*11. convertiamo i caratteri da minuscolo a maiuscolo*/
text-transform:uppercase;
	/*12. togliamo la sottolineatura dei link aggiunta per default*/
text-decoration:none;
	/*13. specifichiamo un colore per i link*/
color: #3F3F3F;
	/*14. allineiamo verticalmente il testo*/
line-height:25px;
	background-image: url(../media/vertical.gif);
	background-repeat: no-repeat;
	background-position: right 23px;
	
}

#menu_css_orizzontale a:hover{
/*3. e il colore dei link stessi*/
color: #E10513;
}