.menu {
	height: 30px; 
	width: 747px; /*750px; */
	position: relative; 
	font-size: 11px;
	font-weight: bold; 
	margin-left: 20px;
	margin-top: 60px;
	z-index: 4; 
}


.menu ul {
	padding: 0; 
	margin: 0; 
	list-style-type: none; 
}

.menu ul li {
	float: left; 
	margin-right: 0px; /* was 1px #A0921Bpadding-left: 5px;*/
	position: relative;
	border-right: 1px solid #D5D600;
	color: #A6A7A9;
	font-size: 11px;
	width: 116px; /*68px;*/
	height: 30px; 
	line-height: 30px;
	text-align: center; 
	cursor: pointer;
}

.menu ul li a { /* first level */
	display: block; 
	border: 0px;	/* this removes the underline from underneath the link */
	color: #A6A7A9;
	font-size: 11px;
	width: 116px;
	height: 30px; 
	line-height: 30px;
	text-align: center; 
	text-decoration: none;
	padding-left: 2px;
	overflow: hidden;
}

.menu li.last { /* no border right on the last in the menu */
  	border: 0px;
}

.menu ul li ul li {
	border-right: 1px solid grey;
	/*border-bottom: 1px solid #35487C;*/
}

/* hide the sublevels */
.menu ul li ul, 						/* hide the second level until we hover for it */
.menu ul li:hover ul li ul, 			/*	hide the third level until we hover for it*/
.menu ul li:hover ul li:hover ul li ul,
.menu ul li:hover ul li:hover ul li.hide ul { /* hide the fourth level until we hover for it*/
	display: none;
} 

.menu ul li a ul li a:hover,	/* for IE. the second level when first is hovered over and second level item hovered on */
.menu ul li:hover ul li a:hover { /* the last item when hovered over */
	background: #A6A7A9; 
	color: white; 
	
}

/* hovering over the first level */
.menu ul li:hover a,		
.menu ul li:hover a.active,
.menu ul li:hover a:visited  { 	/* visited links when hovered over background: #063A5A;*/
	background: #A6A7A9; 
	color: white; 
	border: 0px; 	
} 


/* second level when we need it to show up */



.menu ul li:hover ul { /* where the second level will appear when the first level is hovered over */
	display:block; 
	position:absolute; 
	background-color: #12203F; /*818181#F37C58;*/
	color: white;
	top: 30px; 
	left: 0px; 
	width: 90px;
	
	z-index: 2;
}

.menu ul li.hide:hover ul a,
.menu ul li:hover ul a {
	text-align: left;
	height: 30px; /*33px; #818181*/
	width: 100px;
	line-height: 30px;
	background-color: #12203F; 
	padding-left: 10px;
	z-index: 2;
}

.menu ul li:hover a.last {
	top: 33px; 
	left: 0px; 
}

/* third level when we need it to show up */
li > ul {
	top: auto;
	left: auto;
}
	
.menu ul li:hover ul li:hover ul {  /* placement of third level when second level is hovered over */
	display: block; 
	position: absolute; 
	z-index: 80;
	left: 95px; 
	top: 0;
	background-color: ##12203F;
}

.menu ul li.last:hover ul li:hover ul { /* placement of third level for last menu item when second level is hovered over */
	display: block; 
	position: absolute; 
	left: -115px; 
	top: 0;
}


.menu ul li:hover ul li:hover a.hide { 	/* hide class denotes that this is a folder and has children */
	background-color: #D1D1D1;			/* the second level when the third level is hovered over */
	color: black;
}

.menu ul li:hover ul li:hover ul li a.hide { 	/* third level menu item which has children but nothing is selected */
	background-color: #818181;
	color: white;
}


/* fourth level when we need it to show up */

.menu ul li:hover ul li:hover ul li:hover ul { /* placement of fourth level when third level is hovered over */
	display: block; 
	position: absolute; 
	left: 115px; 
	top: 0;
}

.menu ul li:hover ul li:hover ul li:hover a.hide { 	/* third level menu item which has children when hovered over */
	background-color: #818181;
	color: white;
}

.menu ul li:hover a.last ul li:hover ul li:hover a.last  { /* placement of fourth level for last menu item when 3rd level is hovered over */
	display: block; 
	position: absolute; 
	left: -230px;
	top: 0;
}



.menu li.last a {
  	border: 0px;
}

/*.menu ul li:hover ul li:hover ul.left {left:-105px;}*/