/* ================================================================
css style für navigation ndungukina.de
=================================================================== */

#divNav {
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		height: 60px;
		width: 750px;
	}

	#nav {
		position: relative;
		top: 0px;
		margin-left: 0px;
		height: 60px;
		width: 720px;
	}

	#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: 0px;
	}

	#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: 5px;
		background: #FFCC66;
		height: 30px;
		width: 750px;
		padding-left: 60px;
	}

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

	#nav li.on:hover ul, #nav li.over ul { /*for ie*/
		background: #FFCC66;
	}

	#nav li a {
		color: #FFCC66f;
		display: block;
		width: 90px;
		padding: 0;
	}

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

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

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

	#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, #nav li.on a:hover {
		color: #fff;
	}

	/*do the image replacement*/

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

	#home a, #band a, #news a, #galerie a, #archiv a, #presse a, #projekte a, #kontakt a {
		display: block;
		position: relative;
		height: 30px;
		background: url(../../img/navi/bk-dropdownMap.jpg) no-repeat; /*contains all hover states*/
	}

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

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

#band a {
	background-position: -90px 0;
}

#news a {
	background-position: -180px 0;
}

#galerie a {
	background-position: -270px 0;
}

#archiv a {
	background-position: -360px 0;
}

#presse a {
	background-position: -450px 0;
}


#projekte a {
	background-position: -540px 0;
}

#kontakt a {
	background-position: -630px 0;
}
/*active area - for this demo - the code could be based on a body class, and probably work better.*/

 #home.on a {
 	background-position: 0px -30px;

 }

 #band.on a {
 	background-position: -90px -30px;

 }

 #news.on a {
 	background-position: -180px -30px;

 }

 #galerie.on a {
 	background-position: -270px -30px;

 }

 #archiv.on a {
 	background-position: -360px -30px;

 }

 #presse.on a {
 	background-position: -450px -30px;

 }

 #projekte.on a {
 	background-position: -540px -30px;

 }

 #kontakt.on a {
 	background-position: -630px -30px;

 }
/*hover states*/

#home a:hover, #home:hover a, #home.over a {
	background-position: 0 -30px;
}

#band a:hover, #band:hover a, #band.over a {
	background-position: -90px -30px;
}

#news a:hover, #news:hover a, #news.over a {
	background-position: -180px -30px;
}

#galerie a:hover, #galerie:hover a, #galerie.over a {
	background-position: -270px -30px;
}

#archiv a:hover, #archiv:hover a, #archiv.over a {
	background-position: -360px -30px;
}

#presse a:hover, #presse:hover a, #presse.over a {
	background-position: -450px -30px;
}

#projekte a:hover, #projekte:hover a, #projekte.over a {
	background-position: -540px -30px;
}

#kontakt a:hover, #kontakt:hover a, #kontakt.over a {
	background-position: -630px -30px;
}
/*subnav formatting*/

#nav li.off ul a, #nav li.on ul a {
	display: block;
	background: #ffcc66;
	color: #000;
	font-family: Trebuchet MS, arial, verdana, sans-serif;
	font-size: 1.3em;
}

#nav li.on ul a {
	background: #ffcc66;
}