/* these are the styles that the suckerfish menu depends on, including bug fixes -- nothing else should go in here */

#navigation
{
 float: left;
 font-family: Arial, Helvetica, sans-serif;
 width: 180px;
}

ul#nav
{
 position: relative;
 z-index: 999!important;
 zoom: 1; /* for "hasLayout" */
}

ul#nav, #nav ul
{
 list-style: none;
 margin: 0;
 padding: 0;
}

#nav li
{
 display: inline;
 margin: 6px 0;
}

#nav a
{
 display: block;
 width: 163px;
 height: 38px;
 background: url(../graphics/nav_bg.jpg) right center no-repeat;
 line-height: 38px;
 color: black;
 text-align: center;
 font-size: 11px;
 font-weight: bold;
 text-decoration: none;
}

#nav a:hover
{
 background-position: left bottom;
 border: none;
}

/* nested lists */
#nav li ul
{
	position: absolute;
	left: -999em;
	margin-left: 163px;
	margin-top: -30px;
	border: 3px solid #8d83f3;
	visibility: visible;
}

#nav li:hover
{
 position: static; /* to fix IE7 "stickiness" on menu display */
 border: none;
}

#nav li:hover ul, #nav li.sfhover ul
{
 left: auto;
 top: auto;
 z-index: 999;
}

/* this is to fix IE collapsing the menus incorrectly, too quickly, making them unusable (has to do with it not detecting onmouseout properly, because of thinking I'm selecting the element under it */
.sfhover *
{
zoom: 1; /* gives "hasLayout" */
}


 /* IE is stretching the popout menus all the way across the screen */
* html .sfhover ul, * html .sfhover ul li, * html .sfhover ul li a
{
 width: 11em!important;
}

#nav li ul li
{
 margin: 0;
 padding: 0;
}

#nav li ul li a
{
 background-image: none;
 background-color: #8d83f3;
 text-align: left;
 font-weight: normal;
 width: auto;
 height: auto;
 line-height: normal;
 padding: 9px 70px 4px 9px;
 border-bottom: 1px solid #5c54ad;
 border-left: 2px solid white;
 border-right: 2px solid black;
 white-space: nowrap;
}

#nav li ul li.first a
{
 border-top: 2px solid white;
}

#nav li ul li.last a
{
 border-bottom: 2px solid black;
}

#nav li ul li a:hover
{
 background: white;
 text-decoration: underline;
 border-right: 2px solid black;
 border-left: 2px solid white;
}

#nav li ul li.first a:hover
{
 border-top: 2px solid white;
}

#nav li ul li.last a:hover
{
}