@charset "UTF-8";

/* Rahmen vom großen Logo weg */
a img
{
	border : 0 none;
}

/* Rahmen bei focus bei firefox weg */
a:focus
{
	-moz-outline-style: none;
}

body  {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:0.7em;
	line-height:1.4em;
	color:#58585a;
	background: #fbf7eb;
	margin: 0; /* Es empfiehlt sich, margin (Rand) und padding (Auffüllung) des Body-Elements auf 0 einzustellen, um unterschiedlichen Browser-Standardeinstellungen Rechnung zu tragen. */
	padding: 0;
	text-align: center; /* Hierdurch wird der Container in IE 5*-Browsern zentriert. Dem Text wird dann im #container-Selektor die Standardausrichtung left (links) zugewiesen. */
	background-image:url(../images/headerBackground.jpg);
	background-repeat:repeat-x;
	
}
.bodyclass #container { 
	width: 1000px;  /* Mit einer Breite, die 20 Pixel unter der vollen Breite von 1024 Pixel liegt, können Sie dem Browser-Chrome Rechnung tragen und gleichzeitig eine horizontale Bildlaufleiste vermeiden. */
	margin: 0 auto; /* Durch automatische Ränder (in Verbindung mit einer Breite) wird die Seite zentriert. */
	text-align: left; /* Hierdurch wird die Einstellung text-align: center im Body-Element überschrieben. */
} 


.bodyclass #header {  	
	height:312px;
} 
h1 {
	font-size:23px;
	color:#939f61;
	height:25px;
}

/* logo */

#logo {
	position:relative;
	left:50px;
	top:40px;
	width:402px;
	height:60px;
	background-image:url(../images/logo.png);
}

/* menu */

.bodyclass #menu {
	position:relative;
	width:624px;
	height:31px;
	top:60px;
	left:300px;
	z-index:9999;
}

.bodyclass #umenu {
	position:relative;
	width:600px;
	height:20px;
	top:-40px;
	right:-275px;
}

#news_mp, #phil_mp, #winzer_mp, #info_mp {
	display:block;
	position:relative;
	width:156px;
	height:31px;
	float:left;
}

#agent_ump, #ver_ump, #bz_ump, #presse_ump {
	display:block;
	position:relative;
	width:135px;
	height:15px;
	float:right;
	top: -110px;
	
}

#agent_ump {
	background:url(../images/menupunkte/agent_ump.png) 0px 0px no-repeat;
}
#ver_ump {
	background:url(../images/menupunkte/ver_ump.png) 0px 0px no-repeat;
}
#bz_ump {
	background:url(../images/menupunkte/bz_ump.png) 0px 0px no-repeat;
}
#presse_ump {
	background:url(../images/menupunkte/presse_ump.png) 0px 0px no-repeat;
}


#news_mp {
	background:url(../images/menupunkte/news_mp.png) 0px 0px no-repeat;
}
#phil_mp {
	background:url(../images/menupunkte/phil_mp.png) 0px 0px no-repeat;
}
#winzer_mp {
	background:url(../images/menupunkte/winzer_mp.png) 0px 0px no-repeat;
}
#info_mp {
	background:url(../images/menupunkte/info_mp.png) 0px 0px no-repeat;
}



a#news_mp:hover {
	background:url(../images/menupunkte/news_mp.png) -156px 0px no-repeat;
}
a#phil_mp:hover {
	background:url(../images/menupunkte/phil_mp.png) -156px 0px no-repeat;
}
a#winzer_mp:hover {
	background:url(../images/menupunkte/winzer_mp.png) -156px 0px no-repeat;
}
a#info_mp:hover {
	background:url(../images/menupunkte/info_mp.png) -156px 0px no-repeat;
}


a#agent_ump:hover {
	background:url(../images/menupunkte/agent_ump.png) -135px 0px no-repeat;
}
a#ver_ump:hover {
	background:url(../images/menupunkte/ver_ump.png) -135px 0px no-repeat;
}
a#bz_ump:hover {
	background:url(../images/menupunkte/bz_ump.png) -135px 0px no-repeat;
}
a#presse_ump:hover {
	background:url(../images/menupunkte/presse_ump.png) -135px 0px no-repeat;
}

/* umenu */





.winzer_umenu {
	padding-right: 20px;	
}

#region_test {
	margin-top:-50px;
	width:50px;
	height:18px;
	float:left;
	padding-right:0px;
}

#region_test {
	background:url(../images/menupunkte/region_ump_test.png) 0px 0px no-repeat;
}

a#region_test:hover {
	background:url(../images/menupunkte/region_ump_test.png) -50px 0px no-repeat;
}


/* sidebar */

.bodyclass #sidebar1 {
	float: right; /* Da es sich hier um ein floatendes Element handelt, muss eine Breite angegeben werden. */
	width: 300px; /* Die tatsächliche Breite dieses div umfasst in standardgerechten Browsern bzw. im Standardmodus von Internet Explorer außer der Breite auch die Auffüllung und den Rahmen. */
	/*background: #EBEBEB; /* Die Hintergrundfarbe wird nur für die Länge des Spalteninhalts angezeigt. */
	padding: 0px 50px 0px 10px;
	margin-top:-90px;
}

/**  Weinflaschen  **/

.bodyclass #weinflaschen {
	position:relative;
	padding-top:40px;
	width:256px;
	height:320px;
}


#weinflaschen ul {list-style:none; padding:0; margin:0; width:272px; float:right;}
#weinflaschen ul li {display:inline; width:68px; height:210px; float:left;}

#weinflaschen ul li a img {width:68px; height:201px; border:0;}

#weinflaschen ul li a b {position:absolute; left:-9999px; display:block; width:256px; height:82px; }


#weinflaschen ul li a:hover b {position:absolute; left:0; top:255px; z-index:100;} /* top: Abstand von oben - weg von den Flaschen */

#weinflaschen ul li a b i {display:block; width:256px; height:82px; text-align:center; display:table-cell; vertical-align:middle;}
#weinflaschen ul li a b i img {width:auto; height:auto;}


/**  Winzer CSS Hover  **/

#winzer_karte {
	width:334px;
	float:left;
	margin-top:-120px;
	padding-bottom:100px;
}

#winzer_text{
	position:relative;
	margin-left:-350px;
	width:600px;
	height:230px;
	margin-top:-30px;
}

.winzer_table{
	width:600px;	
	text-align:left;
}



.bodyclass #winzer_hover {
	position:relative;
	left:260px;
	top:210px;
	width:680px;
	height:230px;
}


#winzer_hover ul {list-style:none; padding:0; margin:0; width:680px; } /* weite: "tabellenweite?" */
#winzer_hover ul li {display:inline; width:150px; height:60px; padding-right:10px;  }

#winzer_hover ul li a img {width:150px; height:60px; border:0;}

#winzer_hover ul li a b {position:absolute; left:-9999px; display:block; width:448px; height:137px;}


#winzer_hover ul li a:hover b {position:absolute; left:182px; top:60px; z-index:100;} /* top: Abstand von oben - weg von den Flaschen */


#winzer_hover ul li a b i {display:block; width:450px; height:150px; text-align:center; display:table-cell; vertical-align:middle;}
#winzer_hover ul li a b i img {width:auto; height:auto;}


/*********   *********/


.bodyclass #mainContent { 
	margin: 0 400px 0 0px; /* Durch den rechten Rand dieses div-Elements entsteht die Spalte am rechten Seitenrand. Der Spaltenbereich bleibt unabhängig von der Inhaltsmenge des sidebar1-div immer gleich. Sie können diesen Rand entfernen, falls der Text des #mainContent-div den Bereich von #sidebar1 füllen soll, wenn der Inhalt in #sidebar1 endet. */
	padding: 0 20px; /* padding (Auffüllung) bezeichnet den Innenabstand und margin (Rand) den Außenabstand der div -Box. */
	margin-top:-110px; /* um über den headerbereich zu schreiben */
	
} 

.items td {
	padding: 0 20px;
	text-align:justify;
}

.bodyclass #footer { 
	margin-top:-20px;
	margin-bottom:30px;
	padding-right:50px;
	height:70px;
} 

#footer_text {
	float:left;	
	
}

#bio_logo {
	position:relative;
	width:233px;
	height:75px;
	background-image:url(../images/bio_logo.png);
	background-position:right;
	background-repeat:no-repeat;
	text-align:right;
	padding-right:90px;
	padding-top:35px;
	float:right;
	line-height:16px;
}

#background_hareter{
	background-image:url(../images/winzer/weincollage_hareter.png);
	background-repeat:no-repeat;
	background-position:bottom right;
	height:500px;
	width:600px;
}
#background_hager{
	background-image:url(../images/winzer/weincollage_hager.png);
	background-repeat:no-repeat;
	background-position:bottom right;
	height:500px;
	width:400px;	
}

#background_schwarz{
	background-image:url(../images/winzer/weincollage_schwarz.png);
	background-repeat:no-repeat;
	background-position:bottom right;
	height:500px;
	width:400px;	
}
#background_muster{
	background-image:url(../images/winzer/weincollage_muster.png);
	background-repeat:no-repeat;
	background-position:bottom right;
	height:500px;
	width:400px;	
}

.weinheader{
	font-size:14px;
}


a:link { 
	text-decoration:none;
	color:#58585a;
}
a:visited { 	
	text-decoration:none;
	color:#58585a;
}
a:focus { 	
	text-decoration:none;
	color:#58585a;
}
a:hover { 	
	color:#58585a;
	text-decoration:underline;
}
a:active { 	
	text-decoration:none;
	color:#58585a;
}

#flowpanes div#korkenz {
	 width:300px;
	 height:223px;
	 background-image:url(../images/korkenz.png);
	 background-repeat:no-repeat;
	 background-position:bottom;

}

#flowpanes div#conatct {
	 width:270px;
	 height:173px;
	 background-image:url(../images/contact.png);
	 background-repeat:no-repeat;
	 margin-left:150px;
	 margin-top:0px;
	 font-size:12px;
	 line-height:20px;
	 color:#FFF;
	 padding-top:28px;
	 padding-left:48px;
	 
}
#flowpanes div#wein{
	margin-left:0px;
	font-size:14px;
	line-height:25px;
	float:left;
	 width:250px;
	 height:270px;

}



.fltrt { /* Mit dieser Klasse können Sie ein Element auf der Seite nach rechts fließen lassen. Das floatende Element muss vor dem Element stehen, neben dem es auf der Seite erscheinen soll. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* Mit dieser Klasse können Sie ein Element auf der Seite nach links fließen lassen. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* Diese Klasse sollte in einem div- oder break-Element platziert werden und das letzte Element vor dem Schließen eines Containers sein, der wiederum einen vollständigen Float enthalten sollte. */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}