/* color scheme */
/* cultured (white): f5f5f5
/* sumi (black): 27221f
/* corsa (red): d40000
/* cobalt (blue): 0047ab

/* page structure */
body {
  background-color: #f5f5f5;
  color: #27221f;
  font-family: "Alegreya", serif;
  line-height: 1.5;
  font-size: 15pt;
  font-weight: 400;
  margin: 0;
}

.wrapper {
  margin: auto;
  max-width: 38em;
}

.columns {
  display: flex;
}

.column {
  flex: 1;
}

.columnbody{
  flex: 1;
  max-width: max-content;
}

.left {
  text-align: left;
}

.right {
  text-align: right;
}

.avatar {
  border-radius: 50%;
  margin-top: -1.75em;
  width: 230px;
  height: 230px;
}

/* section titles */
h1 {
  font-family: "Alegreya Sans", sans-serif;
  font-size: 2em;
  font-weight: 900;
  margin-bottom: -.05em;
}

h2 {
  font-weight: 700;
  font-size: 1.5em;
  margin-bottom: -.5em;
}

h3 {
  font-family: "Alegreya SC", serif;
  font-size: 1.25em;
  font-weight: 500;
  margin-bottom: -.5em;
  text-transform: lowercase;
}

/* links */
#icon {
  color: #27221f;
  text-decoration: none;
}

a:link, a:visited, #icon:hover, #icon:active {
  color: #0047ab;
  text-decoration: none;
}

a:hover, a:active {
  color: #27221f;
  text-decoration: underline;
}

/* header */
header {
  display: none;
}

#titlebar {
  color: #27221f;
  font-size: 1.5em;
}

#navbar {
  color: #27221f;
  font-family: "Alegreya SC", serif;
  font-size: 1.5em;
  font-weight: 400;
  text-transform: lowercase;
}

#titlebar:hover, #navbar:hover {
  border-bottom: .4em solid #c3336d;
  text-decoration: none;
}

/* footer */
footer {
  border-top: .1em solid #27221f;
  margin-bottom: .75em;
  padding: 1em;
}

.footnote {
  font-size: .8em;
  line-height: 1.25em;
}

/* mobile settings */
@media only screen and (max-width: 54em) {
  body {
    font-size: 14pt;
  }

  .wrapper {
    margin: 0 5%;
  }

  .columns {
    flex-direction: column;
  }

  .left {
    text-align: center !important;
  }

  .right {
    text-align: center !important;
  }

  .avatar {
    margin: 0;
    max-width: 15em;
  }

  #titlebar:hover, #navbar:hover {
    padding: 0 .25em;
    border-bottom: 0;
    color: #f5f5f5;
    background-color: #c3336d;
  }

  .footnote {
    padding-bottom: 1.25em;
  }
}

/* print settings */
@media only print {
  body {
    background-color: white;
    color: black;
    font-size: 12pt;
    line-height: 1.25;
  }

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

  header {
    border: 0;
    padding: 0;
  }

  footer, .avatar, #icon, #navbar {
    display: none;
  }
}