/*part 1*/
#menux {position:absolute; top:3px; right:1%;}
	
#menux ul {list-style:none; margin:0; padding:0; width:6.5em; float:right;}

#menux ul li {font-size:14px; font-family:Arial; color:white;}

#menux a:visited {display:block; text-decoration:none; color:white;}
#menux a:hover {text-decoration:none; color:white; background-color:gray;}
#menux a:link {display:block; font-family:Arial; text-decoration:none;  color:white;}

#menutop {height:23px; background-color:#FFE4C4; text-align:center; border: black solid 1px;}

#menu {width:100%;	float:left;}

#menu ul {
	list-style: none;
	margin: 0;
	padding: 0 0px 0 0px;
	width: 6.5em;
	float: left;}

/*The above sets the width onto the individual lists, <ul>'s, this time as the need to float side by side to make them fit into whatever horizontal space is available to them. This horizontal width is determined by setting the width of the #menu div itself. The #menu div is also floated in order to "contain" it's floated descendants.*/

/*part 2: we apply the required formatting to the list items and <a> anchors*/

#menu ul li {font-size:19px; font-family:Arial; background-color:#FFE4C4; padding: 2px 0 1px 0;}

#menu ul ul li {font-size:19px; font-family:Arial; background-color:#FFE4C4; padding: 2px 0 1px 0; margin-left:17px;}

#menu a:link {display:block; font-family:Arial; text-decoration:none; color:navy;}
#menu a:visited {display:block; text-decoration:none; color:navy;}
#menu a:hover {text-decoration:none; color:white; background-color:gray;}



.menutop {font-size:20px; font-family:Arial; background-color:#FFE4C4;}
.menubottom {display:block; padding-top:4px; padding-bottom:4px;
			font-size:13px; font-family:Arial;} 
#menubottom hr {margin-top:-2px; margin-bottom:-2px;}

/*part 3: Positioning the Popout Menus and Dropdown Menus*/

#menu li {position: relative;}

#menu ul ul {position: absolute;
			top:20px; left:-28px;
			z-index: 500;}

#menu ul ul ul {top: 0; left: 100%;}


/*part 4: Hiding and Revealing using :hover*/

div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul
{display: none;}

div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}


/*part 5: Fix for IE*/

/*[if IE]>*/
/*<style type="text/css" media="screen">*/
/*body {
behavior: url(csshover.htc);
font-size: 100%;
}*/

#menu ul li {float: left; width: 100%;}
#menu ul li a {height: 1%;} 

#menu a, #menu h2 {
font: bold 0.7em/1.4em arial, helvetica, sans-serif;
}
/*</style>*/
/*<![endif]-->*/