body {
    margin: 0;
    padding: 0;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    color: black ;
    background-color: #ddffcc;
}

          
.Fensterbild {
              position: absolute;
              z-index:1;
              background: #eee;
              border: 4px solid #FFF;
              border-radius: 3px;
              -moz-border-radius: 3px;
              -webkit-border-radius: 3px;
              box-shadow: 1px 2px 4px rgba(0,0,0,.4);
          }
          
 #logo {  text-align: center;}
          
 #bild1 {
          top: 30px;
          left: 1%;
          width:148px;
          height:100px;
          transform: rotate(-5deg);
          -moz-transform: rotate(-5deg);
          -ms-transform: rotate(-5deg);
          -o-transform: rotate(-5deg);
          -webkit-transform: rotate(-5deg);
          }  
                 
 #bild2 {
          top: 20px;
          right: 2%;
          width:129px;
          height:100px;
          transform: rotate(7deg);
          -moz-transform: rotate(7deg);
          -ms-transform: rotate(7deg);
          -o-transform: rotate(7deg);
          -webkit-transform: rotate(7deg);          
                 }  
                        

  
  h1, h2, h3 {
      margin: 0;
      padding: 0;
      font-weight: normal;
      color: #221D1D;
  }
  
  h1 {
      font-size: 1.5em;
  }
  
   h2 { color: #c00; font-weight: bold; font-size: 16px; font-family: Arial, Helvetica, Geneva, Swiss, SunSans-Regular; text-decoration: none;
       line-height: 25px}
       
  
  h3 {
      font-size: 1.6em;
  }
  
  p, ul, ol {
      margin-top: 0;
      font-size: 1em;
      line-height: 180%;
  }
  
  
  a {
      text-decoration: none;
      color: DarkBlue ;
  }
  
  a:hover {
      text-decoration: underline;
      color: Blue;
  }
  
  
  #wrapper {
      width: 1100px;
      margin: 20px auto;
      padding: 0;
      background-color:#ddffcc ;
      opacity:0.85;
      filter:alpha(opacity=85); /* For IE8 and earlier */
  }
  
	 
  /* Page */
  
  #page {
      width: 1000px;
      margin: 0 auto;
      padding: 0;
  }
  
  #page-bgtop {
      padding: 20px 0px;
  }
  
  
  /* Kopf  das obere Bild in Szene setzen */
  
  /* Content */
  
  #content {
      float: right;
      width: 940px;
      padding: 10px 10px 0px 10px;
      background: #eee;
      border: 1px solid #DDD;
      background: -moz-linear-gradient(top, #EEE, #FFF);    
      background: -webkit-linear-gradient(top, #eee, #fff);
      background: -ms-linear-gradient(top, #eee, #fff);
      background: -o-linear-gradient(top, #eee, #fff);
      box-shadow: 1px 2px 4px rgba(0,0,0, .2);
  }
  
  
  
  
  .post {
      margin-bottom: 15px;
  }
  
  .post-bgtop {
  }
  
  .post-bgbtm {
  }
  
  .post .title {
      margin-bottom: 30px;
      padding: 0px 0px 0px 0px;
      font-size: 2.0em;
      letter-spacing: -.5px;
      color:  #005231;
      border: 0px;
      border-bottom: 1px solid #323435;
  }
  
  
  .post .title a {
      color: #0078FF;
      border: none;
  }
  
  .title_klein {
      margin-bottom: 30px;
      padding: 0px 0px 0px 0px;
      font-size: 1.4em;
      color: #005231;
      border: 20px;
      border-bottom: 1px solid #323435;
  }
  
  
  .post .meta {
      height: 30px;
      border-bottom: 1px solid #292929;
      margin: 0px;
      padding: 0px 0px 0px 0px;
      text-align: left;
      font-family:  Verdana, Arial, Helvetica, sans-serif;
      font-size: 13px;
      font-weight: bold;
  }
  
  .post .meta .date {
      float: left;
      height: 24px;
      padding: 3px 15px;
      color: #BBBBBB;
  }
  
  .post .meta .posted {
      float: right;
      height: 24px;
      padding: 3px 15px;
      color: #BBBBBB;
  }
  
  .post .meta a {
      color: #BBBBBB;
  }
  
  .post .entry {
      padding: 0px 0px 20px 0px;
      padding-bottom: 20px;
      text-align: justify;
  }
  
  .post .entry h3 {
      color: #BBBBBB;
      font-size: 1.2em;
      font-weight: bold;
      padding-bottom: 8px;
  }
  
  
  .post .entry td {
      text-align: left;
      vertical-align: top;
      padding: 0px 20px 7px 0px;
  }
  
  .post .entry .rechts td {
      text-align: right;
      vertical-align: top;
      padding: 0px 20px 7px 0px;
  }
  
  .post .entry .mittig td {
      text-align: center;
      vertical-align: top;
      padding: 0px 20px 7px 0px;
  }
  
  
  .mittig  { vertical-align:middle; text-align: center }
  
  .links {
      padding-top: 20px;
      font-size: 12px;
      font-weight: bold;
  }
  
  .rechterRand  {
      float: right;    
  }
  
 
  /* Footer */
  
  #footer {
      width: 95%;
      margin: 0 auto;
      padding: 2px 10px 0px 5px;
      border-top: 4px solid green;
      font-family:  Verdana, Arial, Helvetica, sans-serif;
      
  }
  
  #footer p {
      margin: 0;
      padding-top: 5px;
      line-height: normal;
      font-size: 0.7em;
      text-transform: uppercase;
      text-align: center;
      color: #444444;
  }
  
  #footer a {
      color: #464032;
  }
  
         
 .PhoneBox {
     padding: 0px 25px; 
     line-height: normal;
     float: right;
     width:400px;
 }
 
  
  .Botton {
      color: DarkBlue;
      font-size: 1em;
      font-weight: bold;
      padding: 5px;
  }
  

  
  .Buero {
            padding: 20px;
            float: left;
            border-radius: 5px;
           }

  .Buero img {
              width: 110px;
              display: block;
              margin-left: auto;
              margin-right: auto; 
              float: bottom;
              background: #eee;
              border: 4px solid #FFF;
              border-radius: 3px;
              -moz-border-radius: 3px;
              -webkit-border-radius: 3px;
              box-shadow: 1px 2px 4px rgba(0,0,0,.4);
              }

 .Buero p {
             padding: 5px 0px 0px 0px;
             font-size: 0.75em;
              }
 
#kreisel {
    position: relative;
    height: 20em;
    width: 57em;
    margin: 1em 8em;
    cursor: pointer;
    perspective: 1000px;
    transform-style: preserve-3d;
}

#kreisel img {
    width:250px;
    border: 5px solid #eee;
    box-shadow: 1px 1px 5px 2px #777;
}

#kreisel figure {
    position: absolute;
    margin: 0;
    width: 13.75em;
    height: 9.375em;
    left: 15.4em;
    top: 5em;
    opacity: 0;
}

#kreisel figcaption {
    position: absolute;
    color: #444;
    font: .7em/1.25 Verdana;
    text-align: center;
    background: rgba(255, 255, 255, .7);
    border: 1px solid #fff;
    box-shadow: 1px 1px 5px 2px #777;
    width: 18.5em;
    height: 1.25em;
    top: 155px;
    left: 5px;
    opacity: 0;
    transition: 1s;
}

#kreisel:hover figcaption {
    opacity: 1;
}

#kreisel figure:nth-of-type(1) {
    animation: bild1 36s linear infinite;
}

#kreisel figure:nth-of-type(2) {
    animation: bild1 36s 4s linear infinite;
}

#kreisel figure:nth-of-type(3) {
    animation: bild1 36s 8s linear infinite;
}

#kreisel figure:nth-of-type(4) {
    animation: bild1 36s 12s linear infinite;
}

#kreisel figure:nth-of-type(5) {
    animation: bild1 36s 16s linear infinite;
}

#kreisel figure:nth-of-type(6) {
    animation: bild1 36s 20s linear infinite;
}

#kreisel figure:nth-of-type(7) {
    animation: bild1 36s 24s linear infinite;
}

#kreisel figure:nth-of-type(8) {
    animation: bild1 36s 28s linear infinite;
}

#kreisel figure:nth-of-type(9) {
    animation: bild1 36s 32s linear infinite;
}

@keyframes bild1 {
      0%    {opacity:  1; z-index:5;
             transform:rotateY(0deg) translateZ(370px);}
     11.11% {opacity: .9; z-index:4;
             transform:rotateY(40deg) translateZ(370px);}
     22.22% {opacity: .7; z-index:3;
             transform:rotateY(80deg) translateZ(370px);}
     33.33% {opacity: .5; z-index:2;
             transform:rotateY(120deg) translateZ(370px);}
     44.44% {opacity: .3; z-index:1;
             transform:rotateY(160deg) translateZ(370px);}
     55.56% {opacity: .3; z-index:1;
             transform:rotateY(200deg) translateZ(370px);}
     66.67% {opacity: .5; z-index:2;
             transform:rotateY(240deg) translateZ(370px);}
     77.78% {opacity: .7; z-index:3;
             transform:rotateY(280deg) translateZ(370px);}
     88.89% {opacity: .9; z-index:4;
             transform:rotateY(320deg) translateZ(370px);}
    100%    {opacity:  1; z-index:5;
             transform:rotateY(360deg) translateZ(370px);}
}

#kreisel:hover figure {
    animation-play-state: paused;
}