/* Navigation Container */

ul#nav	{ margin:0; padding:0; width:auto; list-style-type: none;
	 font-weight:bold; font-size: .83em; 
	 /*white-space:nowrap; */
	 color:white; text-align:left;
	}

/* 1st level menu */

ul#nav li	{ margin: 0 0 7px 0; padding:0; display: block; width:11.5em; 
	background-color:#E30000; /* red */
	border-top: 3px solid #CCC; /* outset */
	border-right: 3px solid #666;
	border-bottom: 3px solid #666; 
	border-left: 3px solid #CCC;
	vertical-align:middle; /* this fixes mysterious 3px in IE6 */
	}

ul#nav li a { margin:0; padding:5px 10px; display:block; width:auto;
	color:white; text-align:left; text-decoration:none; 
	text-transform:uppercase;
	border:none; 
	}

ul#nav li a:hover { background-color: #E30000; } /* red */

/* 2nd and nth level menus */

ul#nav ul	{ display:none; } /* z-index:10; hiding is not a graceful degrade but load.js takes too long */

ul#nav ul	{ position:absolute; margin-right:0; margin-bottom:0;
	margin-top: -13px; /* controls vertical position relative to container */
	margin-left: 100px; /* controls horizontal position relative to container */
	padding: 5px; width:auto; 
	list-style-type:none; text-align:left; font-size:1em; font-weight:normal;
	border-top: 1px solid #666; /* inset */
	border-right: 1px solid #CCC;
	border-bottom: 1px solid #CCC; 
	border-left: 1px solid #666;
	background-color: #E30000; /* red */
	}

ul#nav ul li { margin-bottom:-1px; /* mysterious 3px bottom margin in IE6WIN - see hack */
	padding:0; width:12em; display:block; float:none; 
	line-height:1.5em;
	border: 1px solid white;
	background-color: #0089A4;  /* blue */
	vertical-align:middle;  /* this fixes mysterious 3px margin in IE */
	}
/* html>body ul#nav ul li {margin-bottom:-1px}  --- hack not used - ie6 doesn't see this line */

 
ul#nav ul li a { margin:0; padding:0 5px; width:auto; display:block;
	color:white; text-align:left; text-decoration:none;
	text-transform:capitalize;
	border: none;
	}

ul#nav ul li a:hover	{ background-color: #299484; } /* green */