/*
  1. Use a more-intuitive box-sizing model.
*/
*, *::before, *::after {
  box-sizing: border-box; }

/*
    2. Remove default margin
  */
* {
  margin: 0; }

/*
    Typographic tweaks!
    3. Add accessible line-height
    4. Improve text rendering
  */
body {
  line-height: 1.5;
  font-size: 16px; }

html,
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%; }

/*
    6. Remove built-in form typography styles
  */
input, button, textarea, select {
  font: inherit; }

/*
    7. Avoid text overflows
  */
p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
  font-size: 16px;
  font-weight: 400; }

/*
    8. Create a root stacking context
  */
#root, #__next {
  isolation: isolate; }

.verse {
  text-indent: 0;
  max-width: 1rem;
  padding: 20px; }
  @media (max-width: 500px) {
    .verse {
      margin: 25px auto 400px; } }
  @media (min-width: 500px) {
    .verse {
      margin: 40px auto 400px; } }
  @media (min-width: 1000px) {
    .verse {
      margin: 60px auto 400px; } }
  .verse .italic {
    font-style: italic; }
  .verse .sc {
    font-variant: small-caps;
    text-transform: lowercase;
    letter-spacing: 0.05rem;
    word-spacing: 0.05rem; }
  .verse .center {
    text-align: center; }
  .verse .right {
    text-align: right; }
  .verse .subtitle {
    font-size: 1rem; }
  .verse .small {
    font-size: 0.889rem; }
  .verse .sc {
    font-size: 1rem; }
  .verse li {
    font-size: 1rem; }
  @media (max-width: 500px) {
    .verse .title {
      font-size: 1.211rem; } }
  @media (min-width: 500px) {
    .verse .title {
      font-size: 1.211rem; } }
  @media (min-width: 1000px) {
    .verse .title {
      font-size: 1.333rem; } }
  .verse ul {
    list-style-type: none;
    padding: 0; }
  .verse ol {
    margin-left: -0.9rem; }
  .verse ul li {
    text-indent: -1rem;
    margin-left: 1rem;
    line-height: 1.5; }
    .verse ul li.quote {
      text-indent: -1.5rem; }
  .verse ul li.paragraph {
    text-indent: 0;
    margin-left: 0; }
  .verse a {
    text-decoration: none; }
    .verse a:hover {
      text-decoration: underline; }

.verse li.indent-1 {
  margin-left: 2rem; }

.verse li.indent-2 {
  margin-left: 3rem; }

.verse li.indent-3 {
  margin-left: 4rem; }

.verse li.indent-4 {
  margin-left: 5rem; }

.verse li.indent-5 {
  margin-left: 6rem; }

.verse li.indent-6 {
  margin-left: 7rem; }

.verse li.indent-7 {
  margin-left: 8rem; }

.verse li.indent-8 {
  margin-left: 9rem; }

.verse li.indent-9 {
  margin-left: 10rem; }

.verse li.indent-10 {
  margin-left: 11rem; }

.verse li.indent-11 {
  margin-left: 12rem; }

.verse li.indent-12 {
  margin-left: 13rem; }

.verse li.indent-13 {
  margin-left: 14rem; }

.verse li.indent-14 {
  margin-left: 15rem; }

.verse li.indent-15 {
  margin-left: 16rem; }

.verse li.indent-16 {
  margin-left: 17rem; }

.verse li.indent-17 {
  margin-left: 18rem; }

.verse li.indent-18 {
  margin-left: 19rem; }

.verse li.indent-19 {
  margin-left: 20rem; }

.verse li.indent-20 {
  margin-left: 21rem; }

.verse li.indent-21 {
  margin-left: 22rem; }

.verse li.indent-22 {
  margin-left: 23rem; }

.verse li.indent-23 {
  margin-left: 24rem; }

.verse li.indent-24 {
  margin-left: 25rem; }

.verse li.indent-25 {
  margin-left: 26rem; }

.verse li.indent-26 {
  margin-left: 27rem; }

.verse li.indent-27 {
  margin-left: 28rem; }

.verse li.indent-28 {
  margin-left: 29rem; }

.verse li.indent-29 {
  margin-left: 30rem; }

.verse li.indent-30 {
  margin-left: 31rem; }

.verse li.indent-31 {
  margin-left: 32rem; }

.verse li.indent-32 {
  margin-left: 33rem; }

.verse li.indent-33 {
  margin-left: 34rem; }

.verse li.indent-34 {
  margin-left: 35rem; }

.verse li.indent-35 {
  margin-left: 36rem; }

.verse li.indent-36 {
  margin-left: 37rem; }

.verse li.indent-37 {
  margin-left: 38rem; }

.verse li.indent-38 {
  margin-left: 39rem; }

.verse li.indent-39 {
  margin-left: 40rem; }

.verse li.indent-40 {
  margin-left: 41rem; }

.verse li.indent-41 {
  margin-left: 42rem; }

.verse li.indent-42 {
  margin-left: 43rem; }

.verse li.indent-43 {
  margin-left: 44rem; }

.verse li.indent-44 {
  margin-left: 45rem; }

.verse li.indent-45 {
  margin-left: 46rem; }

.verse li.indent-46 {
  margin-left: 47rem; }

.verse li.indent-47 {
  margin-left: 48rem; }

.verse li.indent-48 {
  margin-left: 49rem; }

.verse li.indent-49 {
  margin-left: 50rem; }

.verse li.indent-50 {
  margin-left: 51rem; }

.verse li.indent-51 {
  margin-left: 52rem; }

.verse li.indent-52 {
  margin-left: 53rem; }

.verse li.indent-53 {
  margin-left: 54rem; }

.verse li.indent-54 {
  margin-left: 55rem; }

.verse li.indent-55 {
  margin-left: 56rem; }

.verse li.indent-56 {
  margin-left: 57rem; }

.verse li.indent-57 {
  margin-left: 58rem; }

.verse li.indent-58 {
  margin-left: 59rem; }

.verse li.indent-59 {
  margin-left: 60rem; }

.verse li.indent-60 {
  margin-left: 61rem; }

.verse.width-1 {
  max-width: 2rem; }

.verse.width-2 {
  max-width: 3rem; }

.verse.width-3 {
  max-width: 4rem; }

.verse.width-4 {
  max-width: 5rem; }

.verse.width-5 {
  max-width: 6rem; }

.verse.width-6 {
  max-width: 7rem; }

.verse.width-7 {
  max-width: 8rem; }

.verse.width-8 {
  max-width: 9rem; }

.verse.width-9 {
  max-width: 10rem; }

.verse.width-10 {
  max-width: 11rem; }

.verse.width-11 {
  max-width: 12rem; }

.verse.width-12 {
  max-width: 13rem; }

.verse.width-13 {
  max-width: 14rem; }

.verse.width-14 {
  max-width: 15rem; }

.verse.width-15 {
  max-width: 16rem; }

.verse.width-16 {
  max-width: 17rem; }

.verse.width-17 {
  max-width: 18rem; }

.verse.width-18 {
  max-width: 19rem; }

.verse.width-19 {
  max-width: 20rem; }

.verse.width-20 {
  max-width: 21rem; }

.verse.width-21 {
  max-width: 22rem; }

.verse.width-22 {
  max-width: 23rem; }

.verse.width-23 {
  max-width: 24rem; }

.verse.width-24 {
  max-width: 25rem; }

.verse.width-25 {
  max-width: 26rem; }

.verse.width-26 {
  max-width: 27rem; }

.verse.width-27 {
  max-width: 28rem; }

.verse.width-28 {
  max-width: 29rem; }

.verse.width-29 {
  max-width: 30rem; }

.verse.width-30 {
  max-width: 31rem; }

.verse.width-31 {
  max-width: 32rem; }

.verse.width-32 {
  max-width: 33rem; }

.verse.width-33 {
  max-width: 34rem; }

.verse.width-34 {
  max-width: 35rem; }

.verse.width-35 {
  max-width: 36rem; }

.verse.width-36 {
  max-width: 37rem; }

.verse.width-37 {
  max-width: 38rem; }

.verse.width-38 {
  max-width: 39rem; }

.verse.width-39 {
  max-width: 40rem; }

.verse.width-40 {
  max-width: 41rem; }

.verse.width-41 {
  max-width: 42rem; }

.verse.width-42 {
  max-width: 43rem; }

.verse.width-43 {
  max-width: 44rem; }

.verse.width-44 {
  max-width: 45rem; }

.verse.width-45 {
  max-width: 46rem; }

.verse.width-46 {
  max-width: 47rem; }

.verse.width-47 {
  max-width: 48rem; }

.verse.width-48 {
  max-width: 49rem; }

.verse.width-49 {
  max-width: 50rem; }

.verse.width-50 {
  max-width: 51rem; }

.verse.width-51 {
  max-width: 52rem; }

.verse.width-52 {
  max-width: 53rem; }

.verse.width-53 {
  max-width: 54rem; }

.verse.width-54 {
  max-width: 55rem; }

.verse.width-55 {
  max-width: 56rem; }

.verse.width-56 {
  max-width: 57rem; }

.verse.width-57 {
  max-width: 58rem; }

.verse.width-58 {
  max-width: 59rem; }

.verse.width-59 {
  max-width: 60rem; }

.verse.width-60 {
  max-width: 61rem; }

.verse.width-61 {
  max-width: 62rem; }

.verse.width-62 {
  max-width: 63rem; }

.verse.width-63 {
  max-width: 64rem; }

.verse.width-64 {
  max-width: 65rem; }

.verse.width-65 {
  max-width: 66rem; }

.verse.width-66 {
  max-width: 67rem; }

.verse.width-67 {
  max-width: 68rem; }

.verse.width-68 {
  max-width: 69rem; }

.verse.width-69 {
  max-width: 70rem; }

.verse.width-70 {
  max-width: 71rem; }

.verse.width-71 {
  max-width: 72rem; }

.verse.width-72 {
  max-width: 73rem; }

.verse.width-73 {
  max-width: 74rem; }

.verse.width-74 {
  max-width: 75rem; }

.verse.width-75 {
  max-width: 76rem; }

.verse.width-76 {
  max-width: 77rem; }

.verse.width-77 {
  max-width: 78rem; }

.verse.width-78 {
  max-width: 79rem; }

.verse.width-79 {
  max-width: 80rem; }

.verse.width-80 {
  max-width: 81rem; }

.verse.width-81 {
  max-width: 82rem; }

.verse.width-82 {
  max-width: 83rem; }

.verse.width-83 {
  max-width: 84rem; }

.verse.width-84 {
  max-width: 85rem; }

.verse.width-85 {
  max-width: 86rem; }

.verse.width-86 {
  max-width: 87rem; }

.verse.width-87 {
  max-width: 88rem; }

.verse.width-88 {
  max-width: 89rem; }

.verse.width-89 {
  max-width: 90rem; }

.verse.width-90 {
  max-width: 91rem; }

.verse.width-91 {
  max-width: 92rem; }

.verse.width-92 {
  max-width: 93rem; }

.verse.width-93 {
  max-width: 94rem; }

.verse.width-94 {
  max-width: 95rem; }

.verse.width-95 {
  max-width: 96rem; }

.verse.width-96 {
  max-width: 97rem; }

.verse.width-97 {
  max-width: 98rem; }

.verse.width-98 {
  max-width: 99rem; }

.verse.width-99 {
  max-width: 100rem; }

.verse.width-100 {
  max-width: 101rem; }

.verse h1,
.verse h2,
.verse h3,
.verse h4,
.verse h5,
.verse h6 {
  margin-bottom: 1em; }

.verse ul {
  margin-bottom: 0;
  /* Already gets its space after from ul.verse */ }

/* If verse is in a list, we can preserve line breaks and white space */
.verse li {
  white-space: pre-wrap; }

.verse li h1,
.verse li h2,
.verse li h3,
.verse li h4,
.verse li h5,
.verse li h6 {
  display: inline; }

.verse li:empty:after {
  content: " "; }

.pagination {
  position: fixed;
  bottom: 0px;
  width: 100%;
  display: flex;
  background-color: white;
  box-shadow: 0 0 30px 3px rgba(0, 0, 0, 0.1), 0 0 5px 3px rgba(0, 0, 0, 0.1); }
  .pagination .link {
    text-align: center;
    display: block;
    padding: 25px 10px;
    flex: 1;
    text-decoration: none; }
  .pagination .title {
    display: none; }
  .pagination .title-short {
    margin: 0 0.5rem; }
  .pagination a.link:hover {
    background-color: #f4f4f4; }
    .pagination a.link:hover .title {
      text-decoration: underline; }
  @media (min-width: 500px) {
    .pagination .title {
      display: inline-block;
      vertical-align: bottom;
      max-width: 150px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      margin: 0 0.5em; }
    .pagination .title-short {
      display: none; }
    .pagination .prev {
      text-align: left; }
    .pagination .next {
      text-align: right; }
    .pagination .link {
      padding: 25px 30px; } }
  @media (min-width: 750px) {
    .pagination .title {
      max-width: 300px; } }
  @media (min-width: 1000px) {
    .pagination .link {
      padding: 25px 30px; } }
@media print {
  .pagination {
    display: none; } }

html {
  background-color: #fff; }

* {
  font-family: "linotype-sabon", serif;
  color: #000; }

@media (max-width: 500px) {
  html {
    font-size: 18px; } }

@media (min-width: 500px) {
  html {
    font-size: 19px; } }

@media (min-width: 1000px) {
  html {
    font-size: 21px; } }

@media print {
  html {
    font-size: 14px; }
  .verse {
    margin: 2rem auto; } }
