article {
  h1,
  h2,
  h3,
  h4 {
    margin-top: 35px;
    margin-bottom: 15px;
  }

  h1 {
    font-weight: 600;
    font-size: 32px;
  }

  h2 {
    font-weight: 600;
    font-size: 24px;
    line-height: 1.8;
  }

  h3 {
    font-weight: 600;
    font-size: 20px;
    line-height: 1.8;
  }

  h4 {
    padding-bottom: 8px;
    border-bottom: 2px solid #ddd;
  }

  h5 {
    font-size: 14px;
    padding: 10px 0px;
  }

  p,
  li {
    line-height: 1.625;
  }

  p {
    margin: 0 0 24px;
  }

  figure {
    text-align: center;

    .img-flex {
      display: flex;
      justify-content: center;
    }

    .img-block {
      display: block;
    }

    img {
      display: block;
      width: auto;
      max-width: 100%;
      max-height: 60vh;
    }

    figcaption {
      padding: 8px 0px;
      color: #9daab6;
    }
  }

  blockquote {
    margin: 0 0 20px;
    padding: 10px 20px;
    font-size: 17.5px;
    border-left: 5px solid #eee;

    p:last-child,
    ol:last-child,
    ul:last-child,
    ol ol,
    ol ul,
    ul ol,
    ul ul {
      margin-bottom: 0;
    }
  }

  pre,
  code {
    font-family: 'Menlo', 'Monaco', 'Consolas', 'Courier New', monospace;
  }

  code {
    display: inline-block;
    margin: 0 1px;
    padding: 3px 6px;
    border-radius: 3px;
    background-color: #f5f7f9;
    font-size: 85%;
    color: inherit;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
  }

  pre {
    overflow: auto;
    padding: 11px 16px;
    margin: 0 0 24px;
    border: none;
    border-radius: 4px;
    background-color: #f5f7f9;
    font-size: 13px;
    word-break: break-all;
    word-wrap: break-word;

    code {
      margin: 0;
      padding: 0;
      border-radius: 0;
      background: none;
      font-size: inherit;
      white-space: pre;
    }

    code.hljs.bash:before {
      margin-right: 8px;
      pointer-events: none;
      content: '$';
    }
  }

  table {
    thead {
      color: #9daab6;

      th {
        border-color: #e6ecf1;
        font-weight: normal;
      }
    }

    tbody > tr > td,
    tbody > tr > th,
    tfoot > tr > td,
    tfoot > tr > th,
    thead > tr > td,
    thead > tr > th {
      padding: 8px;
      vertical-align: middle;
    }
  }

  mark {
    background-color: #fcf8e3;
    color: #000;
  }
}