anchor.diff: -<div class="l-styleguide">
  +<aside class="docs-sidebar">
  +  <div class="docs-sidebar-helpful">
  +    <a href="/" class="logo">Helpful</a>
  +  </div>
  +  <nav class="docs-subnav docs-sidebar-subnav">
  +    <h2>Style guide</h2>
  +    <h3>Brand</h3>
  +    <ul class="docs-subnav-list">
  +      <li class="docs-subnav-list-item"><a href="#styleguide-brand">Brand</a></li>
  +      <li class="docs-subnav-list-item"><a href="#styleguide-typography">Typography</a></li>
  +      <li class="docs-subnav-list-item"><a href="#styleguide-colors">Colors</a></li>
  +    </ul>
  +    <h3>Elements</h3>
  +    <ul class="docs-subnav-list">
  +      <li class="docs-subnav-list-item"><a href="#styleguide-buttons">Buttons</a></li>
  +      <li class="docs-subnav-list-item"><a href="#styleguide-forms">Forms</a></li>
  +      <li class="docs-subnav-list-item"><a href="#styleguide-alerts">Alerts</a></li>
  +      <li class="docs-subnav-list-item"><a href="#styleguide-panels">Panels</a></li>
  +    </ul>
  +  </nav>
  +</aside>
  +
  +<div class="docs-content l-styleguide">
   
     <h1>A Helpful Styleguide</h1>
   
   
  -  <h2>Brand</h2>
  +  <h2 id="styleguide-brand">Brand</h2>
     <a href="https://github.com/asm-helpful/helpful-web/blob/master/app/assets/stylesheets/base/brand.css.scss">app/assets/stylesheets/base/brand.css.scss</a>
   
     <div class="example">
  
positive.code:   </div>
  
  
    <h2>Forms</h2>
    <a href="https://github.com/asm-helpful/helpful-web/blob/master/app/assets/stylesheets/modules/form.css.scss">app/assets/stylesheets/modules/form.css.scss</a>
  
  
  
negative.code:   </div>
  
  
    <h2 id="styleguide-alerts">Alerts</h2>
    <a href="https://github.com/asm-helpful/helpful-web/blob/master/app/assets/stylesheets/modules/alert.css.scss">app/assets/stylesheets/modules/alert.css.scss</a>
    <p>Alerts are used for system messages to the user.</p>
  
  