body {
  background-color: #ffc529;
  font-family: 'Poiret One', cursive, sans-serif;
  font-size: 1.1em;
}

div.bgunder {
  position: absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  background: url(img/bookcover.jpg);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

div.overlay {
  opacity: 0.5;
  background-color: white;
  position: absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
}

div.wrapper {
  overflow: auto;
  top:0;
  bottom:0;
  left:0;
  right:0;
  position: absolute;
}

div.main {
  width: 40em;
  background-color: white;
  padding: 3em;
  border-radius: 1em;
  border: 1px solid #aa1d25;
  margin: 1em auto;
}
p.author {
  background-image: url("img/gab.jpeg");
  background-position: left top;
  background-size: 5em auto;
  background-repeat: no-repeat;
  padding-left: 6em;
  min-height: 6em;
}
p.intro {
  font-style: italic;
}
h1 {
  text-align: center;
}
h1, h2, h3, h4, h5 {
  color: #aa1d25;
  font-family: 'Advent Pro', sans-serif;
}

div.chapter {
  font-family: 'Advent Pro', sans-serif;
  padding: 0 1em;
}

span.chapter::before {
  content: "Chapter ";
}
span.chapter::after {
  content: ":";
}
span.chapter {
  text-decoration: underline;
}

iframe {
  max-width: 100%;
  margin: auto;
  display: block;
}


@media (max-width: 800px) {
  body {
    background: none;
  }
  div.bgunder, div.overlay {
    display: none;
  }
  div.wrapper {
    display: block;
  }
  div.main {
    margin: 0;
    border: none;
    border-radius: 0;
    width: auto;
    padding: 1em;
  }
  iframe {
    max-width: 100%;
  }
}