Generated by SassMeister.com.

SassMeister-input.sass

// ----
// Sass (v3.4.14)
// Compass (v1.0.3)
// Bourbon (v4.2.3)
// Modular Scale (v2.1.1)
// ----

@import "modular-scale"
@import bourbon/bourbon

$em-base: 16
$display-threshold: 800px

=small-screens
  @media screen and (max-width: $display-threshold * 0.6)
    @content

=medium-screens
  @media screen and (min-width: $display-threshold * 0.6 + 1) and (max-width: $display-threshold)
    @content

=large-screens
  @media screen and (min-width: $display-threshold + 1)
    @content

=all-screens
  +small-screens
    $em-base: $em-base*0.25 !global
    @content

  +medium-screens
    $em-base: $em-base*0.5 !global
    @content

  +large-screens
    $em-base: 16 !global
    @content

+all-screens
  h1
    font-size: modular-scale(6, $em-base, $major-third)
  h2
    font-size: modular-scale(5, $em-base, $major-third)
  h3
    font-size: modular-scale(4, $em-base, $major-third)
  h4
    font-size: modular-scale(3, $em-base, $major-third)
  h5
    font-size: modular-scale(2, $em-base, $major-third)
  h6
    font-size: modular-scale(1, $em-base, $major-third)
    font-style: italic

SassMeister-output.css

@media screen and (max-width: 480px) {
  h1 {
    font-size: 14.64844;
  }

  h2 {
    font-size: 12.20703;
  }

  h3 {
    font-size: 9.76563;
  }

  h4 {
    font-size: 7.32422;
  }

  h5 {
    font-size: 4.88281;
  }

  h6 {
    font-size: 2.44141;
    font-style: italic;
  }
}
@media screen and (min-width: 481px) and (max-width: 800px) {
  h1 {
    font-size: 9.375;
  }

  h2 {
    font-size: 7.8125;
  }

  h3 {
    font-size: 6.25;
  }

  h4 {
    font-size: 4.6875;
  }

  h5 {
    font-size: 3.125;
  }

  h6 {
    font-size: 1.5625;
    font-style: italic;
  }
}
@media screen and (min-width: 801px) {
  h1 {
    font-size: 213.16282;
  }

  h2 {
    font-size: 177.63568;
  }

  h3 {
    font-size: 142.10855;
  }

  h4 {
    font-size: 106.58141;
  }

  h5 {
    font-size: 71.05427;
  }

  h6 {
    font-size: 35.52714;
    font-style: italic;
  }
}