/* LEVEL ONE */
#hovernav {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
}

#hovernav ul {
	z-index: 100; /* this should be the highest zindex across the css so that it floats over all other elements */
	margin: 0;
	padding: 0;
	position: relative;
}
			
#hovernav li {
	margin: 0 !important;
	padding: 0 !important;
	list-style-type: none;
	list-style-position: outside;
	float: left;  /*adjust depending on if vertical or horizontal list*/
}

#hovernav li a { /* special properties for items in your list that are hyperlinked */
	margin: 0;
	padding: 0 5px;
	text-decoration: none;
	list-style-type: none;
	list-style-position: outside;
	border-left: 1px solid #000;
} 

#hovernav li a:hover { /* special properties for items in your list that are hyperlinked on hover */
	text-decoration: underline;
} 

#hovernav li.first-item, #hovernav li.first-item a { border: 0; } /* special properties for the first item in your list ie: maybe no background if using graphic as delim or border */

#hovernav ul li.hover, #hovernav ul li:hover { position: relative; }

/* LEVEL TWO */
#hovernav ul ul { 
	width: 220px; 
	visibility: hidden; 
	position: absolute; 
	top: 100%;
}

#hovernav ul ul li {
	margin: 0;
	padding: 0 10px;
	width: 220px;
	background: none;
	background-color: #F0F0F0;
	border-bottom: 1px solid #ccc;
	border-left: 1px solid #ccc; 
	border-right: 1px solid #ccc; 
	float: none;
}
									                               
#hovernav ul ul li a {
	border: 0;
	line-height: 25px;
	width: 100%; 
	display: inline-block; /* IE 6 & 7 Needs Inline Block */
	color: #000;
} 

/* LEVEL THREE */
#hovernav ul ul ul { left: 75%; top: 10px; border-top: 1px solid #ccc; }
#hovernav ul li:hover > ul { visibility: visible;}