.header-bg {
  background-size: cover;
  background-position: 50% 50%; }

header {
  padding: 1rem 0; }
  header h1 + .lead {
    margin: 2rem 0; }
  header.site-header.site-header-dark {
    position: initial; }
    header.site-header.site-header-dark .nav-site a {
      color: #000; }
      header.site-header.site-header-dark .nav-site a:hover {
        color: #000; }
    header.site-header.site-header-dark .nav-site .active a {
      color: #000; }
  header.page-header {
    background-size: cover;
    background-position: 50% 50%; }

.main {
  margin: 3rem 0; }
  .main img {
    max-width: 100%; }

.teasers {
  margin-bottom: 1rem; }
  .teasers .teaser {
    margin-bottom: 2rem; }

.archive-item {
  padding-top: 3rem; }
  .archive-item:first-child {
    padding-top: 0; }
  .archive-item a {
    font-weight: 500; }

.tag {
  white-space: nowrap; }

.post-header img {
  margin-top: 2rem; }

.post-header .tag {
  margin-right: 1rem; }

.post-body {
  margin-top: 3rem; }

.page-body h1 {
  margin-bottom: 3rem; }

body {
  font-family: 'Montserrat', sans-serif; }

header {
  color: #fff; }
  header.site-header {
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; }
  header.page-header {
    padding-top: 6rem; }
    header.page-header img {
      border-radius: 80px;
      float: right; }

.nav-site li a {
  color: #fff;
  padding: 0;
  margin: 1em 1em;
  font-size: .9rem;
  text-transform: uppercase;
  transition: all ease-in-out .2s; }
  .nav-site li a:hover {
    padding: .8em 0;
    color: #fff;
    transition: all ease-in-out .2s; }
    .nav-site li a:hover span {
      padding: .2em 1em;
      border-color: #fff;
      transition: all ease-in-out .2s; }
  .nav-site li a span {
    display: block;
    padding: 1em;
    border-color: transparent;
    border-style: solid;
    border-width: 1px 0;
    transition: all ease-in-out .2s; }

.nav-site li.active a {
  color: #fff;
  font-weight: 500;
  text-shadow: 0 0 5px #fff; }

.header-bg.header-bg-empty a:hover span {
  border-color: #000; }

.teasers .teaser .teaser-body {
  background: #f2f2f2;
  height: 100%;
  padding: 2rem; }
  .teasers .teaser .teaser-body .teaser-subtitle {
    font-size: 0.75rem;
    font-weight: 300;
    text-transform: uppercase; }
  .teasers .teaser .teaser-body h3 {
    font-size: 1.5rem;
    font-weight: 300;
    margin-bottom: 1rem; }
  .teasers .teaser .teaser-body p {
    font-size: 0.9rem; }

.archive-item h2 a {
  color: #000;
  transition: color ease-in-out .15s; }
  .archive-item h2 a:hover {
    transition: color ease-in-out .15s; }

.post-header img {
  border: solid .3rem #fff;
  box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.15); }