@charset "UTF-8";
/* CSS Document */

*{
	margin: 0;
	padding: 0;
	}
body{
	padding-top: 60px;
	background: #bbb;
	}
div#shadow{
	width: 978px;
	height: 572px;
	padding: 3px;
	margin: 0 auto;
	position: relative;
	background: url(gfx/shadow.png) no-repeat;
	}
div#rahmen{
	width: 960px;
	height: 560px;
	padding: 6px;
	position: relative;
	}
div#rahmen.start{
	background: url(images/start.jpg) 6px 6px #ebe8e2 no-repeat;
	}
div#rahmen.unterricht{
	background: url(images/unterricht.jpg) 6px 6px #ebe8e2 no-repeat;
	}	
div#rahmen.proben{
	background: url(images/proben.jpg) 6px 6px #ebe8e2 no-repeat;
	}
div#rahmen.gruppen{
	background: url(images/gruppen.jpg) 6px 6px #ebe8e2 no-repeat;
	}	
div#rahmen.tarife{
	background: url(images/tarife.jpg) 6px 6px #ebe8e2 no-repeat;
	}	
div#rahmen.uebermich{
	background: url(images/ueber-mich.jpg) 6px 6px #ebe8e2 no-repeat;
	}		
div#rahmen.kontakt{
	background: url(images/kontakt.jpg) 6px 6px #ebe8e2 no-repeat;
	}		

ul#zitate{
    position: absolute;
	top: 120px;
	left: 600px;
	height: 49px;
	list-style: none;
	color: #fff;
	font: normal 12px Arial, Helvetica, sans-serif;
	width: 350px;
	height: 300px;
	}
ul#zitate li{
	display: block;
	width: 350px;
	height: 300px;
	background: url(images/unterricht.jpg) -594px -114px no-repeat;
	}
ul#zitate li img{
	display: block;
	}
ul#navi{
	list-style: none;
	position: absolute;
	top: 20px;
	left: 40px;
	z-index: 999;
	}
ul#navi li{
	float: left;
	padding: 0 20px 0 0;
	}
ul#navi li a{
	display: block;
	overflow: hidden;
	outline: none;	
	}
ul#navi a.start{
	width: 77px;
	height: 38px;
	background: url(gfx/navi-start-bg.png) left top no-repeat;
	text-indent: -9999px;
	}
ul#navi a.start:hover, ul#navi a.start.active{
	background: url(gfx/navi-start-bg.png) left -38px no-repeat;
	}
ul#navi a.unterricht{
	width: 150px;
	height: 43px;
	background: url(gfx/navi-unterricht-bg.png) left top no-repeat;
	text-indent: -9999px;
	}
ul#navi a.unterricht:hover, ul#navi a.unterricht.active{
	background: url(gfx/navi-unterricht-bg.png) left -44px no-repeat;
	}
ul#navi a.proben{
	width: 110px;
	height: 45px;
	background: url(gfx/navi-proben-bg.png) left top no-repeat;
	text-indent: -9999px;
	}
ul#navi a.proben:hover, ul#navi a.proben.active{
	background: url(gfx/navi-proben-bg.png) left -49px no-repeat;
	}
ul#navi a.gruppen{
	width: 98px;
	height: 49px;
	background: url(gfx/navi-gruppen-bg.png) left top no-repeat;
	text-indent: -9999px;
	}
ul#navi a.gruppen:hover, ul#navi a.gruppen.active{
	background: url(gfx/navi-gruppen-bg.png) left -53px no-repeat;
	}	
ul#navi a.tarife{
	width: 88px;
	height: 41px;
	background: url(gfx/navi-tarife-bg.png) left top no-repeat;
	text-indent: -9999px;
	}
ul#navi a.tarife:hover, ul#navi a.tarife.active{
	background: url(gfx/navi-tarife-bg.png) left -41px no-repeat;
	}
ul#navi a.uebermich{
	width: 133px;
	height: 38px;
	background: url(gfx/navi-uebermich-bg.png) left top no-repeat;
	text-indent: -9999px;
	}
ul#navi a.uebermich:hover, ul#navi a.uebermich.active{
	background: url(gfx/navi-uebermich-bg.png) left -42px no-repeat;
	}	
ul#navi a.kontakt{
	width: 105px;
	height: 42px;
	background: url(gfx/navi-kontakt-bg.png) left top no-repeat;
	text-indent: -9999px;
	}
ul#navi a.kontakt:hover, ul#navi a.kontakt.active{
	background: url(gfx/navi-kontakt-bg.png) left -45px no-repeat;
	}
div.inhalt{
	font: normal 13px/17px arial, helvetica, sans-serif;
	color: #222;
	position: absolute;
	z-index: 999;
	left: 265px;
	top: 58px;
	}
div.inhalt h1{
	font: bold 13px/17px arial, helvetica, sans-serif;
	}
div.inhalt a{ color:#000  
	} 
div.inhalt p{
	margin-top: 8px;
	}
div.inhalt.start{ 
	top: 345px;
	left: 668px;
	width: 220px;
	height: 128px;
	background: url(gfx/inhalt-bg-start.png) no-repeat;
	padding: 100px 32px 0 35px;
	}
div.inhalt.unterricht{
	top: 70px;
	left: 60px;
	width: 420px;
	height: 400px;
	background: url(gfx/inhalt-bg-unterricht.png) no-repeat;
	padding: 55px 110px 0 75px;
	}
div.inhalt.proben{
	top: 80px;
	left: 450px;
	width: 290px;
	height: 528px;
	background: url(gfx/inhalt-bg-proben.png) no-repeat;
	padding: 110px 40px 0 60px;
	}	
div.inhalt.gruppen{
	top: 72px;
	left: 36px;
	width: 290px;
	height: 340px;
	background: url(gfx/inhalt-bg-gruppen.png) no-repeat;
	padding: 90px 40px 0 48px;
	}
div.inhalt.tarife{
	top: 55px;
	left: 440px;
	width: 370px;
	height: 360px;
	background: url(gfx/inhalt-bg-tarife.png) no-repeat;
	padding: 80px 60px 0 60px;
	}	
div.inhalt.tarife span{
	display: block;
	width: 220px;
	float: left;
	}
div.inhalt.uebermich{
	top: 64px;
	left: 470px;
	width: 340px;
	height: 452px;
	background: url(gfx/inhalt-bg-uebermich.png) no-repeat;
	padding: 76px 60px 0 66px;
	}
div.inhalt.kontakt{
	top: 97px;
	left: 350px;
	width: 245px;
	height: 315px;
	background: url(gfx/inhalt-bg-kontakt.png) no-repeat;
	padding: 95px 60px 0 40px;
	}		
div#footer{
	font: normal 12px Arial, Helvetica, sans-serif;
	color: #222;
	position: absolute;
	bottom: 6px;
	left: 10px;
}
div#footer span{
	margin: 0 14px 0 0;
	}
div#footer a{
	color: #000;
	}	
#map{
	margin-top: 4px;
	}
#map div span{
	display: none;
	}