@charset "utf-8";
/* css document */

* 		{ margin:0px; padding:0px; border:none;}
html 	{ overflow-y:scroll; /* permanent scrollbar in Firefox */}
body 	{ font:10px/13px Verdana, Arial, Helvetica, sans-serif; color:#000; background:#868b37 url(../images/body.jpg);}

p   	{ margin-bottom:8px; }
h1  	{ font-size:10px; text-transform:uppercase; }
h2  	{}
hr		{}
ul 	   	{}
li	   	{}
a		{ color:#a82e23; text-decoration:underline;}
a:hover	{ text-decoration:none;}


/* -------------- */
/* layoutelements */
/* -------------- */
div#container 	    	{ width:865px; height:auto; margin:0px auto; margin-top:1px; position:relative;}


/* content-container */
div#content-container	{ width:778px; height:auto; background:#fffad8; border:solid 1px #000; float:left;}

/* header */
div#header				{ width:778px; height:184px;}
h1#branding				{ padding:69px 0 0 85px;}
h1#branding a			{ width:631px; height:86px; display:block; background:url(../images/branding.jpg) no-repeat; text-indent:-9000px; overflow:hidden; }

/* content */
div#content-main	 	{ width:288px; float:right; min-height:419px; height:auto !important; height:419px; padding:10px 100px 30px 0; }
div#content-left	 	{ width:278px; float:right; padding:0 0 0 103px;}

ul#navi 			   	{ list-style-type:none; position:absolute; right:1px; top:75px; } /* zusätzlicher Style für IE6 » ie6.css */
ul#navi li 				{ background-image:none; }
ul#navi li a			{ text-indent:-9000px; overflow:hidden; display:block; }
ul#navi li a.m1 		{ background:url(../images/navi/navi1.gif) no-repeat; width:35px; height:25px; }
ul#navi li a.m2 		{ background:url(../images/navi/navi2.gif) no-repeat; width:56px; height:19px;}
ul#navi li a.m3 		{ background:url(../images/navi/navi3.gif) no-repeat; width:85px; height:24px;}

ul#navi li a:hover.m1, #index ul#navi li a.m1	{ background-position:0 -25px;} /* Diese drei zeilen sagen das sich das Hintergrundbild bei mouse over vertical verschiebt, dadurch erhalten wir den hover effekt. Zusätzlich ist noch die Body-Id Angabe vorhanden, über diese Steuern wir den active Zustand. */
ul#navi li a:hover.m2, #musik ul#navi li a.m2	{ background-position:0 -19px;}
ul#navi li a:hover.m3, #kontakt ul#navi li a.m3	{ background-position:0 -24px;}




/* ----------------------- */
/* classes ans other stuff */
/* ----------------------- */

/* color and fonts */
.color1				{}	
.color2				{}		

/* floats */
.float-stop  		{ clear:both; font-size:0.0001em; line-height:0.00001em;}
.float-right 		{ float:right;}
.float-left 		{ float:left;}

/* margin */
.mT10 				{ margin-top:10px;}
.mT20 				{ margin-top:20px;}
.mT30				{ margin-top:30px;}
.mB10 				{ margin-bottom:10px;}
.mB20 				{ margin-bottom:20px;}
.mB30 				{ margin-bottom:30px;}
.mL10 				{ margin-left:10px;}
.mL20 				{ margin-left:20px;}
.mL30 				{ margin-left:30px;}
.mR10 				{ margin-right:10px;}
.mR20 				{ margin-right:20px;}
.mR30 				{ margin-right:30px;}