#navigation {
	padding:5px;
}

/* structural styles and offsets */
ul.expanding, ul.expanding li, ul.expanding ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
}

ul.expanding {
    position: relative;
    cursor: default;
    /*width: 12em;*/
}

ul.expanding li {
    position: relative;
    text-align: left;
    cursor: pointer;
    cursor: hand;
    /*width: 12em;*/
    margin: -1px 0 0 0;
}

ul.expanding ul {
    cursor: default;
    /*width: 12em;*/
    padding: 2px 0;
    position: absolute;
    left: -100em;
}

/*set the initial width of side menus*/
ul.expanding, ul.expanding li, ul.expanding ul {
	width:14.5em;
} 

/*expanding width offste*/
ul.expanding ul li {
    width: 13em;
}


/* design styles */
ul.expanding a:link, ul.expanding a:visited {
    display: block;
    cursor: pointer;
    cursor: hand;
    background: #6B9BBF; /*background color of side navs*/
    border: 1px solid #7E7E7E;
    padding: 5px 7px;
    font: normal 0.95em tahoma, verdana, sans-serif; /*font size of side navs*/
    color: #fff;  /*foreground color of side navs*/
    text-decoration: none;
    letter-spacing: 1px;
}

/*rollover color*/
ul.expanding a:hover, ul.expanding a:focus, ul.expanding a:active, 
ul.expanding a.rollover:link, ul.expanding a.rollover:visited {
    background: #59819F;
    color: #003366;
}


/* submenu indicator arrows */
ul.expanding li.hasmenu > a:link, ul.expanding li.hasmenu > a:visited {
    background: url(img/down-green.gif) #D6E3F9 no-repeat 95% 50%;
}

ul.expanding li.hasmenu > a:hover, 
ul.expanding li.hasmenu > a:focus, 
ul.expanding li.hasmenu > a:active, 
ul.expanding li.hasmenu > a.rollover:link, 
ul.expanding li.hasmenu > a.rollover:visited {
    background: url(img/down-green.gif) #E0E9EF no-repeat 95% 50%;
}

* html ul.expanding li.hasmenu a:link,
* html ul.expanding li.hasmenu a:visited {
    background: expression(/hasmenu/.test(this.parentNode.className) 
        ? "url(img/down-green.gif) #ffc no-repeat 95% 50%" : "#ffc");
}

* html ul.expanding li.hasmenu a:hover, 
* html ul.expanding li.hasmenu a:active, 
* html ul.expanding li.hasmenu a.rollover:link, 
* html ul.expanding li.hasmenu a.rollover:visited {
    background: expression(/hasmenu/.test(this.parentNode.className) 
        ? "url(img/down-red.gif) #ffefcf no-repeat 95% 50%" : "#ffefcf");
}

/*sidenav title*/
ul.expanding li.title a{
	background-color:#003366;
	text-align:center;
	color:#fff;
}


/* browser hacks */
@media screen, projection {
    * html ul.expanding li {
        display: inline; 
        f\loat: left; 
        background: #fff; 
    }
}