.menu a{
	display:block;
	border-width:0px;
	border-style:solid;
	border-color:#ccc #888 #555 #bbb;
	white-space:nowrap;
	margin:0;
	padding:0;
	background-color: #fff;
}

.menu ul{
list-style:none;
margin:0;
padding:0;
//width:185px;
width:100%;
}

.menu ul ul {
width:100%;
}

.menu li{
position:relative;
}

.menu ul ul{
position:absolute;
//z-index:500;
top:0;
display:none;
left:100%
}

.menu ul ul ul{
top:0;
left:100%;
}

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

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


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

/* Hack. IE wants only one instance of <div id="menu">.  This makes using the flyout technique in multiple places hard.  This should be fixed in IE7  */

.menu2 a{
	display:block;
	border-width:0px;
	border-style:solid;
	border-color:#ccc #888 #555 #bbb;
	white-space:nowrap;
	margin:0;
	padding:0;
	background-color: #fff;
}

.menu2 ul{
list-style:none;
margin:0;
padding:0;
//width:185px;
width:100%;
}

.menu2 ul ul {
width:100%;
}

.menu2 li{
position:relative;
}

.menu2 ul ul{
position:absolute;
//z-index:500;
top:0;
display:none;
left:100%
}

.menu2 ul ul ul{
top:0;
left:100%;
}

div.menu2 li:hover ul ul,
div.menu2 li li:hover ul ul,
div.menu2 li li li:hover ul ul,
div.menu2 li li li li:hover ul ul
{display:none;}

div.menu2 li:hover ul,
div.menu2 li li:hover ul,
div.menu2 li li li:hover ul,
div.menu2 li li li li:hover ul
{display:block;}


div.menu2 li:hover{
cursor:pointer;
z-index:100;
}