/* CSS Document */
   * {margin:0; padding:0;}
   
   body
         {
	font-family: "Times New Roman", Times, serif;
	font-size:12pt;
	color:#000000;
	text-decoration:none;
	scrollbar-base-color:#6B819D;
	scrollbar-3dlight-color:#AFAFAF;
	scrollbar-arrow-color:#AFAFAF;
	scrollbar-darkshadow-color:#5F5F5F;
	scrollbar-face-color:#6B819D;
	scrollbar-highlight-color:#AFAFAF;
	scrollbar-shadow-color:#5F5F5F;
	scrollbar-track-color:#8BA9CE;
	background-color:#9ba4b4;
	z-index:0;
	width: 100%;
         }
		 
    h1 {
font-size: 24px;
font-style: normal;
color: #000000;
text-decoration: none;
margin-top: 20px;
font-weight: bolder;
text-align: center;
}

h2 {
	font-size: 24px;
	font-weight: bolder;
	margin-top: 20px;
	text-decoration: none;
	color: #000000;
	text-align: left;
}

h3 {
	font-size: 18px;
	font-weight: bolder;
	margin-top: 20px;
	text-decoration: none;
	color: #000000;
	text-align: center;
}

p {
font-size: 14px;
text-decoration: none;
color: #000000;
margin-top: 5px;
margin-bottom: 5px;
text-align: left;
}
		 
/* ##########################   links   ######################## */		 

    a:link
         {
         font-size:1em;
         color:#FFFFFF;
         text-decoration:none;
         }

    a:visited
         {
         font-size:1em;
         color:#ffffff;
         text-decoration:none;
         }

    a:hover
         {
         font-size:1em;
         color:#ffffce;
         text-decoration:none;
         }

    a:active
         {
         font-size:1em;
         color:#FFFFFF;
         text-decoration:none;
         }
		 
/* #########################   links ende   ########################### */		 

#inhalt {
	position: absolute;
	height: 735px;
	width: 990px;
	left: 0px;
	top: 0px;
	z-index:1;
	margin-left: auto;
	margin-right: auto;
}


#mosaikleiste {
	position: absolute;
	left: 10px;
	top: 0px;
	z-index:2;
}

/* ###########################   kopf   ############################### */

#kopf {
	position: absolute;
	height: 70px;
	width: 930px;
	left: 50px;
	top: 0px;
	border: 1px solid #000000;
	background-image:url(../bilder/head3.jpg);
	color: #F6EEDB;
	z-index:2;
}
#kopftext {
	position: absolute;
	height: 48px;
	width: 369px;
	left: 85px;
	top: 0px;
	font-size: 36px;
	font-weight: 900;
	color: #F6EEDB;
	z-index:3;
}
#kopftext2 {
	position: absolute;
	height: 27px;
	width: 549px;
	left: 200px;
	top: 40px;
	color: #F6EEDB;
	font-weight: 900;
	z-index:3;
}


/* #########################   kopf ende   ########################## */

/* #########################   navigationsleiste   ########################### */

#navi {
	position: absolute;
	height: 600px;
	width: 120px;
	left: 860px;
	top: 80px;
	border: 1px solid #000000;
	background-image:url(../bilder/navi3.jpg);
	z-index:2;
}
#farbfeld {
	position: absolute;
	height: 400px;
	width: 110px;
	left: 5px;
	top: 25px;
	background-image: url(../bilder/farbfeld3.jpg);
	z-index:3;
}

#impressumlink {
	position: absolute;
	left: 17px;
	top: -38px;
	z-index: 7;
}
#button1 {
	position: absolute;
	height: 20px;
	width: 100px;
	left: 10px;
	top: 30px;
	background-image:url(../bilder/buttons/buttons_deutsch/aktuellbutton1.gif);
	z-index:4;
}
#button1:hover{background-image:url(../bilder/buttons/buttons_deutsch/aktuellbutton2.gif)}
#button2 {
	position: absolute;
	height: 20px;
	width: 100px;
	left: 10px;
	top: 80px;
	background-image:url(../bilder/buttons/buttons_deutsch/mosaikbutton1.gif);
	z-index:4;
}
#button2:hover{background-image:url(../bilder/buttons/buttons_deutsch/mosaikbutton2.gif)}
#buttonreferenz {
	position: absolute;
	height: 20px;
	width: 100px;
	left: 10px;
	top: 110px;
	background-image:url(../bilder/buttons/buttons_deutsch/mittersteigbutton1.gif);
	z-index:4;
}
#buttonreferenz:hover{
	background-image:url(../bilder/buttons/buttons_deutsch/mittersteigbutton2.gif)
}
#button3 {
	position: absolute;
	height: 20px;
	width: 100px;
	left: 10px;
	top: 140px;
	background-image:url(../bilder/buttons/buttons_deutsch/sandbutton1.gif);
	z-index:4;
}
#button3:hover{background-image:url(../bilder/buttons/buttons_deutsch/sandbutton2.gif)}
#button4 {
	position: absolute;
	height: 20px;
	width: 100px;
	left: 10px;
	top: 170px;
	background-image:url(../bilder/buttons/buttons_deutsch/acrylbutton1.gif);
	z-index:4;
}
#button4:hover{background-image:url(../bilder/buttons/buttons_deutsch/acrylbutton2.gif)}
#button4a {
	position: absolute;
	height: 20px;
	width: 100px;
	left: 10px;
	top: 200px;
	background-image:url(../bilder/buttons/buttons_deutsch/taschenkunstbutton1.gif);
	z-index:4;
}
#button4a:hover{
	background-image:url(../bilder/buttons/buttons_deutsch/taschenkunstbutton2.gif)
}
#button5 {
	position: absolute;
	height: 20px;
	width: 100px;
	left: 10px;
	top: 250px;
	background-image:url(../bilder/buttons/buttons_deutsch/vronibutton1.gif);
	z-index:4;
}
#button5:hover{background-image:url(../bilder/buttons/buttons_deutsch/vronibutton2.gif)}
#button6 {
	position: absolute;
	height: 20px;
	width: 100px;
	left: 10px;
	top: 280px;
	background-image:url(../bilder/buttons/buttons_deutsch/mathiasbutton1.gif);
	z-index:4;
}
#button6:hover{background-image:url(../bilder/buttons/buttons_deutsch/mathiasbutton2.gif)}
#buttonlinks {
	position: absolute;
	height: 20px;
	width: 100px;
	left: 10px;
	top: 330px;
	background-image:url(../bilder/buttons/buttons_deutsch/linkbutton1.gif);
	z-index:4;
}
#buttonlinks:hover{background-image:url(../bilder/buttons/buttons_deutsch/linkbutton2.gif)}
#button7 {
	position: absolute;
	height: 20px;
	width: 100px;
	left: 10px;
	top: 360px;
	background-image:url(../bilder/buttons/buttons_deutsch/kontaktbutton1.gif);
	z-index:4;
}
#button7:hover{background-image:url(../bilder/buttons/buttons_deutsch/kontaktbutton2.gif)}
#button8 {
	position: absolute;
	height: 20px;
	width: 100px;
	left: 10px;
	top: 390px;
	background-image:url(../bilder/buttons/buttons_deutsch/homebutton1.gif);
	z-index:4;
}

#button8:hover{background-image:url(../bilder/buttons/buttons_deutsch/homebutton2.gif)}

/* #####################   navigationsleiste ende   ###################### */

/* #####################   hauptfeld   ####################### */

#main {
	position: absolute;
	height: 600px;
	width: 800px;
	left: 50px;
	top: 80px;
	border: 1px solid #000000;
    background-image:url(../bilder/main.jpg);
	z-index:2;
	}
/* Bildergalerie*/

#inhalt_galerie {
	width:778px;
	height:530px;
	position: absolute;
	top:10px;
	left:10px;
	z-index:3;
}

#schrift {
	top:240px;
	left:475px;
	font-family: Times New Roman, Times, serif;
	font-size:0.8em;
	font-weight:400;
	font-style:normal;
	color:#000000;
	padding:20px;
	text-align:center;
	text-decoration:none;
	width: 110px;
	position: absolute;
	z-index:3;
}
#galerietitel {
	position: absolute;
	height: 69px;
	width: 300px;
	left: 345px;
	top: -14px;
	text-align: center;
	z-index:4;
}
#galerieuntertitel {
	position: absolute;
	height: 40px;
	width: 251px;
	left: 345px;
	top: 51px;
	z-index:4;
	font-weight: bold;
}
#navi_galerie {
	position: absolute;
	width: 290px;
	height: 20px;
	left: 20px;
	top: 50px;
	z-index: 3;
}
#mosaikknopf1 {
	background-image:url(../bilder/buttons/buttons_deutsch/mehrklein_blau.gif);
	background-repeat:no-repeat;
	position: absolute;
	top: 0px;
	left: 138px;
	width: 63px;
	height: 20px;
	z-index: 4;
}
#mosaikknopf1:hover{background-image: url(../bilder/buttons/buttons_deutsch/mehrklein_blau2.gif);}
#mosaikknopf2 {
	background-image: url(../bilder/buttons/buttons_deutsch/zurueckklein_blau.gif);
	background-repeat:no-repeat;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 64px;
	height: 20px;
	z-index: 4;
}
#mosaikknopf2:hover{background-image:url(../bilder/buttons/buttons_deutsch/zurueckklein_blau2.gif);}
#knopf1 {
	background-image:url(../bilder/buttons/buttons_deutsch/mehrklein_blau.gif);
	background-repeat:no-repeat;
	position: absolute;
	top: 0px;
	left: 225px;
	width: 64px;
	height: 20px;
	z-index: 4;
}
#knopf1:hover{background-image: url(../bilder/buttons/buttons_deutsch/mehrklein_blau2.gif);}
#knopf2 {
	background-image: url(../bilder/buttons/buttons_deutsch/zurueckklein_blau.gif);
	background-repeat:no-repeat;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 64px;
	height: 20px;
	z-index: 4;
}
#knopf2:hover{background-image:url(../bilder/buttons/buttons_deutsch/zurueckklein_blau2.gif);}
/*#knopf3 {
	position: absolute;
	top: 60px;
	left: 0px;
	width: 64px;
	height: 20px;
	z-index: 4;
}
#knopf4 {
	position: absolute;
	top: 90px;
	left: 0px;
	width: 64px;
	height: 20px;
	z-index: 4;
}
#knopf5 {
	position: absolute;
	top: 120px;
	left: 0px;
	width: 64px;
	height: 20px;
	z-index: 4;
}
#knopf6 {
	position: absolute;
	top: 160px;
	left: 0px;
	width: 64px;
	height: 20px;
	z-index: 4;
}*/

#bilderklein {
	width:285px;
	height:480px;
	position:absolute;
	top: 80px;
	left: 20px;
	background-color:#6C819C;
	padding-left: 5px;
	z-index:4;
			   }

			  
			  
#bild1klein, #bild2klein,
#bild3klein, #bild4klein,
#bild5klein, #bild6klein,
#bild7klein, #bild8klein,
#bild9klein, #bild10klein,
#bild11klein, #bild12klein,
#bild13klein, #bild14klein,
#bild15klein {
	width:90px;
	height:90px;
	margin-top: 5px;
	float:left;
	background-color:#F6EEDB;
	margin-right: 5px;
	z-index:5;
	}

#bild1gross, #bild2gross,
#bild3gross, #bild4gross,
#bild5gross, #bild6gross,
#bild7gross, #bild8gross,
#bild9gross, #bild10gross,
#bild11gross, #bild12gross,
#bild13gross, #bild14gross,
#bild15gross
 {
	position:absolute;
	top:50px;
	left:330px;
	height: 400px;
	width: 400px;
	visibility:hidden;
	z-index:6;
}		
		 
#bild1klein:hover #bild1gross {visibility:visible} 
#bild2klein:hover #bild2gross {visibility:visible}	 
#bild3klein:hover #bild3gross {visibility:visible}	 
#bild4klein:hover #bild4gross {visibility:visible}	 
#bild5klein:hover #bild5gross {visibility:visible}
#bild6klein:hover #bild6gross {visibility:visible}
#bild7klein:hover #bild7gross {visibility:visible}	 
#bild8klein:hover #bild8gross {visibility:visible}	 
#bild9klein:hover #bild9gross {visibility:visible}	 
#bild10klein:hover #bild10gross {visibility:visible}	 
#bild11klein:hover #bild11gross {visibility:visible}
#bild12klein:hover #bild12gross {visibility:visible}
#bild13klein:hover #bild13gross {visibility:visible}
#bild14klein:hover #bild14gross {visibility:visible}
#bild15klein:hover #bild15gross {visibility:visible}


/*Bildergalerie Ende*/
#ueberschrift {
	position: absolute;
	width: 432px;
	height: 65px;
	text-align: center;
	left: 187px;
	top: 5px;
	z-index:5;
}
#lebenslauf {
	position: absolute;
	height: 500px;
	width: 319px;
	left: 243px;
	top: 64px;
	text-align: justify;
	z-index:4;
}
#foto_lebenslauf {
	position: absolute;
	height: 170px;
	width: 170px;
	left: 33px;
	top: 35px;
	z-index:5;
}
#foto2_lebenslauf {
	position: absolute;
	height: 170px;
	width: 170px;
	left: 600px;
	top: 105px;
	background-image: url(../bilder/fotos170x170/vom-winde-verweht4.gif);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	z-index:5;
}
#fotos_LL_links {
	position: absolute;
	height: 545px;
	width: 180px;
	left: 30px;
	top: 30px;
	z-index:5;
}
#foto01 {
	position: absolute;
	height: 170px;
	width: 170px;
	left: 5px;
	top: 5px;
	z-index:6;
}
#foto02 {
	position: absolute;
	height: 170px;
	width: 170px;
	left: 5px;
	top: 259px;
	z-index:6;
}
#fotos_LL_rechts {
	position: absolute;
	height: 545px;
	width: 180px;
	left: 595px;
	top: 30px;
	z-index:5;
}
#foto03 {
	position: absolute;
	height: 170px;
	width: 170px;
	left: 5px;
	top: 100px;
	z-index:6;
}
#foto04 {
	position: absolute;
	height: 170px;
	width: 170px;
	left: 5px;
	top: 355px;
	z-index:6;
}
#plakat1 {
	position: absolute;
	left: 50px;
	top: 70px;
	background-color: #F6EEDB;
	z-index: 5;
}
#inhalt_plakat1 {
	position: absolute;
	left: 0px;
	top: 2px;
	background-color: #F6EEDB;
	z-index: 6;
}

#plakat2 {
	position: absolute;
	left: 280px;
	top: 320px;
	background-color: #F6EEDB;
	z-index: 5;
}
#inhalt_plakat2 {
	position: absolute;
	left: 0px;
	top: 5px;
	background-color: #F6EEDB;
	z-index:6;
}#indexfoto2 {
	height: 152px;
	width: 170px;
	top: 40px;
	position: absolute;
	left: -70px;
	z-index: 6;
}
#indexvideo {
	position: absolute;
	left: 194px;
	top: 35px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	border: 1px solid #333333;
}

#indexfoto1 {
	height: 170px;
	width: 89px;
	top: 79px;
	left: 0px;
	position: absolute;
	z-index: 6;
}
#indextextfeld {
	position: absolute;
	height: 341px;
	width: 685px;
	left: -50px;
	top: 0%;
	z-index: 4;
}



#begruessungstext {
	position: absolute;
	height: 345px;
	width: 555px;
	left: 106px;
	top: 89px;
	padding: 40px;
	border: 0;
	text-align: justify;
	z-index:4;
}
#begruessungsueberschrift {
	position: absolute;
	z-index: 6;
	top: 5px;
	left: 53px;
	height: 78px;
	width: 687px;
	text-align: center;
	z-index:6;
}
#mosaiktextfeld {
	position: absolute;
	height: 423px;
	width: 298px;
	left: 171px;
	top: -20px;
	text-align:justify;
	z-index: 3;
}


#mosaikfoto1 {
	position: absolute;
	width: 152px;
	left: -12px;
	top: 173px;
	height: 108px;
	z-index: 4;
}
#mosaikfoto2 {
	position: absolute;
	width: 152px;
	left: -53px;
	top: -11px;
	height: 108px;
	z-index: 4;
}
#mosaikfoto3 {
	position: absolute;
	width: 107px;
	left: 507px;
	top: 20px;
	height: 152px;
	z-index: 4;
}
#mosaikfoto4 {
	position: absolute;
	width: 130px;
	left: 551px;
	top: 235px;
	height: 150px;
	z-index: 4;
}

#mittersteigfoto1 {
	position: absolute;
	width: 152px;
	left: -60px;
	top: 200px;
	height: 108px;
	z-index: 4;
}
#mittersteigfoto2 {
	position: absolute;
	width: 152px;
	left: -60px;
	top: 50px;
	height: 108px;
	z-index: 4;
}
#mittersteigfoto3 {
	position: absolute;
	width: 107px;
	left: 510px;
	top: 50px;
	height: 152px;
	z-index: 4;
}
#mittersteigfoto4 {
	position: absolute;
	width: 130px;
	left: 510px;
	top: 200px;
	height: 150px;
	z-index: 4;
}
#mittersteigfoto5 {
	position: absolute;
	width: 107px;
	left: -60px;
	top: 350px;
	height: 152px;
	z-index: 4;
}
#mittersteigfoto6 {
	position: absolute;
	width: 130px;
	left: 510px;
	top: 350px;
	height: 150px;
	z-index: 4;
}
#zummittersteig {
	position: absolute;
	z-index: 11;
	top: 7%;
	text-align: right;
	right: 3%;
}
#zudenbildern {
	position: absolute;
	z-index: 11;
	top: 2%;
	text-align: right;
	right: 3%;
}
#nachher {
	position: absolute;
	left: 560px;
	top: 10px;
	font-weight: bold;
	font-size: 1.2em;
	z-index:5;
}
#vorher {
	position: absolute;
	left: -10px;
	top: 10px;
	font-weight: bold;
	font-size: 1.2em;
	z-index:5;
}
#taschenkunsttextfeld {
	position: absolute;
	height: 423px;
	width: 378px;
	left: 120px;
	top: -20px;
	text-align:justify;
	z-index: 3;
}
#taschenkunst1 {
	position: absolute;
	z-index: 7;
	height: 150px;
	width: 150px;
	left: 30px;
	top: 41px;
	background-image: url(../bilder/taschenkunst/150/schattenwurf.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
}
#taschenkunst2 {
	position: absolute;
	z-index: 7;
	height: 150px;
	width: 150px;
	left: 30px;
	top: 201px;
	background-image: url(../bilder/taschenkunst/150/taschenkunst-003.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
}
#taschenkunst3 {
	position: absolute;
	z-index: 7;
	height: 150px;
	width: 150px;
	left: 30px;
	top: 361px;
	background-image: url(../bilder/taschenkunst/150/zweisamkeit.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
}
#taschenkunst4 {
	position: absolute;
	z-index: 7;
	height: 150px;
	width: 150px;
	top: 41px;
	background-image: url(../bilder/taschenkunst/150/taschenkunst-001.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	right: 30px;
}
#taschenkunst5 {
	position: absolute;
	z-index: 7;
	height: 150px;
	width: 150px;
	top: 201px;
	background-image: url(../bilder/taschenkunst/150/katze.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	right: 30px;
}
#taschenkunst6 {
	position: absolute;
	z-index: 7;
	height: 150px;
	width: 150px;
	top: 361px;
	background-image: url(../bilder/taschenkunst/150/panfloete.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	right: 30px;
}
#takutext {
	position: absolute;
	top: -30px;
	width: 350px;
	text-align: left;
	font-weight: bold;
}
#takuserie1a {
	position: absolute;
	z-index: 7;
	height: 80px;
	width: 80px;
	left: 30px;
	top: 105px;
	background-image: url(../bilder/taschenkunst/80/woistmeinschatten.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
}
#takuserie1a {
	position: absolute;
	z-index: 7;
	height: 80px;
	width: 80px;
	left: 30px;
	top: 105px;
	background-image: url(../bilder/taschenkunst/80/woistmeinschatten.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
}

#takuserie2a {
	position: absolute;
	z-index: 7;
	height: 80px;
	width: 80px;
	left: 30px;
	top: 245px;
	background-image: url(../bilder/taschenkunst/80/romantik.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
}
#takuserie3a {
	position: absolute;
	z-index: 7;
	height: 80px;
	width: 80px;
	left: 30px;
	top: 385px;
	background-image: url(../bilder/taschenkunst/80/meinlebenistmusik.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
}
#news {
	position: absolute;
	left: 5%;
	top: 25%;
	z-index: 7;
}
#mittersteig_gross {
	position: absolute;
	left: 0%;
	top: 5%;
}
#mittersteiglink {
	position: absolute;
	left: 5%;
	top: 30%;
	z-index: 7;
	font-size: 0.8em;
}
#ueberschrift_index {
	position: absolute;
}

#fb-root {
	position: absolute;
	top: 440px;
	z-index: 33;
	left: 0px;
	width: 100px;
}