@import url("https://use.typekit.net/jro3edm.css");
html,p,a {
  font-family:  "garamond-premier-pro", Garamond, serif;
  font-style:   normal;
  font-weight:  400;
  font-size:    12pt;
  text-align:   left;
  text-decoration:  none;
  margin:       0;
}
html {
  background: #fafafa;
  padding:    0;
}
h1,h2,h3,h4,h5,h6 {
  font-weight:  400;
  font-style:   normal;
  font-size:    1.1em;
  margin:       0;
}
h1,h3,h5 { font-family:  "garamond-premier-pro", Garamond, serif; }
h2,h4,h6 { font-family:  tangerine, Snell Roundhand, cursive; }

@media screen and (min-width: 640px) {
  main { display: flex; background: white; }
  header section {
    display: flex;
    justify-content: space-between;
    background-color: #f0f0f0;
    border: 0.1ch solid gray;
    line-height: 2em;
  }
}
header section p {
  flex: 0 0 25%;
  padding: 0 0 0 2ch;
}
header nav {
  flex: 0 0 25%;
  text-align: right;
  line-height: 2em;
}
header nav a {
  display: inline-block;
  min-width: 8ch;
  padding: 0 1ch;
  border: 0.1ch solid gray;
  text-align: center;
}
header nav a.sharelink {
  min-width: 2ch;
}
header nav img {
  vertical-align: middle;
}
main {
  max-width: 80%;
  padding: 2ch;
  margin: auto;
  text-align: center;
  align-items: flex-start;
  flex-flow: row wrap;
}
main nav.pagenav {
  min-width: 100%;
}
main nav.pagenav a {
  display: inline-block;
  min-width: 2ch;
  padding: 0 1ch;
  border: 0.1ch solid lightgray;
  text-align: center;
  font-size: 0.8em;
}
main nav.pagenav a:first-of-type, main nav.pagenav a:last-of-type {
  min-width: 10ch;
}
main nav.pagenav a.curpage {
  background-color: lightgray;
}
main div.page {
  width: 100%;
  height: auto;
}
main div.page figure {
  width: 100%;
  height: auto;
}
main div.page.HaikuFrame {
  width: 70%;
  text-align: center;
  margin: 5% auto;
}
main figure.cl_border img, main figure.climg_border img {
  border: 0.5ch solid black;
}
main div.page figure.climg_left {
  width: 42%;
  float: left;
}
main div.page figure.climg_right {
  width: 42%;
  float: right;
}
main div.page figure.climg_small {
  width: 22%;
}
main .CvrPgBox figure figcaption {
  display: none;
}
main .CvrPgBox figure.cl_border img {
  border: 0.2ch solid black;
}
main div.page img {
  width: 80%;
  max-width: 900px;
  margin: auto;
}
main div.CvrPage img { width: 50% }
.HaikuFrame p {
  font-family: antiquarian-scribe, Brush Script MT, Brush Script Std, cursive;
  font-size: 1.4em;
  margin: 0 10%;
}
.HaikuFrame figure p {
  font-family: garamond-premier-pro, Garamond, serif;
  font-size: 1.0em;
  text-align: center;
  margin: 0;
}
main div#CvrPgGrid {
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
main div.CvrPgBox {
  max-width: 40ch;
  padding: 2ch;
  margin: 0 auto;
}
main div.ContentsPage {
  margin: 0 5%;
  columns: 2;
  column-rule: solid 2px black;
}
main div.ContentsPage h1, h2, h3 {
  column-span: all;
}
main div.ContentsPage h4 {
  -webkit-column-break-before: always;
  break-before: column;
}
main div.ContentsPage ul {
  text-align: left;
  margin: 1em 1em;
}
main div.ContentsPage li {
  margin: 0.8em 0;
}
footer p {
  text-align: center;
}