/*
The first thing we are going to do with our CSS is to display the primary level horizontally
(using float) and hide all of the subnavigation lists.
We will also set the display for the links in the list to be bold, colored, and have a border.
*/
ul#topnav {
margin:0px 0px 10px 0px;
}
ul#topnav li {
  /*float the main list items*/
  margin: 0;
  float: left;
  display: block;
  padding-right: 15px;
}
ul#topnav li ul {
  /*hide the subnavs
  display: none;
  */
}
ul#topnav li a.sm {
  /*for all links in the list*/
  color: #1A29A5;
  background: #ACBEE4;
  font-weight: bold;
  display: block;
  height: 23px;
  line-height: 23px;
  font-size:150%;
	border: 1px solid;
	border-color: #DDDDDD #555555 #555555 #DDDDDD;
  padding: 5px;
  text-align:center;
	text-decoration: none;
	width:100px;
}
/*
Next, let’s position our second nav level below the main list, 
so that when it does show up again, it’s in the right place.
*/
ul#topnav li ul.sitemap {
  position: absolute;
  height: 23px;
  line-height: 23px;
  padding-top: 10px;
  /*put the subnavs below and hide them all*/
  position: absolute;
  left: 0px;
  /*put the Slickmap below and hide it*/
  top: 26px;
  *top:37px; /*reposition for IE*/
  display: none;
}
ul#topnav li ul.login {
  position: absolute;
  height: 23px;
  padding-top: 10px;
  /*put the you are here-info below and hide it*/
  top: 5px;
  *top: 16px; /*reposition for IE*/
  left: 390px;
  display: none;
	border: 1px solid;
	border-color: #DDDDDD #555555 #555555 #DDDDDD;
}
ul#topnav li ul.search {
  display: none;
  position: absolute;
	border: 1px solid;
	border-color: #DDDDDD #555555 #555555 #DDDDDD;
  color: #1A29A5;
  background: #ACBEE4;
  padding: 25px;
  /*put the search-window below and hide it*/
  display: none;
  top: 35px;
  *top: 46px; /*reposition for IE*/
  left: 127px;
}
ul#topnav li ul.search input.search {
	float: left;
	border: 1px	solid;
	border-color: #DDDDDD #555555 #555555 #DDDDDD;
	height: 23px;
	line-height: 20px;
	font-size: 150%;
	margin: 0 4px 0 0;
	padding: 1px 4px 1px 4px;
	width: 188px;
}
ul#topnav li ul.search .searchbox {
	height: 23px;
	margin: 0px;
	padding: 5px;
	width: 220px;
}

/*
Now, we activate the rollover.
This is not much different than any other CSS dropdown menu — 
the hover is on the li element, so IE will choke 
due to its poor implementation of the :hover psuedo-class. We’ll get to that in a minute.
 The following CSS removes the border on the second nav level, sets the active subnav to 
 always display, and sets the inactive subnavs to display when their parents are hovered. 
 We’ll set a z-index to be sure that the hovers always take precedence over the current 
 topic area’s subnav.
*/ul#topnav li ul a {
/*  float: left;
 ie doesn't inherit the float*/
  border: 0;
  color: #1A29A5;
  width: auto;
  margin-right: 15px;
}
ul#topnav li:hover ul {
  /*  display the other topics when
      their parent is hovered */
  display: block;
  z-index: 6000;
}
ul#topnav li a:hover {
  color: #0C147D;
}