@font-face {
    font-family: Garamond;
    src: url("res/AGaramondPro-Regular.otf") format("opentype");
}

@font-face {
    font-family: Garamond;
    font-style: italic;
    src: url("res/AGaramondPro-Italic.otf") format("opentype");
}

@font-face {
    font-family: Garamond;
    font-weight: bold;
    src: url("res/AGaramondPro-Bold.otf") format("opentype");
}

body {
  margin: 0;
  padding: 0;
  margin-bottom: 86px;
  font-family: Garamond;
}

header {
  width: 384px;
  margin: 0 auto;
  text-align: center;
}

#header-title {
  font-size: 64px;
  margin-top: 86px;
  margin-bottom: 0px;
}

#header-subtitle {
  font-size: 24px;
  font-style: italic;
}

#content {
  width: 384px;
  margin: 0 auto;
}

#title {
  font-size: 48px;
  text-align: center;
  margin: 32px;
  margin-top: 86px;
}

#poem {
  font-size: 24px;
}

#back {
  text-align: right;
  width: 100%;
  display: block;
  margin-top: 16px;
}

a {
  text-decoration: none;
}

audio {
  width: 300px;
  margin-top: 32px;
  margin-bottom: 16px;
  margin-left: 43px;
}