	
	
	
	#divNav {
		
		margin: 0;
		padding: 0;
		height: 72px;
		width: 960px;
	}

	#nav {
		position: relative;
		margin-top: 50px;
		height: 50px;
		width: 940px;
		position: absolute;
		z-index: 2000; 
	}

	#nav li ul, #nav li ul {
		margin: 0;
		padding: 0;
		
	}

	#nav a {
		text-decoration: none;
	}

	#nav li { /*float the main list items*/
		margin: 0;
		float: left;
		display: block;
	}

	#nav li ul {
		display: none;
	}

	#nav li.off ul, #nav li.on ul  { /*put the subnav below*/
		position: absolute;
		top: 22px;
		left: 0;
		z-index:200;
		padding-top: 12px;
		background: #ffffff;
		height: 162px;
		width: 630px;
		padding-left: 12px;
	}

	#nav li.on ul {
		background: #f90;
	}

	#nav li.on:hover ul, #nav li.over ul { /*for ie*/
	
		border: 1px solid red;
	}

	#nav li a {
		color: #224d6f;
		font-weight: bold;
		display: block;
		width: 105px;
		padding: 0;
	}

	#nav li.on a {
		color: #f90;
	}

	#nav li.on ul a, #nav li.off ul a {
		border: 0;
		float: left; /*ie doesn't inherit the float*/
		color: #f90;
		width: auto;
		margin-right: 12px;
	}

	#nav li.on:hover ul a, #nav li.over ul li a { /*for ie - the specificity is necessary*/
		background: #ffffff;
	}

	#nav li.on ul {
		display: block;
	}

	#nav li.off:hover ul, #nav li.over ul {
		display: block;
		width:912px;
		z-index: 150;
	}

	#nav li.off a:hover, #nav li.on a:hover { 
		color: #f90;
	}

	/*do the image replacement*/

	#nav li span {
		position: absolute;
		left: -9384px;
	}

	#linews a, #liproducts a, #licompany a, #licontact a, #lipress a {
		display: block;
		position: relative;
		height: 22px;
		background:transparent url(images/NAVBG.jpg) no-repeat scroll 0 0; /*contains all hover states*/
		
	}

/*first, put thttp://foxycart.misewell.com/company.asp#he initial states in place*/

#linews a {
	background-position: 0 0;
}

#liproducts a {
	background-position: -106px 0;
}

#licompany a {
	background-position: -212px 0;
}

#licontact a {
	background-position: -318px 0;
}

#lipress a {
	background-position: -423px 0;

}


/*active area - for this demo - the code could be based on a body class, and probably work better.*/

 #licompany.on a {
 	background-position: -204px -37px;
 } /*add selectors for the other li's and background-positions*/

/*hover states*/

#linews a:hover, #linews:hover a, #linews.over a {
	background-position: 0 -66px;
	
}

#liproducts a:hover, #liproducts:hover a, #liproducts.over a {
	background-position: -106px -66px;
}

#licompany a:hover, #licompany:hover a, #licompany.over a {
	background-position: -212px -66px;
}

#licontact a:hover, #licontact:hover a, #licontact.over a {
	background-position: -318px -66px;
}

#lipress a:hover, #lipress:hover a, #lipress.over a {
	background-position: -423px -66px;
}


/*subnav formatting*/

#nav li.off ul a, #nav li.on ul a {
	display: block;
	font-family: arial, verdana, sans-serif;
	font-size: small;
}		



	</style>

