#listMenuRoot
{
	position: relative;
	margin-left: 11px;
}

/* First level menu items <ul> */
.menulist, .menulist  ul 
{
	z-index: 10000;
	margin: 0px;
	padding:0px;
	list-style: none;
	color: #fff;
	font: bold 12px Arial, Helvetica, sans-serif;
	text-align: left;	
}
.menulist a { text-decoration: none !important; }

li.navLnk1 a, li.navLnk2 a, li.navLnk3 a,
li.navLnk4 a, li.navLnk5 a, li.navLnk6 a, 
li.navLnk7 a
{
	height: 44px;
}
li.navLnk1 a:hover, li.navLnk2 a:hover, li.navLnk3 a:hover,
li.navLnk4 a:hover, li.navLnk5 a:hover, li.navLnk6 a:hover, li.navLnk7 a:hover,
li.navLnk1 a:active, li.navLnk2 a:active, li.navLnk3 a:active,
li.navLnk4 a:active, li.navLnk5 a:active, li.navLnk6 a:active, li.navLnk7 a:active
{
	background-color: transparent !important;
} 

.menulist li.navLnk1 { width: 89px;  }
.menulist li.navLnk2 { width: 123px; }
.menulist li.navLnk3 { width: 189px; } 
.menulist li.navLnk4 { width: 88px;  }
.menulist li.navLnk5 { width: 141px; }
.menulist li.navLnk6 { width: 133px; }
.menulist li.navLnk7 { width: 143px; }

img.trans
{
	margin-top: -8px;
	margin-left: -5px;
	height: 53px;
	border: 0px solid;
}

.menulist li.navLnk1 img.trans { width: 84px;  }
.menulist li.navLnk2 img.trans { width: 118px; }
.menulist li.navLnk3 img.trans { width: 184px; } 
.menulist li.navLnk4 img.trans { width: 83px;  }
.menulist li.navLnk5 img.trans { width: 136px; }
.menulist li.navLnk6 img.trans { width: 128px; }
.menulist li.navLnk7 img.trans { width: 138px; }

/* Second level menu items <ul><li><ul> */
.menulist li.navLnk2 ul a, .menulist li.navLnk3 ul a
{
	height: 15px;
}
.menulist li.navLnk2 ul, .menulist li.navLnk3 ul
{
	margin-top: 23px;
}
.menulist li.navLnk2 ul ul, .menulist li.navLnk3 ul ul
{
	margin-top: 0px;
}
/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */
.menulist ul 
{
	z-index: 1000;
	visibility: hidden;
	text-decoration: none;
	position: absolute;
	top: 2.5em; /* I'm using ems rather than px to allow people to zoom their font */
	left: 0px;
	width: 185px;
	background-color:#ac3344;
}

/* Second and third etc. level submenus - position across from parent instead */
.menulist ul ul
{
	top: 0px;
	left: 183px;
	background-color: #e0dede;
}

/*
 All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
 positioned relatively to correctly offset submenus. Also, they have overlapping borders.
*/
.menulist li
{
	float: left;
	position: relative;
	margin-right: -1px;
	margin-top: -1px;
}
/* Items in submenus - override float/border/margin from above, restoring default vertical style */
.menulist ul li /* deals with categories */
{
	float: none;
	margin-right: 0;
	margin-bottom: -1px;
	border: 1px solid #fff;
	color: #fff !important;
	background-color: #ac3344;
	font: normal 12px Arial, Helvetica, sans-serif;
}


.menulist ul ul ul a.course_expanded /* the courses on the end */
{
	float: none;
	margin-right: 0;
	margin-bottom: -1px;
	color: #ac3344 !important;
	background-color: #e0dede;
	font: normal 12px Arial, Helvetica, sans-serif;
}
.menulist ul ul ul a.course /* the courses */
{
	float: none;
	margin-right: 0;
	margin-bottom: -1px;
	color: #ac3344 !important;
	background-color: #e0dede;
	font: normal 12px Arial, Helvetica, sans-serif;
}

.menulist li ul li a:hover { color: #fff !important; background:#666; text-decoration: none }
.menulist ul ul li.course a { color: #fff !important; }
.menulist ul ul li.course a:hover { color: #fff !important;  background-color: #666  }
.menulist ul li a { color: #fff !important; }

.menulist ul li a:hover { background-color: #666 !important; }
.menulist ul li ul
{
	height: 25px;
}

/* Links inside the menu */
.menulist a
{
	display: block;
	padding: 5px;
	color: #fff;
	text-decoration:  none;
}

.menulist a.course_expanded
{
	height: 40px !important;
	color: #fff;
	text-decoration:  none;
}
.menulist a.course_expanded:hover
{
	display: block;	
	height: 40px !important;
}
.menulist ul li.expanded
{
	background-color: #ac3344;
	height: 40px !important;
	margin-bottom: -4px !important;
}
.menulist ul a.expanded
{
	
	height: 40px !important;
	color: #fff;
	text-decoration:  none;
}
.menulist a.expanded:hover
{
	color: #fff !important;  
	background-color: #666;
	padding-bottom: 0px !important;
	height: 40px !important;
}
/* combined course with expanded */
.menulist ul li.course_expanded
{
	float: none;
	border: 1px solid #fff;
	color: #ac3344 !important;
	background-color: #ac3344;
	font: normal 12px Arial, Helvetica, sans-serif;
	display: block;
	color: #fff;
	text-decoration:  none;
}

.menulist ul ul li.course_expanded a 
{
	color: #fff !important;
	background-color: #ac3344;
}
.menulist ul ul li.course_expanded a:hover 
{
	color: #fff !important;  background-color: #666  
}


/* overriding parent links  */
.menulist ul li a {	padding-left: 3px; }

/* Lit  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.menulist a:hover, .menulist a.highlighted:hover, .menulist a.visited /* .menulist a:focus */
{
	color: #fff; background-color:#666;	text-decoration: none
}

/* .menulist  a.highlighted { color: #000; } */

/* Only style submenu indicators within submenus. */
.menulist a .subind { display:  none; }
.menulist ul a .subind { display:  block; float: right; }

/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */
.menulist a { float: left; }
.menulist ul a { float: none; }
/* \*/
.menulist a { float: none; }
/* \*/

/* This semi-commented section exists to fix bugs in IE/Windows (the 'Holly Hack'). \*/
* html .menulist  ul li { float: left; height: 1%; }
* html .menulist  ul a { height: 1%; }
/* End Hack */