/*********************************************
Allgemeines 
**********************************************/

body, p, input, select, textarea
{
	/* Standard-Schriftart */
	font-family: Arial, Helvetica, Geneva, sans-serif;
	/* Standard-Schriftgroesse */
	font-size: 13px;
}

body 
{ 
	/* Hintergrundfarbe */
	background: #E9E6E4; 
	/* Standardschriftfarbe */
	color: black; 
	/* Raender in Hintergrundfarbe - oben/unten und links/rechts */
	margin: 35px 0; 
	/* Zentrierung fuer IE */
	text-align: center;
}

img
{
	/* Rand bei Bildern unterdruecken,
	hilfreich bei verlinkten Bildern */
	border: none;
}

a 
{ 
	/* Standard-Linkfarbe */
	color: #EC173E; 
	/* keine Unterstreichung */
	text-decoration: none;
}

a:hover
{
	/* Unterstreichung bei Mouseover*/
	text-decoration: underline;
}

ul 
{ 
	/* Standardaufzaehlungen Ausrichtung links */
	padding: 0;
	/* Ausrichtung links */
	margin: 5px 0 5px 1.2em;
}

ul li
{
	/* Abstand zwischen den Aufzaehlungspunkten */
	margin: 0 0 5px 0;
	/* Bilddatei fuer den Punkt */
	list-style-image: url(../img/bullet.png);
}


/*********************************************
Grundlayout
**********************************************/

div#container
{
	/* Seite zentrieren */
	margin: 0 auto;
	/* Breite des gestalteten Bereichs */
	width: 858px;
	/* IE-Zentrierung in Containern aufheben */
	text-align: left;
}

div#header
{
	/* Hintergrundfarbe Header */
	background: white;
	/* Weiße Flaeche oben und unten um 10px vergroessern */
	padding: 10px 0;
	/* Transparenter Streifen unten */
	margin-bottom: 6px;
}

div#footer_menu
{
	/* Ganze Layout-Breite nutzen */
	width: 100%;
	/* Rechts anfangen */
	text-align: right;
	/* Abstand zum Contentbereich */
	margin-top: 1px;
}


/*********************************************
Homepage
**********************************************/

div#home_canvas
{
	/* gruener Kasten */
	background: #BED73B;
	/* ganze Breite des Containers fuellen */
	width: 100%;
	/* Hoehe des Kastens festlegen */
	height: 300px;
	/* Voraussetzung fuer die Moeglichkeit,
	im Kasten Objekte zu positionieren */
	position: relative;
	/* Standardschriftfarbe */
	color: white;
}

div#home_canvas div.home_link
{
	/* ermoeglicht die absolute Positionierung der Links */
	position: absolute;
	/* die eigentlichen Positionen werden im HTML-Code angegeben */
}

div#home_canvas a
{
	/* Linkfarbe im Kasten */
	color: white;
	/* Unterstreichung unterdruecken */
	text-decoration: none;
	/* Die Textgroessen werden im HTML-Code angegeben */
}

div#home_canvas a:hover
{
	/* Unterstreichung unter dem Mauszeiger aktivieren */
	text-decoration: underline;
}

div#home_canvas div.serif
{
	/* Variante mit Serifen */
	font-family: Georgia, Times, Serif;
}

/*********************************************
Inhaltsbereich
**********************************************/

/* Linkwolke */
div#white_canvas
{
	/* weisser Kasten */
	background: white;
	/* ganze Breite des Containers fuellen */
	width: 100%;
	/* Hoehe des Kastens festlegen */
	height: 230px;
	/* Voraussetzung fuer die Moeglichkeit,
	im Kasten Objekte zu positionieren */
	position: relative;
	/* Standardschriftfarbe */
	color: black;
}

div#white_canvas div.white_link
{
	/* ermoeglicht die absolute Positionierung der Links */
	position: absolute;
	/* die eigentlichen Positionen werden im HTML-Code angegeben */
}

div#white_canvas a
{
	/* Linkfarbe im Kasten */
	color: black;
	/* Unterstreichung unterdruecken */
	text-decoration: none;
	/* Die Textgroessen werden im HTML-Code angegeben */
}

div#white_canvas a:hover
{
	/* Unterstreichung unter dem Mauszeiger aktivieren */
	text-decoration: underline;
}

div#white_canvas div.serif
{
	/* Variante mit Serifen */
	font-family: Georgia, Times, Serif;
}


div#main
{
	/* Gesamte Breite nutzen */
	width: 100%;
	/* Weisse Flaeche */
	background: white;
	/* Raender oben und unten */
	padding: 45px 0 40px 0;
}

div#content
{
	/* Raender links und rechts */
	margin: 0 220px 0 125px;
}

h1
{
	/* Schriftart fuer Ueberschriften */
	font-family: Times, Serif;
	/* Schriftgroesse */
	font-size: 1.4em;
	/* nicht fett */
	font-weight: normal;
	/* Abstand unten setzen, alles andere auf 0 */
	margin: 0 0 20px 0;
}


/*********************************************
Kontaktformular
**********************************************/

form
{
	/* Abstand unter dem Formular, von oberhalb
	des Buttons gemessen */
	margin-bottom: 80px;
}

table.contact
{
	/* Fixe Breite der Tabelle */
	width: 500px;
	/* Hintergrundfarbe der Tabelle */
	background: #BED73B;
	/* Angrenzende Zellenrahmen sollen zusammengelegt werden */
	border-collapse: collapse;
	/* Freier Randbereich */
	border: solid 20px #BED73B;
	/* Abstand unten (weisse Linie) */
	margin-bottom: 2px;
}

table.contact td
{
	/* Schriftfarbe in allen Zellen */
	color: white;
	/* Schriftgroesse */
	font-size: 13px;
	/* Schriftstil */
	font-weight: bold;
	/* Abstaende zum Zellenrand oben/unten */
	padding: 3px 0;
}

table.contact td.label
{
	/* Abstand zur naechsten Zelle */
	padding-right: 15px;
	/* Ausrichtung immer oben */
	vertical-align: top;
}

table.contact td input,
table.contact td select
{
	/* Breite der Eingabefelder und der Dropdown-Felder */
	width: 350px;
}

table.contact td.nachricht
{
	/* Abstand ueber dem Nachrichtenbereich */
	padding-top: 20px;
}

table.contact td textarea#adresse
{
	/* Breite und Hoehe der Textarea */
	height: 54px;
	width: 350px;
}

table.contact td textarea#nachricht
{
	/* Breite und Hoehe der Textarea */
	height: 100px;
	width: 436px;
}

table.contact td input:focus,
table.contact td select:focus,
table.contact td textarea:focus
{
	background: #f4fcca;
}

table.contact td.ja_nein
{
	/* Schrift fuer Checkbox-Labels */
	font-weight: normal;
	/* Abstand zur Checkbox */
	padding-left: 15px;
}

table.contact td.checkbox
{
	/* Ausrichtung immer oben */
	vertical-align: top;
}

table.contact td.checkbox input
{
	border: 0;
	background: none;
	/* Breite automatisch bestimmen */
	width: auto;
}

table.contact td.ja_nein input#datum
{
	/* Breite Datumsfeld */
	width: 74px;
}

table.contact td.ja_nein input#uhrzeit
{
	/* Breite Uhrzeitfeld */
	width: 42px;
}

div.submit
{
	/* Breite des Containers fuer den Absendebutton
	muss so gross sein, wie die Tabellen */
	width: 500px;
	/* Notwendig fuer die Button-Positionierung */
	position: relative;
}

div.submit input
{
	/* Absolute Button-Positionierung */
	position: absolute;
	/* ganz rechts */
	right: 0;
	/* Hintergrundfarbe Button */
	background: #BED73B;
	/* 3D-Rand unterdruecken */
	border: none;
	/* Schriftfarbe */
	color: white;
	/* Schriftdicke */
	font-weight: bold;
	/* Fläche vergroessern */
	padding: 3px 15px;
}

div.submit input:hover
{
	/* Mouseover-Effekt Unterstreichung */
	text-decoration: underline;
}

table.contact td.error
{
	/* Farbe der Labels, wenn ein Fehler ermittelt wurde,
	in der Regel ein leeres Pflichtfeld */
	color: #EC173E;
}

div.error
{
	/* Schriftfarbe der Fehlermeldung */
	color: #EC173E;
	/* Schriftstaerke */
	font-weight: bold;
	/* Abstand ueber und unter der Box */
	margin: 20px 0;
	/* Rote Box */
	border: solid 1px #EC173E;
	/* Breite der Box, ABZUEGLICH PADDING!
	Also Padding links und rechts jeweils 20px und
	460 Pixel Breite geben eine Breite von 500px */
	width: 460px;
	padding: 10px 20px;
}
