@media all
{
  /* A modified version of A List Apart - http://alistapart.com/articles/slidingdoors2/ */
  
  #nav_main > ul {
    list-style: none;
    margin:0;
    padding:0;
  }
  
  #nav_main > ul > li {
    float: left;
    display: inline;
    background: url("../pics/slidingdoors_tab-right.png") no-repeat right top;
    margin: 0 1.5em 0 9px;
    padding: 0;
  }
  
  #nav_main > ul > li > a {
    display:block;
    float:left;
    text-decoration:none; 
    position: relative;
    left: -9px;
    margin-right: -9px;
    width: 100%;
    background: url("../pics/slidingdoors_tab-left.png") no-repeat left top;
    text-align: center;
    line-height: 25px;
    font-weight: bold;
  }
  
  
  /* Commented Backslash Hack hides rule from IE5-Mac \*/
  #nav_main > ul > li > a {float: none;}
  /* End IE5-Mac hack */
  
  /* not for IE5.x or IE6 */
  #nav_main > ul > li:hover, #nav_main > ul > li:hover > a {
    background-position:100% -125px;
  }
  
  #nav_main > ul > li:hover > a {
    background-position:0 -125px;
  }
  
  #nav_main > ul > li > a.current,#nav_main > ul > li > a.current:hover {
    color:#FFFFFF;
    background: url("../pics/slidingdoors_left_both.png") no-repeat top left;
  }
  
  #nav_main > ul > li.current {
    color:#FFFFFF;
    background: url("../pics/slidingdoors_right_both.png") no-repeat top right;
  }
  
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.stunicholls.com/menu/skeleton.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
#nav ul {padding:0 0 5px 0; margin:0; list-style:none; border:1px solid #000; position:relative; z-index:200;background:#fff}
#nav > ul ul {padding:0 0 5px 0; margin:0; list-style:none; font: 10px verdana, sans-serif; border:1px solid #000; border-color:#efefef #666666 #666666 #efefef; border-width:1px 2px 2px 1px; position:relative; z-index:200;}
#nav {height:25px; padding:0;}

#nav li {float:left;margin:auto;padding-right:20px;}
#nav li li {float:none; background:#fff;margin-left:1px;background-color:#fff;}
/* a hack for IE5.x and IE6 */
* html #nav li li {float:left;}

#nav_left > #nav {height:auto;}
#nav_left > #nav div > li {float:none;}
#nav_left #nav li:hover ul a {padding-left:15px;padding-right:15px;}

#nav li li a {white-space:nowrap; display:block; float:left; text-decoration:none;}
#nav li li a {height:1.6em; line-height:1.6em; float:none;padding-left:3px;padding-right:15px;}

#nav li li, #nav_left #nav li {background-repeat: no-repeat;background-position: right center;}
#nav li li.more, #nav_left #nav li.more {background-image: url(../pics/skeletonmore.gif);}

#nav li:hover {position:relative; z-index:300;}
#nav li:hover ul {left:0px; top:22px;}
/* another hack for IE5.5 and IE6 */
* html #nav li:hover ul {left:10px;}

#nav ul {position:absolute; left:-9999px; top:-9999px;}
/* yet another hack for IE5.x and IE6 */
* html #nav ul {width:1px;}

/* it could have been this simple if all browsers understood */
/* show next level */
#nav li:hover li:hover > ul {left:-1px; margin-left:100%;top:-1px;}
/* keep further levels hidden */
#nav li:hover > ul ul, #nav_main #nav li.current:hover > ul {position:absolute; left:-9999px; top:-9999px; width:auto;}
/* show path followed */
#nav li li:hover > a {text-decoration:underline; color:#b75;}


/* but IE5.x and IE6 need this lot to style the flyouts and path followed */
/* show next level */
#nav li:hover li:hover ul,
#nav li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover li:hover ul
{left:-1px; margin-left:100%; top:-1px;width:auto;}

/* keep further levels hidden */
#nav li:hover ul ul,
#nav li:hover li:hover ul ul,
#nav li:hover li:hover li:hover ul ul,
#nav li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px;}

/* show path followed */
#nav li:hover li:hover a,
#nav li:hover li:hover li:hover a,
#nav li:hover li:hover li:hover li:hover a,
#nav li:hover li:hover li:hover li:hover li:hover a,
#nav li:hover li:hover li:hover li:hover li:hover li:hover a
{text-decoration:underline; color:#b75;}

/* hide futher possible paths */
#nav li:hover li a,
#nav li:hover li:hover li a,
#nav li:hover li:hover li:hover li a,
#nav li:hover li:hover li:hover li:hover li a,
#nav li:hover li:hover li:hover li:hover li:hover li a
{text-decoration:none; color:#888;}


#nav_left #nav > div > li:hover > ul {left:209px; top:0px;}
#nav_left #nav div li.active li, #nav_left #nav div li.current li {background-color:transparent;}

#nav_left #nav a {width: 95%; padding-right: 5%}
#nav_left #nav a.active, #nav_left #nav a.current {width: 95%; padding-right: 5%}

#nav_left #nav > div > li.active > ul,
#nav_left #nav > div > li.current > ul 
{list-style: circle outside;width: 100%;position:relative;left:0px;top:auto;border:0px;background-color:transparent;}

#nav_left #nav div.active ul li.active > ul, 
#nav_left #nav div.active ul li.current > ul, 
#nav_left #nav li.active:hover > ul > div.active > li.more:hover > ul, 
#nav_left #nav li.active:hover > ul > div.active > li.active:hover > ul, 
#nav_left #nav li.active:hover > ul > div.active > li.active:hover > ul div.active > li ul 
{list-style: circle outside;width:108%;margin-left:0px;position:relative;left:-8%;top:auto;border:0px;background-color:transparent;}

#nav_left #nav div.active li.active > ul > div > li, 
#nav_left #nav div.active li.current > ul > div > li, 
#nav_left #nav div.current li.current > ul > div > li 
{margin-left:30px;padding-right:0px;border-bottom:0px;}

#nav_left #nav div li.active > ul > div > li > a, 
#nav_left #nav div li.current > ul > div > li > a 
{width: 92%;margin-left: -30px;padding-right: 8%;padding-left: 30px;white-space: normal;float: none;text-decoration: none;background-repeat: no-repeat;background-image: none;}

#nav_left #nav div li.active li > a:hover 
#nav_left #nav div li.current li > a:hover 
{display: block;width: 92%;margin-left: -30px;padding-left: 30px;padding-right: 8%;}

#nav_left #nav li.active:hover > ul ul, #nav_left #nav li.current:hover > ul ul {width:auto;margin-left:auto;left:100%;}


#nav_left > #nav div li li a {height:auto; line-height:1.2em;}
#nav_left > #nav div li a {height:auto;line-height:1.2em; }
#nav_left > #nav div li.current li.more li a {height:1.6em;line-height:1.6em}

#nav_left > #nav div.active > li.active {padding-right: 0px;}
#nav_left > #nav div.active > li.active a.active {width: auto;font-weight: bold;}
#nav_left > #nav div.active div.current > li.current {padding-right: 0px;}
#nav_left > #nav div.active div.current > li.current a.current {width: auto;}

#nav_left #nav div li.current li.more li > a:hover {margin-left: 0px;padding-left: 15px;padding-right: 15px;}

#nav_left #nav div.more {background-color: transparent;}
#nav_left #nav div.current > li.more {background-image: none;}

#nav_main #nav li > ul {
	margin-left: 100%;
}

#nav_main #nav > li > ul {
	margin-left: -9px;
}

}