@charset "utf-8";
body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #242424;
	margin: 0; /* Es empfiehlt sich, margin (Rand) und padding (Auffüllung) des Body-Elements auf 0 einzustellen, um unterschiedlichen Browser-Standardeinstellungen Rechnung zu tragen. */
	padding: 0;
	text-align: center; /* Hierdurch wird der Container in IE 5*-Browsern zentriert. Dem Text wird dann im #container-Selektor die Standardausrichtung left (links) zugewiesen. */
	color: #000;
}
a:link{
	color: #FCCF19;
}
a:visited{
	color: #FF0;
}
a:hover{
	color: #FF0;
}
a:active{
	color: #FF0;
}
#nav a:link,
#nav a:visited,
#nav a:hover,
#nav a:active,
#footer a:link,
#footer a:visited,
#footer a:hover,
#footer a:active{
	text-decoration: none;
}
#container,
#footer{
	border-bottom-right-radius: 8px; /* runde Ecken nach CSS3, für Webkit-Browser sowie IE durch HTC-Skript */
	border-bottom-left-radius: 8px;
	-moz-border-radius-bottomright: 8px; /* runde Ecken für Firefox */
	-moz-border-radius-bottomleft: 8px;
	behavior: url(border-radius.htc); /* runde Ecken für IE durch Verwendung von VML durch Skript (benötigt Active-X) */
}
#container {
	width: 70%;
	max-width: 920px;
	background: #4B4B4B;
	color: #FBFBFB;
	margin: 1.3% auto; /* Durch automatische Ränder (in Verbindung mit einer Breite) wird die Seite zentriert. */
	text-align: left; /* Hierdurch wird die Einstellung text-align: center im Body-Element überschrieben. */
} 
#header {
	background: #6E6E6E;
	color: #FCCF19;
	padding: 0 10px;  /* Diese Auffüllung entspricht der linksbündigen Ausrichtung der Elemente in den divs, die darunter erscheinen. Wenn im #header anstelle von Text ein Bild eingesetzt wird, sollten Sie die Auffüllung entfernen. */
} 
#header h1 {
	margin: 0 1.1em; /* 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. */
	font-size: 2.1em;
	text-align:right;
}
#nav {
	float: left; 
	width: 10em; /* Da es sich hier um ein floatendes Element handelt, muss eine Breite angegeben werden. */
	padding: 3.5em 0 5em 0; /* Durch die Auffüllung oben und unten entsteht in diesem div ein visueller Leerraum.  */
	margin-left: 0.4em;
	line-height: 1.9em;
	font-size: 1.2em;
}
#nav ul{
	list-style: none;
}
#mainContent {
	margin: 1.7em 2.6em 0.7em 13.5em; /* Der rechte Rand kann in Prozent oder Pixel angegeben werden. Durch ihn entsteht der Abstand am rechten Seitenrand. */
	text-align: justify;
}
#mainContent h1 {
	font-size: 1.6em;
	margin-left: 1.1em;
}
#mainContent img {
	margin-top: 0.6em;
}
#footer {
	padding: 0 10px; /* Diese Auffüllung entspricht der linksbündigen Ausrichtung der Elemente in den divs, die darunter erscheinen. */
	background: #6E6E6E;
	color: #4B4B4B;
}
#footer p {
	margin: 0; /* Wenn Sie die Ränder des ersten Elements in der Fußzeile auf 0 einstellen, können Sie unerwartete Abstände zwischen divs vermeiden. */
	padding: 10px 0; /* Durch die Verwendung der Auffüllung bei diesem Element entsteht genau wie bei einem Rand ein Leerraum, aber ohne die potenziellen Abstandsprobleme. */
	text-align: center;
}