body {
    margin: 0;
    padding: 0;
    margin-top: 60px;
    font-family: sans-serif;
  }

  h1, h2, h3, p, a{
    color: #333;
  }
  h2 {
    font-size: 2em;
  }
  h3{
    font-size: 1.6em;
  }
  p, a{
    font-size: 1em;
  }
  a{
    text-decoration: none;
    color: hsl(0, 40%, 98%);
  }

/* Stil Banner */
.banner .content {
    display: flex;
    border: 1px solid #ccc;
    padding: 20px;
}
.banner .content img {
    max-width: 100%;
    border: 1px solid #85D1E000
    ;
}
.banner .content p {
    max-width: 50%;
    padding-left: 20px;
}
/* Stil für Content*/
.content{
    width: 80%;
    margin: 0 auto;
    display: flex;
}
.box {
    margin: 0 2%;
}
.box h2, h3{
    text-align: center;
}
.box img{
    width: 100%;
}

footer{
    width: 100%;
    display: flex;
    margin-top: 11%;
    background: #333;
    color: #ccc;
}
footer .rechts, .links{
    width: 50%;
    padding: 1%;
    background: #333;
    color: #ccc;
}

.bildlinks {
    float: left;
    clear: left;
}  

.bildmitte {
  float: center;
  clear: center;
}  
.bildrechts {
    float: right;
    clear: right;
}  


/* Media Query für kleinere Bildschirme */
@media screen and (max-width: 768px) {
    .tabs {
    float: none; /* Float aufheben */
    margin-top: 0;
    margin-right: 0;
    text-align: center; /* Zentriert die Reiter */
    }
    .tabs a {
    margin-right: 10px; /* Kleinerer Seitenabstand für Reiter */
    }
    .banner {
    margin-right: 0; /* Abstand zum Rand aufheben */
    }
    .content img {
    max-width: 100%; /* Bildbreite auf 100% setzen */
    }
    .content p {
    max-width: 100%; /* Textbreite auf 100% setzen */
    padding-left: 0; /* Linken Seitenabstand entfernen */
    }
    }