body, html {
  margin: 0;
  padding: 0;
  height: 100%;
  background-color: rgb(50, 50, 50);
}

.container {
  display: flex;
  height: 100%;
}

.image {
  flex: 0 0 70%; /* 70% Breite */
  position: relative; /* Positionierung relativ für das Overlay */
}

.image img {
  width: 100%; /* Bild füllt den verfügbaren Platz aus */
  height: 100%; /* Bild füllt den verfügbaren Platz aus */
  object-fit: cover; /* Das Bild wird proportional gestreckt, um den gesamten Bereich zu füllen */
}

.content {
  flex: 1; /* Nimmt den restlichen verfügbaren Platz ein */
  display: flex; /* Anzeige der inneren Elemente als Flexbox */
  flex-direction: column; /* Anordnung der Elemente in Spalten */
  justify-content: flex-start; /* Ausrichtung der inneren Elemente am oberen Rand */
  align-items: start; /* Zentriert die inneren Elemente horizontal */
  padding: 20px; /* Innenabstand */
}

.logo img {
  width: 65%; /* Breite des Logos */
  margin: 10% 0 0 18%; /* zentrieren des Logos */
  height: auto; /* Behält das Seitenverhältnis bei */
}

.divider-eins {
  width: 80%;
}

.text {
  color: whitesmoke;
  margin-left: 10%; /* Text auf Flucht des Logos bringen */
  font-family: 'Avenir', sans-serif;
}

.title {
  font-size: 42pt;
  font-style: normal;
  margin: 8% 0 16% 0;
}

.subtitle {
  font-size: 32pt;
  font-weight: normal;
  margin: 30% 0 4% 0;
}

.description {
  font-size: 22pt;
  font-weight: normal;
  margin: 0% 0 0 0;
}