/*@charset "utf-8";
/* ======================================================================
CSS Stylesheet für www.waldschaenke.com	

Stand: 1.0
Datum: 10. 2. 2008
Datei: screen.css
Autor: MAGUN Design Group

Aufbau:	1. Kalibrierung
		2. Allgemeine Styles
		3. Styles für Layoutbereiche
		4. Sonstige Styles
====================================================================== */


/* ======================================================================
	1. Kalibrierung
====================================================================== */

* { padding: 0; margin: 0; }							/* Sämtliche Aussenabstände (margin) und Polsterungen (padding) auf Null setzen */
														/* -> Definierte Ausgangssituatzion für ALLE Browser */

														/* Beginn der Resauration */
h1, h2, h3, h4, h5, p, ul, ol {margin-bottom: 1em; }	/* Zeilenabstände. Einheit em -> Abstände wachsen auch bei Schriftänderung */			
h4							  {margin-top: 1em; }
ol ul {margin-bottom: 0em; }								/* Zeilenabstände. Keine Zeilenabsände in geordneten / ungeordneten Listen */	
li {margin-left: 3em; }									/* Listenstände von Links. Einheit em -> Abstände wachsen auch bei Schriftänderung */


/* ======================================================================
	2. Allgemeine Styles
====================================================================== */

html { height: 101%; }		/* Kosmetik: Im Firefox werden kurze Seiten ohne Scrollbar angezeigt. Im ie immer. Somit springt die Seite. */

body {
  background-color: white;								/* helles Grün */
  color: #006600;											/* Schriftfarbe */
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: small;
/*  font-size: small;
*/  text-align: center;
}

h1,h5 { font-size: 1.4em; }				/* h5 ist eine Pseuduüberschrift für den Einsatz ohne 1. Buchstabe */
h2 { font-size: 1.2em; }
h3 { font-size: 1.1em; }
h4 { font-size: 1.0em; }



address {
  text-align: center;			/* Text Zentriert */
  font-size: 0.7em;				/* Textgröße des Address Style */
  font-style: normal;			/* Address Style standardmäßig kursiv -> wieder auf normal gestellt */
  letter-spacing: 1px;			/* Pixelabstand zwischen den einzelnen Buchstaben */
  line-height: 1.2;				/* Abstand zwischen den Zeilen. Bedeutet das x-fache der Schriftgrösse */
}

blockquote {				/* Blockqoute für Zitate */
  color: #006600;
  font-size: 1em;
  word-spacing: 2px;			/* Abstände zwischen den Wörtern */
  letter-spacing: 1px;		/* Abstand zwischen den einzelnen Zeichen */
  line-height: 2em;
}

cite {						/* Zitatquelle in Blockqoute */
  display: block;
  font-size: 0.85em;
  font-style: italic;
  font-weight: normal;
}



/* -----------------------*/
/* Hyperlink Definitionen */
/* -----------------------*/



/* ----------------------------------------- */
/* Hyperlink Definitionen für Klassen & ID´s */
/* ----------------------------------------- */

.skiplink {								/* Hilfe zum Vorlesen der Webseiten. Navigation wird übersprungen und nicht immer vorgelesen */
	position: absolute;
	top: -5000px;						/* Link aus dem Bildschirm schieben */
	left: -5000px;						/* Link aus dem Bildschirm schieben */
	width: 0;							/* Breite sicherheitshalber auf 0 */
	height: 0;							/* Höhe sicherheitshalber auf 0 */
	overflow: hidden;					/* Wenn doch ein Inhalt vorhanden -> verstecken! */
	display: inline;					/* Objekt hat keinen eigenen Zeilenumbruch */
}

.bildlinks {							/* Bild einfügen und Ausrichtung Links */
	float: left;						/* Zum Einfügen in <img src="..." ..... class="bildlinks"> */
	padding: 3px;
	border: 5px solid #cccccc;
	margin-right: 10px;
	margin-bottom: 10px;
}

.bildrechts {							/* Bild einfügen und Ausrichtung Rechts */
	float: right;						/* Zum Einfügen in <img src="..." ..... class="bildrechts"> */
	padding: 3px;
	border: 5px solid #cccccc;
	margin-bottom: 10px;
	margin-left: 10px;
}

.clearing {							/* Um den Textfluss um das Bild zu unterbinden, ist das float mit clear zu beenden */
	clear: both;					/* both bedeutet, egal ob left oder right, beide werden beendet */
}									/* einzubinden bei <p class="clearing"> */



.p1, #textbereich li, .antwort {
		/* text-indent: 1em;			/* Jeden Absatz einrücken */

		font-size: 0.9em;				/* Schritfgröße */
		line-height: 1.5em;			/* Abstand zwischen den Zeilen */
		
		word-spacing: 2px;			/* Abstände zwischen den Wörtern */
		letter-spacing: 1px;		/* Abstand zwischen den einzelnen Zeichen */
}


.p2 {
		/* text-indent: 1em;			/* Jeden Absatz einrücken */
		font-size: 0.9em;				/* Schritfgröße */
		line-height: 1.4em;			/* Abstand zwischen den Zeilen */
		
		word-spacing: 2px;			/* Abstände zwischen den Wörtern */
		letter-spacing: 1px;		/* Abstand zwischen den einzelnen Zeichen */
}



#logo {
/*	border: 1px solid #000000; */
}

/* ---------------------------------------------------------------------
	Logobilder für Sites
------------------------------------------------------------------------ */

#impressumseite #bildbereich {
	background-image: url(../system/pic_logo_impressumseite.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}

#chronikseite #bildbereich {
	background-image: url(../system/pic_logo_chronik.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}

#festlichkeitenseite #bildbereich,
#wintergartenseite #bildbereich {
	background-image: url(../system/pic_logo_festlichkeiten.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}

#zimmerseite #bildbereich,
#zimmerreservierungsseite #bildbereich {
	background-image: url(../system/pic_logo_zimmer.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}


#tischreservierungsseite #bildbereich {
	background-image: url(../system/pic_logo_gaststube2.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}

#spielplatzseite #bildbereich {
	background-image: url(../system/pic_logo_spielplatz.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}

#wanderwegeseite #bildbereich {
	background-image: url(../system/pic_logo_wanderwege.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}

#gaststubenseite #bildbereich {
	background-image: url(../system/pic_logo_gaststube.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}

#gastgartenseite #bildbereich {
	background-image: url(../system/pic_logo_gastgarten.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}

#nebenstubenseite #bildbereich {
	background-image: url(../system/pic_logo_nebenstube.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}

#wintergartenseite #bildbereich {
	background-image: url(../system/pic_logo_wintergarten.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}

#festsaalseite #bildbereich {
	background-image: url(../system/pic_logo_festsaal.jpg); 
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
}



/* ======================================================================
	3. Styles für Layoutbereich
====================================================================== */



#wrapper {
  
  background-color: white;
  color: #006600;				/* Schriftfarbe */
 /* width: 800px;					/* Breite der aktiven Homepage */
 /* margin: 10px auto; 			/* Aussenabstand 10px (oben/unten) und zentriert (links/rechts) */

	padding: 5px 10px 10px 10px;
	text-align: left;			/* Für ältere ie Versione zur Gegenkorrektur vom body text-align: center */
}

#rahmen-kopfbereich { 	background-color: white;	}
#rahmen-bildbereich {	background-color:#006600; border: 2px solid white; }
#rahmen-navibereich { 	background-color: white; /* #C2F3C4; */ }
#rahmen-textbereich { 	background-color: white; /*#C2F3C4;*/ }
#rahmen-fussbereich {	background-color: white;	}


#kopfbereich {
	background-color: #ffffff;#006600
	color: #006600;				/* Schriftfarbe #A7741D = Herbst
												#006600 = Standard */
	padding: 5px 10px 0px 10px;	/* top - right - bottom - left (im Uhrzeigersinn) */
	text-align: right;
	height: 40px;

	width: 780px;
	margin: 0px auto;
	border-left: 2px solid white;
	border-right: 2px solid white;


}

#kopfbereich #hide {							/* Im Kopfbreich wird eine Überschirft angegeben, jedoch nicht angezeigt (nur für Sucmachinen)*/
		display: none;
}

		#kopfbereich a {						/* Kennzeichung eine Hyperlink */
			text-decoration: none;				/* Kein Underline bei Link */
			border: none;						/* Kein Rahmen bei Link */
			outline: none;						/* punktierter Rahmen um Link entfernen -> Funktioniert nicht in allen Browser */ 
		}
		
		#kopfbereich a:link {					/* nicht besuchte Hyperlink #A7741D = Herbst */
			color: #006600;
		}
		
		#kopfbereich a:visited {				/* besuchter Hyperlink #A7741D = Herbst */
			color: #006600;
		}
		
		#kopfbereich a:hover, 
		#kopfbereich a:focus {					/* Mouse über Hyperlink #A7741D = Herbst */
			color: #ffffff;
			background-color: #006600;
		}
		
		#kopfbereich a:active {					/* Verhalten zum Zeitpunkt der Betätigung #A7741D = Herbst */
			color: #ffffff;
			background-color: #006600;
		}

		#kopfbereich ul li {list-style: none }				/* keine Marken im Listenelemente (Kopfnavigation */
		
		#kopfbereich li {

			font-size: 90%;
			display: inline;
			list-style-type: none;
			margin-right: 0px;								/* Kopfnavigation Inline und mit "|" Symetrisch ausgerichtet */
			margin-left: 0px;								/* Kopfnavigation Inline und mit "|" Symetrisch ausgerichtet */
						
		}
		
		#kopfbereich ul {
			margin-bottom: 0;				/* keine Rand bei ungeordneten Listen im Kopfbereich. Allgemein haben ul einen Rahmen */
			
		}


#bildbereich {
	background-color: #006600;
	height: 250px;
	background-image: url(../system/pic_logo_startseite.jpg);
	background-repeat: no-repeat;									/* Bild nicht wiederholen */
	color: #ffffff;				/* Schriftfarbe */

 	width: 800px;
	margin: 0px auto;
	border-left: 2px solid white;
	border-right: 2px solid white;
}

#navibereich {
 	background-color: #eee;				/* Da Navimenü kürzer als 800px Hintergrundfarbe */
 	width: 800px;
	height: 1.7em;						/* Da Navimenü kürzer als 800px Hintergrundfarbe */
	margin: 0px auto;
	border-left: 2px solid white;
	border-right: 2px solid white;
}
		#navibereich a {										/* Kennzeichung eine Hyperlink */
			text-decoration: none;
			outline: none;						/* punktierter Rahmen um Link entfernen */ 
												/* ->  (Funktioniert nich in allen Brower */
		}

#textbereich {
  	background-color: #ffffff;

	width: 780px;
	padding: 30px 10px 10px 10px;
	margin: 0px auto;
	margin-bottom: 20px;
	border-left: 2px solid white;
	border-right: 2px solid white;

}


		#textbereich a {					/* Kennzeichung eine Hyperlink */

			text-decoration: none;
			color: #006600; 
			border-bottom: 1px dotted green;
			outline: none;						/* punktierter Rahmen um Link entfernen */ 
												/* ->  (Funktioniert nich in allen Brower */
		}

		#textbereich a img {				/* Alle verlinkten Bilder ohne Rahmen */
			border: 0px none;
		}
		
		#textbereich a:link { 
			color: #006600; 				/* nicht besuchte Hyperlink */

		}
		#textbereich a:visited { 			 				/* besuchter Hyperlink */
			background-color: #ffffff;
			color: red;
			border-bottom: 1px dotted red;
		}
		
		#textbereich a:hover, a:focus {						/* Mouse über Hyperlink */
			background-color: #006600;
			color: #ffffff;
			border-bottom: 1px dotted #006600;
		}
		#textbereich a:active {								/* Verhalten zum Zeitpunkt der Betätigung */
			background-color: #006600;
			color: #ffffff;

		}
/*
#textbereich ul.zweispalter {
	list-style: none;
	float: left;
	width: 668px;
	margin: 20px 0px 0px 60px;

	border: 1px solid #006600;    
	background-color: #effbef;    
}


#textbereich ul.zweispalter li {
	display: block;
	float: left;
	width: 320px;
	margin: 0px auto;
	padding: 0px 1px;

}
#textbereich ul.zweispalter img {
	margin: 0;
	padding: 20px;
}


#textbereich ul.zweispalter h4 {
	font-size: 0.9em;
	text-align: center;
	margin: 0;
	padding: 10px 0px 0px 0px;

}

*/

#textbereich table.chronik1 {
	margin: 50px auto;
	width: 400px;
	text-align: center;
	border: 1px dotted #006600;   
}

#textbereich table.chronik1 td {
	padding: 5px 0px;
}


#textbereich .center-img {
	display: block;
	margin: 30px auto;
	padding: 15px;
	border: outset 2px;
}

#textbereich .center-img-ohne {
	display: block;
	margin: 30px auto;
	padding: 15px;

}

#textbereich ol ul {margin-bottom: 1em; }





#fussbereich {
  	background-color: #ffffff;

	padding-top: 10px;
	padding-bottom: 10px;
	border-top: 1px solid #006600;
/*	margin-top: 20px;
*/
	width: 800px;
	margin: 0px auto;
	border-left: 2px solid white;
	border-right: 2px solid white;
}

		#fussbereich a {										/* Kennzeichung eine Hyperlink */
			text-decoration: none;
			color: #006600;
			border-bottom: 1px dotted green;
			outline: none;						/* punktierter Rahmen um Link entfernen */ 
												/* ->  (Funktioniert nich in allen Brower */
		}
		
		#fussbereich a:link { color: #006600; }				/* nicht besuchte Hyperlink */
		#fussbereich a:visited { 			 				/* besuchter Hyperlink */
			color: red;
			border-bottom: 1px dotted red;
		}
		
		#fussbereich a:hover, a:focus {						/* Mouse über Hyperlink */
			color: #ffffff;
			background-color: #006600;
			border-bottom: 1px dotted #006600;
		}
		#fussbereich a:active {								/* Verhalten zum Zeitpunkt der Betätigung */
			color: #ffffff;
			background-color: #006600;
		}





/* ======================================================================
	4. Sonstige Styles
====================================================================== */

/* ------------------------ */
/* Allgemeine Formulardaten */
/* ------------------------ */

form {
	background-color: #f5f5f5;
	color: #006600;
	padding: 20px;
	border: 1px solid #8c8c8c;
	margin: 50px auto 20px;
}

label {
	display: block;			/* Blocksatz Darstellung */
	cursor: pointer;		/* Wenn über den Formulatext gefahren wird, ändert sich der Mousezeiger */
}

fieldset {border: 0px solid;}

input:focus,
textarea:focus {
	background-color: #d9d9d9;
	color: #003300;
}


/* ---------------- */
/* Kontaktformulare */
/* ---------------- */


form {
	width: 370px;
}

input#absender, textarea {				/* gilt für das absender feld und das textaera Feld, nicht für das Submit daher input#absender */
	width: 300px;
	border: 1px solid #8c8c8c;
	margin-bottom: 1em;
}

textarea { height: 7em }



/* ---------------------- */
/* Reservierungsformulare */
/* ---------------------- */

#tischreservierungsseite form,
#zimmerreservierungsseite form {
	width: 500px;
}

#tischreservierungsseite label,
#zimmerreservierungsseite label { /* Alle Labels UND Formularelemente auswählen */
  float: left;
  width: 150px;
  margin-top: 0.5em;
  text-align: right; 
  padding-right: 1em; 
}


#tischreservierungsseite input , 
#tischreservierungsseite select,
#tischreservierungsseite textarea,
#zimmerreservierungsseite input , 
#zimmerreservierungsseite select,
#zimmerreservierungsseite textarea { /* Alle Labels UND Formularelemente auswählen */
  display: block;
  float: left;
  margin-top: 0.5em;
  margin-bottom: 0;
}

#tischreservierungsseite form br,
#zimmerreservierungsseite form br { /* Alle Zeilenumbrüche in Formularen auswählen */
  clear: left; /* das floating der labels und inputs aufheben */
}

#tischreservierungsseite input#submit,
#tischreservierungsseite input#reset,
#zimmerreservierungsseite input#submit,
#zimmerreservierungsseite input#reset { /* den Submit-Button */
  width: auto;
  margin-top: 2em;
  margin-left: 80px; 
}




/*------------------------------------------*/
/* Info Box									*/
/*											*/
/* (ohne) 	= Typ	Selektor (body, h1, ..)	*/
/* #		= ID	Selektor (wrapper, ...)	*/
/* . 		= Class	Selector (skiplink,...)	*/
/*------------------------------------------*/

/*------------------------------------------------------------------*/
/* Spezifität - Punktesystem für Selektoren 						*/
/* 																	*/
/*	Selektrotype			Beispiel					Punkte		*/
/*	einfach					p							1			*/		
/*	Klasse					.skiplink					10			*/
/*	ID						#kopfbereich				100			*/
/*	Attrinut style=".."		style="Color:red";			1000		*/
/*																	*/	
/*	Selektor					Punke			Gesamt				*/	
/*	body						1				1					*/
/*	a:visited					1+10			11					*/
/*	p.hinweisbox				1+10			11					*/
/*	#navibereich				100				100					*/
/*	div#navibereich				1+100			101					*/
/*	#startseite #navi01 a		100+100+1		201					*/
/*																	*/
/*	border: 1px solid red !important		!important = IMMER !	*/
/*------------------------------------------------------------------*/