:root{
  --ink:#243447;
  --paper:#fcfbf9;
  --gold:#b89b72;
  --maxw:660px;
}

html,body{height:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:Georgia, serif;
  font-size:.85rem;
  line-height:1.35;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:20px;
}

.wrap{max-width:var(--maxw); width:100%}

h1{
  text-align:center;
  font-size:1.12rem;
  font-weight:bold;
  margin:0 0 .6rem 0;
}

.content{text-align:left}

h2{
  font-size:.86rem;
  font-weight:bold;
  margin:.9rem 0 .35rem;
}
h3{
  font-size:.8rem;
  font-weight:bold;
  margin:.55rem 0 .2rem;
}
p{margin:.32rem 0}

a{
  color:var(--ink);
  text-decoration:none;
  border-bottom:1px solid var(--gold);
  padding-bottom:1px;
}
a:hover{opacity:.85}
.nav-link{
  display:inline-block;
  margin-top:.8rem;
  font-size:.78rem;
  border-bottom:1px solid var(--gold);
  padding-bottom:1px;
}

.rule{
  margin:1rem auto .7rem;
  width:92%;
  border-top:1px solid var(--gold);
}
footer{text-align:center}
footer p{margin:0; font-size:.72rem}
footer a{border-bottom:1px solid var(--gold); padding-bottom:1px}
@media (max-width: 400px) {
  h1 {
    font-size: 1rem; /* slightly smaller on very narrow screens */
  }
}