* {
    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;
}

#logo1 {
    position: fixed;
    top: 110px;
    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);
    writing-mode: bt-rl;
    text-shadow:5px 5px 5px #000000;

}


#logo2 {
    position: fixed;
    top: 330px;
    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);
    writing-mode: bt-rl;
    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%);
    
}

#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;
} 

#navilinksoben {
    position: fixed;
    top:550px ;
    left:20px ;
    background:-webkit-gradient(linear, 80% 20%, 10% 21%, from(#3b3b3b), to(#707070));
    width: 130px;
    height:150px;
    z-index: -10; 
    -webkit-transition-property: background-color, color ;
    -webkit-transition-duration: 4s;
    -moz-transition-property: background-color, color ;
    -moz-transition-duration: 4s;
    -o-transition-property: background-color, color;
    -o-transition-duration: 4s;
    -ms-transition-property: background-color, color;
    -ms-transition-duration: 4s;
    transition-property: background-color, color;
    transition-duration: 4s;
}

#navilinksoben:hover {

    background:-webkit-gradient(linear, 100% 0%, 0% 0%, from(#707070), to(#3b3b3b));

   -webkit-transition: all 2.0s ease-out;
    -moz-transition: all 2.0s ease-out;
    -o-transition: all 2.0s ease-out;
    -ms-transition: all 2.0s ease-out;
    transition: all 2.0s ease-out;

}


#navilinks {
    position: fixed;
    top:600px ;
    left:70px ;
    background:-webkit-gradient(linear, 80% 20%, 10% 21%, from(#3b3b3b), to(#707070));
    width: 80px;
    height: 100px;
    z-index: -5;
     
    -webkit-transition-property: background-color, color ;
    -webkit-transition-duration: 4s;
    -moz-transition-property: background-color, color ;
    -moz-transition-duration: 4s;
    -o-transition-property: background-color, color;
    -o-transition-duration: 4s;
    -ms-transition-property: background-color, color;
    -ms-transition-duration: 4s;
    transition-property: background-color, color;
    transition-duration: 4s;
}

#navilinks:hover {

    background:-webkit-gradient(linear, 100% 0%, 0% 0%, from(#707070), to(#3b3b3b));

   -webkit-transition: all 2.0s ease-out;
    -moz-transition: all 2.0s ease-out;
    -o-transition: all 2.0s ease-out;
    -ms-transition: all 2.0s ease-out;
    transition: all 2.0s ease-out;
    
}
#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: white;
    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;

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

}

#fixwerb:hover img {
    top: 75px;
    left:150px;
    width: 700px;
    height: 482px;

    -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;

}


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

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


.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;

}



.box {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 630px;
    height: 170px;
    background-color: #F3F3F5;
   
}
#index {
    position: absolute;
    top: 10px;
    left: 770px;
    color: #C0C0C0;
    font-size: 17px;
    width: 200px;
}

#baslik {
    position: absolute;
    top: 10px;
    left: 10px;

}
.bild1 {
    position: absolute;
    top: 50px;
    left: 640px;
}
.bild2 {
    position: absolute;
    top: 430px;
    left: 10px;
}


.boxtext {
    position:  absolute;    
    top: 170px;
    left: 10px;
    width: 600px;
    
}


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