_media-queries.scss

@media screen and (min-width: $viewport-small) {
  html {
    font-size: 16px;
  }

  h1,
  .h1 {
    font-size: $h1;
  }

  .site-header {
    text-align: left;
  }

  .site-nav {
    margin-top: 0;
  }

  .site-header a,
  .social-icons a,
  .share-links a {
    font-size: $h5;
  }

  .site-header .site-title {
    font-size: $h4;
    float: left;
    font-weight: $bold-font-weight;
  }

  .site-header .site-nav {
    float: right;
    margin-top: .25rem;
  }

  blockquote {
    margin: 0 0 0 $space-2;
    padding: $space-2 $space-1 + $space-2;
  }
}

@media screen and (min-width: $viewport-medium) {
  html {
    font-size: 18px;
  }
}

@media screen and (min-width: $viewport-large) {
  html {
    font-size: 20px;
  }
}

@media screen and (min-width: $viewport-large + 14) {
  em img {
    max-width: $measure-width + 14;
    margin-left: -7em;
  }
}