/*=======================================================
Stand: Januar 2010
datei: bildschirm.css
datum: 28.1.2010
Autor: T.Trölsch
Aufbau: 1.Kalibrierung und allg. Styles
		2.Styles für Layoutbereiche
		3.sonstige Styles
========================================*/

/*=================================
	1.Kalibrierung und allg. Styles
====================================*/

/*Kalibrierung wichtiger Abstände*/
*{margin: 0;}
h2, p, ul, ol { margin-bottom: 1em; }/* Abstand nach unten*/
ul ul{ margin-bottom: 0;}/*Verschachtelte Listen ohne Abstand*/
li { margin-left: 1em; font-size: 90%; }/*Abstand von Links*/

/*Allgemeine Selektoren*/
body
{ /* Gestaltet das HTML-Element mit dem namen body */
	color: #FFFF99; /* Schriftfarbe */
	Background-color:#999966; /*Hintergrundfarbe*/
	font-family: Arial,Helvetica, sans-serif;
	font-size: 100%; /* Schriftgröße*/
}

h1 { font-size: 130%;
color:#999966;	}
h2 { font-size: 110%;
	color: #FF8000;
	text-align:left; }
h3 { font-size: 105%;
    margin-top: 20px;    }
h4 { font-size: 100%;
	color: #FF8000;}
h5 { font-size: 100%;
	margin-top: 15px;
	margin-bottom: 20px;}

address {
	text-align: center;/* zentrieren */
	font-size: 60%;	/* etwas kleiner */
	color:#a9a9a9;
	font-style: normal;
	letter-spacing: 1px;/* Abstand zwischen den Buchstaben*/
	line-height: 1.3em;/* Zeilenabstand */
	font-weight: regular;
	padding-top: 0;
	line height: 1px solid #808080;	}

a {text-decoration: none;  /*Unterstreichung entfernen*/
	outline: none;}

a:link 
{ color: #2F4F4F; }
a:visited 
{ color:#6699FF; }
a:hover, a:focus 
{ border-bottom:1px solid #FF8000; }
a:active 
{ color:white;

}

/*Allgemeine Klassen und IDs*/
.skiplink{
	position: absolute;
	top:-2000px;
	left:-3000px;
	width: 0px;
	height:0px;
	overflow: hidden;
	display:inline;
}

#logo{/*das HTML-Element mit dem Attribut id="logo"*/
	background-color: orange;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
		}
	

/*=================================
	2.Styles für die Layoutbereiche
====================================*/

#kopfbereich{
	color: black;
	background-color: #999966;;/*grün*/
	width: 955px; /*Breite des Inhaltbereiches*/
	height: 150px; /*Breite des Inhaltbereiches*/
	margin-right: auto;/*Abstand rechts*/
	margin-left: auto;/*Abstand rechts*/
	
}
#kopfbereich p {
	margin-bottom: 0;
	}
/* ====== Navibereich======*/

#navibereich {
	text-align:center; /*...	bündig*/
	color: white;
	background-color: #FF8000;/*orange*/
	width: 955px; /*Breite des Inhaltbereiches*/
	padding-top: 5px;
	padding-bottom: 4px;
	border-bottom:1px solid white;
	margin-right: auto;/*Abstand rechts*/
	margin-left: auto;/*Abstand rechts*/
	}
#navibereich ul { margin-bottom: 3px;}

#navibereich li {
	display: inline;	/*li nebeneinander anzeigen*/
	list-style-type:none;/*ohne aufzählpunkte*/
	margin: 0px 18px 0 0;/*Abstand zwische den worten*/
}
#navibereich a {
	color:white;
	padding-top: 3px;
	padding-right: 10px;
	padding-bottom: 4px;
	padding-left: 8px;
	
}
#navibereich a:hover,
#navibereich a:focus,
#startseite #navi01 a,
#ueberuns #navi02 a,
#tee #navi03 a,
#wein #navi04 a,
#undmehr #navi05 a,
#kontaktseite #navi06 a,
#impressum #navi07 a {
	color: black;  /*Farbe text berühren Maus*/
}
#navibereich a:active
	{color:	#FFFFFF;/*Farbe geklickt*/}

a.extra:link { color: #99cccc;}
a.extra:visited { color:#99cccc; }
a.extra:hover {color:#CC9900;}	
	
	
/* ====== Navibereich======*/

/*==== Textbereich===*/

*html #textbereich {width:300px;}/* patch für IE6*/

#wrapper{/* Gestatltet das HTML-Element mit id="wrapper"*/
	position:relative;
	width:955px; 
	height:610px;
	color: black;
	background-color:white;/*Hintergrundfarbe*/
	margin-right: auto;/*Abstand rechts*/
	margin-left: auto;/*Abstand rechts*/
	}

#wrapper1{/* Gestatltet das HTML-Element mit id="wrapper"*/
	position:relative;
	width:955px; 
	height:800px;
	color: black;
	background-color:white;/*Hintergrundfarbe*/
	margin-right: auto;/*Abstand rechts*/
	margin-left: auto;/*Abstand rechts*/
	}
	

#foto1{
    position:absolute;
    top:0px;
    left:750px;
    width:200px;
    height:600px;
    margin:0 0 0 0;    }
    
    #foto1a{
    position:absolute;
    top:0px;
    left:800px;
    width:152px;
    height:608px;
    margin:0 0 0 0;    }
    
    #foto2{
    position:absolute;
    top:30px;
    left: 380px;
    width:114px;
    height:180px;
    margin:0 0 0 0;
     }


#textbereich {
    position:absolute;
	left:130px;
	width:300px; 
	height:500px;
 	padding-top:10px;
 	padding-left:30px;
	padding-right:10px;
	
	}
	
#bildbereich{
    background-color:white;
    width:390px;
    height:500px;
 	padding-right:10px;
	margin-left:530px;
	}

#textbereich03{
	text-align: center;  /* zentrieren */
	width: 800px;
	height:500px;
	background-color:white;
	background-repeat: no-repeat;
	padding-left: 30px;
	padding-left: 30px;
	padding-bottom:20px;
	margin-left: 50px;
	}

#textbereich1a{
    text-align:center;
    position:absolute;
    font-size:10px;
    color: grey;
    left:300px;
	width:350px; 
	height:400px;
 	margin-top:730px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
	#textbereich2a{
    text-align:left;
    position:absolute;
    font-size:16px;
    color: grey;
    left:300px;
	width:550px; 
	height:400px;
 	margin-top:50px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
	#textbereich2b{
    text-align:left;
    position:absolute;
    font-size:13px;
    color: grey;
    left:300px;
	width:550px; 
	height:400px;
 	margin-top:30px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
	#textbereich2c{
    text-align:left;
    position:absolute;
    font-size:13px;
    color: grey;
    left:300px;
	width:450px; 
	height:400px;
 	margin-top:30px;
 	padding-right:10px;
	padding-bottom:20px;	
	}


#textbereich3a{
    text-align:center;
    position:absolute;
    font-size:10px;
    color: grey;
    left:300px;
	width:350px; 
	height:400px;
 	margin-top:530px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
#textbereich a{
	border-bottom:1px dotted #FF8000;
}

#textbereich a:hover,
#textbereich a:focus {
	border-bottom: 1px solid #808080;
}
/*==== Ende Textbereich===*/

a.link1 {
position:absolute;
top:35px;
left: 35px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube.jpg);
}

a.link1:hover {
background-image:url(img/traube1.jpg);
}

a.link2 {
position:absolute;
top:35px;
left: 345px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube2.jpg);
}

a.link2:hover {
background-image:url(img/traube2a.jpg);
}
 
 a.link3 {
position:absolute;
top:35px;
left: 630px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube3.jpg);
}

a.link3:hover {
background-image:url(img/traube3a.jpg);
}
   

a.link4 {
position:absolute;
top:200px;
left: 35px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube4.jpg);
}

a.link4:hover {
background-image:url(img/traube4a.jpg);
}

a.link5 {
position:absolute;
top:200px;
left:345px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube5.jpg);
}

a.link5:hover {
background-image:url(img/traube5a.jpg);
}

a.link6 {
position:absolute;
top:200px;
left:630px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube6.jpg);
}

a.link6:hover {
background-image:url(img/traube6a.jpg);
}

a.link7 {
position:absolute;
top:370px;
left: 35px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube7.jpg);
}

a.link7:hover {
background-image:url(img/traube7a.jpg);
}

a.link8 {
position:absolute;
top:370px;
left:345px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube8.jpg);
}

a.link8:hover {
background-image:url(img/traube8a.jpg);
}

a.link9 {
position:absolute;
top:370px;
left:630px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube9.jpg);
}

a.link9:hover {
background-image:url(img/traube9a.jpg);
}

a.link10{
position:absolute;
top:540px;
left: 35px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube10.jpg);
}

a.link10:hover {
background-image:url(img/traube10a.jpg);
}

a.link11 {
position:absolute;
top:540px;
left:345px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube11.jpg);
}

a.link11:hover {
background-image:url(img/traube11a.jpg);
}



a.link12{
position:absolute;
top:540px;
left:630px;
width:250px;
height:150px;
border:0px solid #000000;
background-image:url(img/traube12.jpg);
}

a.link12:hover {
background-image:url(img/traube12a.jpg);
}


		/* Sidebar */

#sidebar {
	float: left;
	width: 170px;
	height: 120px;
	padding-top: 20px; }

#sidebar ul {
	margin: 0;
	padding: 0 0 20px 0;
	list-style: none;}

#sidebar li {
}

#sidebar li ul {
	padding: 0px 21px 20px 15px;
}

#sidebar li li {
	border-bottom: 1px dotted #999966;
	padding: 5px 0px;
}


#sidebar a {
   	font-size:12px;
   	font-weight: bold;
	font-family: Verdana, sans-serif;
	text-decoration: none;
	color: #c0c0c0;
}

#sidebar a:hover {
	text-decoration: none;
	color:#FF8000;
}

#sidebar .current_page_item a {
		background:transparent;
		color:#999966;
		}


/*  Ende Sidebar */


/*=================================
	ENDE
====================================*/