/******* this css includes css hacks *******/

/******* the following css hacks are used within the stylesheets directly *******/
/* tan hack (only interpreted by for ie and mac ie): */ 
/* * html .element */

/* mac hack (anything between theses two comments is hidden from mac ie): */
/* \*/ /* */ 

/******* clearing problems - use .area *******/
/* 
- stretch the surrounding area (div) over all included floating elements
- "How To Clear Floats Without Structural Markup", source and explanation: http://www.positioniseverything.net/easyclearing.html
*/
/* ignored by win ie */
.area:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
.area {display: inline-table;} 
/* hide from mac ie5 \*/
* html .area {height: 1%;} 
*+html .area {height: 1%;}
.area {display: block;}
/* end hide from mac ie5 */

/******* ie: don't create space around checkboxes and position checkboxes like mozilla *******/
* html input.inputCheckbox, * html input.inputRadio { /* ie6 */
	margin: -4px 0 0 -3px;
}
*+html input.inputCheckbox, *+html input.inputRadio { /* ie7 */
	margin: -4px 0 0 -3px;
}

/******* ie: break words *******/ 
/* the following definitions only work for ie, it is valid css css for ie but not realized by css validator, 
it has normally to be set directly within html
<!--[if gte IE 5]>
  	<style type="text/css">
	</style>
<![endif]-->
but this not possible with the branding concept
*/
* html body {
	word-wrap: break-word; /* wrap words that are too long, Explorer 5+ Windows only */
}


* { /* exclude browser incompatibilities */
	margin: 0;
	padding: 0;
}


body {
	font: 12px  Verdana, Tahoma,Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif;
	background: #fff;
}

#container_einstieg{
	margin: 50px auto;
	height: 540px;
	width: 900px;
	border: 1px solid #000;
}

#container,
#container_startseite
{
	margin: 50px auto;
	height: 540px;
	width: 850px;
	border: 1px solid #000;
}


*+html #container,
*+html #container_startseite,
*+html #container_einstieg{
	height: 540px;
}

#container_startseite {
	background-image: url();
	background-repeat: no-repeat;
	background-position: left bottom;

}

#container_einstieg {
	background-image:  url(images/bg_einstieg.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;

}

#menue, #trenner,#content {
	float:left;
	padding: 0px;
	margin:0px;
}

#menue {
	width: 285px;
	height: 540px;
}

* html #menue {
	height: 540px;
}

.m_events{
	background-image: url(images/bg_menue_events.jpg);
	background-repeat: no-repeat;
	background-position: bottom;	
}

.m_produkte{
	background-image: url(images/bg_menue_produkte.jpg);
	background-repeat: no-repeat;
	background-position: bottom;	
}

.m_material{
	background-image: url(images/bg_menue_material.jpg);
	background-repeat: no-repeat;
	background-position: bottom;	
}

.m_unikat{
	background-image: url(images/bg_menue_unikat.jpg);
	background-repeat: no-repeat;
	background-position: bottom;	
}

.m_kontakt{
	background-image: url(images/bg_menue_kontakt.jpg);
	background-repeat: no-repeat;
	background-position: bottom;	
}

.m_impressum{
	background-image: url(images/bg_menue_impressum.jpg);
	background-repeat: no-repeat;
	background-position: bottom;	
}

.m_freunde{
	background-image: url(images/bg_menue_freunde.jpg);
	background-repeat: no-repeat;
	background-position: bottom;	
}

#menuestruktur {
	width: 100%;
	text-align: right;
	position: relative;
	top:85px;
}

#menuestruktur a {
	width: 265px;
	margin: 0px 10px;
	text-align: right;
	float: none;
	clear:both;
	display: block;
	text-decoration: none;
	font-size:11px;
	font-weight: bold;
	line-height:42px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #696969;
}

#homelink {
	position: relative;
	top: -200px;
	left: 0px;
	width: 280px;
	height: 40px;

}

#homelink div {
	width: 280px;
	height: 40px;	
	z-index: 130;
	cursor: pointer;
}

#trenner {
	width: 35px;
	height:500px;
	margin: 20px 0px;
	background-color: Fuchsia;
	background-color: #f8d2eb;
	background-image: url(images/bg_trenner.jpg);
	background-repeat: no-repeat;
	background-position: top;	
}

#content {
	width: 510px;
	height:520px;
	margin: 20px 20px 0px 0px;
	background-color: #fff;
}



/* Hintergrundbilder Content-Bereich */

.bgHome,
.bgEvent,
.bgKontakt,
.bgFreunde,
.bgEmpty{
	background-repeat: no-repeat;
	background-position: top left;
}
.bgHome		{	background-image: url(images/bg_content_home.jpg);}
.bgEvent		{	background-image: url(images/bg_content_event.jpg);}
.bgKontakt	{	background-image: url(images/bg_content_kontakt.jpg);}
.bgFreunde	{	background-image: url(images/bg_content_freunde.jpg);}
.bgEmpty		{	background-image: url(images/bg_content_leer.jpg);}

#inhalt {
	margin: 0px 20px 0px 20px;
	background-color: transparent;
	position: relative;
	bottom: 0px;
	width: 470px;
	height:500px;
}


* html #inhalt {
	margin: 0px 20px 0px 20px;
	background-color: transparent;
	position: relative;
	bottom: 0px;
	width: 470px;
	height:520px;
}

*+html #inhalt {
	margin: 0px 20px 0px 20px;
	background-color: transparent;
	position: relative;
	bottom: 0px;
	width: 470px;
	height:530px;
}


h1 {
	margin: 35px 0px 5px 0px;
	height:45px;
	background-repeat: no-repeat;
}

h2 {
	margin: 0px 0px 5px 10px;
	height:30px;
	background-repeat: no-repeat;
}

h1.home{
	background-image: url(images/h1_home.gif);
}

h1.events{
	background-image: url(images/h1_event.gif);
}

h1.material{
	background-image: url(images/h1_material.gif);
}

h1.produkte{
	background-image: url(images/h1_produkte.gif);
}

h1.kontakt{
	background-image: url(images/h1_kontakt.gif);
}

h1.impressum{
	background-image: url(images/h1_impressum.gif);
}

h1.freunde{
	background-image: url(images/h1_freunde.gif);	
}

h2.augenschmauss	{	background-image: url(images/h2_augenschmauss.gif);}
h2.landliebe	{	background-image: url(images/h2_landliebe.gif);}
h2.esslinger_gartentage	{	background-image: url(images/h2_esslinger_gartentage.gif);}



p.einleitung {
	padding: 5px 10px 5px 50px;
}

p.plagiat {
	padding: 30px 5px 5px 180px;	
}

#materialbilder,#produktebilder, #content_navigation {
	float:left;
	clear: both;
}

#materialbilder, #produktebilder {
	width:340px;
}

#materialbilder .materialbild,#produktebilder .materialbild{
	margin: 1px 1px 0px 0px;
}

#materialbilder a img,#produktebilder a img {
	border: none;
}

#content_navigation {
	width: 150px;
	position: absolute;
	top: 360px;
	left: 340px;
	z-index: 120;
}

* html #content_navigation {
	width: 150px;
	position: absolute;
	top: 390px;
	left: 340px;
	z-index: 120;
}

*+html #content_navigation {
	width: 150px;
	position: absolute;
	top: 390px;
	left: 340px;
	z-index: 120;
}


#content_navigation a.next {
	position: relative;
	top: 0px;
	left: 0px;
	width: 75px;
	height: 45px;
		text-decoration: none;
}

#content_navigation a.previous {
	position: relative;
	top: -15px;
	left: 48px;
	width: 65px;
	height: 30px;
	border: none;
	text-decoration: none;
}

#content_navigation img {
	border: none;
}


#navigation_hauptseite {
	width: 150px;
	position: relative;
	top: 435px;
	left: 730px;
	z-index: 120;
}

#navigation_hauptseite a.next {
	position: relative;
	top: 0px;
	left: 0px;
	width: 75px;
	height: 45px;
		text-decoration: none;
}


#navigation_hauptseite img {
	border: none;
}

#form {
	font-size: 10px;
}
.zeile {
	width: 100%;
	float: none;
	clear:both;
	height: auto;
}

.zelle200 {
	width: 190px;
	float: left;
}

.zelle300 {
	width: 280px;
	float: left;
}

.adresse {
	margin: 0px 5px 10px 10px;
	color: #000;
	text-transform: uppercase;
	font-size: 10px;
	letter-spacing: 1px;
	font-stretch: condensed;
	line-height: 16px;
}

label {
	width: 60px; 
	text-align: right;
	color: #f06927;
	float:left;
	padding: 0px 4px 0px 0px;
	
}

input.kontaktForm {
	width: 200px;
	float: left;
	margin: 3px 0px;
	border: none;
	padding: 3px;
}

textarea.kontaktForm {
	width: 200px;
	height: 100px;
	float: left;
	margin: 3px 0px;
	border: none;
	padding: 3px;
}


.kontaktFormSubmit {
	position: relative;
	top: 90px;
	left: 180px;
	z-index:100;
}

p.monat,p.event {
	margin: 3px 0px;
	line-height: 16px;
	
}

.monat {
	text-align: right;
	padding: 0px 20px 0px 0px;
	color: #F06927;
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
}

.event {
	text-align: left;
	padding: 0px 20px 0px 30px;
	color: Black;
}


#inhalt.contactBG {
	background-image:	url(images/kontakt_zwerge_unten2.gif);
	background-repeat: no-repeat;
	background-position: -20px 320px;
}

* html .contactBG {
	background-image:	url(images/kontakt_zwerge_unten2.gif);
	background-repeat: no-repeat;
	background-position: -20px 360px;
}

*+html .contactBG {
	background-image:	url(images/kontakt_zwerge_unten2.gif);
	background-repeat: no-repeat;
	background-position: -20px 360px;
}

#inhalt.eventBG {
	background-image:	url(images/event_bg.gif);
	background-repeat: no-repeat;
	background-position: 0px 174px;

}

* html .eventBG {
	background-image:	url(images/event_bg.gif);
	background-repeat: no-repeat;
	background-position: 0px 260px;
}

*+html .eventBG {
	background-image:	url(images/event_bg.gif);
	background-repeat: no-repeat;
	background-position: 0px 260px;
}


#inhalt.homeBG {
	background-image:	url(images/home_bg.gif);
	background-repeat: no-repeat;
	background-position: -20px 130px;
}

* html .homeBG {
	background-image:	url(images/home_bg.gif);
	background-repeat: no-repeat;
	background-position: -20px 170px;
}

*+html .homeBG {
	background-image:	url(images/home_bg.gif);
	background-repeat: no-repeat;
	background-position: -20px 170px;
}

.abstandoben {
	margin-top: 60px;
	margin-left: 15px;

}

.eventueberschrift {
	font-size: 12pt;
	font-face: Arial;
	padding: 0px 20px 0px 30px;
		
}

.produktebild {
	margin-left: 10px;
}

#bilderrahmen {
	margin-left: 15px;	
}

.links {
	margin-top: 50px;
	margin-left: 25px;	
}

.links2 {
	margin-top: 25px;
	margin-left: 75px;	
}

.links3 {
	margin-top: 25px;
	margin-left: 125px;	
}

.links4 {
	margin-top: 25px;
	margin-left: 175px;	
}

.links5 {
	margin-top: 25px;
	margin-left: 225px;	
}

.links6 {
	margin-top: 25px;
	margin-left: 275px;	
}