/* ------------------------------------------------ 
Copyright (c) 2008 MWS. All rights reserved.
This stylesheet is based on work by Stu Nichols at
http://www.cssplay.co.uk/menus/
--------------------------------------------------- */
/* format outer div to give it width */
.menu {font-size:1em;}

/* format level hovers */
/* first */
.menu a:hover {background:#CAE4FF;}
.menu :hover > a {background:#CAE4FF;}

/* format links for the top level */
.menu a, .menu a:visited {
	font-family: Arial Narrow, Helvetica, sans-serif;
	font-size:0.8em;
	display:block;
	height:100%;
	text-decoration:none;
	color:#000;
	background:#FFFFFF;
	padding:0 0 0 0.3em;
}

/* Top Level */
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
	width:770px;
	padding:0;
	margin:auto;
	list-style-type:none; 
	height:1em; 
	background:#FFFFFF;
}

/* format Menu background */
.menu ul :hover a.sub1 {/* no changes */}

/* float the top list items to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu ul li {
	width:108px;
	float:left;
	height:1em;
	line-height:1em;
	border: 1px solid #CAE4FF;
}

/* format sub-level lists */
/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
	border: 2px solid #CAE4FF;
	visibility:hidden;
	position:absolute;
	height:auto;
	top:1em;
	left:0;
	width:143px;
}
/* format sub level links */
.menu ul ul a, .menu ul ul a:visited {
	display:block;
	color:#000;
	width:140px;
	height:100%;
	line-height:1em;
	padding:0.4em 0em 0.4em 0.3em;
}
/* format level hovers */
/* second */
.menu ul ul a:hover{background:#FFF9DD;	z-index:200;}
/* format sub level 2 background */
.menu ul ul :hover a.sub2 {background:#002365;	z-index:1000;}
.menu ul ul :hover > a {background:#FFF9DD;	z-index:1000;}

/* format second level list items */
.menu ul ul li {
	display:block;
	width:140px;
	height:auto;
	position:relative;
	line-height:1em;
	border-top-style: none; /* makes dropdowns continuous */
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}


/* position the third level flyout menu */
.menu ul ul ul{
	left:143px;
	top:0;
}

/* format third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {background:#FFF9DD;}
/* format level hovers */
/* third */
.menu ul ul ul a:hover {background:#FFFCEA;}
.menu ul ul ul :hover > a {background:#FFFCEA;}

/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {left:-145px;}



/* format fourth level background */
.menu ul ul ul ul a, .menu ul ul ul ul a:visited {background:#FFFCEA;}

/* format level hovers */
/* fourth */
.menu ul ul ul ul a:hover {background:#fff;}




/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul, .menu ul a:hover ul {visibility:visible; height:auto; background:transparent url(images/trans.gif);}
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{visibility:hidden;}
/* keep the fourth level hidden when you hover on second level list OR link */
.menu ul :hover ul :hover ul ul{visibility:hidden;}

/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{visibility:visible;}
/* make the fourth level visible when you hover over third level list OR link */
.menu ul :hover ul :hover ul :hover ul {visibility:visible;}




.arrow1 {
	vertical-align: middle;
	padding: 0px;
	margin-top: 3px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	border: 0px none;
	height: 7px;
	width: 9px;
	white-space: nowrap;
	right: 0%;
	position: absolute;
	text-decoration: none!important;
}


/* format table so that it takes no part in the layout - required for IE to work */
/* Also falling under the "shit I do not understand" category */
.menu table {position:absolute; left:0; top:0; font-size:1em; z-index:-1;}
.menu li:hover {position:relative;}
.menu ul table ul a, .menu ul table ul a:visited  {width:110px; w\idth:110px;}
