* {
  box-sizing: border-box;
}

body {
  font-family: 'Anonymous Pro', serif;
  background-image: url("/static/vigilance/desk_texture.jpg");
  background-repeat: repeat;
}

h1 {
  font-style: italic;
  color: #373fff;
}

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

.input {
  position: absolute;
  opacity: 0;
}

.label {
  width: 100%;
  font-family: 'Anonymous Pro', serif;
  font-size: large;
  text-decoration: underline;
  cursor: pointer;
  background: #ccc;
  padding: 10px;
}

.label:hover {
  background: #bbb;
}

.label:active {
  background: #aaa;
}

.input:checked + .label {
  background: #eee;
}

@media (min-width: 825px) {
  .label {
    width: auto;
  }

  .page {
    order: 99;
  }
}

.page {
  background-color: #ddd;
  padding: 1% 3%;
  display: none;
  width: 100%;
}

.single-page {
  background-color: #ddd;
  padding: 1% 3%;
  width: 100%;
}

.input:checked + .label + .page {
  display: block;
}

.page::before {
  content: "TOP SECRET \2014  FOR YOUR EYES ONLY";
  font-size: small;
  font-family: 'Anonymous Pro', sans-serif;
  color: #8c0808;
}

.tabPageBody {
  font-family: 'Anonymous Pro', serif;
  font-size: large;
}

.tabPageHeading {
  font-family: 'Staatliches', sans-serif;
  font-size: xx-large;
  text-align: center;
  margin-top: 1em;
  margin-bottom: 1em;
  font-style: italic;
}

.card {
  border: 2px solid #000;
  border-radius: 5px;
  padding: 0 10px;
  margin: 10px 0;
}

li.default {
  list-style-type: disc;
}

li {
  list-style-type: circle;
}

table {
  table-layout: fixed;
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 10px;
}

thead th:nth-child(1) {
  width: 20%;
}

th, td {
  border: 1px solid #000;
  padding: 10px;
}

/* Print stylesheet for offline roleplaying */
@media print {
  @page {
    size: letter;
    margin: 10mm 10mm 10mm 10mm;
  }

  .container {
    display: block;
    flex-wrap: nowrap;
  }

  .page {
    display: block;
    break-after: always;
    page-break-after: always;
  }

  .label {
    display: none;
  }

  .typewriter {
    font-size: small;
  }

  .heading {
    font-size: medium;
  }

  .card {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Hide assets when printing the overall Vigilance page because their formatting
  gets messed up there */
  #assets-main {
    display: none;
  }

  .asset.card {
    border: 2pt solid #000;
    border-radius: 0;
    margin: 10px;
    padding: 0 5pt;
    width: 63mm;
    height: 88mm;
    float: left;
    font-size: 10pt;
  }

  .asset.card ul {
    padding-inline-start: 10pt;
  }

  .asset.card p {
    margin: 0;
  }
}