<style type="text/css">



body {

	font-family: arial, helvetica, serif;

}



.hoverlink{

color: #FFFFFF;

text-decoration: none;

}



.hoverlink:hover{

color: #FFFFFF;

text-decoration:underline;

}



#nav, #nav ul { /* all lists */

	padding:0px;

	margin: 0;

	list-style: none;

	line-height: 1;

	color:purple;

	font-size:12px;

	font-family: arial, helvetica, serif;

}



#nav a {

	padding-top:0px;

	padding-left:3px;

	padding-right:4px;

	width:6em;

	font-weight:bold;

	display: block;

	color:white;

	font-size:12px;

	text-decoration:none;

}



#nav li { /* all list items */

	padding-left:5px;

	padding-right:5px;

	float: left;

	width: 19ems; /*7 em orginally width needed or else Opera goes nuts!  Change this number if you add more links to the main link bar */

}



#nav li ul { /* second-level lists */

	position: absolute;

	background: purple;

	width:19em;

	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */

}

.dropdown{

	width:15em;

	text-align:center;

}

.dropdown2{

	float:left;

}

#nav a:hover {

	text-decoration:underline;

}

#nav li ul ul { /* third-and-above-level lists */

		position:relative;

	left:10px;

	background:purple;

}



#nav li:hover ul ul, #nav li.sfhover ul ul {

	left: -999em;



}



#nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul { /* lists nested under hovered list items */

	left: auto;

}



#content {

	clear: left;

	color: #ccc;

}

</style>