Generated by SassMeister.com.

SassMeister-input-HTML.html

<h1>Lorem Ipsom</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>
<h2>Lorem Ipsom</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>
<h3>Lorem Ipsom</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>
<h4>Lorem Ipsom</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>
<h5>Lorem Ipsom</h5>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>
<h6>Lorem Ipsom</h6>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>

SassMeister-input.scss

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

@import 'modular-scale';
@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic|Noto+Sans:400,400italic,700,700italic);

$base-size: 14px;
$ratio: $golden;
h1,h2,h3,h4,h5,h6 { 
  font-family: 'Noto Sans', Helvetica, sans-serif;
  margin: 0;
}
h1 {
  font-size: ms(2.25);
  line-height: ms(0) * 1.4;
}
h2 {
  font-size: ms(1.75);
  line-height: ms(0) * 1.4;
}
h3 {
  font-size: ms(1.2);
  line-height: ms(0) * 1.4;
}
h4 {
  font-size: ms(0.75);
  line-height: ms(0.5) * 1.4;
}
h5 {
  font-size: ms(0.5);
  line-height: ms(0.5) * 1.4;
}
h6 {
  font-size: ms(0);
  line-height: ms(0.5) * 1.4;
}

p {
  font-size: ms(0);
  line-height: ms(0) * 1.4;
  font-family: "Roboto", sans-serif;
}

div { position: relative; }
a {
  height: 100px;
  width: 100px;
  background-color: red;
  display: block;
  position: relative;
  left: 0;
  top: 0;
  
  &:hover {
    left: 5px;
    top: 5px;

    transition-timing-function: cubic-bezier(0.25, 0.25, 0.4, 1);
    transition: all 0.5s cubic-bezier(.25,.25,.4,1); 
    background-color: blue;
  }
}

SassMeister-output.css

@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic|Noto+Sans:400,400italic,700,700italic);
h1, h2, h3, h4, h5, h6 { font-family: 'Noto Sans', Helvetica, sans-serif; margin: 0; }

h1 { font-size: 2.95272em; line-height: 1.4em; }

h2 { font-size: 2.32128em; line-height: 1.4em; }

h3 { font-size: 1.7815em; line-height: 1.4em; }

h4 { font-size: 1.43463em; line-height: 1.78083em; }

h5 { font-size: 1.27202em; line-height: 1.78083em; }

h6 { font-size: 1em; line-height: 1.78083em; }

p { font-size: 1em; line-height: 1.4em; font-family: "Roboto", sans-serif; }

div { position: relative; }

a { height: 100px; width: 100px; background-color: red; display: block; position: relative; left: 0; top: 0; }
a:hover { left: 5px; top: 5px; transition-timing-function: cubic-bezier(0.25, 0.25, 0.4, 1); transition: all 0.5s cubic-bezier(0.25, 0.25, 0.4, 1); background-color: blue; }

SassMeister-rendered.html

<h1>Lorem Ipsom</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>
<h2>Lorem Ipsom</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>
<h3>Lorem Ipsom</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>
<h4>Lorem Ipsom</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>
<h5>Lorem Ipsom</h5>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>
<h6>Lorem Ipsom</h6>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tortor lorem, molestie ac magna laoreet, lobortis pellentesque tortor. Vivamus non mollis ipsum, sit amet blandit odio. Sed eleifend turpis erat, nec tempus sapien convallis id. Etiam dignissim sit amet quam nec rutrum. Nam in sagittis ex. Praesent gravida in leo non volutpat. Integer lacinia ac magna ut mollis. Proin at neque at augue tempus iaculis. Nam at est dolor. Cras ipsum leo, venenatis non auctor vitae, faucibus ac nisl. Donec dictum, ex sit amet tempor condimentum, lorem nisi condimentum tortor, at luctus augue nisl ut est. Praesent vel maximus mauris. Praesent ac fringilla tellus. Vestibulum lorem purus, maximus convallis sem eu, accumsan pharetra lacus. In elementum ante ligula, id molestie nisi lacinia sed. Fusce tempor dictum ipsum sit amet posuere.</p>