/*
Paolo Magrograssi - Novembre 2005

Foglio stile per menů a tendina fatti con i CSS
non influisce sugli stili generali, definisce solamente stili utilizzati 
in un div con id navMenuContainer

esempio:
<div id="navMenuContainer">
				<ul id="navMenu"> 
					<li>Opzione 1
						<ul> 
							<li>Opzione non linkata</li> 
							<li><a href="#">Shadow bass</a></li> 
							<li><a href="#">Ozark bass</a></li> 
							<li><a href="#">White crappie</a></li> 
							<li>&nbsp;</li> 
							<li><strong>Strumenti</strong></li> 
							<li><a href="#">strumento 1</a></li> 
							<li><a href="#">strumento 2</a></li> 
							<li><a href="#">strumento 3</a></li> 
						</ul> 
					</li> 
					<li>Opzione 2
						<ul> 
							<li>Blackbanded sunfish</li> 
							<li><a href="#">Shadow bass</a></li> 
							<li><a href="#">Ozark bass</a></li> 
							<li><a href="#">White crappie</a></li> 
						</ul> 
					</li> 
					<li><a href="#">No submenu</a>
					</li> 
				
				</ul>
			</div>

*/

/* 
il font delle opzioni di menu (primo livello) lo imposto solo a livello generale sul DIV
*/

#navMenuContainer
{
	font : 10px Verdana, Arial, Helvetica, sans-serif;
	background-color: #000000;
	width: 545px;
	padding: 0px;
	margin: 0px;
	height: 18px;
	
}

/* 
non voglio che i link abbiano la sottolineatura
non voglio che i link siano colorati con il colore di default dei tag A quindi
faccio ereditare il colore dal padre
*/
#navMenuContainer  a, #navMenuContainer  li a 
{
	text-decoration : none;
	color: #fff;
}

 #navMenuContainer li ul li a 
{
	text-decoration : none;
	color: #3A3B3B;
}


/*
questo serve a far comparire il menů di secondo livello quando 
c'č un hover (gestito solo da firefox) oppure un over (trucchetto con classname usato per explorer)
sulla "cella" (che in effetti č un LI) del primo livello del menů
*/
#navMenuContainer li:hover ul, #navMenuContainer li.over ul{ display: block; }


/* PRIMO LIVELLO */

/*
questo serve a fare in modo che la UNSORTED LIST (tag UL), non abbia i pallini a sinistra e che sia tutta su una riga
*/

#navMenuContainer ul 
{ 
	padding: 0; 
	margin: 0; 
	list-style: none; 
} 

/*
stile generale del menů di primo livello e suo posizionamento
*/

#navMenuContainer li {
	float: left;
	position: relative;
	padding : 2px;
	padding-left : 5px;
	padding-right : 5px;
	background: #000;
	color: White;
	border: 1px Solid #000;
	
} 

/*
primo livello con mouse sopra
*/

#navMenuContainer  li:hover,#navMenuContainer li.over {
	float: left;
	position: relative;
	/*
	se anche il testo deve cambiare colore impostarlo qui
	(attenzione che questo colore si ripercuote anche sulle opzioni di secondo livello quindi
	bisognerŕ impostare il colore anche nello stile #navMenuContainer li ul  li:hover,#navMenuContainer li ul li.over )
	color: Yellow;
	*/
	/*background: #000;
	border: 1px Solid #000;*/
	
} 

/* SECONDO  LIVELLO */

/*
stille generale del menů di secondo livello e suo posizionamento
*/

#navMenuContainer li ul {
	display: none;
	position: absolute;
	/* 
	usare sempre un posizionamento assoluto in pixel 
	e tenere presente che č influenzato da eventuali border
	*/
	top: 16px;  
	/*
	se le opzioni di primo livello non avessero un border  
	bisognerŕ impostare  un left: 0
	*/
	left: -1;
}

/* 
cella non evidenziata menů secondo livello
*/
#navMenuContainer li ul li {
	float: none;
	border: 1px solid #000;
	background: #ccc;
	color: #3A3B3B;
	width: 140px;
}

/* 
cella evidenziata menů secondo livello
*/
#navMenuContainer li ul  li:hover,#navMenuContainer li ul li.over {
	float: none;
	position: relative;
	/*colore che deve assumere il testo nelle opzioni di secondo livello quando ci si passa sopra con il mousercolor: Yellow;
	*/
	background: #fff;
	border: 1px solid #000;
	;
} 



