/* ff_style_startseite.css */
/* ------------------------------------------------------------ */
/* Fabian Englich, fabian@englich.net									 */
/* Firefox Stylesheet														 */
/* ------------------------------------------------------------ */


/* - - - - - - - - - - Hauptseite Styles - - - - - - - - - - */

body {
	background-color: #dbc798;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	text-align: center;
	margin: 0 auto;
	margin-top: 15px;
}

table, td, tr {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 1.8em;
}

p {
	line-height: 1.8em;
}

input, textarea, select, option, submit { 
	/* Formularelemente anpassen */
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: xx-small;
	border: 1px solid #4a4a4a;
	background-color: White;
}


/* - - - - - - - - - - Seitenlayout - - - - - - - - - - */

#NavigationOben { 
	/* Obere Navigation + Impressum */
	width: 745px;
	height: 22px;
	padding: 0px;
	text-align: right;
	color: #7a253a;
	background-color: #dbc798;
}

#NavigationOben a {
	/* Setzt die Link Farbe in der Navigation_Oben */ 
	color: #7a253a;
	text-decoration: none;
}

#NavigationOben a:hover {
	/* Setzt die Link Farbe in der Navigation_Oben beim hover */ 
	color: #7a253a;
	text-decoration: underline;
}

#SeiteInDieMitteSetzen { 
	/* Setzt die Seite in die Mitte */
	position: static;
	margin: 0px auto;
	padding: 0px;
	width: 745px;
	background-color: white;
}

#Inhalt { 
	/* Kasten für den Seiteninhalt*/
	padding: 10px 10px 10px 10px;
	background-color: #d7ccb3;
	width: 495px;
	height: 289px;
	border: 0;
}

#Bild {
	/* Formatierungen für das Bild */
	position: relative;
	z-index: 1;
	margin: 0 auto;
	width: 745px;
	height: 289px;
	padding: 0;
	border: 0;
	background-color: #d7ccb3;
	/* Pfad für das Bild auf der Startseite */
	background-image: url(../images/startseite_bild.jpg);
	background-repeat: no-repeat;
	background-position: right;
}

#Logo {
	/* Formatierungen für das Logo */
	margin: 0 auto;
	width: 745px;
	height: 123px;
	padding: 0;
	border: 0;
	background-image: url(../images/startseite_logo.jpg);
	background-repeat: no-repeat;
	background-position: left;
}

#Kontakt {
	/* Kontakt, immer sichtbar ganz unten */
	margin: 0 auto;
	width: 745px;
	height: 83px;
	padding: 0;
	border: 0;
	background-image: url(../images/startseite_kontakt.gif);
	background-repeat: no-repeat;
	background-position: right;
}

#Banner {
	/* Banner */
	margin: 0 auto;
	width: 745px;
	height: 83px;
	padding: 0;
	border: 0;
	background-image: url(../images/banner.gif);
	background-repeat: no-repeat;
	background-position: right;
}

#Inhalt a { 
	/* Linkfarbe einstellen im Kasten für den Seiteninhalt */
	color: #7e003e;
	text-decoration: none;
}

#Inhalt a:hover { 
	/* Link-Hover einstellen im Kasten für den Seiteninhalt */
	color: #7e003e;
	text-decoration: underline;
}

#bg_banner { 
	/* Brauner Hintergrund des Banners */
	position: absolute;
	z-index: 0; /*Firefox*/
	top: 160px; /*Firefox*/
	left: 0px;
	width: 100%;
	height: 318px; /*Firefox*/
	background-image: url(../images/banner_braun.gif);
	background-repeat: repeat;
	background-position: left;
}

#NavigationFesthalten {
	position: relative;
	z-index: 2;
	width: 745px;
	height: 28px;
	padding: 0px;
	color: #62656A;
	background-color: #731933;
	border-bottom: 1px solid white;
}

.Headline { 
	/* Farbe und Größe der Überschriften im Inhalt */
	font-size: 12pt;
	color: #056bb3;
	font-weight: bold;
}

/* - - - - - - - - - - - Navigation - - - - - - - - - - */

#Box { 
	/* Kasten um die Navigation daran auszurichten */
	position: absolute;
	top: 0;
	left: 50%;
	width: 900px;
	margin: 0 -450px 0 -450px;
}

ul#navigation { 
	/* Ausrichtung der Navigation am Element box.
		Die relative Positionierung mit dem z-index ist wichtig,
		damit die Navigation auf einer höheren Ebene als die Input
		Felder ist da es ansonsten zu einer Überlappung kommt. */
	position: absolute;
	z-index: 1;
	top: -9px;
	left: -30px;
	width: 700px; /* Breite der Hauptnavigation für mehr Menupunkte ändern */
	float: left;
}
	
ul#navigation, #navigation ul { 
	/* Entfernt bei allen ul und li die bullets */
	list-style: none;
}

#navigation li { 
	/* Damits ein Horizontales Menu gibt */
	float: left;
	padding: 0;
}
		
#navigation li:hover, #navigation li.sfhover { 
	/* Das passiert beim darüberfahren über ein Link mit der Maus */
}

#navigation li a {
	/* Für den IE wird eine feste Breite gebraucht,
		da ansonsten display: block nicht funktioniert.
		Da dem IE aber egal ist wenn das Element zu schmal
		definiert ist gehts wunderbar mit 1px und ist
		dennoch dynamisch breit */
	width: auto !important;
	width: 1px;
	white-space: nowrap;
	padding: 0 10px 0 10px; /* Abstände zwischen den Wörtern im Hauptmenu */
	line-height: 26px;
	height: auto !important;
	height: 26px;
	display: block;
	/* Wie sollen die Menüpunkte im Hauptmenu aussehen */
	font-weight: bold;
	color: white;
	text-decoration: none;
	background-image: url(../../clear.gif);
}

#navigation li ul {
	margin-left: -32px; /* Ausrichtung des Aufklappkastens am Hauptmenüpunkt */
	padding: 0 30px 30px 30px;
	width: 150px !important;
	width: 200px; /* Breite des Aufklappkastens */
	position: absolute;
	left: -9999px;
}

#navigation li li {
	width: 147px !important;
	width: 200px; /* Breite des Aufklappkastens muß hier ebenfalls geändert werden */
	padding: 0;
	clear: left;
	/* Farbeinstellung und Transparenz für den Aufklappkasten */
	background-color: #731933;
	opacity: 0.8; /* Für Mozilla Browser */
	-moz-opacity:0.8; /* Für Mozilla Browser */
	-khtml-opacity:0.8; /* Für Mozilla Browser */
	filter:alpha(opacity=80); /* Für Internet Explodierer */
}

#navigation li li:hover, #navigation li li.sfhover {
	
}

#navigation li li a {
	width: auto !important;
	width: 192px;
	line-height: 22px; /* Höhe der Menupunkte im Aufklappmenu */
	height: auto !important;
	height: 22px; /* Höhe der Menupunkte im Aufklappmenu */
	white-space: normal;
	/* Wie sollen die Untermenupunkte im Aufklappmenu aussehen */
	font-weight: normal;
	color: White;
	text-decoration: none;
	text-align: left;
}

#navigation li:hover ul, #navigation li.sfhover ul {
	left: auto;
}

#HauptNavigationHover a:hover {
	color: #d7ccb3;
}

#NavigationHover a {
	color: White;
}

#NavigationHover a:hover {
	font-weight: bold;
	color: White;
}
