﻿body  {
    	font: 1em Verdana, Arial, Helvetica, sans-serif;
    	background: black;
		margin: 0 0 0 0;
    	padding: 0;
    	text-align: center;
    	color: #dcdcdc;
    }
    
    h1 {
    font-size: 1.6em;
    font-weight: bold;
    color: #b22222;
    }
    
    h2 {
    font-size: 1.2em;
    font-weight: bold;
    }
    
    h3 {
    font-size: 0.8em;
    font-weight: bold;
    }    
    
    .d2r #container {
		background: black url(images/logo_.jpg) no-repeat top;
    	width: 64em;
    	margin: 0px auto;
    	text-align: left;
		border-bottom: 1px dotted #dcdcdc;
		border-left: 1px solid #dcdcdc;
		border-right: 1px solid #dcdcdc;
		border-top: 1px dotted #000000;
    } 
    
    .d2r #header {     	 
    	height: 260px;
    } 
    
    .d2r #header h1 {
    	margin: 0;
    	/* Wenn Sie den Rand des letzten Elements im #header-div auf 0 einstellen, können Sie das Auftreten unerwarteter Abstände zwischen divs vermeiden. Wenn das div einen Rahmen hat, ist dies unnötig, weil dieser Rahmen die gleiche Wirkung hat. */
    	padding: 10px 0;
    	/* Durch die Verwendung der Auffüllung anstelle von Rändern lässt sich gewährleisten, dass das Element die Kanten des div nicht berührt. */
    }
    
    .d2r #sidebar1 {
    	float: right;
    	width: 21.8em;
    	height: 500px;
    	margin: 0 0 0 0em;
    }
    
    .d2r #sidebar1.pic1 {
		background: url(images/pic_1.jpg) no-repeat scroll top;
    }

    .d2r #sidebar1.pic3 {
		background: url(images/pic_3.jpg) no-repeat scroll top;
    }      

    .d2r #sidebar1.pic2 {
		background: url(images/pic_2.jpg) no-repeat scroll top;
    }
        
    .d2r #sidebar1.pic5 {
		background: url(images/pic_5.jpg) no-repeat scroll top;
    }

    .d2r #sidebar1.pic6 {
		background: url(images/pic_6.jpg) no-repeat scroll top;
    }           
       
    
    .d2r #sidebar1 h3, .d2r #sidebar1 p {
    	margin-left: 10px; 
    	margin-right: 10px;
    }

    .d2r #mainContent {
		border-top: 1px solid #dcdcdc;
		margin: 0 10px 0 0;
		padding: 0 8px 0px 8px;
		background-color: #dddddd;
		color: black;
		width: 40em;
    } 

    
    /* Verschiedene wieder verwertbare Klassen */
    
    /* Mit dieser Klasse können Sie ein Element auf der Seite nach rechts fließen lassen. Das floatende Element muss vor dem Element stehen, neben dem es auf der Seite erscheinen soll. */
    .fltrt {
    	float: right;
    	margin-left: 8px;
    }
	/* Mit dieser Klasse können Sie ein Element auf der Seite nach links fließen lassen. */    
    .fltlft { 
    	float: left;
    	margin-right: 8px;
    }
    /* Diese Klasse sollte in einem div- oder break-Element platziert werden und das letzte Element vor dem Schließen eines Containers sein, der wiederum einen vollständigen Float enthalten sollte. */
    .clearfloat { 
		clear:both;
		height:0;
		font-size: 1px;
		line-height: 0px;
    }
    
/* Menü */

div#menue {
	font-weight: bold;
	z-index: 1000;
	}

div#menue ul, div#menue ul li {
	display: inline;
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	text-align: left;
}

div#menue a {
	display: block;
	text-decoration:none;
	color: #dfdbd8;
	padding: 3px 4px 5px 4px;
	width: 8em;
	border-bottom: 1px dotted #a9a9a9;
	border-right: 1px solid #a9a9a9;
}
	
div#menue a:hover, div#menue a:active {
	background-color: #ADA39D;
	color: #e9e9e9;
	}

.hier {
	background-color: #b22222;
	}
	
#bt {
	border-top: 1px dotted #a9a9a9;	
}		
	
/* Ende Menü*/

#scroller {
	position: fixed;
	top: 290px;
	width: 64em;
	height: 65%;
	text-align: left;
	background: transparent repeat-y left top;
	overflow: auto;
	border-top: 1px dotted #dcdcdc;
	/*border-left: 1px solid #dcdcdc;
	border-right: 1px solid #dcdcdc;*/
	border-bottom: 1px dotted #dcdcdc;	
}

#player {
	border: 1px ridge gray;
	width: 38em;
	font-size: 0.8em
	}
	
#credits {
	font-size: 0.7em;
}

