/**************** menu coding *****************/
#menu {
width: 380px;
background: #FFF;
float: left;
margin-left:24px;
z-index: 51;
}

#menu ul {
list-style: none;
margin: 0;
padding: 0;
/*width: 190px;*/
width:auto;
float: left;
}

#menu ul ul {
list-style: none;
margin: 0;
padding: 0;
width: 172px;
float: left;
}

#menu a, #menu h2 {
font: bold 10px arial, helvetica, sans-serif;
display: block;
margin: 0;
padding: 1px 3px;
}

#menu a {
/* border-bottom: 1px solid #ccc;
border: 1px solid #ccc;*/
padding-left:10px;
padding-right:10px;
}


#menu ul ul {
	background-image: url(empty.gif);	/* required to work in IE6 and IE7 - due to their (different) hover bugs */
	padding: 0px 8px 8px 8px;
	margin: 0 0 0 -8px;
/*	background: yellow;*/
}

#menu ul ul ul{
	padding: 8px 8px 8px 8px;
	margin: -12px 0 0 -30px;
	/* background: red; */
z-index:400;
}


#menu li li{	/* create borders around each item */
	border: 1px solid #ccc;
}
#menu ul>li + li{	/* and remove the top border on all but first item in the list */
	border-top: 0;
}

#menu h2 {
color: #666;
background: #FFF;
padding-left: 10px;
padding-right: 10px;
cursor:pointer;
height:14px;
padding-top: 2px;
}

#menu li.mlink h2 {
margin: 0;
padding: 1px 0px 0px 0px;
}

#menu li.mlink a {
font: bold 10px arial, helvetica, sans-serif;
display: block;
background-color: #FFF;
color: #666;
text-decoration: none;
margin: 0;
padding: 1px 6px 1px 6px;
border: none;
height:14px;
}


#menu a {
background-color: #EFEFEF;
color: #000;
text-decoration: none;
}


#menu a:hover {
color: #A00;
background: #FFF;
}

#menu h2:hover {
	color:#000;
	text-decoration:underline;
}

#menu li.mlink a:hover {
	color:#000;
	text-decoration:underline;
}

#menu li {position: relative;}

#menu ul ul {
position: absolute;
/*z-index: 500;*/
}

#menu ul ul ul {
position: absolute;
top: 0;
left: 100%;
}

#menu ul ul ul ul {
position: absolute;
top: 0;
left: 100%;
}

#menu ul ul ul ul ul {
position: absolute;
top: 0px;
left:-148px;
z-index: 500;
}

/*#menu ul#menu2 {
width:50px;
}*/ /*Sets width for individual menus*/


#menu li:hover {
	z-index: 10000;	/* ...and here. this makes sure active item is always above anything else in the menu */
	white-space: normal;/* required to resolve IE7 :hover bug (z-index above is ignored if this is not present)
							see http://www.tanfa.co.uk/css/articles/pure-css-popups-bug.asp for other stuff that work */
}


/*#menu li:hover>ul {*/	/* inset submenus, to show off overlapping */
/*	top: 5px;
	left: 90%;
}*/

div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul,
div#menu ul ul ul li:hover ul ul {
_display: none;
visibility: hidden;
}

div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul,
div#menu ul ul ul ul li:hover ul {
_display: block;
visibility: visible
}


#menu a.popout {
background: #efefef url(/images/l-arrow.gif) no-repeat left top;
background-position: 3px 4px;
/* background-position: 165px 4px; 
z-index: 501;*/
}

</style>