* {
    margin: 0;
    padding: 0;
   
}

html {
    width: 1160px;
    height: auto;
    background-color: white;
}

body {
    width: 960px;
    height: auto;
    position: absolute;
    top: 0px;
    left: 150px;
    background-color: #C0C0C0;
    
}

#headerback {
    position: absolute;
    top: 0px;
    left: -150px;
    background-color: #3b3b3b;
    /*background-color: #005555;*/
    width: 1160px;
    height: 400px;
    z-index: -10;
}

#tuyaplogo {
    position: absolute;
    top: 125px;
}

#logomimari {
    position: fixed;
    top: 25px;
    left:50px;
    z-index: 1;
}


#logo1 {
    position: fixed;
    top: 135px;
    left:0px;
    width: 200px;
    height: 500px;
    color: red;
    z-index: 1;

}

#logo1 p {
    color:  #C0C0C0 ;
    font-size: 60px;

     -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); /*für IE variable ist 1;2;3 und 4*/

   text-shadow:5px 5px 5px #000000;

}


#logo2 {
    position: fixed;
    top: 355px;
    left:0px;
    width: 200px;
    height: 500px;
    color: red;
    z-index: 1;

}

#logo2 p {
    color:  #C0C0C0;

    font-size: 60px;
     -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
   filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); /*für IE variable ist 1;2;3 und 4*/
    text-shadow:5px 5px 5px #000000;

}

#balkenlinks {
    position: absolute;
    top: 400px;
    left: -150px;
    width: 150px;
    height: 2050px;
    background-color: #3b3b3b;
}


#s3slide {
    position: absolute;
    top: 20px;
    left: 0px;
   
}

#leiste {
    position: absolute;
    top: -20px;
    left: 0px;
    width: 960px;
    height: 15px;
    background-image: -webkit-linear-gradient(top, #4E4443 0%, #C0C0C0 95%);
    
}
#leiste-ie {
    position: absolute;
    top: -20px;
    left: 0px;
    /*
    width: 960px;
    height: 15px;
    background-color: #808080;*/
}
#navi {
    position: fixed;
    top: 625px;
    left: 120px;
    z-index: 10000;
}

#navi:hover ul,li  {
    background-color: #0099CC;     
    -webkit-transition: all 1.0s ease-in-out;
    transition: all 1.0s ease-in-out;
}

#navi ul, li {
   display: inline-block;
   color: white;
   background-color:  rgba(0,0,0,0.6);
}

#navi ul {
   height: 75px;
   width: 960px;
   padding-left: 50px;
    
   -webkit-transition-property: top, height, width, background-color, border-radius;
    -webkit-transition-duration: 2s;
    transition-property: top, height, width, background-color, border-radius;
    transition-duration: 2s;
}

#navi li {
    margin-left: 5px;
    margin-right: 5px;
    padding-left: 0px;
    padding-top: 10px;
   background-color:  transparent;
    
}

#navi a {
    color:white;
    font-size: 15px;
    font-weight: bold;
    text-decoration: none;
  
} 

#navi a:hover {
    color:black;
    text-decoration: none;
    background-color: white;
    padding: 4px;
} 

#logofix {
    position: fixed;
    top: 80px;
    left: 0px;
    width: 30px;
    height: 200px;
    z-index: 1000;
}

#fixwerbuntergrund {

    position: fixed;
    top: 50px;
    left: 0;
    width: 30px;
    height: 150px;
    background-color: #6495ED;
    z-index: 0;

    -webkit-border-radius: 0px 10px 10px 0px;
    border-radius: 0px 10px 10px 0px;

    -moz-box-shadow: 6px 6px 11px #000000;
    -webkit-box-shadow: 6px 6px 11px #000000;
    box-shadow: 6px 6px 11px #000000;

    -webkit-transition-property: width,  border-radius;
    -webkit-transition-duration: 1s;
    transition-property: width,  border-radius;
    transition-duration: 1s;

}

#fixwerb {
    position: fixed;
    top: 50px;
    left: 0;
    width: 30px;
    height: 150px;
    background-color:  transparent;
    z-index: 2000;

    -webkit-border-radius: 0px 10px 10px 0px;
    border-radius: 0px 10px 10px 0px;

    -moz-box-shadow: 6px 6px 11px #000000;
    -webkit-box-shadow: 6px 6px 11px #000000;
    box-shadow: 6px 6px 11px #000000;

    -webkit-transition-property: width,  border-radius;
    -webkit-transition-duration: 1s;
    transition-property: width,  border-radius;
    transition-duration: 1s;

}
#fixwerb a {
    text-decoration: none;
}


#fixwerb  img {
    width: 0px;
    height: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    border-color: #C0C0C0;
    -webkit-transition-property: width, height, left, top;
    -webkit-transition-duration: 1s;
    transition-property: width, height, left, top;
    transition-duration: 1s;

}

#fixwerb:hover img {
    top: 0px;
    left:70px;
    width: 750px;
    height: 482px;
    border-style: solid;
    border-top-width: 50px;
    border-bottom-width: 50px;
    border-left-width: 100px;
    border-right-width:100px;
    border-color: rgba(128,128,128,0.6);
    -webkit-transition: all 1.0s ease-in-out;
    transition: all 1.0s ease-in-out;
}
/*
#fixwerb:hover  {
    top: 50px;
    left: 75px;
    width: 1020px;
    height: 600px;
    background-color: rgba(128,128,128,0.6);
    z-index: 100000;
    -webkit-border-radius: 0px 0px 0px 0px;
    border-radius: 0px 0px 0px 0px;

    -webkit-transition: all 1.0s ease-in-out;
    transition: all 1.0s ease-in-out;

}

*/


#logofix2 {
    position: fixed;
    top: 280px;
    left: 3px;
    width: 30px;
    height: 200px;
    z-index: 1000;
}

#fixwerbuntergrund2 {

    position: fixed;
    top: 250px;
    left: 0;
    width: 30px;
    height: 150px;
    background-color: #00CE00;   /* 00FF00 */
    z-index: 0;

    -webkit-border-radius: 0px 10px 10px 0px;
    border-radius: 0px 10px 10px 0px;

    -moz-box-shadow: 6px 6px 11px #000000;
    -webkit-box-shadow: 6px 6px 11px #000000;
    box-shadow: 6px 6px 11px #000000;

    -webkit-transition-property: width,  border-radius;
    -webkit-transition-duration: 1s;
    transition-property: width,  border-radius;
    transition-duration: 1s;

}

#fixwerb2 {
    position: fixed;
    top: 250px;
    left: 0;
    width: 30px;
    height: 150px;
    background-color:  transparent;
    z-index: 2000;

    -webkit-border-radius: 0px 10px 10px 0px;
    border-radius: 0px 10px 10px 0px;

    -moz-box-shadow: 6px 6px 11px #000000;
    -webkit-box-shadow: 6px 6px 11px #000000;
    box-shadow: 6px 6px 11px #000000;

    -webkit-transition-property: width,  border-radius;
    -webkit-transition-duration: 1s;
    transition-property: width,  border-radius;
    transition-duration: 1s;

}
#fixwerb2 a {
    text-decoration: none;
}


#fixwerb2  img {
    width: 0px;
    height: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    border-color: #C0C0C0;

    -webkit-transition-property: width, height, left, top;
    -webkit-transition-duration: 1s;
    transition-property: width, height, left, top;
    transition-duration: 1s;

}

#fixwerb2:hover img {
    top: -220px;
    left:60px;
    width: 900px;
    height: 482px;
    border-style: solid;
    border-top-width: 50px;
    border-bottom-width: 50px;
    border-left-width: 100px;
    border-right-width:60px;
    border-color: rgba(128,128,128,0.6);
    -webkit-transition: all 1.0s ease-in-out;
    transition: all 1.0s ease-in-out;
}
  /*
#fixwerb2:hover  {
    top: 50px;
    left: 75px;
    width: 1020px;
    height: 600px;
    background-color: rgba(128,128,128,0.6);
    z-index: 100000;
    -webkit-border-radius: 0px 0px 0px 0px;
    border-radius: 0px 0px 0px 0px;

    -webkit-transition: all 1.0s ease-in-out;
    transition: all 1.0s ease-in-out;

}  */

#logofix3 {
    position: fixed;
    top: 480px;
    left: 0px;
    width: 30px;
    height: 200px;
    z-index: 1000;
}

#fixwerbuntergrund3 {

    position: fixed;
    top: 450px;
    left: 0;
    width: 30px;
    height: 150px;
    background-color: #282828;
    z-index: 0;

    -webkit-border-radius: 0px 10px 10px 0px;
    border-radius: 0px 10px 10px 0px;

    -moz-box-shadow: 6px 6px 11px #000000;
    -webkit-box-shadow: 6px 6px 11px #000000;
    box-shadow: 6px 6px 11px #000000;

    -webkit-transition-property: width,  border-radius;
    -webkit-transition-duration: 1s;
    transition-property: width,  border-radius;
    transition-duration: 1s;

}

#fixwerb3 {
    position: fixed;
    top: 450px;
    left: 0;
    width: 30px;
    height: 150px;
    background-color:  transparent;
    z-index: 2000;

    -webkit-border-radius: 0px 10px 10px 0px;
    border-radius: 0px 10px 10px 0px;

    -moz-box-shadow: 6px 6px 11px #000000;
    -webkit-box-shadow: 6px 6px 11px #000000;
    box-shadow: 6px 6px 11px #000000;

    -webkit-transition-property: width,  border-radius;
    -webkit-transition-duration: 1s;
    transition-property: width,  border-radius;
    transition-duration: 1s;

}
#fixwerb3 a {
    text-decoration: none;
}


#fixwerb3  img {
    width: 0px;
    height: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    border-color: #C0C0C0;

    -webkit-transition-property: width, height, left, top;
    -webkit-transition-duration: 1s;
    transition-property: width, height, left, top;
    transition-duration: 1s;

}

#fixwerb3:hover img {
    top: -400px;
    left:150px;
    width: 700px;
    height: 482px;
     border-style: solid;
    border-top-width: 50px;
    border-bottom-width: 50px;
    border-left-width: 100px;
    border-right-width:100px;
    border-color: rgba(128,128,128,0.6);
    -webkit-transition: all 1.0s ease-in-out;
    transition: all 1.0s ease-in-out;
}

/*
#fixwerb3:hover  {
    top: 50px;
    left: 75px;
    width: 1020px;
    height: 600px;
    background-color: rgba(128,128,128,0.6);
    z-index: 100000;
    -webkit-border-radius: 0px 0px 0px 0px;
    border-radius: 0px 0px 0px 0px;

    -webkit-transition: all 1.0s ease-in-out;
    transition: all 1.0s ease-in-out;

}
  */



#inhalt {
    position: absolute;
    top: 290px;
    left: 0;
    width: 960px;
    height: 2150px;
    background-color: #F3F3F5;
}

#inhalt p {
    margin-bottom: 10px;
}


#links {
    position: absolute;
    top:5px;
    left: 10px;
    width: 630px;
    height: 1500px;
    background-color: white;
}

#rechts {
    position: absolute;
    top:365px;
    left: 650px;
    width: 300px;
    height: 500px;
    background-color: white;

}

#rechts a {
    text-decoration: none;
    color: black;
}



.boxschrift {
    width: 300px;
    background-color: #F3F3F5;
    font-size: 25px;
    color: black;
    text-align: center;
    padding-top: 3px;
    border-right-width: 0px;
    border-left-width: 0px;
    border-style: solid;
    border-top-width: thin;
    border-bottom-width: thin;
    border-color: #000000;

}

.boxschrift a {
    text-decoration: none;
    color: #000000;
}
.boxschrift a:hover {
    font-weight: bold;
    color:   #000000;
}

.boxschriftmitte {
    width: 630px;
    background-color: #F3F3F5;
    font-size: 25px;
    color: black;
    text-align: center;
    padding-top: 3px;
    border-right-width: 0px;
    border-left-width: 0px;
    border-style: solid;
    border-top-width: thin;
    border-bottom-width: thin;
    border-color: #000000;

}
.farbwechsel {
    width: 630px;
    height: 170px;

    -webkit-transition-property: background-color ;
    -webkit-transition-duration: 2s;
    -moz-transition-property: background-color ;
    -moz-transition-duration: 2s;
    -o-transition-property: background-color,;
    -o-transition-duration: 2s;
    -ms-transition-property: background-color;
    -ms-transition-duration: 2s;
    transition-property: background-color;
    transition-duration: 2s;

}


.farbwechsel:hover {
    background-color: #C0C0C0;
    -webkit-transition: all 1.0s ease-out;
    -moz-transition: all 1.0s ease-out;
    -o-transition: all 1.0s ease-out;
    -ms-transition: all 1.0s ease-out;
    transition: all 1.0s ease-out;
}
.farbwechsel2 {
    width: 300px;
    height: 85px;

    -webkit-transition-property: background-color ;
    -webkit-transition-duration: 2s;
    -moz-transition-property: background-color ;
    -moz-transition-duration: 2s;
    -o-transition-property: background-color,;
    -o-transition-duration: 2s;
    -ms-transition-property: background-color;
    -ms-transition-duration: 2s;
    transition-property: background-color;
    transition-duration: 2s;

}

.farbwechsel2:hover {
    background-color: #C0C0C0;
    -webkit-transition: all 1.0s ease-out;
    -moz-transition: all 1.0s ease-out;
    -o-transition: all 1.0s ease-out;
    -ms-transition: all 1.0s ease-out;
    transition: all 1.0s ease-out;
}

.boxmitte1 {
    position: absolute;
    top: 35px;
    left: 0px;
    width: 630px;
    height: 170px;
    background-color: white;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
  
}
.boxmitte1 a {
    text-decoration: none;
    color: black;
}

.boxmitte2 {
    position: absolute;
    top: 210px;
    left: 0px;
    width: 630px;
    height: 170px;
    background-color: #F3F3F5;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
 
}
.boxmitte2 a {
    text-decoration: none;
    color: black;
}

.boxmitte3 {
    position: absolute;
    top: 385px;
    left: 0px;
    width: 630px;
    height: 170px;
    background-color: white;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
  
}
.boxmitte3 a {
    text-decoration: none;
    color: black;
}

.boxmitte4 {
    position: absolute;
    top: 560px;
    left: 0px;
    width: 630px;
    height: 170px;
    background-color: #F3F3F5;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
  
}
.boxmitte4 a {
    text-decoration: none;
    color: black;
}

.boxtextmitte {
    position: absolute;
    top: 40px;
    left: 170px;
    font-size: 25px;
    font-weight: bold;
}

.box1 {
    position: absolute;
    top: 35px;
    left: 0px;
    width: 300px;
    height: 85px;
    background-color: white;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
}
.box1 a {
    text-decoration: none;
    color: black;
}

.box2 {
    position: absolute;
    top: 120px;
    left: 0px;
    width: 300px;
    height: 85px;
    background-color: #F3F3F5;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
}
.box2 a {
    text-decoration: none;
    color: black;
}

.box3 {
    position: absolute;
    top: 206px;
    left: 0px;
    width: 300px;
    height: 85px;
    background-color: white;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
}
.box3 a {
    text-decoration: none;
    color: black;
}

.box4 {
    position: absolute;
    top: 292px;
    left: 0px;
    width: 300px;
    height: 85px;
    background-color: #F3F3F5;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
}
.box4 a {
    text-decoration: none;
    color: black;
}


.box5 {
    position: absolute;
    top: 378px;
    left: 0px;
    width: 300px;
    height: 85px;
    background-color: white;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
}
.box5 a {
    text-decoration: none;
    color: black;
}

.box6 {
    position: absolute;
    top: 464px;
    left: 0px;
    width: 300px;
    height: 85px;
    background-color: #F3F3F5;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
}
.box6 a {
    text-decoration: none;
    color: black;
}

.box7 {
    position: absolute;
    top: 550px;
    left: 0px;
    width: 300px;
    height: 85px;
    background-color: white;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
}
.box7 a {
    text-decoration: none;
    color: black;
}


.box8 {
    position: absolute;
    top: 636px;
    left: 0px;
    width: 300px;
    height: 85px;
    background-color: #F3F3F5;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color: #000000;
}
.box8 a {
    text-decoration: none;
    color: black;
}


.platzhalterunten {    /* dient dazu das am ende das menu nicht auf dem letzten artikel steht */
    
    position: absolute;
    top: 636px;
    left: 5px;
    width: 300px;
    height: 50px;
    background-color: transparent;
}


.boxbildgross {
    width: 300px;
}

.boxbild1 {
    position: absolute;
    top: 5px;
    left: 5px;
}

.boxbild2 {
    position: absolute;
    top: 5px;
    left: 5px;
}
.boxbild3 {
    position: absolute;
    top: 5px;
    left: 5px;
}
.boxbild4 {
    position: absolute;
    top: 5px;
    left: 5px;
}
.boxbild5 {
    position: absolute;
    top: 5px;
    left: 5px;
}
.boxbild6 {
    position: absolute;
    top: 5px;
    left: 5px;
}
.boxbild7 {
    position: absolute;
    top: 5px;
    left: 5px;
}
.boxbild8 {
    position: absolute;
    top: 5px;
    left: 5px;
}


.boxtext1 {
    position: absolute;
    top: 5px;
    left: 85px;
}

.boxtext2 {
    position: absolute;
    top: 5px;
    left: 85px;
}

.boxtext3 {
    position: absolute;
    top: 5px;
    left: 85px;
}
.boxtext4 {
    position: absolute;
    top: 5px;
    left: 85px;
}
.boxtext5 {
    position: absolute;
    top: 5px;
    left: 85px;
}
.boxtext6 {
    position: absolute;
    top: 5px;
    left: 85px;
}
.boxtext7 {
    position: absolute;
    top: 5px;
    left: 85px;
}
.boxtext8 {
    position: absolute;
    top: 5px;
    left: 85px;
}



.boxrechts {
    width: 285px;
    padding-left: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-style: solid;
    border-bottom-width: thin;
    border-color:  #808080;
    background-color: white;
    
}
.boxrechts:hover {
    background-color: #C0C0C0;
    
}

#reklamrechts {
    position: absolute;
    top: 5px;
    left: 650px;
    width: 300px;
}

#bulten {
    position: absolute;
    top:310px ;
    left:650px ;
    width: 295px;
    height: 50px;
    background-color: #3b3b3b;
    color:white;
    border-color: #000000;
    border-style: solid;
    border: 1px;
    padding-left: 5px;
    
}



#reklamrechtsunten {
    position: absolute;
    top:905px;
    left: 650px;
    width: 250px;
    height: 250px;
}

#rechtsunten2 {
    position: absolute;
    top: 1155px;
    left: 650px;
    width: 300px;
    height: 520px;
    background-color: white;

}

#paylas {
    position: absolute;
    left: 650px;
    top: 1800px;
    width: 300px;
    height: 130px;
    background-color: #FFFF00;
}

#paylas h1 {
    padding-top: 10px;
    padding-left: 10px;
    color: black;
    font-size: 20px;
}
#paylas h2 {
    text-align: center;
    color: red;
    font-size: 20px;
}
#paylas p {
    color: black;
    font-size: 15px;
    padding-left: 10px;
}