/*** Allgemeines ***/
body {
	background: #CCCCCC;
	color: #999999;
	margin: 0;
  	padding: 2%; /* Abstand, damit der Anschein eines Blattes auf der Wand immer erhalten bleibt. */
  	min-width: 770px; /* Mindestens 770px breit, kleiner dann Scrollbalken */
}

a { /* unbesuchte Links */ 
	color: #966F43; text-decoration: underline;
}

a:visited { /* besuchte Links */
	color: #999999;
}

h1 {
  	font-size: 1.8em;
  	/*line-height: 0.8em;*/
  	padding: 1.2em 0 0.2em 0;
  	/*margin: 0;*/
}

h2 {
	font-size: 1.1em;
  	line-height: 1.4em;
  	padding: 0.7em 0 0.1em 0;
}

h1, h2, h3, h4, h5, h6 { 
  	color: #966F43;
  	font-weight: lighter;
  	font-family: verdana, arial, sans-serif;
}

img {
  	border: none;
  	max-width: 95%;
}

.fleft { /* hier fließt der Text rechts vorbei */
  	float: left;
  	margin: 0 1em 0.2em 0;
  	padding: 1px;
}

.fright { /* hier fließt der Text links vorbei */
  	float: right;
  	margin: 0 0 0.2em 1em;
  	padding: 1px;
}

/*** Layoutspezifisches ***/
#container {
  	font-size: 0.78em;
  	font-family: verdana, arial, sans-serif;
  	font-weight: lighter;
  	max-width: 65em; /* Begrenzung der Breite auf höhstens 65em, um nicht zu lange Textbreiten zu erhalten. */
  	margin: auto; /* Seite zentrieren */
  	border: 1px solid #966F43;  Eine kleine optische Abgränzung. */
  	border-top: 0;
  	background: white;
}

ol.decimal {
	list-style-type: decimal;
	list-style-position: outside;
}

/*** Logo bzw. Kopf ***/
#logo {
  	background: url(../img/logo.jpg) 0 0 no-repeat #966F43;
  	height: 81px;
  	margin: 10px;
  	padding: 0 20px;
  	overflow: hidden; 
}

/*** Menü ***/
#menu {
  	background-color: white;
  	padding: 1px 0 0 10px;
  	margin: -3px 10px 20px 10px;
  	text-align: left;
  	/*border-top: 2px solid #966F43; */
  	color: #CCCCCC; /* Farbe des Menüpunktes der Seite auf der wir gerade sind */
}

#menu2 {
  	background-color: white;
  	padding: 5px 0 7px 0;
  	margin: 10px 10px 0 10px;
  	text-align: left;
  	border-top: 3px double #966F43;
  	border-bottom: 3px double #966F43;
  	color: #CCCCCC; /* Farbe des Menüpunktes der Seite auf der wir gerade sind */
}

#menu li {
  	font-size: 0.9em;
  	display: inline; /* Damit die Menüpunkte nebeneinander und nicht untereinander stehen. */
  	list-style-type: none;  /* keine Bullets vor den Menüpunkten */
  	padding: 0 10px 0 10px;
  	font-weight: bold;
}

#menu li a {
  	color: #966F43;
  	text-decoration: none;
}

#menu2 li {
  	font-size: 0.9em;
  	display: inline; /* Damit die Menüpunkte nebeneinander und nicht untereinander stehen. */
  	list-style-type: none;  /* keine Bullets vor den Menüpunkten */
  	padding: 0 10px 0 10px;
  	font-weight: bold;
}

#menu2 li a {
  	color: #966F43;
  	text-decoration: none;
}

/*** Fußnote ***/
#footer {
  	clear: both; /* Damit #main mindestens so hoch ausgedehnt wird wie #subnav, falls #subnav länger sein sollte. */
  	background-color: white;
  	/*font-size: 0.8em;*/
  	text-align: left;
  	border-top: 1px solid #966F43;
  	margin-top: 50px;
  	margin-left: 10px;
  	margin-right: 10px; 
  	padding-left: 0px;  
  	padding-bottom: 6px;
  	padding-top: 1px;
}

#footer_1 { /* links */ 
	width: 30%; 
	float: left; 
	padding-left: 10px; 
	padding-right: 10px; 
	display: block;
}

#footer_m { /* mitte */
	width: 28%; 
	float:left;  
	padding-left: 10px; 
	padding-right: 10px; 
	display: block;
}

#footer_r { /* rechts */
	margin-left: 58%; 
	margin-right: 0px; 
	padding-left: 10px; 
	padding-right: 10px; 
	display: block;
}

.footer_head {
	font-size: 0.9em;
  	font-weight: bold;
  	font-variant: small-caps;
  	letter-spacing: 0.1em;
  	color: #966F43; 
  	margin-bottom: -4pt;
}
  
.footer_next {  
	font-size: 0.7em;
  	font-weight: lighter;
  	padding-top:-4pt;
}

/* - Subnavigation, Rechte Spalte - */
#subnav {
  width: 26%; /* Je kleiner das Fenster desto kleiner soll auch die Breite der Subnavigation werden, damit immer genügend Platz für den richtigen Inhalt bleibt. */
  min-width: 10em; /* Damit uns die Subnavigarion nicht zu sehr zusammengeschoben wird. */
  float: right; /* Damit erreichen wir dass der Inhalt links neben der Subnavigation vorbeifließt und nicht erst unten drunter anfängt. */
  padding: 30px 1% 1em 1%;
  margin: 1em 1% 0 1%;
  /*border-left: 1px dotted #aaa;*/ /* Hiermit trennen wir optisch die Subnavigation vom eigentlichen Inhalt ab. */
  font-size: 0.8em; /* Die Schriftgröße setzen wir hier ein wenig herunter damit erkennbar wird dass das Informationen zweiter Rangordnung sind. */
}
#subnav dt { /* Die einzelnen Überschriften in der Subnavigation */
  font-size: 1.1em;
  font-family: verdana, arial, sans-serif;
  font-weight: bold;
  padding-top: 1em;
  margin-top: 1em;
  border-top: 1px dotted #966F43; /* Hier eine optische Trennungslinie zwischen den einzelnen Bereichen der Subnavigation. */
}
#subnav dd { /* Die Unterpunkte der Subnavigation. */
  padding: 0;
  margin: 0.5em 0;
}


/* - Der Hauptinhaltsteil - */
#main {
  /*background: url(../img/zahn_blau_grau_90_64.jpg) no-repeat 94% 0.2em white;*/ /* Die kleine, blaue, halbdurchsichtige Blume wird als Hintergrundbild, welches rechts oben in der Ecke steht, definiert. */
  padding: 0 31% 0 20px; /* Der rechte Abstand (31%) stellt sicher, dass auch nach dem Umfließen der Subnavigation der Text genau so breit wird wie oben und ein zwei-Spalten Eindruck entsteht. */
  line-height: 1.5em; /* Zur besseren Lesbarkeit erhöhen wir die Zeilenhöhe. */
  min-height: 300px;
 }
 
#main2 {
  /*background: url(../img/zahn_blau_grau_90_64.jpg) no-repeat 94% 0.2em white;*/ /* Die kleine, blaue, halbdurchsichtige Blume wird als Hintergrundbild, welches rechts oben in der Ecke steht, definiert. */
  padding: 0 20px 0 20px; /* Der rechte Abstand (31%) stellt sicher, dass auch nach dem Umfließen der Subnavigation der Text genau so breit wird wie oben und ein zwei-Spalten Eindruck entsteht. */
  line-height: 1.5em; /* Zur besseren Lesbarkeit erhöhen wir die Zeilenhöhe. */
  min-height: 300px;
}