html {
  height: 100%;
  width: 100%;
}

* {
  box-sizing: border-box;
}

a {
  text-decoration: none; /* Disable underline */
  color: black; /* Change text color */
}


.Tabelle{
  border-collapse: collapse;
  width: 50%;
  float: left;
}

.spl{
  border-collapse: collapse;
  width: 50%;
}

table th, table td {
  border: 1px solid #ddd;
  padding: 8px;
  text-align: left;
}

.Tabelle tr:nth-child(even) {
  background-color: #ffffff;
}

.Tabelle tr:nth-child(odd) {
  background-color: #f0f0f0;
}



.Spiele tr:nth-child(even) {
  background-color: #ffffff;
}

.Spiele tr:nth-child(odd) {
  background-color: #f0f0f0;
}

.Tabhigh tr:nth-last-child(-n+2) td {
  background-color: red;
  color: black;
}
.Tabhigh tr:nth-last-child(3) td {
  background-color: #ff9500;
  color: black;
}
.Tabhigh tr:first-child td {
  background-color: #fbff00;
  color: black;
}

.Tablow tr:nth-last-child(-n+2) td {
  background-color: red;
  color: black;
}
.Tablow tr:nth-last-child(3) td {
  background-color: #ff9500;
  color: black;
}
.Tablow tr:nth-child(1) td {
  background-color: #0cad00;
  color: black;
}
.Tablow tr:nth-child(2) td {
  background-color: #0cad00;
  color: black;
}
.Tablow tr:nth-child(3) td {
  background-color: #0fe600;
  color: black;
}



/* Style for the parent buttons */
.parent-button {
  display: inline-block;
  padding: 18px;
  background-color: #f1f1f1;
  border: none;
  cursor: pointer;
  width: calc(100% / 7);
  font-size: large;
  
  margin-right: -4px; /* This removes the space between the buttons */
}

.parent-button:hover {
  background-color: #ccc;
}

/* Style for the child buttons */
.child-button {
  display: inline-block;
  box-sizing: border-box;
  padding: 18px;
  background-color: #f1f1f1;
  border: none;
  cursor: pointer;
  width: calc(100% / 3); /* Change 3 to the maximum number of child buttons you have */
  font-size: large;
  text-align: center;
}

.child-button:hover {
  background-color: #ccc;
}


.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  height:50px;
}

.page-btn {
  display: inline-block;
  padding: 5px 10px;
  background-color: #f1f1f1;
  font-size: 30px;
  border: none;
  cursor: pointer;
  min-width: 10%;
  margin-right: -4px; /* This removes the space between the buttons */
}

.page-btn:hover {
  background-color: #ccc;
}

.page-text {
  display: inline-block;
  margin: 0 10px;
  font-size: 40px;
  font-weight: bold;
  text-align: center;
  min-width: 30px;
}