Undistraction

<div class="Title">
  <h2>THIS SHOULD BE CENTERED<ul class="Icons><li></li></ul><span class="Icons-icon">X</span></span></li></ul></h2>
</div>

Undistraction

<div class="block">
  <div class="block-element-1"></div>
  <div class="block-element-2"></div>
</div>

<div class="block--special">
  <div class="block-element-1"></div>
  <div class="block-element-2"></div>
</div>

Undistraction

<ul>
  <li>ONE</li>
  <li>TWO</li>
  <li>THREE</li>
  <li>FOUR</li>
  <li>FIVE</li>
  <li>SIX</li>
</ul>
<div></div>

Undistraction

<div class="NewModal">
  <div class="NewModal-arrow NewModal-arrow--left"></div>
  <p>This is some text about some stuff and other stuff</p>
</div>

<div class="NewModal">
  <div class="NewModal-arrow NewModal-arrow--right"></div>
  <p>This is some text about some stuff and other stuff</p>
</div>

Undistraction

(function(e, t) {
    var n = {
        "cssurl": "http://f.fontdeck.com/s/css/nqzf9dyjxdWCfc1VihiAGc6V9dY/intercitystudio.dev/49493.css",
        "domain": "intercitystudio.dev",
        "project": "49493",
        "cssbase": "http://f.fontdeck.com/s/css/nqzf9dyjxdWCfc1VihiAGc6V9dY",
        "fonts": [{
            "font_family": "'Maison Neue Medium', Calibri, Arial, Roboto, sans-serif",
            "font_urls": {
                "woff": "http://f.fontdeck.com/f/1/VWo4SDM2bkoAA9g7Alhx+U/ifCeFhDJu9B3Pq+RQg1g7dsmVeosxbEd7CgQClWE+AiwtDYDwtTGSvbx0bjuKAJA5w65ZOvKWaZnZSQBRNOS6LNYXtJaRosKqzO5ZCrnMgjk.woff"

Undistraction

<script type="text/javascript">

  // This is a hack to rewrite font-names so that different weights / styles of the same face have
  // the same font-name.

  (function () {
    'use strict';

    var faceFrom = 'Maison Neue Medium';
    var faceTo = 'Maison Neue';

Undistraction

<div class="wrap">
  <header class="Page-header">
    <h4>Title</h4>
  </header>
</div>
<div class="Page-body">
  <section class="first"></section>
  <section class="second"></section>
  <section class="third"></section>
</div>

Undistraction

<div class="Page">
  <section class="first"></section>
  <section class="second"></section>
  <section class="third"></section>
</div>

Undistraction

// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// Sassy Maps (v0.4.0)
// ----

@import "sassy-maps";

$palette-map: (
  blue: #003DFF,

Undistraction

<div class="Wrapper">
  <div class="VideoContainer Vimeo Sixteen-Nine">
    <iframe src="http://player.vimeo.com/video/109777141?byline=0&amp;portrait=0&amp;badge=0&amp;color=090909" class="js-only" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>
  </div>
</div>