
body {
  font-family: $bodyFontFamily;
  line-height: $lineHeight;
  letter-spacing: 0.33px;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: $headingFontFamily;
  line-height: $lineHeight;
  display: block;
  margin-bottom: $gutter/4;
  a {
    text-decoration: none;
  }
}
h1, .h1 {
  font-size: 4rem;
  font-weight: $fontBold;
  letter-spacing: 0.5px
}
h2, .h2 {
  font-size: 2.31rem;
  font-weight: $fontLight;
  letter-spacing: 0.5px
}
h3, .h3 {
  font-size: 2rem;
}
h4, .h4 { font-size: 1.45rem; }
h5, .h5 { font-size: 1.4rem; }
h6, .h6 { font-size: 1.3rem; }

p, ul, ol, li {
  font-size: 1.07rem;
  font-weight: $fontRegular;
  line-height: $lineHeight;
  margin-bottom: 1.4rem;
}

a {
  color: $colorText;
  cursor: pointer;
  @include transition();
  &:hover, &:focus {
    color: $colorEight;
  }
}

hr {
  border: 0;
  border-top: $borderWeight $borderStyle $colorText;
  margin: $gutter/1.5 0;
}

strong, b {
  font-weight: $fontBold;
}

small {
  font-size: 0.8rem;
}

i {
  font-style: italic;
}

.rte {
  // TBA
  h2 {
    margin-top: $gutter;
  }
  ul, ol {
    list-style: initial;
    list-style-position: inside;
    margin-bottom: $gutter/2;
    li {
      list-style: inherit;
      list-style-position: inherit;
      margin-bottom: $gutter/10;
    }
  }
  ol {
    list-style-type: decimal;
  }
}
aside.sidebar {
  h3 {
    font-weight: $fontBold;
    color: $colorOne;
  }
  h4 {
    font-weight: $fontBold;
    margin-bottom: 0;
    font-size: 1em;
  }
  li {
    font-weight: $fontBold;
    .active {
      color: $colorEight;
    }
  }
  a {
    text-decoration: none;
    transition: none;
    color: $colorText;
    .active {
      color: $colorText;
    }
  }
  ul {
    margin-bottom: $gutter / 2;
  }
}
.anchor {
  margin-bottom: $gutter;
  max-width: 700px;
}
article.documentation {
  h2, h3 {
    font-weight: $fontBold;
    color: $colorOne;
  }
  h2 {
    font-size: 1.8rem;
    margin-bottom: $gutter / 2;
  }
  h3 {
    font-size: 1.5rem;
  }
  ol, ul {
    margin: 0 0 $gutter/2 $gutter/2.5;
    list-style: initial;
  }
  > h1,> h2,> h3,> h4,> h5,> h6,> ul,> ol,> p {
    max-width: 700px;
  }

}
