#menu {
	padding:5px 20px 0 20px;
	margin:0;
}

/* START UL */

#menu > ul {
	margin: -1px 0 15px 0;
	padding: 2px 2px 6px 2px;
	list-style:none;
}

/* format and position nested ULs */
#menu ul ul {
	list-style:none;
	position:absolute;
	margin:0;
}

/* padding for first-level nested ULs */
#menu ul ul {
	padding: 8px 0 5px 0;
	_padding-top:0px; /* IE hack */
	z-index:100;
}

/* padding for subsequent levels of nested ULs */
#menu ul ul ul {
	padding-top:5px;
	_padding-top:0px; /* IE hack */
}

/* position first nested ul underneath */
#menu > ul > li > ul  {
	top: 100%;
	left: 0;
}

/* position subsequent nested ULs underneath */
#menu ul ul ul  {
	top: -7px; /* account for 8px padding on "#menu ul ul" */
	left: 120px;
}

/* END UL */

/* START LI */

#menu li {
	position:relative;
	margin: 0;
	padding:0;
	height:auto;
	display:inline;
}

/* give width to all nested LIs */
#menu ul ul li {
	width: 110px;
	padding-left: 2px;
}

/* dividers */

#menu ul ul li.section > a:after { /* 125 */
	content: " >";
	float: right;
}

/* END LI */

/* START A */

#menu a {
	text-decoration:none;
	text-align:left;
	padding:0 5px;
	line-height:20px;
	font-weight:normal;
}

/* fix opera problem */
#menu li a {
	display: inline;
	height: 100%;
}

/* make all nested As fill their LI */
#menu ul ul a {
	margin: 0px;
	text-align: left;
	font-size: 10px;
	font-weight: normal;
	padding: 3px 5px 3px 5px;
	width: 110px;
	display: inline-block; /* block makes IE8 fall over */
	line-height: normal;
}

/* END A */

/* 
START HIDE/SHOW 
*/

/* IE falls over when you use the simpler "#menu li:hover > ul" so instead we rely on the specificity rules in CSS (tag = 1, attribute = 10, selector = 100).
Unfortunatley, this means a set of rules to show/hide for each level. Rules for up to 4 levels included... */

/* hide nested ULs
Specificities: 12, 113, 214 */
#menu ul ul, 
#menu li:hover ul ul, 
#menu li:hover li:hover ul ul {
	list-style:none;
	display:none;
	position:absolute; 
}

/* popup any nested UL when the containing LI is rolled over (".over" is for IE6)
Specificities: 112, 213, 314  */
#menu li:hover ul, 
#menu li:hover li:hover ul, 
#menu li:hover li:hover li:hover ul, 
#menu li.over ul {
	display: block;
}

/* END HIDE/SHOW */