@mixin content {

  background: #fff;
  padding: 2.75rem;
  margin-top: -120px;
  min-height: 530px;
  box-shadow: 0px -2px 3px 0px rgba(50, 50, 50, 0.25);

  h1, h2, h3, h4, h5, h6 {
    scroll-margin-top: $scroll-margin-top + 2.5;
    &:first-of-type {
      margin-top: 0;
      padding-top: 0;
    }
  }

  h2 {
    margin-top: $scroll-margin-top;
    border-bottom: 3px solid $dark;
  }

  img {
    @extend .img-fluid;
  }

  pre {
    font-family: "overpass-mono";
    @extend .highlight, .pre-scrollable;
    padding: 5px 10px;
  }

  code {
    font-family: "overpass-mono";
  }

  table {
    @extend .table, .table-striped;
    thead {
      @extend .thead-dark;
    }
  }

  blockquote {
    @extend .blockquote;
    font-size: $font-size-base;

    border-left: 5px solid $info;
    background-color: rgba($info, 0.05);
    padding: 1em;

    blockquote {
      border-left: 5px solid $success;
      background-color: rgba($success, 0.05);
      blockquote {
          border-left: 5px solid $warning;
          background-color: rgba($warning, 0.05);
        blockquote {
          border-left: 5px solid $danger;
          background-color: rgba($danger, 0.05);
        }
      }
    }
  }

  .alert {
    .title {
      font-size: $h4-font-size;
      font-weight: $font-weight-bold;
    }
  }

  .video {
    @extend .embed-responsive, .embed-responsive-16by9;
    margin-bottom: $line-height-base * 1em;
  }

  @include code-header;
}