@media all {
  
  * { 
    margin:0;
    padding:0;
  }  
  * html body * {
    overflow: visible;
  }
  html * {
    font-size: 100.01%;
  }
  body {
    background: #FFF;
    color: #000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 75.00%;
    text-align: left;    
  } 
  .clearfix { 
    display: block;
  }
  .clearfix:after {
    clear: both;
    content: ".";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden;
  }  
  h1,h2,h3,h4,h5,h6 {     
    margin: 0 0 0.25em 0;
  }
  h1 { font-size: 200%; }                       /* 15px */
  h2 { font-size: 200%; }                       /* 10px */
  h3 { font-size: 150%; }                       /* 10px */
  h4 { font-size: 133.33%; }                    /* 10px */
  h5 { font-size: 116.67%; }                    /* 14px */
  h6 { font-size: 116.67%; }                    /* 14px */
  ul, ol { 
    margin: 0 0 1em 1em;
  }
  li {
    line-height: 1.5em;
    margin-left: 0.8em;
  }
  option { 
    padding-left: 0.4em;
  }
  select {
    padding: 1px;
  }   
}

@media screen {
  
  body {    
    background: #4D87C7;
    padding: 10px 0;
    text-align: center;
    overflow-y: scroll;
    background: #C0C0C0;
  }  
  .wrapper {    
    background: #FFF;
    margin: 0 auto;
    min-width: 740px;
    max-width: 80em;
    text-align: left; 
    min-width: 840px;  
    max-width: 90em;
  }  
  .seite { 
    padding: 10px;
  }
  #kopfbereich {
    background: #FFF repeat-x top left;
    color: #000;    
    padding: 45px 2em 1em 20px;
    position: relative;
  }
  #servicenavi {
    background: transparent;
    color: #AAA;  
    position: absolute;
    top: 10px;
    right: 10px; 
    text-align: right; 
  }
  #hauptbereich { 
    background: #FFF;
    padding: 10px 0; 
  }
  #fusszeile {    
    background: #F9F9F9;
    color: #666;
    padding: 10px 20px;
    border-top: 5px #EFEFEF solid;
    line-height: 1.5em;
  }
  #kopfbereich, #servicenavi, #hauptbereich, #fusszeile { 
    clear: both; 
  }
  #kopfbereich h1 {
    color: #000;    
    font-size: 2.5em;
    font-weight: bold;
    letter-spacing: -2px;
    line-height: 65%;    
  }
  #kopfbereich span { 
    color: #999; 
  }
  #servicenavi a {
    background: transparent;
    color: #999;
    font-weight: normal;    
    text-decoration: none; 
  }
  #servicenavi a:focus,
  #servicenavi a:hover,
  #servicenavi a:active {    
    background-color: transparent;
    text-decoration: underline; 
  }
  #fusszeile a { 
    background: transparent;
    color: #999;    
    font-weight: bold;
  }
  #fusszeile a:focus,
  #fusszeile a:hover,
  #fusszeile a:active {    
    background-color: transparent;
    color: #4D87C7;
    text-decoration: underline;
  }    
  /* #spalte1 wird zur linken Spalte */
  #spalte1 { float: left; width: 25%; margin: 0;} 
  /* #spalte2 wird zur mittleren Spalte */  
  #spalte2 { width: 50%; float: left; margin: 0;}
  /* #spalte3 wird zur rechten Spalte */  
  #spalte3 { margin: 0 0% 0 75%; width: auto;}  
  
  #spalte1_inhalt, #spalte2_inhalt, #spalte3_inhalt { position: relative; }
  #spalte1_inhalt { margin: 0 5px; padding: 10; }
  #spalte2_inhalt { margin: 0 5px; padding: 10; }
  #spalte3_inhalt { margin: 0 5px; padding: 10; }

  #spalte1_inhalt ul.menu li a {
    background: url("../images/hdot2.gif") repeat-x scroll center bottom transparent;
    color: #333333;
    display: block;
    outline: medium none;
    padding: 2px 0;
    text-decoration: none;
  }
  #spalte1_inhalt ul.menu li a span {
    background: url("../images/bullet.gif") no-repeat scroll 5px 5px transparent;
    padding-left: 16px;
  }
  #spalte1_inhalt ul.menu {
    list-style: none outside none;
    padding:0;
    margin:10;
  }
  /*
  #spalte1_inhalt ul.menu li a span {
    background: url("../images/bullet.gif") no-repeat scroll 5px 5px transparent;
  }
  */

  /* ####################################################################
  ** ###### Farben zur besseren Verdeutlichung ##########################
  ** ####################################################################
  */
  #spalte1 { background: #fff; }
  #spalte1_inhalt { background: #FFFFFF; }
  /*#spalte2 { background: #E0F0FF; }*/
  #spalte2_inhalt { background: #FFFFFF; }
  #spalte3 { background: #fff; }
  #spalte3_inhalt { background: #FFFFFF; }
  #hauptbereich { background: #fff; }

}