<div class="example">
  <div class="sheet-header">
    <h3 id="iconography">Iconography</h3>
  </div>
  <div class="bs-example bs-sheet bs-example-icons" data-example-id="iconography">
    <ul class="list-unstyled">
      <li><i class="icon-translations"></i> translations</li>
      <li><i class="icon-external"></i> external</li>
      <li><i class="icon-invoice"></i> invoice</li>
      <li><i class="icon-rental"></i> rental</li>
      <li><i class="icon-photo"></i> photo</li>
      <li><i class="icon-video"></i> video</li>
      <li><i class="icon-categories"></i> categories</li>
      <li><i class="icon-description"></i> description</li>
      <li><i class="icon-contract"></i> contract</li>
      <li><i class="icon-reservation"></i> reservation</li>
      <li><i class="icon-rates"></i> rates</li>
      <li><i class="icon-payments"></i> payments</li>
      <li><i class="icon-help"></i> help</li>
      <li><i class="icon-map"></i> map</li>
      <li><i class="icon-navigation"></i> navigation</li>
      <li><i class="icon-calendar"></i> calendar</li>
      <li><i class="icon-inbox"></i> inbox</li>
      <li><i class="icon-clients"></i> clients</li>
      <li><i class="icon-owner"></i> owner</li>
      <li><i class="icon-search"></i> search</li>
      <li><i class="icon-checkin"></i> checkin</li>
      <li><i class="icon-settings"></i> settings</li>
      <li><i class="icon-maintenance"></i> maintenance</li>
      <li><i class="icon-reports"></i> reports</li>
      <li><i class="icon-cleaning"></i> cleaning</li>
      <li><i class="icon-notifications"></i> notifications</li>
      <li><i class="icon-instant"></i> instant</li>
      <li><i class="icon-amenities"></i> amenities</li>
      <li><i class="icon-applications"></i> applications</li>
      <li><i class="icon-website"></i> website</li>
      <li><i class="icon-reviews"></i> reviews</li>
      <li><i class="icon-template"></i> template</li>
      <li><i class="icon-widget"></i> widget</li>
    </ul>
  </div>
</div>
~~~ html
<ul class="list-unstyled">
  <li><i class="icon-invoice"></i> invoice</li>
  <li><i class="icon-rental"></i> rental</li>
  <li><i class="icon-photo"></i> photo</li>
  <li><i class="icon-video"></i> video</li>
  <li><i class="icon-description"></i> description</li>
  <li><i class="icon-contract"></i> contract</li>
  <li><i class="icon-reservation"></i> reservation</li>
  <li><i class="icon-rates"></i> rates</li>
  <li><i class="icon-payments"></i> payments</li>
  <li><i class="icon-help"></i> help</li>
  <li><i class="icon-map"></i> map</li>
  <li><i class="icon-calendar"></i> calendar</li>
  <li><i class="icon-inbox"></i> inbox</li>
  <li><i class="icon-clients"></i> clients</li>
  <li><i class="icon-owner"></i> owner</li>
  <li><i class="icon-search"></i> search</li>
  <li><i class="icon-checkin"></i> check-in</li>
  <li><i class="icon-settings"></i> settings</li>
  <li><i class="icon-maintenance"></i> maintenance</li>
  <li><i class="icon-reports"></i> reports</li>
  <li><i class="icon-cleaning"></i> cleaning</li>
  <li><i class="icon-notifications"></i> notifications</li>
  <li><i class="icon-instant"></i> instant</li>
  <li><i class="icon-applications"></i> applications</li>
  <li><i class="icon-website"></i> website</li>
  <li><i class="icon-reviews"></i> reviews</li>
  <li><i class="icon-widget"></i> widget</li>
</ul>
~~~

<div class="example">
  <div class="sheet-header">
    <h3 id="icons-fixed-width-example">Fixed width icons</h3>
  </div>
  <div class="bs-example bs-sheet" data-example-id="icons-fixed-width-example">
    <ul class="list-unstyled">
      <li><i class="icon-rental icon-fw"></i> &nbsp; rental</li>
      <li><i class="icon-clients icon-fw"></i> &nbsp; photo</li>
      <li><i class="icon-applications icon-fw"></i> &nbsp; applications</li>
    </ul>
  </div>
</div>
~~~ html
<ul class="list-unstyled">
  <li><i class="icon-rental icon-fw"></i> &nbsp; rental</li>
  <li><i class="icon-clients icon-fw"></i> &nbsp; photo</li>
  <li><i class="icon-applications icon-fw"></i> &nbsp; applications</li>
</ul>
~~~
