/*Multi-level drop down menu with overrun and overlap */

/* Style the outer div to give it width */
.dropdown_multilevel_menu_class
{
	font-size:12px;
	font-family:arial;
	font-weight:bold;
	padding:0px;
	width:800px; /*total width of top-level menu bar*/
}

/* Remove all the bullets, borders and padding from the default list styling */
.dropdown_multilevel_menu_class ul
{
	padding:0;
	margin:0;
	list-style-type:none;
	height:2.5em;
	background:transparent;
}

/* 1st level menu list */
.dropdown_multilevel_menu_class ul ul
{
	width:80px;
}

/* Float the top list items to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.dropdown_multilevel_menu_class ul li
{
	display:block;
	float:left;
	height:2.5em; /*height of top-level menu block*/
	line-height:2.5em; /*height of inline text block*/
}

/* 2nd level submenu list */
.dropdown_multilevel_menu_class ul ul li
{
	display:block;
	width:12em;
	height:auto;
	line-height:1em;
}

/* style the links for the top level */
.dropdown_multilevel_menu_class a,
.dropdown_multilevel_menu_class a:visited
{
	display:block;
	float:left;
	height:100%;
	width:113px; /*width of top-level menu item text*/
/*	padding:0 3em 0 1em;*/
	text-align:center;
	font-size:12px; /*top-level menu font size*/
	text-decoration:none;
	color:#70ffff;
	background:#303070 url("../images/MenuImages/GradientArcRedDim1x80.png") center center;
	border-right:1px solid #333;
}
/* Hack IE5.x to get the correct the faulty box model and get the width right */
* html .dropdown_multilevel_menu_class a,
* html .dropdown_multilevel_menu_class a:visited
{
	width:11em;
	w\idth:7em;
}

/* 2nd level submenu links */
.dropdown_multilevel_menu_class ul ul a,
.dropdown_multilevel_menu_class ul ul a:visited
{
	display:block;
	background:#444488 url("../images/MenuImages/GradientHorizRed250x80.png");
	color:#70ffff;
	text-align:left; /*left align submenu*/
	width:120px; /*width of dropdown submenu*/
	height:100%;
	line-height:1em;
	padding:0.5em 1em; /*give text some space around the submenu box*/
	border-top:1px solid #acc; /*submenu divider*/
	border-bottom:1px solid #577; /*submenu divider*/
}

* html .dropdown_multilevel_menu_class ul ul a,
* html .dropdown_multilevel_menu_class ul ul a:visited 
{
	width:14em;
	w\idth:12em;
}


/* Style the table so that it takes no part in the layout - required for IE to work */
.dropdown_multilevel_menu_class table
{
	border-collapse:collapse;
	padding:0;
	margin:-1px;
	width:0;
	height:0;
	font-size:1em;
	z-index:1;
}


/* 3rd level submenu background */
.dropdown_multilevel_menu_class ul ul ul a,
.dropdown_multilevel_menu_class ul ul ul a:visited
{
	background:#6666aa url("../images/MenuImages/GradientHorizRed250x80.png");
}

/* 4th level submenu background */
.dropdown_multilevel_menu_class ul ul ul ul a,
.dropdown_multilevel_menu_class ul ul ul ul a:visited
{
	background:#8888cc url("../images/MenuImages/GradientHorizRed250x80.png");
}

/* 1st level menu style background */
.dropdown_multilevel_menu_class ul :hover a.sub1
{
	background:#a0a0ff;
}

/* 2nd level submenu style background */
.dropdown_multilevel_menu_class ul ul :hover a.sub2
{
	background:#a0a0ff;
}

/* Hover styles */
/* 1st level hover style */
* html .dropdown_multilevel_menu_class a:hover
{
	color:#ffff00;
	background:#a0a0ff url("../images/MenuImages/GradientArcRed1x80.png") center center;
	position:relative;
	z-index:100;
}
.dropdown_multilevel_menu_class li:hover
{
	position:relative;
}
.dropdown_multilevel_menu_class :hover > a
{
	color:#ffff00;
	background:#a0a0ff url("../images/MenuImages/GradientArcRed1x80.png") center center;
}
/* 2nd level hover style */
* html .dropdown_multilevel_menu_class ul ul a:hover
{
	color:#ffff00;
	background:#7070d0;
	position:relative;
	z-index:110;
}
.dropdown_multilevel_menu_class ul ul li:hover
{
	position:relative;
}
.dropdown_multilevel_menu_class ul ul :hover > a
{
	color:#ffff00;
	background:#a0a0ff;
}
/* 3rd level hover style */
* html .dropdown_multilevel_menu_class ul ul ul a:hover
{
	background:#a0a0ff;
	position:relative;
	z-index:120;
}
.dropdown_multilevel_menu_class ul ul ul :hover > a
{
	background:#a0a0ff;
}
/* 4th level hover style */
.dropdown_multilevel_menu_class ul ul ul ul a:hover
{
	background:#a0a0ff;
	position:relative;
	z-index:130;
}


/* Hide the sub levels and give them a positon absolute so that they take up no room */
.dropdown_multilevel_menu_class ul ul
{
	visibility:hidden;
	position:absolute;
	height:0;
	top:2.5em; /*spacing submenu down from top-level menu*/
	left:0;
	width:14em;
}

/* Position the 3rd level flyout menu */
.dropdown_multilevel_menu_class ul ul ul
{
	left:12em;
	top:0;
	width:14em;
}


/* Make the second level visible when hover on first level list OR link */
.dropdown_multilevel_menu_class ul :hover ul
{
	visibility:visible;
	height:auto;
	padding:0 3em 3em 3em;
	background:transparent url("../images/MenuImages/Transparent8x8.png");
	left:-3em;
}
/* Keep the 3rd level hidden when you hover on 1st level list OR link */
.dropdown_multilevel_menu_class ul :hover ul ul
{
	visibility:hidden;
}
/* Keep the 4th level hidden when you hover on 2nd level list OR link */
.dropdown_multilevel_menu_class ul :hover ul :hover ul ul
{
	visibility:hidden;
}
/* Make the 3rd level visible when you hover over 2nd level list OR link */
.dropdown_multilevel_menu_class ul :hover ul :hover ul
{
	visibility:visible;
	left:9em;
}
/* Make the fourth level visible when you hover over third level list OR link */
.dropdown_multilevel_menu_class ul :hover ul :hover ul :hover ul {visibility:visible;}


.dropdown_multilevel_menu_class li.selected_class a
{
	background:#a0b0f0 url("../images/MenuImages/GradientArcRed1x80.png") repeat-x center center;
	color: #ff3030;	/* HiLite color */
}

<!--[if lte IE 6]>
.dropdown_multilevel_menu_class ul ul
{
	left:-1px;
	margin-left:-1px;
}
<![endif]-->
