/* CSS Document */
/* by Wild Wild Web :: Internetservices :: Heiko Hänsge, www.wild-wild-web.de */


/*<![CDATA[*/

/* -----------------------------------------------------------------------------------------
	COLORS
   ---------------------------------------------------------------------------------------*/
/*
gelb bg				#FAFBE2
grau schrift	#888888
grau hover		#CCCCCC
grau formfields #444444
grau rahmen		#CCCCCC
rot menü			#CC9999  (952431)
rot menü hover #CC6666 (952431)
*/

/* -----------------------------------------------------------------------------------------
	HTML tags & hacks
   ---------------------------------------------------------------------------------------*/
* { margin:0; padding:0; font-size: 100%; }

HTML, BODY { 
	font: 14px Arial, Helvetica, sans-serif; /*"Times New Roman", Times, serif*/
	}

html {height:100%}

body {
    min-height: 101%;
    font-size: 100.01%;
    position: relative;
    color: #888888;
    background: #FAFBE2 url('../bilder/page-bg.jpg') repeat-y left top;
}

img { border:0; }

fieldset { 
	padding: 8px;
	}

legend { 
	padding: 3px;
	}

select, input, textarea {
	font: 14px Arial, Helvetica, sans-serif;
	color: #444444; 
	}

P, TD, LI, H1, H2, H3, legend, NOBR { 
	font: 14px Arial, Helvetica, sans-serif;
	color: #888888;
	/*text-align: left;
	line-height: 170%;*/
	}

A {
	color: #888888;
	}

A:hover {
	color: #CCCCCC;
	text-decoration: none;
	}

HR {
	clear: both;
	color: #888888;
	height: 1px;
	margin: 20px 0;
	}

/* Clearen per Overflow */
.floatbox { overflow:hidden; }

/* .floatbox-Anpassung für IE #/
/* Hides from IE-mac \*/
* html .floatbox {width:100%;}
/* End hide from IE-mac */

							 
/* -----------------------------------------------------------------------------------------
	Page & Pics
   ---------------------------------------------------------------------------------------*/


#page {
	position: absolute; 
	top: 0px;
	left: 0px;
	width: 940px;
	/* Bambus-Hintergrund links auf Browserfensterhöhe verlängern falls Seiteninhalt kürzer als Browserfensterhöhe ist */
	min-height: 101%;
	background: url('../bilder/bambus-bg.jpg') repeat-y left top;
	/* IE5/WIN workaround zur Zentrierung im Browser */
	text-align:left;
	vertical-align: bottom;
	}

#teaser {
	position: absolute; top: 0px; left: 400px; z-index: 10;
}

#bambus_o {
	position: absolute; top: 0px; left: 0px; z-index: 30;
}

#bambus_l {
	position: absolute; top: 285px; left: 0px; z-index: 31;
}

#bambus_r {
	position: absolute; top: 285px; left: 286px; z-index: 32;
}

#bambus_u {
	position: absolute; top: 521px; left: 0px; z-index: 33;
}


/* -----------------------------------------------------------------------------------------
	Main Menu
   ---------------------------------------------------------------------------------------*/

#menu {
	position: absolute; 
	top: 285px;
	left: 45px;
	z-index: 40;
	margin: 0px;
	padding-top: 14px;
	width: 241px;
	height: 236px;
	background: url('../bilder/bambus-nav-bg.jpg') no-repeat left top;
	}

#menu DIV.menuitem {
	font: 16px Arial, Helvetica, sans-serif;
	font-weight: normal; /*bold*/
	text-align: right;
	padding: 5px 10px;
	margin: 0px;
	height: 20px;
}

#menu DIV.menuitem A {
	background: none;
	text-decoration: none; 
	color: #CC9999; /*#CC3333*/
	padding: 4px 15px;
}

#menu DIV.menuitem A:hover, #menu DIV.menuitem A:active, #menu DIV.menuitem A.activePage {
	background: url('../bilder/menuitem_img.gif') no-repeat left;
	text-decoration: none; 
	color: #CC6666;/* #952431*/
	font-weight: bold;
	padding: 4px 15px;
}


/* -----------------------------------------------------------------------------------------
	Content
   ---------------------------------------------------------------------------------------*/

#content { 
	position: absolute; 
	top: 0px;
	left: 0px;
	z-index: 20;
	width: 525px;
	/*height: 400px;*/
	margin: 0px;
	padding: 130px 20px 20px 344px;
	/* Bambus-Hintergrund links verlängern falls Seiteninhalt länger als Browserfensterhöhe ist */
	background: url('../bilder/bambus-bg.jpg') repeat-y left top;
	}

#content H1, #content H1 A { 
	font: 22px Arial, Helvetica, sans-serif; 
	font-weight: normal; /*bold*/
	margin-bottom: 20px;
	color: #888888;
	}

#content H1 A.backlink {
	font: 14px Arial, Helvetica, sans-serif; 
	font-weight: normal; 
	margin: 0px;
	padding-top: 10px;
	color: #888888;
}

#content H2, #content H2 A { 
	font: 18px Arial, Helvetica, sans-serif; 
	font-weight: normal; /*bold*/
	margin-bottom: 15px;
	color: #CC6666;/* #952431*/
	}

#content H2 A:hover { 
	color: #CC9999; /*#CC3333*/
	text-decoration: none;
	}

#content H3, #content H3 A { 
	font: 14px Arial, Helvetica, sans-serif; 
	font-weight: bold; /*normal*/
	margin-bottom: 15px;
	color: #888888;
	}

#content H3 A:hover { 
	color: #888888;
	text-decoration: none;
	}

#content P { 
	margin: 0 auto 15px auto;
	text-align: justify;
	line-height: 130%;
	}

#content LI { 
	margin-bottom: 5px;
	font-weight: bold;
	line-height: 130%;
	}

#content IMG.newsimage {
	float: right;
	position: relative;
	border: 1px solid #888888;
	margin-left: 20px;
	}

TABLE.page_link {
	/*border-top: 1px dotted #888888;*/
	}

#content TABLE.std {
	border: 1px solid #CCCCCC;
	}

#content TABLE.std TD {
	padding: 5px 5px 10px 5px;
	}

#content TABLE.std TEXTAREA {
	width: 98%;
	}

#content TABLE.std TR.formTail TD {
	text-align: center;
	}

#footer_bg {
	display: none;
	text-align: center;
}


/* -----------------------------------------------------------------------------------------
	Gästebuch
   ---------------------------------------------------------------------------------------*/

#content TR.entryBody1, #content TR.entryHead {
	text-align: left;
	}


/* -----------------------------------------------------------------------------------------
	KontaktFormular und BestellFormular
   ---------------------------------------------------------------------------------------*/

#content DIV.KontaktFormular {
	float: right;
	position: relative;
	width: 280px;
	margin: 0 0 20px 40px;
	}

#content TABLE.Formular TD {
	padding-bottom: 10px;
	}

#content DIV.KontaktFormular INPUT, 
#content DIV.KontaktFormular INPUT[type=text], 
#content DIV.KontaktFormular TEXTAREA {
	width: 250px;
	}

#content DIV.KontaktFormular INPUT[type=checkbox] {
	width: 20px;
	}

#content DIV.KontaktFormular P { 
	margin: 0 auto 10px auto;
	text-align:left;
	line-height: 120%;
	}

#content DIV.KontaktFormular LABEL {
	text-align: left;
	}


/* -----------------------------------------------------------------------------------------
	Footer
   ---------------------------------------------------------------------------------------*/

#footer { 
	font: 14px Arial, Helvetica, sans-serif;
	font-weight: normal; /*bold*/
	color: #888888;
	text-align: center;
	margin: 15px auto 0 auto;
	padding: 0px;
	/*border: 1px solid #888888;*/
	}