html {
  background-color: #faf9f7;
  font-size: 105%;
}

/* Typography */

h1, h2, h3, h4 {
  font-family: 'Source Serif Pro', serif;
}

p, li, th, td, figcaption, div.buttons a {
  font-family: 'Source Serif Pro', serif;
  line-height: 1.5em;
}

li {
  margin-top: 1em;
}

.smaller {
  font-size: 80%;
}

blockquote {
  margin-left: 1em;
  padding-left: 1em;
  border-color: #e6e5e3;
  border-width: 0 0 0 0.25em;
  border-style: solid;
}

/* Text alignment */

p {
  text-align: justify;
}

/* Links */

a, a:visited {
  color: #0a2c8f;
  text-decoration: none;
}

a:hover {
  color: #3857ae;
  text-decoration: underline;
}

/* Buttons */

.buttons {
  padding-top: 2em;
  padding-bottom: 2em;

  text-align: center;
}

.buttons a {
  display: inline-block;

  margin: 0.5em;
  padding: 0.5em 1em;

  background: #042fab;

  -webkit-box-shadow: 0px 0px 0px 4px #e6e5e3;
  -moz-box-shadow: 0px 0px 0px 4px #e6e5e3;
  box-shadow: 0px 0px 0px 4px #e6e5e3;

  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;

  text-shadow: 0px 1px 1px #494949;

  color: #ffffff;
  font-size: 110%;
}

.buttons a:hover {
  text-decoration: none;
}

/* Rule - http://www.daveperrett.com/articles/2014/04/07/recreating-the-reeder-two-tone-horizontal-rule-in-pure-css/ */

hr {
  margin-top: 2em;
  margin-bottom: 2em;

  height: 3px;
  border: 0;
  background-color: #c3c3c3;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#faf9f7), to(#faf9f7), color-stop(50%, #fff));
  background-image: -webkit-linear-gradient(left, #faf9f7, #fff, #faf9f7);
  background-image: -moz-linear-gradient(left, #faf9f7, #fff, #faf9f7);
  background-image: -ms-linear-gradient(left, #faf9f7, #fff, #faf9f7);
  background-image: -o-linear-gradient(left, #faf9f7, #fff, #faf9f7);
}

hr::after {
  content: "";
  display: block;
  height: 1px;
  background-color: #f7f6f4;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#faf9f7), to(#faf9f7), color-stop(50%, #c3c3c3));
  background-image: -webkit-linear-gradient(left, #faf9f7, #c3c3c3, #faf9f7);
  background-image: -moz-linear-gradient(left, #faf9f7, #c3c3c3, #faf9f7);
  background-image: -ms-linear-gradient(left, #faf9f7, #c3c3c3, #faf9f7);
  background-image: -o-linear-gradient(left, #faf9f7, #c3c3c3, #faf9f7);
}

/* Footer */

footer {
  margin-top: 3em;
  margin-bottom: 3em;
}

footer p {
  text-align: center;
}