#divNav {

/*		background: transparent url(bk-nav.jpg) no-repeat top left;*/

/*		background-color: #fff;*/

		margin: 0;

		padding: 0;

		height: 50px;

width: 960px;

position:relative;

top:-8px;

/*border: 1px solid #000;*/

	}



#divNav ul {

padding-left: 60px;

margin: 0;

}





	#nav {

		position: relative;

				top: 0px;

		height: 22px;

		background-color: #DDECFF;

	}

	

		#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;

/*		padding-right: 15px;*/

	}



	#nav li ul {

		display: none;

	}



	#nav li.off ul, #nav li.on ul  { /*put the subnav below*/

		position: absolute;

		top: 25px;

		left: 0;

padding-top: 3px;

		background: #1f2b7d;

		height: 22px;

padding-left: 20px;

width: 940px;

	}



	#nav li.on ul {

		background: #1f2b7d;

			}



	#nav li.on:hover ul, #nav li.over ul { /*for ie*/

		background: #1f2b7d;

			}



	#nav li a {

		color: #1f2b7d;

/*		font-weight: bold;*/

		width: auto;

		padding: 0;

	border-right: 2px solid #fff;

	padding: 2px 15px 3px 15px; 

	}



	a.selected {

	font-weight: bold;

	}

	

	#nav li >a {

display: block;

	}

	

	#nav li.on a {

		color: #fff;

		background: #1f2b7d;

height: 25px;

	}



	#nav li.on a:hover {

		color: #fff;

		background: #1f2b7d;

height: 25px;

	}

	

	#nav li.on ul a:hover {

		color: #f90;

			height: auto;

		}

	

	#nav li.on ul a, #nav li.off ul a {

		border: 0;

		float: left; /*ie doesn't inherit the float*/

		color: #fff;

		width: auto;

		height:auto;

	margin-right: 15px;

	}

	

	

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

		background: #1f2b7d;

	}



	#nav li.on ul {

		display: block;

	}



	#nav li.off:hover ul, #nav li.over ul {

		display: block;

		z-index: 6000;

	}



	#nav li.off a:hover { 

		color: #f90;

	}



	/*do the image replacement*/



	#nav li span {

		position: absolute;

		left: -9384px;

	}



	#liRenaissance a, #liArtNouveau a, #liModern a, #liPostModern a, #liDigital a {

		display: block;

		position: relative;

		height: 26px;

		background: url(bk-dropdownMap.gif) no-repeat; /*contains all hover states*/

	}



/*first, put the initial states in place*/



#liRenaissance a {

	background-position: 0 0;

}



#liArtNouveau a {

	background-position: -102px 0;

}



#liModern a {

	background-position: -204px 0;

}



#liPostModern a {

	background-position: -306px 0;

}



#liDigital a {

	background-position: -408px 0;

}



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



 #liModern.on a {

 	background-position: -204px -37px;

 } /*add selectors for the other li's and background-positions*/



/*hover states*/



#liRenaissance a:hover, #liRenaissance:hover a, #liRenaissance.over a {

	background-position: 0 -73px;

}



#liArtNouveau a:hover, #liArtNouveau:hover a, #liArtNouveau.over a {

	background-position: -102px -73px;

}



#liModern a:hover, #liModern:hover a, #liModern.over a {

	background-position: -204px -73px;

}



#liPostModern a:hover, #liPostModern:hover a, #liPostModern.over a {

	background-position: -306px -73px;

}



#liDigital a:hover, #liDigital:hover a, #liDigital.over a {

	background-position: -408px -73px;

}



/*subnav formatting*/



#nav li.off ul a, #nav li.on ul a {

	display: block;

	background: #1f2b7d;

	color: #fff;

	font-family: arial, verdana, sans-serif;

	font-size: 0.9em;

}		



#nav li.on ul a {

	background: #1f2b7d;

}

