/******************************
See 
http://build.int.confex.com/redmine/projects/style/wiki/Navigation_Menus
for instructions on using the jQuery Slide Menu.

To make this work you will need jqueryslidemenu.js, 
links to jquery.min.js and a unordered list menu 
set up with the proper id's and classes.

Override this template for your client and 
Edit colors freely, 
edit width carefully, 
and edit padding or margins with caution!

******************************/

#top_nav {
	background-image:url('../../img/sim/35th/nav2bg.gif'); /* main background color of the menu */
	width: 940px; /* width of the menu */
	height:38px;
	overflow: visible;
	margin-top:30px;

}

.jqueryslidemenu{
	font: 1em Arial, Helvetica, sans-serif; /* menu font style */
	font-weight:bold;
	font-size: 12.5px;
	width: 100%; 
	float:center;
	
	
}

.msie html .jqueryslidemenu{height: 1%;}

.jqueryslidemenu ul{
	margin: 0;
	padding: 0;
	list-style-type: none; /* get rid of bullets */
	color:#fff;
	background-color: #000; /* normally this will match the #top_nav background */
	
}

/*Top level list items*/
.jqueryslidemenu ul li{
	position: relative;
	display: inline; /* allows items to line up horizontally */
	float: left; /* allows items to line up horizontally */
	z-index: 3000; /* keeps top level items on top */
	

}

/*Top level menu link items style*/
.jqueryslidemenu ul li a{
	display: block; /* turns "a" into a block element so it can have padding and float and stack */
	padding: 11px 11px;
	color:#17435F;
	/* this puts a separating border btwn items */
	
	text-decoration: none;
}


.bLeft {
	border-left: 1px solid #2477BE;
}


* html .jqueryslidemenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
	display: inline-block;
}


.jqueryslidemenu ul :hover a, .jqueryslidemenu ul :active a{
	color:#fff; /* color of the menu text when hovered */
	background-color: #17a1cf; /* hover background color */

}
	
/*1st sub level menu*/
.jqueryslidemenu ul li ul{
	position: absolute;
	left: 0;
	display: block;
	visibility: hidden; /* menu is hidden until top level is hovered */
	padding-bottom:18px;
	background:url('../../img/sim/35th/ddbg.gif') no-repeat 0 100%;
}

/*Sub level menu list items (undo style from Top level List Items)*/
.jqueryslidemenu ul li ul li{
	background: #17a1cf;
	display: list-item;
	float: none;
}

/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.jqueryslidemenu ul li ul li ul{
	top: 0;
}

/* Sub level menu links style */
.jqueryslidemenu ul li ul li a{
	font: normal 13px Arial;
	width:147px;
	padding: 8px;
	margin: 0;
	background-color:#17a1cf;
    color:#fff;
}

.jqueryslidemenu ul li ul li a:hover{ /*sub menus hover style*/
	background-color:#E1EDD6;
	color: #17a1cf;
	
}

/* ######### CSS classes applied to down and right arrow images  ######### */

.downarrowclass{
	position: absolute;
	top: 12px;
	right: 7px;
}

.rightarrowclass{
	position: absolute;
	top: 6px;
	right: 5px;
}

/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */

.clearfix:before,
.clearfix:after {
	content: '.';
	display: block;
	overflow: hidden;
	visibility: hidden;
	font-size: 0;
	line-height: 0;
	width: 0;
	height: 0;
}

.clearfix:after {
	clear: both;
}

/*
  The following zoom:1 rule is specifically for IE6 + IE7.
  Move to separate stylesheet if invalid CSS is a problem.
*/

.clearfix {
	zoom: 1;
}

#top_nav {
	padding-left: 0;
	margin-left: 0;
	text-align: left;
}