* { margin: 0; padding: 0; outline: 0; }

html  {
         height: 100%;
         background: url("../images/Tropfen4.png") no-repeat center center fixed;
         -webkit-background-size: cover;
         -moz-background-size: cover;
         -o-background-size: cover;
         background-size: cover;
}

body {   margin: 0 auto;
         align-items: center;
         justify-content: center;
        font-size: 14px;
        line-height: 1.6em;
        font-family: helvetica, arial, sans-serif;
        color: #333;
}

img { width: 100%; height: auto; }

a { color: #7d5d3e; text-decoration: none; cursor: pointer; }
a:hover, a:active, .aktiv {color: #a87d4d; }
a img { border: 0; }
p, h1, ul { padding-bottom: .7em; }
h1 {font-size: 18px; }
h2{font-size: 16px; }
li {margin-left: 15px; }

#wrapper { height: 100%; max-width: 980px;  margin: 0 auto; }
#header {margin: 1em auto; padding: 0 1em; max-width: 600; }

.main { display: flex; }
.quader1, .quader2, .quader12 { background-image: url(../images/tropfen_bg.jpg);
         background-position: center;
         background-repeat: no-repeat;
         background-size: cover;
         margin: 1em; padding: 2em; padding-bottom: 60px;
         float: left; }
.quader1, .quader2 { width:41%; }
.quader12 { width:90.7%; }
.container { display: grid; grid-template-columns: 1fr 1fr; /* Zwei gleich breite Spalten */  }

details summary { padding: .3em; }
details div { background-color: #fafafa; padding: .8em; }
.lastcont { padding-bottom: 1.5em; }
.mini img { margin: 1px 5px 1px 0px; width:60px; height: 80px;}

#footer { position: fixed; left: 0;
  bottom: 0; width:100%; height: 20px; background-color:#a27c56; padding: .6em; }
#footer a { color: #e1c6a8; text-decoration: none; cursor: pointer; }
#footer a:hover, #footer a:active, #footer .aktiv {color: #fff; }

@media only screen and (max-width: 960px) {
  iframe { max-width: 360px; overflow: hidden; }
}
@media only screen and (max-width: 800px) {
  iframe { max-width: 320px; overflow: hidden; }
}
@media only screen and (max-width: 600px) {
.main { display: block; }
  .quader1, .quader2, .quader12 { width:88%!important; padding: .9em; padding-bottom: 75px; }
  iframe { max-width: 300px; overflow: hidden; }
  #footer {height:33px;}
}