<!-- Classes that begin with '.s-' are for UI Library display purposes only. -->
<div class="c-container--mobile s-container--mobile">
  <div class="c-header--mobile">
  <div class="c-navbar--mobile js-navbar-pro">
  <a href="#" class="c-navbar__item js-navbar-item active">
    <div class="flexicon flexicon-search--large"></div>
  </a>

  <a href="#" class="c-navbar__item js-navbar-item">
    <div class="flexicon flexicon-flame--large"></div>
  </a>

  <a href="#" class="c-navbar__item js-navbar-item">
    <div class="flexicon flexicon-avatar--large"></div>
  </a>

  <a href="#" class="c-navbar__item js-navbar-item">
    <div class="flexicon flexicon-file--large"></div>
  </a>

  <a href="#" class="c-navbar__item c-badge-holder--icon js-navbar-item">
    <div class="flexicon flexicon-bars--large"></div>
    <div class="badge"> 10 </div>
  </a>

  <a href="#" class="c-navbar__item js-navbar-item">
    <div class="c-avatar c-avatar--small">ab</div>
  </a>
</div>

<script>
$(function () {
  $('.js-navbar-pro').on('click', '.js-navbar-item', function () {
    $('.js-navbar-pro .js-navbar-item').removeClass('active');
    $(this).addClass('active');
    return false;
  });
});
</script>

</div>

  <div class="c-content--mobile">
    <div class="c-card">
      <div class="c-contact-entry">
        <label> Email </label>
        <a href="mailto:someone@somewhere.us" class="u-link--plain">
          <div> someone@somewhere.us </div>
        </a>
      </div>
      <div class="c-contact-entry">
        <label> Mobile </label>
        <a href="tel:4065551212" class="u-link--plain">
          <div> 406.555.1212 </div>
        </a>
      </div>
      <div class="c-contact-entry">
        <label> Address </label>
        <div> 123 Somewhere Street </div>
        <div> Sometown, MS  99999 </div>
      </div>
    </div>
  </div>
</div>