.template-blog-post {
  .header {
    background: $blueGradient;
  }

  .social-container {
    margin-bottom: $spacingUnit * 2;
    margin-top: 0;
  }

  .section-content {
    max-width: $contentPageMaxWidth;
  }
}

.blog-title {
  margin-bottom: $spacingUnit;
  color: $titleGray;
  font-weight: lighter;
  font-size: $fontSize * 2.4;
  letter-spacing: -2px;
}

.blog-byline {
  font-size: $fontSize;
  font-weight: normal;
  color: $bylineGray;
  margin-bottom: $spacingUnit * 2;
}

.blog-body {
  img {
    width: 100%;
    height: auto;
  }

  .block-image {
    margin-bottom: $spacingUnit * 1.5;
  }
}

.template-blog-post {
  .header {
    background: $blueGradient;
  }

  .social-container {
    margin-bottom: $spacingUnit * 2;
    margin-top: 0;
  }

  .section-content {
    max-width: $contentPageMaxWidth;
  }
}

.blog-title {
  margin-bottom: $spacingUnit;
  color: $titleGray;
  font-weight: lighter;
  font-size: $fontSize * 2.4;
  letter-spacing: -2px;
}

.blog-byline {
  font-size: $fontSize;
  font-weight: normal;
  color: $bylineGray;
  margin-bottom: $spacingUnit * 2;
}

.blog-body {
  img {
    width: 100%;
    height: auto;
  }

  .block-image {
    margin-bottom: $spacingUnit * 1.5;
  }

  // TODO: copy-pasted from _content-page.scss because I'm too tired to figure
  // out how to do this the right way. DRY this out.

  h1 {
    font-size: $h1Size;
  }

  h2 {
    font-size: $h2Size;
  }

  h3 {
    font-size: $h3Size;
  }

  h4 {
    font-size: $h4Size;
    color: $darkGray;
  }

  h5 {
    font-size: $h5Size;
    color: $darkGray;
  }

  h1, h2, h3, h4, h5 {
    border-bottom: 1px solid $lightGray;
    color: lighten($textGray, 15%);
    margin-bottom: $spacingUnit * 1.5;
    font-weight: 300;
  }

  a {
    color: lighten($textGray, 20%);
    cursor: pointer;
  }
}

Make BlogPost and ContentPage styles consistent
Make BlogPost and ContentPage styles consistent
