Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// ----


/**
 * =============================================================================
 * Typography
 * =============================================================================
 * Sass Version: 
 * Type scale: http://modularscale.com/scale/?px1=16&px2=24&ra1=1.333&ra2=0
 */

$base-text-color: #333;
$base-font-size: 16px;
$base-font-family: Helvetica, Arial, sans-serif;
$base-line-height: 1.5em;
$base-background: #fff;
$base-spacing: 16px;
$base-spacing-large: $base-spacing*2;
$base-spacing-small: $base-spacing/2;

$link-color: #c09;
$link-color-hover: darken($link-color, 25%);

$heading-color: $base-text-color;
$heading-font-weight: 400;
$heading-font-family: $base-font-family;

html {
    color: $base-text-color;
    font-size: $base-font-size;
    font-family: $base-font-family;
    line-height: $base-line-height;
}

body {
    background: $base-background;
}

p {
    margin: 0 0 $base-font-size;
}





/**
 * Headings
 * =============================================================================
 */

h1, h2, h3, h4, h5, h6 {
    margin: 0 0 1em;
    color: $heading-color;
    font-weight: $heading-font-weight;
    font-family: $heading-font-family;
    text-rendering: optimizelegibility;
}

h1 {
    font-size: rem(31.992);
}

h2 {
    font-size: rem(28.430);
}

h3 {
    font-size: rem(24.000);
}

h4 {
    font-size: rem(21.328);
}

h5 {
    font-size: rem(18.005);
}

h6 {
    font-size: rem(16);
}





/**
 * Definition List
 * =============================================================================
 */

dl {

    dt {
        margin-top: 1em;
    }

    dd {
        margin-left: $base-spacing-large;
    }

}





/**
 * Horizontal rule
 * =============================================================================
 */
 
hr {
    border: 0;
    clear: both;
    display: block;
    font-size: 2em;
    height: 0;
    margin: 0 0 1.5em 0;
    padding: 0;
    text-align: center;

    &::after {
        color: #bbb;
        content: "···";
        height: 0;
        letter-spacing: 1em;
        padding-left: 1em;
    }

}





/**
 * Links
 * =============================================================================
 */

a {
    border-bottom: 1px solid #eee;
    color: $link-color;
    text-decoration: none;

    &:focus,
    &:hover {
        border-bottom: 1px solid #ccc;
        color: $link-color-hover;
    }
    
}

SassMeister-output.css

@charset "UTF-8";
/**
 * =============================================================================
 * Typography
 * =============================================================================
 * Sass Version: 
 * Type scale: http://modularscale.com/scale/?px1=16&px2=24&ra1=1.333&ra2=0
 */
html {
  color: #333;
  font-size: 16px;
  font-family: Helvetica, Arial, sans-serif;
  line-height: 1.5em;
}

body {
  background: #fff;
}

p {
  margin: 0 0 16px;
}

/**
 * Headings
 * =============================================================================
 */
h1, h2, h3, h4, h5, h6 {
  margin: 0 0 1em;
  color: #333;
  font-weight: 400;
  font-family: Helvetica, Arial, sans-serif;
  text-rendering: optimizelegibility;
}

h1 {
  font-size: rem(31.992);
}

h2 {
  font-size: rem(28.43);
}

h3 {
  font-size: rem(24);
}

h4 {
  font-size: rem(21.328);
}

h5 {
  font-size: rem(18.005);
}

h6 {
  font-size: rem(16);
}

/**
 * Definition List
 * =============================================================================
 */
dl dt {
  margin-top: 1em;
}
dl dd {
  margin-left: 32px;
}

/**
 * Horizontal rule
 * =============================================================================
 */
hr {
  border: 0;
  clear: both;
  display: block;
  font-size: 2em;
  height: 0;
  margin: 0 0 1.5em 0;
  padding: 0;
  text-align: center;
}
hr::after {
  color: #bbb;
  content: "···";
  height: 0;
  letter-spacing: 1em;
  padding-left: 1em;
}

/**
 * Links
 * =============================================================================
 */
a {
  border-bottom: 1px solid #eee;
  color: #c09;
  text-decoration: none;
}
a:focus, a:hover {
  border-bottom: 1px solid #ccc;
  color: #4d0039;
}