* {
  margin-left: 0;
  padding: 0;
}

/* html { color-scheme: dark } */

[hidden] {
  display: none;
}

body {
  background: #2b2e35;
}

.wrapper {
  width: min(900px, 100% - 3rem);
  margin-inline: auto;
  align: center;
}

table {
  with: 100%;
  t-size: 1.1rem;
  font-family: tahoma;
  line-height: .15rem;
  border-collapse: collapse;
  border-color: #00edff;
  background: #32353d;
  border-radius: 12px;
  margin: 28px 32px;
  color: #fff;
}

caption,
th,
td {
  padding: 1rem;
  border-radius: 12px 12px 0px 0px;
}

caption,
th {
  text-align: left;
}

caption {
  font-size: 1.2rem;
  font-weight: 700;
}

.code-txt {
  font-size: .85rem;
  color: #abb8d4;
}

.nme-txt {
  font-size: .65rem;
  /* color: #35ff0c; */
  color: #00edff;
}

th {
  background: #008e99;
}


.ths-txt {
  font-size: .65rem;
}

tr:nth-of-type(2n) {
  background: hsl(0 0% 0% / 0.2);
}

@media (max-width: 1050px) {
  th {
    display: none;
}
  td {
    display: block;
    min-width: 310px;
    padding: .6rem 1rem;
    font-size: .75rem;
  }

  .nme {
  font-size: .55rem;
  }

  .nme-txt {
    font-size: .55rem;
  }

  td:first-child {
    padding-top: 1rem;
  }

  td:last-child {
    padding-bottom: 1rem;
  }

  td::before {
    content: attr(data-cell) ": ";
    font-weight: 700;
    text-transform: capitalize;
    font-size: .85rem;
  }
}