li {
  margin-top: 0;
  margin-bottom: 0;
}

section.lore-content {
  margin-top: 48px;
  margin-bottom: 64px;
}

.parchment a {
  color: #3a2215;
  font-weight: bold;
}

.parchment a:hover {
  color: #3a2215;
}

.parchment a:active {
  color: ##2d1604;
}

.parchment a:visited {
  color: ##634738;
}

.parchment a:active:visited {
  color: ##2d1604;
}

.lore-title {
  padding-left: 7.5%;
  padding-right: 7.5%;
  padding-bottom: 8px;
  font-family: Rooters, serif;
  font-size: 1.7em;
  text-align: center;
}

.table-of-contents .lore-title {
  font-size: 1.3em;
}

.lore-text {
  margin-top: 42px;
  margin-bottom: 42px;
  line-height: 1.3em
}

.table-of-contents .lore-text{
  margin-bottom: 0;
}

.parchment {
  width: 92vw;
  max-width: 480px;
  border: 3.25rem solid transparent;
  border-image-slice: 125 fill;
  border-image-source: url('../images/parchment.jpg');
  border-image-repeat: stretch;
  color: #3a2215;
  font-family: Jorvik, serif;
  font-size: 16pt;
}

.lore-nav {
  width: 100%;
  padding-top: 1.5em;
}

.toc-row {
  width: 100%;
  padding-bottom: 24px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.arrows-row {
  width: 100%;
  height: 28px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.arrow-container {
  width: 45%;
  height: 28px;
  margin-left: -0.5em;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.arrow-container.right {
  margin-left: 0;
  margin-right: -0.5em;
  text-align: right;
  flex-direction: row-reverse;
}

.arrow-container.right .nav-arrow {
  transform: rotate(180deg);
}

.arrow-label {
  margin-top: -2px;
  font-size: 14pt;
  line-height: 1em;
  text-decoration: none;
}

.nav-arrow {
  width: 15px;
  height: 21px;
  padding-right: 10px;
}

.centered-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.parchment-divider {
  width: 95%;
  max-width: 360px;
  height: 5px;
}

.parchment-glyph {
  width: 83px;
  height: 22px;
}

.table-of-contents .parchment-glyph {
  margin-top: 42px;
}

.dropped {
  margin-top: 64px;
}

.small {
  font-size: 80%;
}

.rotated {
  transform: rotate(180deg);
}

@media (min-width: 720px) {
  .parchment {
    padding-left: 1.5em;
    padding-right: 1.5em;
  }
}
