// http://type-scale.com/
html
  font-size: $font-size
@media screen and (min-width: $viewport-m) and (max-width: $viewport-l)
  html
    font-size: $font-size-m
@media screen and (min-width: $viewport-l)
  html
    font-size: $font-size-l
body
  font-family: $font-family
  font-weight: $font-weight
  line-height: 1.85
  color: $font-color
p,
.p
  font-size: 1rem
  margin-bottom: 1.3rem
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4
  margin: 1.414rem 0 0.5rem
  font-weight: inherit
  line-height: 1.42
h1,
.h1
  margin-top: 0
  font-size: 3.998rem
h2,
.h2
  font-size: 2.827rem
h3,
.h3
  font-size: 1.999rem
h4,
.h4
  font-size: 1.414rem
h5,
.h5
  font-size: 1.121rem
h6,
.h6
  font-size: .88rem
small,
.small
  font-size: 0.707em
pre,
code
  font-family: $monospace-font-family
.italic
  font-style: italic
.thin
  font-weight: 100
.bold
  font-weight: bold
.caps
  font-variant: small-caps
.justify
  text-align: justify
.ellipsis
  text-overflow: ellipsis
  white-space: nowrap
  overflow: hidden