.tablepers {
  max-width: 300px;
  margin: 5px;
  padding: 0;
  background: rgb(119, 27, 173); 
  color:#fff
}

/* jede Zeile = flex-container, aber nur in .tablepers */
.tablepers .row {
  display: flex;
  margin-bottom: 4px;
}

/* Grundstil für jede Zelle in .tablepers */
.tablepers .cell {
  padding: 4px 8px;
}

/* linke Spalte: Bezeichnungen */
.tablepers .cell[role="rowheader"] {
  font-weight: bold;
  width: 100px;
}

/* rechte Spalte: Werte, nimmt den Rest */
.tablepers .cell[role="cell"] {
  flex: 1;
}

.tablelebenslauf {
  max-width: 900px;
  margin: 5px;
  padding: 0;
  background: rgba(53, 98, 149, 0.85);
  color:#fff;
  font-size: 14px;
  border: 1px solid #444;
}


.tablelebenslauf .row.title .cell {
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  padding: 10px;
  background: rgba(66, 107, 153, 0.85);
  color: #fff;
  border-bottom: 1px solid #444;

  /* Über alle 3 Spalten strecken */
  width: 100%;
}

/* jede Zeile */
.tablelebenslauf .row {
  display: flex;
  padding: 4px 0;
  border-bottom: 1px solid #444;  /* Linie zwischen den Zeilen */
}

/* Kopfzeile */
.tablelebenslauf .row.header {
  font-weight: bold;
  border-bottom: 2px solid #ccc;
}

/* Zellen in der Lebenslauf-Tabelle */
.tablelebenslauf .cell {
  padding: 2px 6px;
}

/* (falls mal rowheader in dieser Tabelle sind) */
.tablelebenslauf .cell[role="rowheader"] {
  font-weight: bold;
  width: 100px;
}

/* Spaltenbreiten */
.tablelebenslauf .row:not(.title) .cell:nth-child(1) { width: 160px; }
.tablelebenslauf .row:not(.title) .cell:nth-child(2) { flex: 2; }
.tablelebenslauf .row:not(.title) .cell:nth-child(3) { flex: 1.5; }