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

<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="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

<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

<a href="#"><span class="Icon">@</span> LABEL</a>
<a class="different-icon-color" href="#"><span class="Icon">@</span> LABEL</a>

Undistraction

<div class='box box-1'> 
</div>

<div class='box box-2'> 
</div>

<div class='box box-3'> 
</div>

Undistraction

<div class="Primary">
  
</div>
<div class="Secondary">
  
</div>

Undistraction

<img srcset="/assets/paperclip/full/video.png 610w,/assets/paperclip/full/video.png 300w">

Undistraction

<img srcset="/assets/paperclip/full/video.png 610w,/assets/paperclip/full/video.png 300w">

Undistraction

<div class="Flexbox">
  <div class="Flexbox-box"></div>
  <div class="Flexbox-box"></div>
  <div class="Flexbox-box"></div>
  <div class="Flexbox-box"></div>
  <div class="Flexbox-box"></div>
  <div class="Flexbox-box"></div>
</div>