/* Basic code - don't modify */
#nav{display: block; margin: 0; padding: 0; position: relative;  float:right;}
#nav li{display: block; list-style: none; margin: 0; padding: 0; float: left; position: relative; }
#nav a{display: block; }
#nav ul{display: none; position: absolute; left: 0; margin: 0; padding: 0; }
* html #nav ul{line-height:0;} /* IE6 "fix" */
#nav ul a { zoom: 1; } /* IE6/7 fix */
#nav ul li { float: none; }
#nav ul ul { top: 0; }
/* Essentials - configure this */
#nav ul { width:200px; height:102px; }
#nav ul ul {left:200px; }
#nav ul ul li a{height:auto; background:#abd1d8; border-bottom:1px solid #fff;}
#nav ul ul li.hover a{}
/* Everything else is theming */
#nav *:hover {background:url(../images/menuHover.png) repeat-x;}
#nav li a {
	color: #333; 
	font-size: 13px; 
	text-decoration:none; 
	height:16px; 
	padding:78px 15px 10px 15px;
}
#nav ul {top:102px;}
#nav ul li{border-bottom:1px solid #ccc;}
#nav ul li a{background-image:none; background-color: #42b2c6; height:10px; padding:10px 10px 15px 20px; color:#FFF; font-size:10px;}
#nav ul li.hover a{color:#333;}
#nav .menuFirst{background:url(../images/leftShadow.png) no-repeat left;}
#nav .menuFirst a{background:url(../images/menuSeperator.png) no-repeat right;}
#nav .menuFirst.hover a{background:url(../images/menuHover.png) repeat-x;}
#nav .menuMiddle{background:url(../images/menuSeperator.png) no-repeat right;}
#nav .menuLast{background:url(../images/rightShadow.png) no-repeat 66px;}
/* #nav ul a { border-bottom: none; } - I also needed this for IE6/7 */