/* -- Allgemeines -- */
body {
 color: black;
/** background: url(../icons/bg08.png) #ffff99; /* hell-gelb0 ganz helles violett  Hier sollte man auch wenn man ein Bild als Hintergrund nicht vergessen die Hintergrundfarbe zu setzen. Es k�nte n�lich sein dass man aus versehen fr den Text die gleiche Farbe hat wie fr den Hintergrund wobei die Leute mit ausgeschalteten Bildern nichts erkennen k�nen. */
background: url(../icons/lecker_locker_05.jpg) #ffff99; /* hell-gelb0 ganz helles violett  Hier sollte man auch wenn man ein Bild als Hintergrund nicht vergessen die Hintergrundfarbe zu setzen. Es k�nte n�lich sein dass man aus versehen fr den Text die gleiche Farbe hat wie fr den Hintergrund wobei die Leute mit ausgeschalteten Bildern nichts erkennen k�nen. */
 margin: 15px;
 padding: 2%; /* Ein wenig Abstand damit der Anschein eines Blattes auf der Wand immer erhalten bleibt */
 min-width: 640px; /* Bei weniger als 640px Breite soll ein Scrollbalken erscheinen */
 font-size: 100.01%; /* umgeht den Font-Size-Bug im Safari, �teren Operas und IE */
 font-family: verdana, arial, sans-serif ;
}

/* farben: 
maroon 	#800000  maroon 	kastanienbraun siehe auch selfhtml 
		silver			#C0C0C0
		gray			#808080
		taubenblau	#229999		h1, h2 ...
	dunkles tbblau		#224444		besuchte Links	
		gelb			#ffff99		Texthintergrund
*/



h1, h2, h3, h4, h5, h6 { /* Alle �erschriften bekommen eine besondere Farbe und da sie sehr gro�sind k�nen wir es uns erlauben hier eine Schrift mit Serifen zu w�len. Wir spielen hier ein wenig mit Typographie, und entgegen dem Einheitsbrei auf vielen Seiten. */
 color: #229999; 
 background: #ffff99;
 font-family: Georgia, "Times New Roman", Times, serif;
 font-style: italic;
 line-height: 1.2em;
}

h1 { /* Die �erschrift jeder Seite stellen wir besonders da, denn sie ist sehr wichtig. */
 font-size: 2.4em;
 padding: 20px 0 5px 5%;
 margin: 0;
 /*    border-bottom: 1px dashed #aaa;   */
 }
 
h2 { font-size: 1.8em; }
h3 { font-size: 1.5em; }
 
a { 
color: #229999; 
/*background: #ffff88; */
text-decoration: underline;  /* Alle unbesuchten Links bekommen eine leicht bl�liche Farbe und werden unterstrichen, damit man Sie gleich im Text erkennt. */
font-size: 0.9em;
padding: 5px 5px 5px 5px;
font-style: italic;
font-weight: bold;
}

a:visited { color: #224444; }

a:hover{color: maroon; /* font-size: 1.1em; } /* damit verden alle Links ber dier die Maus ist, gr�er */}

.menu {
color: maroon; 
background: #ffff99;
display: inline; 
 /*  padding: 10px 10px;re-li-o-u  */
 }
 
 .menu-ist { /* die gerade betrachtete Seite soll in der Linkleiste andersfarbig markiert sein */
background: #c0c0c0;
/*font-weight: bold;*/
font-style: normal; /* um beim Ausdrucken (ohne Hintergrund) erkennen zu k�nen welche der Links die aktive Seite ist */
display: inline;

 } 
 
.menu2 {
color: maroon; 
background: #ffff99;
display: inline;
font-size: 0.8em;
 /*padding: 10px 10px; re-li-o-u  */
 } 
 
.menu2-ist { /* die gerade betrachtete Seite soll in der Linleiste andersfarbig markiert sein */
background: #c0c0c0;
/*font-weight: bold;*/
font-size: 1.0em;
font-style: normal; /* um beim Ausdrucken (ohne Hintergrund) erkennen zu k�nen welche der Links die aktive Seite ist */
display: inline;

 } 
 
.skip { /* Da ein wichtiger Screenreader das display: none; auch f�schlicherweise fr sich versteht und nichts vorlie� obwohl das hier sich vor allem an Blinde richtet, muss man es so l�en dass man diesen Link au�rhalb des Sichtfeldes bringt. Somit wird er trotzdem vorgelesen. */
 position: absolute;
 margin-left: -10000px;
}

/* wird im html-dokument mit class=fleft angesprochen */
.fleft { /* Sachen an denen der Text vorbeiflie�n soll werden diese Klassen zugewiesen. */
 float: left;
 margin: 0 1em 0.2em 0; /* Man sollte einen sch�en Abstand w�len sonst kleben die Sachen so am Text. */
  padding: 1px;
}

.fright {
 float: right;
 margin: 0 0 0.2em 1em;
 padding: 1px;
 
}


/* -- Layoutspezifisches -- */

#header {
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 4ex;
	
//	padding-top: 5px;
//	padding-bottom: 5px;
	
	width: 710px;
	
}

#navigation {
	width: 710px;
	padding-bottom: 1ex;
	
	margin-left: auto;
	margin-right: auto;
	background-color: #ffff99;

}
 
.floating_box {
	// Textboxen, die "über" dem Hintergund schweben, und eine Schatten (s.u.) haben können.
	background-color: #ffff99;

   border-left: 1px solid #cccccc;
	border-top: 1px solid #cccccc;
	border-right: 1px solid #888888;
	border-bottom: 1px solid #888888;
	
	position: relative;
}

.shadow {
	/* Durch Einschluss des Schnipsels '<div class="shadow"></div>' kann man
	* (absolut oder relativ) positionierten Blockelementen einen halbtransparenten
	* Schatten hinzufügen.
	* Funktioniert leider nicht mit dem IE6.
	*/
	width: 100%;
	height: 100%;
	
 	background-color: #666666;
	position: absolute;

	top: 15px;
	left: 15px;

	z-index: -1;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* IE8, first! */
	filter: alpha(opacity=50);					/* IE5-7, second! */
	opacity: 0.5;									/* all other browsers */

/*
	width: 710px;
	height: 90px;
*/
}
	
#container { /* Ist dafür gedacht dass die viele Formatierungen einfacher werden, und auch ein gemeinsammer Rand entstehen kann, der nicht ganz au�n am Fenster ist. */
 font-size: 0.8em; /* Ein Kompromiss ber den man sicherlich streiten kann, aber viele Leute empfinden die von Ihnen selbst eingestellte Textgr�e fr zu gro� wissen aber nicht wie man das �dert. */
 max-width: 1000px; /* Eine Begrenzung der Breite auf h�stens 900px. Das machen wir um nicht zu lange Textbreiten zu erhalten welche dann schlecht zu lesen sind. Fr den IE gibt es in ielte.css einen Woraround. */
 margin: auto; /* Hiermit zentrieren wir unsere Seite */  
 border: 1px solid #aaa; /* Eine kleine optische Abgr�zung */
 border-top: 0; /* Ganz oben allerdings wrde es mit dem grauen komisch aussehen, deshalb weg damit. */
}

.unterschrift {
 text-decoration: none;
 font-style: italic;
 font-size: 0.7em;
}

.foto{
 font-family: monospace;
 font-size: 0.7em;
 }
 
.courier-fett{
 font-family: monospace;
 font-size: 0.7em;
 font-weight: bold;
 } 
 
#aktuell{ /* grunds�zlich wie h3 padding wie h1 */
 color: #229999; 
 background: white;
 
 font-family: Georgia, "Times New Roman", Times, serif;
 font-style: italic;
 font-size: 1.5em;
 font-variant:small-caps;
 line-height: 1.2em;
 padding: 20px 0 5px 5%;
 text-decoration: none;  /* hie muss was hin! */
}

#hervorhebung1{
 font-family: Georgia, "Times New Roman", Times, serif;
 text-decoration: none;
 font-style: italic; 
}

.name{  /*   fr eigennamen */
 font-style: italic; 
 display: inline;
 font-weight: bold;
 padding: 5px;
}


/* - Hier Hauptinhaltsteil - */
#main {
 background: url(../icons/bg00.png) #ffff99;  /*  no-repeat 100% 0 white; /* 120grad zu 00aaaa =hellgelb fc68fc=hell-vioDie kleine blaue halbdurchsichtige Blume wird als Hintergrundbild, welches rechts oben in der Ecke steht, deffiniert. */
 padding: 2% 10px 10px 10px; /* re-li-ob-unt Der rechte Abstand 6% Stellt sicher dass auch nach dem Umflie�n der Subnavigation der Text genau so breit wird wie oben und ein zwei Columnen Eindruck entsteht. */
 line-height: 1.2em; /* Zesseren Lesbarkeit erh�en wir die Linienh�e. */
}

/* Aktuelle Ankündigungen */
#announce {
 background: url(../icons/bg00.png) #ffff99;  /*  no-repeat 100% 0 white; /* 120grad zu 00aaaa =hellgelb fc68fc=hell-vioDie kleine blaue halbdurchsichtige Blume wird als Hintergrundbild, welches rechts oben in der Ecke steht, deffiniert. */
 padding: 0.1ex 1em 1ex 1em; /* oben-rechts-unten-links */
 position: relative;
 top: 0px;
 left: 0px;
 width: 40%;
 text-align: center;
 line-height: 1.2em; /* Zesseren Lesbarkeit erh�en wir die Linienh�e. */
 margin-top: 20px;
 margin-bottom: 20px;
 margin-left: auto; /* Hiermit zentrieren wirdas Element auf der Seite */ 
 margin-right: auto;  /* Hiermit zentrieren wirdas Element auf der Seite */
 

/* Letzte Ueberarbeitung
$Date: 2009-10-13 02:17:22 +0200 (Di, 13. Okt 2009) $ 
 */