body {
  width: 100%;
  background-color: #fff;
  color: #282828;
  font: 100% 'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  line-height: 1.5em;
  margin: 16px auto 48px;
  padding: 0;
  letter-spacing: 0.0625em;
}

.container {
  position: relative;
  margin: 0 auto;
  width: 20em;
  min-width: 320px;
}

p {
  margin: 0 0 1.5em;
}

hgroup p {
  margin-block-end: 0;
}

article,
aside,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary {
  display: block;
  margin: 0;
}

a:link,
a:active,
a:visited {
  text-decoration: none;
}

a {
  color: #2c70c5;
}

a:hover,
a:focus,
a img:focus {
  color: #8bf;
  background-color: transparent;
  border: 0;
  text-decoration: none;
}

.current {
  color: #525252;
  cursor: default;
}

.btnbkd {
  background:linear-gradient(#fff, #d7d7d7);
  background-clip:padding-box;
  border:1px solid #aac;
  border-radius:6px;
  box-shadow:0 1px 2px rgba(0,0,0,.2);
  padding:0.34375em 0.5em 0.375em;
  text-shadow:0 1px 2px rgba(0,0,0,.1);
}

.btnbkd:hover {
  background: linear-gradient(rgb(255, 255, 255) 50%, rgb(212, 212, 212) 100%);
  border:1px solid #8af;
  box-shadow:0 0 8px rgba(85,85,255,.6);
  color: #2c70c5;
}

.btnbkd:active,
.btnbkd:focus {
  background:linear-gradient(#fff, #ccc);
  border:1px solid #ccc;
  color: #8bf;
}

h1,
h2,
h3 {
  font-weight: normal;
  line-height:1.25em;
  margin: 0.125em 0;
}

h1 {
  font-size:1.75em;
}

h2 {
  color: #1b3664;
  font-size:1.5em;
}

h3 { 
  color: #1b9a6d;
  font-size:1.25em;
}

h4 {
  color: #8f8f8f;
  font-size: 1.125em;
  line-height: 1.375em;
  font-style: italic;
  text-transform: uppercase;
  margin: 0.75em 0;
}

ul,
dl { 
  display: block;
}

dl {
  width: 100%;
  margin: 0;
}

dt {
  display: inline-block;
  margin: 0.5em 0 0;
}

dd {
  display: inline-block;
  margin: 0.5em 0 0;
}

.vcard, #main { display: block; padding-left: 8px; }
.vcard { padding-top: 2em; padding-right: 1em; }

.figure {
  display: block;
  text-align: center;
  width: 100%;
}

img { 
  height: auto;
  max-width: 100%;
}

.tacen { text-align: center; }

.dbsp { padding-top: 0.25em; }
.trpsp { padding-top: 0.5em; }
.quadsp { padding-top: 0.75em; }

.sexsp { padding-top:1.25em; }

.dbsb { padding-bottom: 0.25em; }
.trpsb { padding-bottom: 0.5em; }
.quadsb { padding-bottom: 0.75em; }
.quintsb { padding-bottom: 1em; }
.sexsb { padding-bottom:1.25em; }

.two-columns {
  display: grid;
  gap: 0;
  grid-template-columns: 1fr;
}

.two-columns > div {
  margin: 1.25rem 0;
}

@media screen and (min-width: 640px){
 .container { width: 40em; min-width: 640px; }
 .vcard, #main { padding-left: 12px; }
 dd { width: 88%; }
 .two-columns {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: 1fr 1fr;
  }
}

@media screen and (min-width: 960px){
 .container { width: 60em; min-width: 960px; }
 .vcard, #main { padding-left: 16px; }
 dd { width: 92%; }
}