@charset "utf-8";

#topnav,
#topnav ul {
	padding : 0 0 5px 0;
	margin : 0;
	list-style : none;
	position : relative;
	z-index : 200;
}

#topnav {
	height : 25px;
	padding : 0;
	font-size : 13px;
}

ul#topnav ul {
	border : 1px solid #fff;
	background-image : URL(../images/topnavi.png);
	font-size : 13px;
}

#topnav table { border-collapse : collapse; }

#topnav li {
	float : left;
	padding : 0 8px 0 5px;
}

#topnav li li { float : none; }

/* a hack for IE5.x and IE6 */
#topnav li a li { float : left; }

#topnav li a {
	display : block;
	float : left;
	color : #000;
	height : 25px;
	padding-right : 5px;
	line-height : 25px;
	text-decoration : none;
	white-space : nowrap;
	font-weight : normal;
}

#topnav li li a {
	height : 20px;
	line-height : 20px;
	float : none;
	color : #fff;
	font-weight : normal;
}

#topnav li:hover {
	position : relative;
	z-index : 300;
}

#topnav a:hover {
	position : relative;
	z-index : 300;
	text-decoration : underline;
}

#topnav :hover ul {
	left : 0;
	top : 20px;
}

/* another hack for IE5.5 and IE6 */
#topnav a:hover ul { left : -10px; }

#topnav ul {
	position : absolute;
	left : -9999px;
	top : -9999px;
}

/* it could have been this simple if all browsers understood */
/* show next level */
#topnav li:hover li:hover > ul {
	left : 0px;
	margin-left : 100%;
	top : -1px;
}

/* keep further levels hidden */
#topnav li:hover > ul ul {
	position : absolute;
	left : -9999px;
	top : -9999px;
	width : auto;
}

/* show path followed */
#topnav li:hover > a {
	text-decoration : underline;
}

/* but IE5.x and IE6 need this lot to style the flyouts*/
/* show next level */
#topnav a:hover a:hover ul,
#topnav a:hover a:hover a:hover ul,
#topnav a:hover a:hover a:hover a:hover ul,
#topnav a:hover a:hover a:hover a:hover a:hover ul {
	left : 100%;
	top : -1px;
}

/* keep further levels hidden */
#topnav a:hover ul ul,
#topnav a:hover a:hover ul ul,
#topnav a:hover a:hover a:hover ul ul,
#topnav a:hover a:hover a:hover a:hover ul ul {
	position : absolute;
	left : -9999px;
	top : -9999px;
}