.table {
  border-collapse: collapse;
  border-spacing: 0;
  text-align: left;
  box-sizing: border-box;
  overflow: hidden;
  width: 100%;
  display: table;
}

.table td, .table th {
  padding: 0.5em;
  border-bottom: 0.1em solid var(--brighttext);
  border-top: 0.1em solid var(--brighttext);
}

.table.table-striped tbody tr:nth-of-type(odd) {
  background: var(--sectionthree);
}

.table.table-striped tbody tr:nth-of-type(even) {
  background: white;
}

/* Undoing table code from https://codepen.io/aarongustafson/pen/ARWyLv and further modified */
@media (max-width: 30rem) {
  table {
    border: 0;
    border-bottom-width: 0.0625em;
    padding-bottom: 1.4375em;
    display: block;
    width: 100%;
    /*
     * make everything display block so it
     * aligns vertically
     */
    /* Labeling
     * adding a data-title attribute to the cells
     * lets us add text before the content to provide
     * the missing context
     *
     * Markup:
     *   <td data-title="Column Header">Content Here</td>
     *
     * Display:
     *   Column Header: Content Here
     */
  }
  .table.table-striped tbody tr:nth-of-type(odd) {
    background: unset;
  }
  .table.table-striped tbody td:nth-of-type(odd) {
    background: var(--sectionthree);
  }
  .table.table-striped tbody td:nth-of-type(even) {
    background: white;
  }
  table caption {
    display: block;
  }
  table thead {
    display: none;
    visibility: hidden;
  }
  table tbody,
  table tr,
  table th,
  table td {
    border: 0;
    display: block;
    padding: 0;
    text-align: left;
    white-space: normal;
  }
  table tr {
    padding: 0.5em;
  }
  table th[data-title]:before,
  table td[data-title]:before {
    content: attr(data-title) ": ";
    font-weight: bold;
  }
  table th:not([data-title]) {
    font-weight: bold;
  }
  .table tr {
    padding: 0.2em;
  }
  .table tr td {
    padding: 0.1em;
  }
  .table tr td:first-child {
    border-top: 0.1em solid var(--brighttext);
    border-bottom: 0.05em solid var(--brighttext);
  }
  .table tr td:last-child {
    border: none;
  }
  .table tr:last-child {
    border-bottom: 0.1em solid var(--brighttext);
  }
}

/*# sourceMappingURL=table.css.map */