/********* MAIN NAVIGATION **********/

/* Note: colors are set in Config Settings. You can set the colors there, or
   you can replace the <w:data ... > text with color values here             */

/* This CSS drop-down menu is adapted from the "Son of Suckerfish" menu originally
   published at http://htmldog.com/articles/suckerfish/dropdowns/            */

/* Note that for the drop-downs to work in IE there is also a small bit of
   JavaScript required, which is in menu.js                                  */

/* If you make changes, be sure to check across the entire browser matrix of
   interest. A much simpler version works fine in Firefox but various browsers
   have issues if some of the CSS is simplified                              */

#linkContainer {  /* wrapper for entire navigation bar */
  float:left;
  padding: 0;
  width: 100%;
  margin: 0;
  /* zoom: 1;   to make IE behave */
  /* for IE, z-index has to increase for each containing element so menus stay on top */
  z-index:2010;   
  position:relative;
}
#nav, #nav ul {  /* top-level navigation unordered list */
  list-style-type:none;
  font-weight: bold;
  padding: 0;
  margin: 0;
  color: #FFF; 
  float: left;
  list-style: none;
  z-index:2009;
  width: 100%;
  background-color:#666;  
  /* zoom: 1;  to make IE behave */
  position:relative;
}
#nav li {  /* top-level navigation list items */
  display:inline;
  float:left;
  margin: 0;
  padding: 0;
  list-style: none;
  line-height: 1.2em;
  border-right: 1px solid #FFF; 
  z-index:2008;
}
#nav a {  /* top-level navigation links */
  display:block;
  font-size: 12px;
  padding: 4px 8px;
  text-decoration: none;
  letter-spacing: 0.05em;
  font-weight: bold;
  color: #FFF;
  background-color:#666; 
  z-index:2007;
}
#nav .current {  /* color to highlight nav for current page */
  background-color:#333; 
  z-index:2006;
}
#nav a:hover {   /* color for nav hover */
  background-color:#333; 
  color: #FFF;
  z-index:2006;
}

/******* Drop-Downs ********/

#nav li ul {  /* list that is the drop-down for each main menu item */
  position: absolute;
  width: 150px;  /* sets width of drop-down */
  left: -999em;  /* keep the drop-down offscreen until it is activated */
  padding:0;
  margin: 0;
  background-color: #666;
  z-index:2005;
}
#nav li ul li {
  display:block;
  width: 150px;  /* sets width of drop-down */
  margin: 0;
  padding: 0;
  z-index:2004;
}
#nav li:hover ul, #nav .sfhover ul {  /* sfhover class is used by menu.js to make IE work */
  left: auto;   /* move the drop-down into position */
  z-index:2003;
}
#nav li ul li a {  /* primary styling for drop-down items */
  display:block;
  width: 150px;
  font-size: 12px;
  font-weight: bold;
  padding: 4px 8px;
  text-decoration: none;
  color: #FFF;
  line-height: 16px;
  background-color: #666;
  margin: 0;
  z-index:2002;
}
#nav li ul li a:hover {
  background-color: #333;
  color: #FFF;
  font-weight:bold;
  z-index:2002;
}