$body-font: serif !default;
$copy-font: serif !default;
$heading-font: sans-serif !default;
$body-font-size: 16px !default;
$copy-font-size: 1rem !default;
$heading-1-font-size: 2rem !default;
$heading-2-font-size: 1.5rem !default;
$heading-3-font-size: 1.17rem !default;
$heading-4-font-size: 1.12rem !default;
$heading-5-font-size: .83rem !default;
$heading-6-font-size: .75rem !default;
$heading-margin: 0 0 .5rem 0 !default;
$copy-margin: 0 0 .5rem 0 !default;
$copy-line-height: 1.2 !default;
$heading-line-height: 1.2 !default;
$copy-font-weight: normal !default;
$heading-font-weight: bold !default;
$btn-font: $copy-font !default;

html {
  font-family: $body-font;
  font-size: $body-font-size;
  color: $heading-color;
}

.copy {
  font-family: $copy-font;
  color: $copy-color;
  margin: $copy-margin;
  font-size: $copy-font-size;
  line-height: $copy-line-height;
  font-weight: $copy-font-weight;
}

.heading,
.heading-1,
.heading-2,
.heading-3,
.heading-4,
.heading-5,
.heading-6, {
  font-family: $heading-font;
  margin: $heading-margin;
  line-height: $heading-line-height;
  font-weight: $heading-font-weight;
}

.heading-1 { font-size: $heading-1-font-size; }
.heading-2 { font-size: $heading-2-font-size; }
.heading-3 { font-size: $heading-3-font-size; }
.heading-4 { font-size: $heading-4-font-size; }
.heading-5 { font-size: $heading-5-font-size; }
.heading-6 { font-size: $heading-6-font-size; }

@for $i from 1 through 400 {
  .fz-#{$i} { font-size: #{$i}px !important; }

  @media (min-width: $medium) {
    .md-fz-#{$i} { font-size: #{$i}px !important; }
  }

  @media (min-width: $large) {
    .lg-fz-#{$i} { font-size: #{$i}px !important; }
  }

  @media (min-width: $xlarge) {
    .xlg-fz-#{$i} { font-size: #{$i}px !important; }
  }

  @media (min-width: $xxlarge) {
    .xxlg-fz-#{$i} { font-size: #{$i}px !important; }
  }
}

.fw-100 { font-weight: 100 !important; }
.fw-200 { font-weight: 200 !important; }
.fw-300 { font-weight: 300 !important; }
.fw-400 { font-weight: 400 !important; }
.fw-500 { font-weight: 500 !important; }
.fw-600 { font-weight: 600 !important; }
.fw-700 { font-weight: 700 !important; }
.fw-800 { font-weight: 800 !important; }
.fw-900 { font-weight: 900 !important; }

.lh-1 { line-height: 1 !important; }
.lh-normal { line-height: 1.2 !important; }
.lh-2 { line-height: 2 !important; }
.lh-lg { line-height: 2.5 !important; }
.lh-xl { line-height: 3.5 !important; }

/* TEXT HELPERS */
.bold { font-weight: bold !important; }
.italic { font-style: italic !important; }
.uppercase { text-transform: uppercase !important; }
.lowercase { text-transform: lowercase !important; }
.capitalize { text-transform: capitalize !important; }
.nowrap { white-space: nowrap !important; }
.underline { text-decoration: underline !important; }
.line-through { text-decoration: line-through !important; }

.text-center { text-align: center !important; }
.text-right { text-align: right !important; }
.text-left { text-align: left !important; }
.text-justify { text-align: justify !important; }

@media (min-width: $medium) {
  .md-text-center { text-align: center !important; }
  .md-text-right { text-align: right !important; }
  .md-text-left { text-align: left !important; }
  .md-text-justify { text-align: justify !important; }
}

@media (min-width: $large) {
  .lg-text-center { text-align: center !important; }
  .lg-text-right { text-align: right !important; }
  .lg-text-left { text-align: left !important; }
  .lg-text-justify { text-align: justify !important; }
}

@media (min-width: $xlarge) {
  .xlg-text-center { text-align: center !important; }
  .xlg-text-right { text-align: right !important; }
  .xlg-text-left { text-align: left !important; }
  .xlg-text-justify { text-align: justify !important; }
}

@media (min-width: $xxlarge) {
  .xxlg-text-center { text-align: center !important; }
  .xxlg-text-right { text-align: right !important; }
  .xxlg-text-left { text-align: left !important; }
  .xxlg-text-justify { text-align: justify !important; }
}