.password_rules {
  margin-top: 1em;
}

td.active {
  font-size: larger;
  font-weight: bold;
}

tr.active {
  border: 4px solid black;
}

table {
  border-collapse: collapse;
  margin: 0 auto;
}

td {
  padding: 2px;
  text-align: center;
}

td.player {
  text-align: left;
}

.up {
  color: blue;
  background-color: lime;
}

.down {
  color: yellow;
  background-color: red;
}

h2 {
  font-size: 20pt;
  text-align: center;
}

#logincontainer {
  display: flex;
  justify-content: space-around;
  gap: 20px;
}

#logincontainer fieldset {
  flex-basis: 40%;
}

.container {
  max-width: 1000px;
  margin: 0 auto;
}

.scroll {
  height: 80vh;
  overflow-y: auto;
}

.center {
  text-align: center;
}

.altcenter {
  margin: 0 auto;
}

article {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  /* gap: 20px; */
  border: 1px solid black;
  margin-bottom: 0.5em;
}

header {
  flex: 1 100%;
  text-align: center;
  background-color: aliceblue;
  cursor: pointer;
}

header.qpd, header.qtb {
  border: 1px solid black;
  margin-bottom: 0.5em;
}

article > header > div.headercontainer {
  display: flex;
}

article > header > div.headercontainer > div {
  text-align: left;
  flex-basis: 50%;
}

article > header > div.headercontainer > div + div {
  flex-basis: 50%;
  text-align: right;
}

article > footer {
  flex: 1 100%;
  height: 10px;
  background-color: lime;
  text-align: center;
}

article > section {
  display: none;
  padding: 1% 0;
}

article.qpd {
}

article.qpd section {
  display: block;
}

article.qpd > header {
  cursor: auto;
}

.showdetails {
  display: none;
}

.showdetails:checked ~ section {
  display: block;
}

input[type="submit"], button {
  border: none;
  background-color: white;
  color: rgb(0,0,238);
  cursor: pointer;
  font-size: 16pt;
}

@media screen and (max-width: 650px) {
  article {
    flex-direction: column;
    justify-content: space-around;
  }
  article section {
    text-align: center;
  }
  #logincontainer {
    flex-direction: column;
    justify-content: space-around;
  }
}