body{
	margin:0;
	padding:0;
	color: black;
	font-size: 100.01%; /* umgeht den Font-Size-Bug im Safari, älteren Operas und IE */
	font-family: verdana, arial, sans-serif ;
	text-align:center;
}

h1, h2, h3, h4, h5, h6 { 
  color: #2E5E82;
  font-weight: normal;
  font-family: verdana, arial, sans-serif 
}
a { color: #2E5E82; text-decoration: underline; } /* Unbesuchten Links in dunkelblauer Farbe und unterstrichen. */
a:visited { color: #5E6167; } /* Besuchte Links in grau. Somit erkennt man wo man schon war. */

img{ border:0;}

#container{
	margin: 10px auto;
	background-color: #fff;
	color: #333;
	border: 1px solid #5E6167;
	font-size: 0.8em;
	width: 70em; 
	text-align:left;
}
#top{
	background-color: #5E6167;
	border-bottom: 1px solid #5E6167;
	text-align:right; 
}
#slogan{
	margin: 0;/*5px 13px 5px 5px;*/
	padding: 0;

	
}
#slogan div{
	text-align:left;
	
	width:90px;
	float:left;
	font-size:12px;
	margin-top: 5px;
	margin-left: 10px;
}
#slogan a{
	color:#fff;
}
#slogan a:hover{
	text-decoration:none;
}
#slogan h1, #slogan strong{
	width:700px;
	color:#fff;	
	font-size:15px;
	padding: 5px 13px 5px 5px;
	margin:0;
	font-weight:bold;
	float:right;
	display:block;
	line-height: 0.8em;	
}
.clearboth{
	clear:both;
}
#logo {
  background: url('../img/BackgroundSmall.png') right top no-repeat;
  height: 121px;  /* Das Bild der Spirale ist 122px */
  padding: 0;
  background-color: #fff;
  text-align:left;
  margin: 0; /* Manche Browser haben das schon voreingestellt aber nicht alle, deshalb vereinheitlichen wir das. */
}
#logo img{ 	margin:5px; }

#leftnav{
	float: left;
	width: 200px;
	margin: 0;
	padding: 1em;
}

#content{
	margin-left: 220px;
	padding: 1em;
}


#content h1, h2.h2_like_h1 { /* h2 in der index.html soll aussehen wie eine h1 Überschrift */
	margin:15px 0 5px 0;
	padding:0;
	font-size: 1.8em; 
	line-height:1.1em; 
}
#footer{
	clear: both;
	margin: 0;
	padding: 4px  5px 3px 5px;
	color: #fff;
	background-color: #5E6167;
}
#footer a {   color: white; } /* Wegen des grauen Hintergrunds müssen in der Fusszeile auch Links weiß dargestellt werden. */
 
#footer a:visited { color: white; } /* Auch besuchte Links bleiben wegen des grauen Hintergrunds weiß. */

#invisible a, #invisible a:visited, #invisible a:hover, #invisible a:active {color: white;} /* Trick für unsichtbare Links */

#leftnav p { margin: 0 0 1em 0; }

.fleft { /* Sachen, an denen der Text vorbeifließen soll, wierden diese Klassen zugewiesen. */
  float: left;
  margin: 0 1em 0.2em 0; /* Man sollte einen schönen Abstand wählen, sonst kleben die Sachen so am Text. */
}
.fright {
  float: right;
  margin: 0 0 0.2em 1em;
  padding: 1px;
}
/* - Navigation - */
#navigation {
	padding-top:24px; /* Die Menüpunkte sollten etwas Abstand zum Kopfteil haben. */
	padding-bottom:24px; /* Die Menüpunkte sollten etwas Abstand zur Fusszeile haben. */
	line-height: 1.3em; /* Zeilenabstand wird vergrössert für bessere Trennung der "Menüpunkte". */
}

#navigation ul {
	clear: both;
	list-style: none; /* Die Bullets vor den Menüpunkten schalten wir ab. */
	padding: 0 4px 0 4px;
	margin: 0;
}
#navigation ul.menu-e1 {
	font-weight: bold; /* Text in der ersten Navigationsebene */
}
#navigation ul.menu-e2 {
	font-weight: normal; /* Text in der zweiten Navigationsebene  */
	margin-top:-4px;
}
#navigation li {
	margin:0;
	padding:0;
	border:1px solid #fff;
}
#navigation li a {
	display: block; 
	padding: 1px 0 1px 6px;
	margin: 0 0 4px 0;	
	color: #2E5E82; /*  Links werden im Navigationsmenü...  */
	text-decoration:none; /* ...ohne Unterstreichung dargestellt. */
}


/* Ab der 2. Navigationsebene kleinere Abstände */
#navigation li li a {
	padding-top:2px;
	padding-bottom: 2px;
	margin-bottom: 1px;

}
/* IE */
* html #navigation li li a {
	margin-bottom: 0px;
}

/* Einzüge links in der erster und zweiter Menüebene. */
#navigation li li a {
	padding-left: 15px;
}
#navigation li li li a {
	padding-left: 30px;
}

#navigation ul a:visited { color: #5E6167; } /* Besuchte Links werden grau. */
#navigation ul a:focus { text-decoration:underline; color:#71A1C5; } /* Beim "Durchsteppen" mit der Tabulator-Taste wird Link blau und unterstrichen. */
#navigation ul a:hover { text-decoration:underline; color:#71A1C5; } /* Beim "Maus-Über" wird Link blau und unterstrichen. */
#navigation ul a:active { text-decoration:underline; color:#71A1C5; } /* Beim Anlicken wird Link blau und unterstrichen. */

#navigation ul.menu-e1 a.selected {
   background-color: #71A1C5; /* Der selektierte Navigationspunkt wird blau hinterlegt. */
   color: white; /* Aufgrund des blauen Hintergrunds ist weißer Text leichter zu erkennen. */
}

