<!-- eslint-disable max-len -->
<template>
  <section>
    <h1 class="page-title">UI - <span class="fw-semi-bold">Icons</span></h1>
    <b-tabs>
      <b-tab title="Glyphicons" active>
        <h4>Built-in <span class="fw-semi-bold">Glyphicons</span></h4>
        <b-row class="icon-list">
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-asterisk"/>asterisk
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-plus"/>plus</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-euro"/>euro</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-minus"/>minus</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-cloud"/>cloud</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-envelope"/>envelope
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-pencil"
          />pencil
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-glass"/>glass</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-music"/>music</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-search"
          />search
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-heart"/>heart</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-star"/>star</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-star-empty"/>star-empty
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-user"/>user</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-film"/>film</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-th-large"/>th-large
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-th"/>th</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-th-list"
          />th-list
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-ok"/>ok</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-remove"
          />remove
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-zoom-in"
          />zoom-in
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-zoom-out"/>zoom-out
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-off"/>off</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-signal"
          />signal
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-cog"/>cog</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-trash"/>trash</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-home"/>home</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-file"/>file</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-time"/>time</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-road"/>road</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-download-alt"/>download-alt
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-download"/>download
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-upload"
          />upload
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-inbox"/>inbox</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-play-circle"/>play-circle
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-repeat"
          />repeat
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-refresh"
          />refresh
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-list-alt"/>list-alt
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-glyph-lock"
          />lock
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-flag"/>flag</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-headphones"/>headphones
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-volume-off"/>volume-off
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-volume-down"/>volume-down
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-volume-up"/>volume-up
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-qrcode"
          />qrcode
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-barcode"
          />barcode
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-tag"/>tag</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-tags"/>tags</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-book"/>book</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-glyph-bookmark"/>bookmark
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-print"/>print</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-glyph-camera"/>camera
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-font"/>font</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-bold"/>bold</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-italic"
          />italic
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-text-height"/>text-height
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-text-width"/>text-width
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-align-left"/>align-left
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-align-center"/>align-center
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-align-right"/>align-right
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-align-justify"/>align-justify
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-list"/>list</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-indent-left"/>indent-left
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-indent-right"/>indent-right
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-facetime-video"/>facetime-video
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-picture"
          />picture
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-map-marker"/>map-marker
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-adjust"
          />adjust
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-tint"/>tint</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-edit"/>edit</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-share"/>share</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-check"/>check</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-move"/>move</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-step-backward"/>step-backward
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-fast-backward"/>fast-backward
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-backward"/>backward
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-play"/>play</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-pause"/>pause</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-stop"/>stop</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-forward"
          />forward
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-fast-forward"/>fast-forward
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-step-forward"/>step-forward
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-eject"/>eject</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-chevron-left"/>chevron-left
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-chevron-right"/>chevron-right
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-plus-sign"/>plus-sign
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-minus-sign"/>minus-sign
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-remove-sign"/>remove-sign
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-ok-sign"
          />ok-sign
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-question-sign"/>question-sign
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-info-sign"/>info-sign
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-screenshot"/>screenshot
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-remove-circle"/>remove-circle
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-ok-circle"/>ok-circle
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-ban-circle"/>ban-circle
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-arb-row-left"/>arb-row-left
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-arb-row-right"/>arb-row-right
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-arb-row-up"/>arb-row-up
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-arb-row-down"/>arb-row-down
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-share-alt"/>share-alt
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-resize-full"/>resize-full
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-resize-small"/>resize-small
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-exclamation-sign"/>exclamation-sign
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-gift"/>gift</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-leaf"/>leaf</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-glyph-fire"
          />fire
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-eye-open"/>eye-open
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-eye-close"/>eye-close
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-warning-sign"/>warning-sign
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-plane"/>plane</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-glyph-calendar"/>calendar
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-random"
          />random
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-comment"
          />comment
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-magnet"
          />magnet
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-chevron-up"/>chevron-up
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-chevron-down"/>chevron-down
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-retweet"
          />retweet
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-shopping-cart"/>shopping-cart
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-folder-close"/>folder-close
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-folder-open"/>folder-open
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-resize-vertical"/>resize-vertical
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-resize-horizontal"/>resize-horizontal
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-hdd"/>hdd</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-bullhorn"/>bullhorn
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-glyph-bell"
          />bell
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-certificate"/>certificate
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-thumbs-up"/>thumbs-up
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-thumbs-down"/>thumbs-down
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-hand-right"/>hand-right
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-hand-left"/>hand-left
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-hand-top"
          />hand-up
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-hand-down"/>hand-down
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-circle-arb-row-right"
          />circle-arb-row-right
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-circle-arb-row-left"/>circle-arb-row-left
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-circle-arb-row-top"/>circle-arb-row-up
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-circle-arb-row-down"/>circle-arb-row-down
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-globe"/>globe</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-glyph-wrench"/>wrench
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-tasks"/>tasks</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-filter"
          />filter
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-glyph-briefcase"/>briefcase
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-fullscreen"/>fullscreen
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-dashboard"/>dashboard
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-glyph-paperclip"/>paperclip
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-heart-empty"/>heart-empty
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-link"/>link</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-phone"/>phone</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-glyph-pushpin"/>pushpin
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-usd"/>usd</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-gbp"/>gbp</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-sort"/>sort</b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-sort-by-alphabet"/>sort-by-alphabet
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-sort-by-alphabet-alt"
          />sort-by-alphabet-alt
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-sort-by-order"/>sort-by-order
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-sort-by-order-alt"/>sort-by-order-alt
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-sort-by-attributes"
          />sort-by-attributes
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-sort-by-attributes-alt"
          />sort-by-attributes-alt
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-unchecked"/>unchecked
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              class="glyphicon glyphicon-expand"
          />expand
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-collapse"/>collapse-down
          </b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span class="glyphicon glyphicon-collapse-top"/>collapse-up
          </b-col>
        </b-row>
      </b-tab>
      <b-tab>
        <template slot="title">
          FA 4.7.0
          <b-badge class="bg-danger">new</b-badge>
        </template>
        <h4>Awesome <span class="fw-semi-bold">Font Awesome</span></h4>
        <b-row class="icon-list">
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-bed"
          /> bed</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
          ><i class="fa fa-bank"/> bank <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-behance"
          /> behance</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item">
            <span><i class="fa fa-behance-square"/> behance-square</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-bomb"
          /> bomb</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-building"
          /> building</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-cab"
          /> cab <span class="text-muted">(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-car"
          /> car</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-child"
          /> child</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-circle-o-notch"/> circle-o-notch</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-circle-thin"
          /> circle-thin</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-codepen"
          /> codepen</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-cube"
          /> cube</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-cubes"
          /> cubes</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-database"
          /> database</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-delicious"
          /> delicious</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-deviantart"/> deviantart</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-digg"
          /> digg</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-drupal"
          /> drupal</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-empire"
          /> empire</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-envelope-square"/>
            envelope-square</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-fax"
          /> fax</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-archive-o"/> file-archive-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-audio-o"/>
            file-audio-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-file-code-o"
          /> file-code-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-excel-o"/>
            file-excel-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-image-o"/>
            file-image-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-movie-o"/> file-movie-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-pdf-o"/> file-pdf-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-photo-o"/> file-photo-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-picture-o"/> file-picture-o
            <span class="text-muted">(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-powerpoint-o"/>
            file-powerpoint-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-sound-o"/> file-sound-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-video-o"/>
            file-video-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-file-word-o"
          /> file-word-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-file-zip-o"/> file-zip-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-ge"
          /> ge <span class="text-muted">(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-git"
          /> git</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-git-square"/> git-square</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-google"
          /> google</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-graduation-cap"/> graduation-cap</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-hacker-news"
          /> hacker-news</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-header"
          /> header</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-history"
          /> history</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-institution"/> institution <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-joomla"
          /> joomla</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-jsfiddle"
          /> jsfiddle</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-language"
          /> language</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-life-bouy"
          /> life-bouy <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-life-ring"
          /> life-ring</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-life-saver"
          /> life-saver <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-mortar-board"/> mortar-board
            <span class="text-muted">(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-openid"
          /> openid</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-paper-plane"
          /> paper-plane</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-paper-plane-o"/>
            paper-plane-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-paragraph"
          /> paragraph</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-paw"
          /> paw</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-pied-piper"/> pied-piper</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-pied-piper-alt"/> pied-piper-alt</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-pied-piper-square"/>
            pied-piper-square <span class="text-muted">(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-qq"
          /> qq</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-ra"
          /> ra <span class="text-muted">(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-rebel"
          /> rebel</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-recycle"
          /> recycle</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-reddit"
          /> reddit</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-reddit-square"/>
            reddit-square</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-send"
          /> send <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-send-o"/> send-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-share-alt"
          /> share-alt</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-share-alt-square"/>
            share-alt-square</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-slack"
          /> slack</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-sliders"
          /> sliders</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-soundcloud"/> soundcloud</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-space-shuttle"/>
            space-shuttle</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-spoon"
          /> spoon</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-spotify"
          /> spotify</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-steam"
          /> steam</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-steam-square"/>
            steam-square</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-stumbleupon"
          /> stumbleupon</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-stumbleupon-circle"/>
            stumbleupon-circle</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-support"
          /> support <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-taxi"
          /> taxi</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-tencent-weibo"/>
            tencent-weibo</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-tree"
          /> tree</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-university"/> university</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-vine"
          /> vine</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-wechat"
          /> wechat <span class="text-muted">(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-weixin"
          /> weixin</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-wordpress"
          /> wordpress</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span><i
              class="fa fa-yahoo"
          /> yahoo</span></b-col>
        </b-row>
      </b-tab>
      <b-tab title="Web Application">
        <b-row class="icon-list">
          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-adjust"
          /> adjust</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-anchor"
          /> anchor</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-archive"
          /> archive</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-arrows"
          /> arrows</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-arrows-h"
          /> arrows-h</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-arrows-v"
          /> arrows-v</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-asterisk"
          /> asterisk</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-automobile"
          /> automobile <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-ban"
          /> ban</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-bank"/> bank <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-bar-chart-o"
          /> bar-chart-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-barcode"
          /> barcode</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-bars"
          /> bars</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-beer"
          /> beer</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-bell"
          /> bell</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-bell-o"
          /> bell-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-bolt"
          /> bolt</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-bomb"
          /> bomb</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-book"
          /> book</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-bookmark"
          /> bookmark</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-bookmark-o"/> bookmark-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-briefcase"
          /> briefcase</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-bug"
          /> bug</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-building"
          /> building</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-building-o"/> building-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-bullhorn"
          /> bullhorn</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-bullseye"
          /> bullseye</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-cab"
          /> cab <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-calendar"
          /> calendar</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-calendar-o"/> calendar-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-camera"
          /> camera</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-camera-retro"/>
            camera-retro</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-car"
          /> car</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-caret-square-o-down"/>
            caret-square-o-down</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-caret-square-o-left"/>
            caret-square-o-left</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-caret-square-o-right"/>
            caret-square-o-right</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-caret-square-o-up"/>
            caret-square-o-up</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-certificate"
          /> certificate</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-check"
          /> check</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-check-circle"/>
            check-circle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-check-circle-o"/> check-circle-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-check-square"/>
            check-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-check-square-o"/> check-square-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-child"
          /> child</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-circle"
          /> circle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-circle-o"
          /> circle-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-circle-o-notch"/> circle-o-notch</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-circle-thin"
          /> circle-thin</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-clock-o"
          /> clock-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-cloud"
          /> cloud</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-cloud-download"/> cloud-download</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-cloud-upload"/>
            cloud-upload</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-code"
          /> code</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-code-fork"
          /> code-fork</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-coffee"
          /> coffee</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-cog"
          /> cog</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-cogs"
          /> cogs</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-comment"
          /> comment</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-comment-o"
          /> comment-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-comments"
          /> comments</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-comments-o"/> comments-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-compass"
          /> compass</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-credit-card"
          /> credit-card</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-crop"
          /> crop</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-crosshairs"/> crosshairs</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-cube"
          /> cube</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-cubes"
          /> cubes</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-cutlery"
          /> cutlery</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-dashboard"/> dashboard <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-database"
          /> database</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-desktop"
          /> desktop</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-dot-circle-o"/>
            dot-circle-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-download"
          /> download</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-edit"/> edit <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-ellipsis-h"/> ellipsis-h</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-ellipsis-v"/> ellipsis-v</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-envelope"
          /> envelope</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-envelope-o"/> envelope-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-envelope-square"/>
            envelope-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-eraser"
          /> eraser</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-exchange"
          /> exchange</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-exclamation"
          /> exclamation</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-exclamation-circle"/>
            exclamation-circle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-exclamation-triangle"/>
            exclamation-triangle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-external-link"/>
            external-link</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-external-link-square"/>
            external-link-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-eye"
          /> eye</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-eye-slash"
          /> eye-slash</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-fax"
          /> fax</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-female"
          /> female</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-fighter-jet"
          /> fighter-jet</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-archive-o"/> file-archive-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-audio-o"/>
            file-audio-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-file-code-o"
          /> file-code-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-excel-o"/>
            file-excel-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-image-o"/>
            file-image-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-movie-o"/> file-movie-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-pdf-o"/> file-pdf-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-photo-o"/> file-photo-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-picture-o"/> file-picture-o
            <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-powerpoint-o"/>
            file-powerpoint-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-sound-o"/> file-sound-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-video-o"/>
            file-video-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-file-word-o"
          /> file-word-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-zip-o"/> file-zip-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-film"
          /> film</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-filter"
          /> filter</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-fire"
          /> fire</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-fire-extinguisher"/>
            fire-extinguisher</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-flag"
          /> flag</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-flag-checkered"/> flag-checkered</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-flag-o"
          /> flag-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span><i
              class="fa fa-flash"
          /> flash <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-flask"
          /> flask</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-folder"
          /> folder</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-folder-o"
          /> folder-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-folder-open"
          /> folder-open</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-folder-open-o"/>
            folder-open-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-frown-o"
          /> frown-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-gamepad"
          /> gamepad</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-gavel"
          /> gavel</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-gear"
          /> gear <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-gears"
          /> gears <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-gift"
          /> gift</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-glass"
          /> glass</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-globe"
          /> globe</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-graduation-cap"/> graduation-cap</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-group"
          /> group <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-hdd-o"
          /> hdd-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-headphones"/> headphones</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-heart"
          /> heart</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-heart-o"
          /> heart-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-history"
          /> history</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-home"
          /> home</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-image"
          /> image <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-inbox"
          /> inbox</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-info"
          /> info</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-info-circle"
          /> info-circle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-institution"/> institution <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-key"
          /> key</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-keyboard-o"/> keyboard-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-language"
          /> language</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-laptop"
          /> laptop</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-leaf"
          /> leaf</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-legal"
          /> legal <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-lemon-o"
          /> lemon-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-level-down"/> level-down</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-level-up"
          /> level-up</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-life-bouy"
          /> life-bouy <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-life-ring"
          /> life-ring</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-life-saver"
          /> life-saver <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-lightbulb-o"
          /> lightbulb-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-location-arrow"/> location-arrow</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-lock"
          /> lock</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-magic"
          /> magic</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-magnet"
          /> magnet</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-mail-forward"
          /> mail-forward <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-mail-reply"
          /> mail-reply <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-mail-reply-all"
          /> mail-reply-all <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-male"
          /> male</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-map-marker"/> map-marker</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-meh-o"
          /> meh-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-microphone"/> microphone</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-microphone-slash"/>
            microphone-slash</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-minus"
          /> minus</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-minus-circle"/>
            minus-circle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-minus-square"/>
            minus-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-minus-square-o"/> minus-square-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-mobile"
          /> mobile</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-mobile-phone"
          /> mobile-phone <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-money"
          /> money</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-moon-o"
          /> moon-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-mortar-board"/> mortar-board
            <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-music"
          /> music</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-navicon"
          /> navicon <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-paper-plane"
          /> paper-plane</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-paper-plane-o"/>
            paper-plane-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-paw"
          /> paw</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-pencil"
          /> pencil</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-pencil-square"/>
            pencil-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-pencil-square-o"/>
            pencil-square-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-phone"
          /> phone</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-phone-square"/>
            phone-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-photo"
          /> photo <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-picture-o"
          /> picture-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-plane"
          /> plane</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-plus"
          /> plus</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-plus-circle"
          /> plus-circle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-plus-square"
          /> plus-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-plus-square-o"/>
            plus-square-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-power-off"
          /> power-off</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-print"
          /> print</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-puzzle-piece"/>
            puzzle-piece</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-qrcode"
          /> qrcode</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-question"
          /> question</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-question-circle"/>
            question-circle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-quote-left"/> quote-left</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-quote-right"
          /> quote-right</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-random"
          /> random</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-recycle"
          /> recycle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-refresh"
          /> refresh</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-reorder"
          /> reorder <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-reply"
          /> reply</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-reply-all"
          /> reply-all</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-retweet"
          /> retweet</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-road"
          /> road</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-rocket"
          /> rocket</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-rss"
          /> rss</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-rss-square"/> rss-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-search"
          /> search</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-search-minus"/>
            search-minus</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-search-plus"
          /> search-plus</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-send"
          /> send <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-send-o"/> send-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-share"
          /> share</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-share-alt"
          /> share-alt</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-share-alt-square"/>
            share-alt-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-share-square"/>
            share-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-share-square-o"/> share-square-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-shield"
          /> shield</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-shopping-cart"/>
            shopping-cart</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-sign-in"
          /> sign-in</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-sign-out"
          /> sign-out</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-signal"
          /> signal</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-sitemap"
          /> sitemap</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-sliders"
          /> sliders</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-smile-o"
          /> smile-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-sort"
          /> sort</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-sort-alpha-asc"/> sort-alpha-asc</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-sort-alpha-desc"/>
            sort-alpha-desc</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-sort-amount-asc"/>
            sort-amount-asc</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-sort-amount-desc"/>
            sort-amount-desc</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-sort-asc"
          /> sort-asc</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-sort-desc"
          /> sort-desc</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-sort-down"
          /> sort-down <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-sort-numeric-asc"/>
            sort-numeric-asc</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-sort-numeric-desc"/>
            sort-numeric-desc</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-sort-up"
          /> sort-up <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-space-shuttle"/>
            space-shuttle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-spinner"
          /> spinner</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-spoon"
          /> spoon</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-square"
          /> square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-square-o"
          /> square-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-star"
          /> star</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-star-half"
          /> star-half</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-star-half-empty"
          /> star-half-empty <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-star-half-full"
          /> star-half-full <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-star-half-o"
          /> star-half-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-star-o"
          /> star-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-suitcase"
          /> suitcase</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-sun-o"
          /> sun-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-support"
          /> support <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-tablet"
          /> tablet</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-tachometer"/> tachometer</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-tag"
          /> tag</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-tags"
          /> tags</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-tasks"
          /> tasks</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-taxi"
          /> taxi</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-terminal"
          /> terminal</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-thumb-tack"/> thumb-tack</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-thumbs-down"
          /> thumbs-down</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-thumbs-o-down"/>
            thumbs-o-down</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-thumbs-o-up"
          /> thumbs-o-up</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-thumbs-up"
          /> thumbs-up</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-ticket"
          /> ticket</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-times"
          /> times</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-times-circle"/>
            times-circle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-times-circle-o"/> times-circle-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-tint"
          /> tint</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-toggle-down"/> toggle-down
            <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-toggle-left"/> toggle-left
            <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-toggle-right"/>
            toggle-right <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-toggle-up"/> toggle-up <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-trash-o"
          /> trash-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-tree"
          /> tree</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-trophy"
          /> trophy</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-truck"
          /> truck</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-umbrella"
          /> umbrella</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-university"/> university</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-unlock"
          /> unlock</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-unlock-alt"/> unlock-alt</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-unsorted"
          /> unsorted <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-upload"
          /> upload</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-user"
          /> user</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-users"
          /> users</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-video-camera"/>
            video-camera</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-volume-down"
          /> volume-down</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-volume-off"/> volume-off</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-volume-up"
          /> volume-up</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-warning"/> warning <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-wheelchair"/> wheelchair</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-wrench"
          /> wrench</span></b-col>
        </b-row>
      </b-tab>
      <b-tab title="Spinner">
        <b-row class="icon-list">
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-circle-o-notch"/> circle-o-notch</span></b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-cog"
          /> cog</span></b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-gear"
          /> gear <span
              class="text-muted"
          >(alias)</span></span></b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-refresh"
          /> refresh</span></b-col>
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-spinner"
          /> spinner</span></b-col>
        </b-row>
      </b-tab>
      <b-tab title="Text Editor">
        <b-row class="icon-list">
          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-align-center"/>
            align-center</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-align-justify"/>
            align-justify</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-align-left"/> align-left</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-align-right"
          /> align-right</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-bold"
          /> bold</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-chain"
          /> chain <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-chain-broken"/>
            chain-broken</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-clipboard"
          /> clipboard</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-columns"
          /> columns</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-copy"
          /> copy <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-cut"
          /> cut <span class="text-muted">(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-dedent"
          /> dedent <span class="text-muted">(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-eraser"
          /> eraser</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-file"
          /> file</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-file-o"
          /> file-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-file-text"
          /> file-text</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-file-text-o"
          /> file-text-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-files-o"
          /> files-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-floppy-o"
          /> floppy-o</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-font"
          /> font</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-header"
          /> header</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-indent"
          /> indent</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-italic"
          /> italic</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-link"
          /> link</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-list"
          /> list</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-list-alt"
          /> list-alt</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-list-ol"
          /> list-ol</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-list-ul"
          /> list-ul</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-outdent"
          /> outdent</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-paperclip"
          /> paperclip</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-paragraph"
          /> paragraph</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-paste"
          /> paste <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-repeat"
          /> repeat</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-rotate-left"
          /> rotate-left <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-rotate-right"
          /> rotate-right <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-save"
          /> save <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-scissors"
          /> scissors</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-strikethrough"/>
            strikethrough</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-subscript"
          /> subscript</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-superscript"
          /> superscript</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-table"
          /> table</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-text-height"
          /> text-height</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-text-width"/> text-width</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-th"
          /> th</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-th-large"
          /> th-large</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-th-list"
          /> th-list</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-underline"
          /> underline</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span ><i
              class="fa fa-undo"
          /> undo</span></b-col>

          <b-col md="4" lg="3" xs="12" class="icon-list-item"><span
              
          ><i class="fa fa-unlink"/> unlink <span
              class="text-muted"
          >(alias)</span></span></b-col>
        </b-row>
      </b-tab>
      <b-tab title="Brand">
        <b-row class="icon-list">
          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-adn"
          /> adn</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-android"
          /> android</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-apple"
          /> apple</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-behance"
          /> behance</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-behance-square"/> behance-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-bitbucket"
          /> bitbucket</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-bitbucket-square"/>
            bitbucket-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-bitcoin"
          /> bitcoin <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-btc"
          /> btc</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-codepen"
          /> codepen</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-css3"
          /> css3</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-delicious"
          /> delicious</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-deviantart"/> deviantart</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-digg"
          /> digg</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-dribbble"
          /> dribbble</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-dropbox"
          /> dropbox</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-drupal"
          /> drupal</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-empire"
          /> empire</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-facebook"
          /> facebook</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-facebook-square"/>
            facebook-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-flickr"
          /> flickr</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-foursquare"/> foursquare</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-ge"
          /> ge <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-git"
          /> git</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-git-square"/> git-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-github"
          /> github</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-github-alt"/> github-alt</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-github-square"/>
            github-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-gittip"
          /> gittip</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-google"
          /> google</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-google-plus"
          /> google-plus</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-google-plus-square"/>
            google-plus-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-hacker-news"
          /> hacker-news</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-html5"
          /> html5</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-instagram"
          /> instagram</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-joomla"
          /> joomla</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-jsfiddle"
          /> jsfiddle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-linkedin"
          /> linkedin</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-linkedin-square"/>
            linkedin-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-linux"
          /> linux</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-maxcdn"
          /> maxcdn</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-openid"
          /> openid</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-pagelines"
          /> pagelines</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-pied-piper"/> pied-piper</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-pied-piper-alt"/> pied-piper-alt</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-pied-piper-square"/>
            pied-piper-square <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-pinterest"
          /> pinterest</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-pinterest-square"/>
            pinterest-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-qq"
          /> qq</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-ra"
          /> ra <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-rebel"
          /> rebel</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-reddit"
          /> reddit</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-reddit-square"/>
            reddit-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-renren"
          /> renren</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-share-alt"
          /> share-alt</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-share-alt-square"/>
            share-alt-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-skype"
          /> skype</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-slack"
          /> slack</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-soundcloud"/> soundcloud</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-spotify"
          /> spotify</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-stack-exchange"/> stack-exchange</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-stack-overflow"/> stack-overflow</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-steam"
          /> steam</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-steam-square"/>
            steam-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-stumbleupon"
          /> stumbleupon</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-stumbleupon-circle"/>
            stumbleupon-circle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-tencent-weibo"/>
            tencent-weibo</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-trello"
          /> trello</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-tumblr"
          /> tumblr</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-tumblr-square"/>
            tumblr-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-twitter"
          /> twitter</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-twitter-square"/> twitter-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-vimeo-square"/>
            vimeo-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-vine"
          /> vine</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-vk"
          /> vk</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-wechat"
          /> wechat <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-weibo"
          /> weibo</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-weixin"
          /> weixin</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-windows"
          /> windows</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-wordpress"
          /> wordpress</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-xing"
          /> xing</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-xing-square"
          /> xing-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-yahoo"
          /> yahoo</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-youtube"
          /> youtube</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-youtube-play"/>
            youtube-play</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-youtube-square"/> youtube-square</span></b-col>
        </b-row>
      </b-tab>
      <b-tab title="Other">
        <h4>File Type <span class="fw-semi-bold">Icons</span></h4>
        <b-row class="icon-list">
          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-file"
          /> file</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-archive-o"/> file-archive-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-audio-o"/>
            file-audio-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-file-code-o"
          /> file-code-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-excel-o"/>
            file-excel-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-image-o"/>
            file-image-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-movie-o"/> file-movie-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-file-o"
          /> file-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-pdf-o"/> file-pdf-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-photo-o"/> file-photo-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-picture-o"/> file-picture-o
            <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-powerpoint-o"/>
            file-powerpoint-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-sound-o"/> file-sound-o <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-file-text"
          /> file-text</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-file-text-o"
          /> file-text-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-video-o"/>
            file-video-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-file-word-o"
          /> file-word-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-file-zip-o"/> file-zip-o <span
              class="text-muted"
          >(alias)</span></span></b-col>
        </b-row>

        <h4 class="mt-3">Form Control <span class="fw-semi-bold">Icons</span></h4>
        <b-row class="icon-list">
          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-check-square"/>
            check-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-check-square-o"/> check-square-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-circle"
          /> circle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-circle-o"
          /> circle-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-dot-circle-o"/>
            dot-circle-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-minus-square"/>
            minus-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-minus-square-o"/> minus-square-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-plus-square"
          /> plus-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-plus-square-o"/>
            plus-square-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-square"
          /> square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-square-o"
          /> square-o</span></b-col>
        </b-row>

        <h4 class="mt-3">Currency <span class="fw-semi-bold">Icons</span></h4>
        <b-row class="icon-list">
          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-bitcoin"
          /> bitcoin <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-btc"
          /> btc</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-cny"
          /> cny <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-dollar"
          /> dollar <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-eur"
          /> eur</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-euro"
          /> euro <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-gbp"
          /> gbp</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-inr"
          /> inr</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-jpy"
          /> jpy</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-krw"
          /> krw</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-money"
          /> money</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-rmb"
          /> rmb <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-rouble"
          /> rouble <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-rub"
          /> rub</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-ruble"
          /> ruble <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-rupee"
          /> rupee <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-try"
          /> try</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-turkish-lira"
          /> turkish-lira <span
              class="text-muted"
          >(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-usd"
          /> usd</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-won"
          /> won <span class="text-muted">(alias)</span></span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-yen"
          /> yen <span class="text-muted">(alias)</span></span></b-col>
        </b-row>

        <h4 class="mt-3">Video Player <span class="fw-semi-bold">Icons</span></h4>
        <b-row class="icon-list">

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-arrows-alt"/> arrows-alt</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-backward"
          /> backward</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-compress"
          /> compress</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-eject"
          /> eject</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-expand"
          /> expand</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-fast-backward"/>
            fast-backward</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-fast-forward"/>
            fast-forward</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-forward"
          /> forward</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-pause"
          /> pause</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-play"
          /> play</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-play-circle"
          /> play-circle</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-play-circle-o"/>
            play-circle-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-step-backward"/>
            step-backward</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-step-forward"/>
            step-forward</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-stop"
          /> stop</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-youtube-play"/>
            youtube-play</span></b-col>
        </b-row>

        <h4 class="mt-3">Medical <span class="fw-semi-bold">Icons</span></h4>
        <b-row class="icon-list">
          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-ambulance"
          /> ambulance</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-h-square"
          /> h-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-hospital-o"/> hospital-o</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-medkit"
          /> medkit</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-plus-square"
          /> plus-square</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-stethoscope"
          /> stethoscope</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span ><i
              class="fa fa-user-md"
          /> user-md</span></b-col>

          <b-col class="icon-list-item" lg="3" md="4" xs="12"><span
              
          ><i class="fa fa-wheelchair"/> wheelchair</span></b-col>
        </b-row>
      </b-tab>
    </b-tabs>
  </section>
</template>

<script>
export default {
  name: 'Icons',
};
</script>

<style src="./Icons.scss" lang="scss" scoped/>
