<div class="side-bar">
  <nav class="side-nav">
    <a class="side-nav__navlink back" href="#">Back</a>
    <a class="side-nav__navlink" href="#">Sub Navigation Item One</a>
    <a class="side-nav__navlink" href="#">Sub Navigation Item Two here is a really long one test can we wax poetic and get to three, count 'em three lines<i class="ss-icon ss-standard"><span class="test">directright</span></i></a>
    <a class="side-nav__navlink" href="#">Sub Navigation Item Three</a>
    <a class="side-nav__navlink" href="#">Sub Navigation Item Four<i class="ss-icon ss-standard"><span class="test">directright</span></i></a>
    <a class="side-nav__navlink" href="#">Sub Navigation Item Four<i class="ss-icon ss-standard"><span class="test">directright</span></i></a>
  </nav>

  <div class="related-links">
    <header>
      <h6>See Also:</h6>
    </header>
    <nav>
      <a class="related-nav__navlink" href="#">Related Link Item One</a>
      <a class="related-nav__navlink" href="#">Related Link Item Two here's one that's a little longer than the others</a>
      <a class="related-nav__navlink" href="#">Related Link Item Three</a>
      <a class="related-nav__navlink" href="#">Related Link Item Four</a>
      <a class="related-nav__navlink" href="#">Related Link Item Five</a>
    </nav>
  </div>
</div>