html {
    box-sizing: border-box;
}

*, *::before, *::after {
    box-sizing: inherit;
}

html, body {
  margin: 0;
  padding: 0;
  background-color: #ffffff;
  color: #000000;

  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 0.8rem;
}

h1, h2, h3, h4 {
  font-size: 1.1rem;
  font-weight: bold;
  margin: 6px 0 6px 0;  
/* Beispiel:
1em 2em 3em 4em
4 Werte:
oben 1em
rechts 2em
unten 3em
links 4em

1em 3em
2 Werte:
oben und unten 1em
rechts und links 3em
*/
width: 100%
}

hr {
    width: 100%    
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.0rem;
  font-family: Verdana, Arial, Helvetica, sans-serif;
}

/*
table tr:first-child td {
    font-weight: bold;
    font-size: 1.0em;
    background-color: #f0f0f0;
}
 */   

th {
  font-size: 1.0rem;
  font-weight: bold;  
  background-color: #f0f0f0;
  padding: 2px 3px;
/*  VVVV  löst das Problem mit dem horizontalen Scrollbalken  */
  white-space: normal;
  word-break: break-word;
  min-width: 0; /* Flexbox-Kompatibilität */
/* Bessere Positionierung des Headers */
  line-height: 1.2;
  text-align: left;    
/* VVV Neu 17.1.26 */
    position: sticky;
    top: 0; /* Am oberen Rand fixieren */
    z-index: 100;
}

td {
/*  font-size: 1.2rem; */
  padding: 2px 3px;
}

tbody tr:nth-child(odd) td {
  background-color: #ffffff;
}

tbody tr:nth-child(even) td {
  /*background-color: #f8f8f8;*/
  background-color: #F0F0F0;
}

tbody tr:hover td {
  background-color: #eaeaea;
}

td.nummern {
  text-align: right;
}

td.zahlen {
  text-align: right;
}
.spacer {
    height: 0.8rem;
}

/* Für kleine Bildschirme ...*/
@media (max-width: 600px) {
  table {
  width: 100%;
    font-size: 0.9em;
  }

  th, td {
    font-size: 0.9rem;
    padding: 2px 3px;
  }
}