/* === MAIN NAVIGATION BAR === */

#navdiv {
	position:	relative; 
	z-index:	100;
    	font-size: 	11px;
    	font-weight:	bold;	
	color:		#fff; 	
    background: #000 url(/images/backgrounds/nav_bg.gif) repeat-x top left ;			
}

/* remove all the bullets, borders and padding from the default list styling */
#navdiv ul {
	margin:		0;
	list-style-type:none;
    	height: 	37px;
    	padding: 	0px 3px 0px 3px ;
    
}
#navdiv ul ul {
	width:95px;
}
/* float the list to make it horizontal and a relative position 
   so that you can control the dropdown menu positon */
#navdiv li {
	float:		left;
	width:		95px;
	position:	relative;
	
	
}
/* style the links for the top level */
#navdiv a, #navdiv a:visited {
	display:	block;
	text-decoration:none; 
	color:		#fff; 
	width:		95px; 
	height:		37px; 
	line-height:37px;	
	text-align:	center;
	background:	#000 url(/images/backgrounds/nav_bg.gif) repeat-x top left;

}

/* style the second level background */
#navdiv ul ul a.drop, #navdiv ul ul a.drop:visited {
	background:	#000 url(/images/backgrounds/nav_bg.gif) repeat-x top left;
}
/* style the second level hover */
#navdiv ul ul a.drop:hover{
	background:	#000 url(/images/backgrounds/nav_bg_c.gif)  repeat-x top left;
}
#navdiv ul ul :hover > a.drop {
	background:	#000 url(/images/backgrounds/nav_bg_c.gif)  repeat-x top left;
}

/* hide the sub levels and give them a position absolute so that they don't take up space */
#navdiv ul ul {
	position:	absolute;
	top:		37px;	
	width:		95px;
	visibility:	hidden;
	height:		0;
	left:		0; 
}

/* style the second level links */
#navdiv ul ul a, #navdiv ul ul a:visited {
	background: #000 url(/images/backgrounds/nav_bg.gif) repeat-x top left;
	height:		auto; 
	line-height:37px;	
	width:		150px;
	padding: 	0px 10px 0px 15px;
	text-align:	left;	
}

/* style the top level hover */
#navdiv a:hover, 
#navdiv ul ul a:hover{
	color:		#fff; 
	background: #000 url(/images/backgrounds/nav_bg_c.gif) repeat-x top left;
}
#navdiv :hover > a, 
#navdiv ul ul :hover > a {
	color:#fff;
	background:	#000 url(/images/backgrounds/nav_bg_c.gif) repeat-x top left;
}

/* make the second level visible when hover on first level list or link */
#navdiv ul li:hover ul,
#navdiv ul a:hover ul{
	visibility:	visible; 
}
