/* Begin CSS Popout Menu */

#menu{
	/*position:absolute;*/
	width:180px;
	padding-bottom:100px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #4ab9ea;
}

#menu a, #menu h2{
	display:block;
	white-space:nowrap;
	margin:0;
	padding:1px 0 1px 3px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 24px;
	font-weight: bold;
}

#menu h2{
	color:#4ab9ea;
	line-height:24px;
	height: 24px;
	text-transform:uppercase;
}

#menu .menulink{
	line-height:24px;
	height: 24px;
	border: 0px;
	text-transform:uppercase;
}


#menu a.menulink:link{
	line-height:24px;
	height: 24px;
	border: 0px;
	color: #4ab9ea;
}

#menu a.menulink:active{
	color:#336699;
	border: 0px;
}

#menu a.menulink:hover{
	height: 24px;
	color:#336699;
	border: 0px;
}

#menu a{
color:#4ab9ea;
/*background:#e7f0f4;*/
text-decoration:none;
}

#menu a:hover{
color:#336699;
/*background:#e7f0f4;*/
}

#menu a:active{
color:#336699;
/*background:#e7f0f4;*/
}

#menu ul{
list-style:none;
margin:0;
padding:0;
width:100%;

}

#menu ul ul{
	width:200px;
}

#menu ul ul li{
	background:#fdfcfc;
	padding-left:4px;
}

/* Requirement: Put the element selector name (div)
onto non anchor hover selectors to force IE5 and
5.5 to correctly apply the csshover file. */

div#menu h2:hover{
	display: block;
	color:#336699;
}

div#menu li, div#menu li:hover{
position:relative;
}

div#menu li:hover{
cursor:pointer;
z-index:100;
}

div#menu li ul{
position:absolute;
top:24px;
left:80px;
display:none;
}

div#menu ul ul,
div#menu ul ul ul,
div#menu ul li:hover ul ul,
div#menu ul li:hover ul ul ul
{display:none;}

div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display:block;}

/* End non-anchor hover selectors */

/* Styling for Expand */

#menu a.x, #menu a.x:visited{
background:#eee url(/css/images/expand3.gif) no-repeat bottom right;
}

#menu a.x:hover{
color:#a00;
background:#ddd;
}

#menu a.x:active{
color:#060;
background:#ccc;
}