/* There is a version of this file commented in great detail for educational purposes here:
 * http://users.tpg.com.au/j_birch/plugins/superfish/superfish.commented.css
 */

/*** ESSENTIAL STYLES ***
#nav, #nav * {
	margin: 0;
	padding: 0;
	list-style: none;
}


#nav ul {
	position:absolute;
	top:-999em;
}

#nav ul li,
#nav a {
	
}

#nav li {
	float:left;
	position:relative;
	z-index: 210;
}

#nav a {
	display:block;
}

#nav li:hover ul,
ul#nav li.sfHover ul {
	left: -1px;
	top: 39px;
}

#nav li:hover li ul,
#nav li.sfHover li ul {
	top: -999em;
}

#nav li li:hover ul,
ul#nav li li.sfHover ul {
	left: 150px;
	top: -1px;
}

.superfish li:hover ul,
.superfish li li:hover ul {
	top: -999em;
}

*** SKIN ***
#nav {
	background: url(/images/nav.jpg) 0px 0px repeat-x;
	width: 936px;
	height: 39px;
	position: absolute;
	bottom: 0px;
	left: 120px;
}

#nav li {
	
}

#nav a,
#nav span.left,
#nav span.right { background-image: url(/images/navBg.jpg); }

#nav a {
	color: #FFF;
	text-decoration: none;
	display: block;
	float: left;
	font-size: 13px;
	background-repeat: repeat-x;
	background-position: 0px -39px;
	background-color: #4D4D4D;
}
#nav a:hover { background-position: 0px -78px; }

#nav span {
	float: left;
}

#nav a span {
	cursor: pointer;
}

#nav a span.center {
	padding: 0 29px;
	line-height: 39px;
}

#nav span.left,
#nav span.right {
	float: left;
	display: block;
	background-repeat: no-repeat;
	background-position: top left;
	width: 2px;
	height: 39px;
	background-repeat: no-repeat;
	overflow: hidden;
	cursor: pointer;
}

#nav span.left 			{ background-position: 0px 0px; }
#nav span.right 		{ background-position: -2px 0px; }

#nav a:hover span.left 	{ background-position: -4px 0px; }
#nav a:hover span.right { background-position: -6px 0px; }


#nav li:hover a, #nav li.sfHover a, #nav li a:hover {
	
}

#nav li:hover, #nav li.sfHover,
#nav a:focus, #nav a:hover, #nav a:active {
	
}

#nav li:hover, #nav a:hover {
	
}
*/
/* DROP DOWN */
/*
#nav ul {
	width: 175px;
}

#nav li li a {
	text-align: left;
	font-weight: normal;
	padding: 5px 5px 5px 10px;
	border-bottom: 1px solid #717171;
	width: 150px;
	background: #5C5C5C;
}

#nav li:hover li a, #nav li.sfHover li a, #nav li li a {
	border-right: none;
	border-left: none;
}

#nav li li a:hover {
	background: #6D6D6D;
	border-left: none;
	border-right: none;
}

#nav a span {
	text-align: center;
}


html
<ul id="nav">
					<span class="right">&nbsp;</span>
					<li><% makeNav linkOurFirm,"Our Firm","firm" %>
						<ul>
							<li><a href="<%=linkPhilosophy%>">Our Philosophy</a></li>
							<li><a href="<%=linkPeople%>">Our People</a></li>
						</ul>
					</li>
					<li><% makeNav linkServices,"Our Services","services" %>
						<ul>
							<li><a href="<%=linkNUA%>">NUA Distribution Strategy</a></li>
							<li><a href="<%=linkStock%>">Stock Option Analysis</a></li>
							<li><a href="<%=linkHedging%>">Hedging Strategies</a></li>
							<li><a href="<%=linkEmployee%>">Employee Stock Purchase Plans</a></li>
							<li><a href="<%=linkRestricted%>">Restricted Securities Management</a></li>
							<li><a href="<%=link10b%>">10b5-1 Planning</a></li>
							<li><a href="<%=linkCorporate%>">Corporate Services</a></li>
						</ul>
					</li>
					<li><% makeNav linkEnhancing,"Enhancing Wealth","wealth" %>
						<ul>
							<li><a href="<%=linkPorfolioMgmt%>">Portfolio Management</a></li>
						</ul>
					</li>
					<li><% makeNav linkEstablishing,"Establishing Legacy","legacy" %>
						<ul>
							<li><a href="<%=linkFiduciary%>">Fiduciary Services</a></li>
							<li><a href="<%=linkPhilanthropy%>">Philanthropy</a></li>
						</ul>
					</li>
					<li><% makeNav linkResources,"Resources &amp; Events","resources" %>
						<ul>
							<li><a href="<%=linkPublications%>">Publications</a></li>
							<li><a href="<%=linkNews%>">Firm News</a></li>
							<li><a href="<%=linkEvents%>">Events</a></li>
						</ul>
					</li>
					<span class="left">&nbsp;</span>
				</ul>			

			
				<!--
				<div id="nav">
					<span class="right">&nbsp;</span>
					<% makeNav linkOurFirm,"Our Firm","firm" %>
					<% makeNav linkPreserving,"Preserving Assets","assests" %>
					<% makeNav linkEnhancing,"Enhancing Wealth","wealth" %>
					<% makeNav linkMaximizing,"Maximizing Prosperity","prosperity" %>
					<% makeNav linkEstablishing,"Establishing Legacy","legacy" %>	
					<span class="left">&nbsp;</span>
				</div>
				-->
*/



/**** NO DROP MAIN NAV ****/
#nav {
	position: absolute;
	bottom: 0px;
	left: 0px;
	height: 39px;
	overflow: hidden;
	margin: 0 0 0 122px;
}

#nav a {
	color: #FFF;
	text-decoration: none;
	display: block;
	float: left;
	font-size: 13px;
}

#nav span {
	float: left;
	background-image: url(/images/navBg.jpg);
}

#nav a span {
	cursor: pointer;
}

#nav a span.center {
	padding: 0 29px;
	line-height: 39px;
	background-repeat: repeat-x;
	background-position: 0px -39px;
}

#nav a:hover .center {
	background-position: 0px -78px;
}


#nav span.left,
#nav span.right {
	float: left;
	display: block;
	background-repeat: no-repeat;
	background-position: top left;
	width: 2px;
	height: 39px;
	background-repeat: no-repeat;
}

#nav span.left 			{ background-position: 0px 0px; }
#nav span.right 		{ background-position: -2px 0px; }

#nav a:hover span.left 	{ background-position: -4px 0px; }
#nav a:hover span.right { background-position: -6px 0px; }
