* {
  padding: 0;
  margin: 0;
 }


body {
  width: 100vw;
  height: 100vh;
  /* picture for a device-width between 0 and 775px in landscape-mode */
  background-repeat:  no-repeat;
  background-position: center center;
  background-size: cover;
  /* change  */
  background-attachment: fixed;
  /* to  */
  /* if your style is not added to body */
}

@media (orientation: portrait),
       (-webkit-min-device-pixel-ratio: 1.1),
       (min-resolution: 144dpi) {

  body {
    background-image: url(A-Hochformat.jpg);
  }
}

@media (min-width: 680px) and (orientation: landscape) {
  body {
    background-image: url(B-Querformat.jpg);
  }
}




#mother {
  width: 775px;
  text-align: left;
  background-color: #ffffff;
  margin: 0 auto;
  border: white solid 5px;
  }

#header {
  height: 90px;
  background-image: url('kopf.gif');
  background-repeat: no-repeat;
  font-family: Georgia, Helvetica, serif;
}


#menue {
  width: 760px;
  clear: both;
  height: 30px;
  padding: 10px 10px 3px 3px;
  background-color: #E1F4FF;
}

#main {
  background-color: white;
  padding: 15px 15px; 
  
}

#BilderHo {
  clear: both;
  height: 300px;
  padding: 8px 8px 8px 8px;
  background-color:#FDFCC7;
}


#BilderEG {
  clear: both;
  height: 360px;
  padding: 8px 8px 8px 8px;
  background-color: #ffe9e7;
}

#BilderOG {
  clear: both;
  height: 360px;
  padding: 8px 8px 8px 8px;
  background-color: #e6f2FF;
}

#BilderPr {
  clear: both;
  height: 360px;
  padding: 8px 8px 8px 8px;
  background-color: #EFF9FF;
}

#BilderRa {
  clear: both;
 height: 360px;
  padding: 8px 8px 8px 8px;
  background-color: #EEFFDF;
}

#BilderSc {
  clear: both;
 height: 360px;
  padding: 8px 8px 8px 8px;
  background-color: #ebebeb;
}

#BilderTi {
  clear: both;
  height: 795px;
  padding: 8px 8px 8px 8px;
  background-color: #F2EFCE;
}


#footer {
  width: 760px;
  clear: both;
  height: 15px;
  padding: 10px 10px 3px 3px;
  background-color: #ffff99;
}