/* BODY CSS STYLES */

body{
  behavior: url('csshover.htc');
}

/* STEP 2: SET MENU CONTAINER <DIV> CSS STYLES

   - Set the final desired width of navbar container <div>.
*/

#navbar{
  width: 141px;
}

/* STEP 1: SET MENU <UL> CSS STYLES:

   - Remove <ul> margins, paddings, and list-styles
   - Set background color for each <ul> menu and submenu

*/

#navbar ul{
  margin: 0px;
  padding: 0px;
  list-style: none;
  border-left: 1px solid #FFFFFF;
}

/* STEP 2: MENU <LI> CSS STYLES

   - Set all <li> tags to relative position
   - Set borders for each <li> menu list item FOR IE6 ONLY!!!!
   - Remove borders for NON-IE BROWSERS since borders cause problems (add borders to <a> tags below).

*/

#navbar li{
  position: relative;
  border-bottom: 1px solid #AFB7DD;
}

html>body #navbar li{
  border: none;
}

/* STEP 3: MENU <A> CSS STYLES

   - Set all <a> tags to display as 'block' items
   - Add padding for text. This padding, along with the text pixel size, determine height of final displayed link.
   - Set the <a> tag width. Subtract <a> left & right padding from final desired width.
   - Add any per <a> tag background colors, and hovered background colors.
   - Add any link text .
   - Also add borders to the links here for NON-IE BROWSERS since this could not be added to <li> tags seen above.

 */

#navbar ul a
{
	display: block;
	padding: 3px 5px;
	width: 131px;
	/* subtract <a> left/right padding from final desired width (see #navbar width above) */
	text-decoration: none;
	color: #FFF;
}

html>body #navbar ul a{
  border-bottom: 1px solid #AFB7DD; /* Set any borders for non-IE browsers here */
}

#navbar ul a:hover, #navbar ul a:active
{
	background-color: transparent;
	color: #F60;
	background-repeat: repeat;
}

/* STEP 4: SUBMENU <UL> CSS STYLES

   - Set all <ul> submenu tags (not on level one) to absolute position.
   - Set the pixel offset for left and top (where submenus are positioned relative to parent menu).
   - Set initial <ul> submenu visibility to none to initially hide all submenus.
*/
#navbar ul ul{
  position: absolute;
  top: 0px;
  left: 141px;
  display: none;
  background: #AFB7DD;
  border-left: 0px;
}
#navbar ul ul a{
  color: #C6CCE7;
  background-color: #6C77AE;
}

/* ENABLE SUBMENU LEVEL 1 */

#navbar ul li:hover ul{
  display: block;
}

#navbar ul li:hover ul ul{
  display: none;
}

/* ENABLE SUBMENU LEVEL 2 */

#navbar ul ul li:hover ul{
  display: block;
}

#navbar ul ul li:hover ul ul{
  display: none;
}/* ENABLE SUBMENU LEVEL 3 */


#navbar ul ul ul li:hover ul{
  display: block;
}

#navbar ul ul ul li:hover ul ul{
  display: none;
}