/* Grundfarben und Schrift für Textspalte */
.responsive-table td:nth-child(2) {
  color: #ccffff;
  font-size: 20px;
  line-height: 2.0;
}

/* Bild flexibel skalieren */
.responsive-table img {
  max-width: 100%;
  height: auto;
  display: block;
}
 

/* Linkfarbe */
.responsive-table td:nth-child(2) a {
  color: #ccffff;
  text-decoration: underline;
}
/* Nur für Desktop (Bildschirme breiter als 992px) */
@media (min-width: 992px) {
    /* Wir geben der Bild-Zelle rechts Platz */
    .responsive-table td:first-child {
        padding-right: 100px !important;
        margin-right: 0 !important; /* Margin zur Sicherheit nullen */
  }
  /* Wir geben der Text-Zelle rechts Platz */
    .responsive-table td:last-child {
        padding-right: 100px !important;
        margin-right: 0 !important; /* Margin zur Sicherheit nullen */
  }
}



/* Auf kleinen Bildschirmen: Spalten nebeneinander, Text kleiner */
@media (max-width: 600px) {
  .responsive-table {
    display: flex !important;
    flex-wrap: nowrap !important; /* keine Umbrüche */
    width: 100%;
  }
  .responsive-table tbody {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 100%;
  }
  .responsive-table tr {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 100%;
  }
  /* Die erste Zelle (Bild) soll 30% Platz bekommen */
.responsive-table td:first-child {
    flex: 0 0 30% !important; /* 30% fest, kein Schrumpfen */
    max-width: 30%;
}

/* Die zweite Zelle (Text) bekommt den Rest */
.responsive-table td:last-child {
    flex: 1 1 70% !important;
}
  .responsive-table td {
    display: flex !important;
    margin-right: 10px;
    width: auto !important;
    box-sizing: border-box;
  }
  .responsive-table td:last-child {
    margin-right: 0;
  }
  .responsive-table td:nth-child(2) {
    font-size: 12px; /* Text kleiner */
    line-height: 1.4;
  }
}