{% extends 'partials/base.html' %}
{% load static %}
{% block content %}
  <!-- Page Wrapper -->
  <div class="page-wrapper cardhead">
    <div class="content">
      <!-- Page Header -->
      <div class="page-header">
        <div class="row">
          <div class="col-sm-12">
            <h3 class="page-title">Simpleline Icon</h3>
          </div>
        </div>
      </div>
      <!-- /Page Header -->

      <div class="row">
        <!-- Chart -->
        <div class="col-md-12">
          <div class="card">
            <div class="card-header">
              <div class="card-title">Simpleline Icons</div>
            </div>
            <div class="card-body">
              <div class="icons-items">
                <ul class="icons-list">
                  <li>
                    <i class="si si-user" data-bs-toggle="tooltip" title="si-user"></i>
                  </li>
                  <li>
                    <i class="si si-people" data-bs-toggle="tooltip" title="si-people"></i>
                  </li>
                  <li>
                    <i class="si si-user-female" data-bs-toggle="tooltip" title="si-user-female"></i>
                  </li>
                  <li>
                    <i class="si si-user-follow" data-bs-toggle="tooltip" title="si-user-follow"></i>
                  </li>
                  <li>
                    <i class="si si-user-following" data-bs-toggle="tooltip" title="si-user-following"></i>
                  </li>
                  <li>
                    <i class="si si-user-unfollow" data-bs-toggle="tooltip" title="si-user-unfollow"></i>
                  </li>
                  <li>
                    <i class="si si-login" data-bs-toggle="tooltip" title="si-login"></i>
                  </li>
                  <li>
                    <i class="si si-logout" data-bs-toggle="tooltip" title="si-logout"></i>
                  </li>
                  <li>
                    <i class="si si-emotsmile" data-bs-toggle="tooltip" title="si-emotsmile"></i>
                  </li>
                  <li>
                    <i class="si si-phone" data-bs-toggle="tooltip" title="si-phone"></i>
                  </li>
                  <li>
                    <i class="si si-call-end" data-bs-toggle="tooltip" title="si-call-end"></i>
                  </li>
                  <li>
                    <i class="si si-call-in" data-bs-toggle="tooltip" title="si-call-in"></i>
                  </li>
                  <li>
                    <i class="si si-call-out" data-bs-toggle="tooltip" title="si-call-out"></i>
                  </li>
                  <li>
                    <i class="si si-map" data-bs-toggle="tooltip" title="si-map"></i>
                  </li>
                  <li>
                    <i class="si si-location-pin" data-bs-toggle="tooltip" title="si-location-pin"></i>
                  </li>
                  <li>
                    <i class="si si-direction" data-bs-toggle="tooltip" title="si-direction"></i>
                  </li>
                  <li>
                    <i class="si si-directions" data-bs-toggle="tooltip" title="si-directions"></i>
                  </li>
                  <li>
                    <i class="si si-compass" data-bs-toggle="tooltip" title="si-compass"></i>
                  </li>
                  <li>
                    <i class="si si-layers" data-bs-toggle="tooltip" title="si-layers"></i>
                  </li>
                  <li>
                    <i class="si si-menu" data-bs-toggle="tooltip" title="si-menu"></i>
                  </li>
                  <li>
                    <i class="si si-list" data-bs-toggle="tooltip" title="si-list"></i>
                  </li>
                  <li>
                    <i class="si si-options-vertical" data-bs-toggle="tooltip" title="si-options-vertical"></i>
                  </li>
                  <li>
                    <i class="si si-options" data-bs-toggle="tooltip" title="si-options"></i>
                  </li>
                  <li>
                    <i class="si si-arrow-down" data-bs-toggle="tooltip" title="si-arrow-down"></i>
                  </li>
                  <li>
                    <i class="si si-arrow-left" data-bs-toggle="tooltip" title="si-arrow-left"></i>
                  </li>
                  <li>
                    <i class="si si-arrow-right" data-bs-toggle="tooltip" title="si-arrow-right"></i>
                  </li>
                  <li>
                    <i class="si si-arrow-up" data-bs-toggle="tooltip" title="si-arrow-up"></i>
                  </li>
                  <li>
                    <i class="si si-arrow-up-circle" data-bs-toggle="tooltip" title="si-arrow-up-circle"></i>
                  </li>
                  <li>
                    <i class="si si-arrow-left-circle" data-bs-toggle="tooltip" title="si-arrow-left-circle"></i>
                  </li>
                  <li>
                    <i class="si si-arrow-right-circle" data-bs-toggle="tooltip" title="si-arrow-right-circle"></i>
                  </li>
                  <li>
                    <i class="si si-arrow-down-circle" data-bs-toggle="tooltip" title="si-arrow-down-circle"></i>
                  </li>
                  <li>
                    <i class="si si-check" data-bs-toggle="tooltip" title="si-check"></i>
                  </li>
                  <li>
                    <i class="si si-clock" data-bs-toggle="tooltip" title="si-clock"></i>
                  </li>
                  <li>
                    <i class="si si-plus" data-bs-toggle="tooltip" title="si-plus"></i>
                  </li>
                  <li>
                    <i class="si si-minus" data-bs-toggle="tooltip" title="si-minus"></i>
                  </li>
                  <li>
                    <i class="si si-close" data-bs-toggle="tooltip" title="si-close"></i>
                  </li>
                  <li>
                    <i class="si si-event" data-bs-toggle="tooltip" title="si-event"></i>
                  </li>
                  <li>
                    <i class="si si-exclamation" data-bs-toggle="tooltip" title="si-exclamation"></i>
                  </li>
                  <li>
                    <i class="si si-organization" data-bs-toggle="tooltip" title="si-organization"></i>
                  </li>
                  <li>
                    <i class="si si-trophy" data-bs-toggle="tooltip" title="si-trophy"></i>
                  </li>
                  <li>
                    <i class="si si-screen-smartphone" data-bs-toggle="tooltip" title="si-screen-smartphone"></i>
                  </li>
                  <li>
                    <i class="si si-screen-desktop" data-bs-toggle="tooltip" title="si-screen-desktop"></i>
                  </li>
                  <li>
                    <i class="si si-plane" data-bs-toggle="tooltip" title="si-plane"></i>
                  </li>
                  <li>
                    <i class="si si-notebook" data-bs-toggle="tooltip" title="si-notebook"></i>
                  </li>
                  <li>
                    <i class="si si-mustache" data-bs-toggle="tooltip" title="si-mustache"></i>
                  </li>
                  <li>
                    <i class="si si-mouse" data-bs-toggle="tooltip" title="si-mouse"></i>
                  </li>
                  <li>
                    <i class="si si-magnet" data-bs-toggle="tooltip" title="si-magnet"></i>
                  </li>
                  <li>
                    <i class="si si-energy" data-bs-toggle="tooltip" title="si-energy"></i>
                  </li>
                  <li>
                    <i class="si si-disc" data-bs-toggle="tooltip" title="si-disc"></i>
                  </li>
                  <li>
                    <i class="si si-cursor" data-bs-toggle="tooltip" title="si-cursor"></i>
                  </li>
                  <li>
                    <i class="si si-cursor-move" data-bs-toggle="tooltip" title="si-cursor-move"></i>
                  </li>
                  <li>
                    <i class="si si-crop" data-bs-toggle="tooltip" title="si-crop"></i>
                  </li>
                  <li>
                    <i class="si si-chemistry" data-bs-toggle="tooltip" title="si-chemistry"></i>
                  </li>
                  <li>
                    <i class="si si-speedometer" data-bs-toggle="tooltip" title="si-speedometer"></i>
                  </li>
                  <li>
                    <i class="si si-shield" data-bs-toggle="tooltip" title="si-shield"></i>
                  </li>
                  <li>
                    <i class="si si-screen-tablet" data-bs-toggle="tooltip" title="si-screen-tablet"></i>
                  </li>
                  <li>
                    <i class="si si-magic-wand" data-bs-toggle="tooltip" title="si-magic-wand"></i>
                  </li>
                  <li>
                    <i class="si si-hourglass" data-bs-toggle="tooltip" title="si-hourglass"></i>
                  </li>
                  <li>
                    <i class="si si-graduation" data-bs-toggle="tooltip" title="si-graduation"></i>
                  </li>
                  <li>
                    <i class="si si-ghost" data-bs-toggle="tooltip" title="si-ghost"></i>
                  </li>
                  <li>
                    <i class="si si-game-controller" data-bs-toggle="tooltip" title="si-game-controller"></i>
                  </li>
                  <li>
                    <i class="si si-fire" data-bs-toggle="tooltip" title="si-fire"></i>
                  </li>
                  <li>
                    <i class="si si-eyeglass" data-bs-toggle="tooltip" title="si-eyeglass"></i>
                  </li>
                  <li>
                    <i class="si si-envelope-open" data-bs-toggle="tooltip" title="si-envelope-open"></i>
                  </li>
                  <li>
                    <i class="si si-envelope-letter" data-bs-toggle="tooltip" title="si-envelope-letter"></i>
                  </li>
                  <li>
                    <i class="si si-bell" data-bs-toggle="tooltip" title="si-bell"></i>
                  </li>
                  <li>
                    <i class="si si-badge" data-bs-toggle="tooltip" title="si-badge"></i>
                  </li>
                  <li>
                    <i class="si si-anchor" data-bs-toggle="tooltip" title="si-anchor"></i>
                  </li>
                  <li>
                    <i class="si si-wallet" data-bs-toggle="tooltip" title="si-wallet"></i>
                  </li>
                  <li>
                    <i class="si si-vector" data-bs-toggle="tooltip" title="si-vector"></i>
                  </li>
                  <li>
                    <i class="si si-speech" data-bs-toggle="tooltip" title="si-speech"></i>
                  </li>
                  <li>
                    <i class="si si-puzzle" data-bs-toggle="tooltip" title="si-puzzle"></i>
                  </li>
                  <li>
                    <i class="si si-printer" data-bs-toggle="tooltip" title="si-printer"></i>
                  </li>
                  <li>
                    <i class="si si-present" data-bs-toggle="tooltip" title="si-present"></i>
                  </li>
                  <li>
                    <i class="si si-playlist" data-bs-toggle="tooltip" title="si-playlist"></i>
                  </li>
                  <li>
                    <i class="si si-pin" data-bs-toggle="tooltip" title="si-pin"></i>
                  </li>
                  <li>
                    <i class="si si-picture" data-bs-toggle="tooltip" title="si-picture"></i>
                  </li>
                  <li>
                    <i class="si si-handbag" data-bs-toggle="tooltip" title="si-handbag"></i>
                  </li>
                  <li>
                    <i class="si si-globe-alt" data-bs-toggle="tooltip" title="si-globe-alt"></i>
                  </li>
                  <li>
                    <i class="si si-globe" data-bs-toggle="tooltip" title="si-globe"></i>
                  </li>
                  <li>
                    <i class="si si-folder-alt" data-bs-toggle="tooltip" title="si-folder-alt"></i>
                  </li>
                  <li>
                    <i class="si si-folder" data-bs-toggle="tooltip" title="si-folder"></i>
                  </li>
                  <li>
                    <i class="si si-film" data-bs-toggle="tooltip" title="si-film"></i>
                  </li>
                  <li>
                    <i class="si si-feed" data-bs-toggle="tooltip" title="si-feed"></i>
                  </li>
                  <li>
                    <i class="si si-drop" data-bs-toggle="tooltip" title="si-drop"></i>
                  </li>
                  <li>
                    <i class="si si-drawer" data-bs-toggle="tooltip" title="si-drawer"></i>
                  </li>
                  <li>
                    <i class="si si-docs" data-bs-toggle="tooltip" title="si-docs"></i>
                  </li>
                  <li>
                    <i class="si si-doc" data-bs-toggle="tooltip" title="si-doc"></i>
                  </li>
                  <li>
                    <i class="si si-diamond" data-bs-toggle="tooltip" title="si-diamond"></i>
                  </li>
                  <li>
                    <i class="si si-cup" data-bs-toggle="tooltip" title="si-cup"></i>
                  </li>
                  <li>
                    <i class="si si-calculator" data-bs-toggle="tooltip" title="si-calculator"></i>
                  </li>
                  <li>
                    <i class="si si-bubbles" data-bs-toggle="tooltip" title="si-bubbles"></i>
                  </li>
                  <li>
                    <i class="si si-briefcase" data-bs-toggle="tooltip" title="si-briefcase"></i>
                  </li>
                  <li>
                    <i class="si si-book-open" data-bs-toggle="tooltip" title="si-book-open"></i>
                  </li>
                  <li>
                    <i class="si si-basket-loaded" data-bs-toggle="tooltip" title="si-basket-loaded"></i>
                  </li>
                  <li>
                    <i class="si si-basket" data-bs-toggle="tooltip" title="si-basket"></i>
                  </li>
                  <li>
                    <i class="si si-bag" data-bs-toggle="tooltip" title="si-bag"></i>
                  </li>
                  <li>
                    <i class="si si-action-undo" data-bs-toggle="tooltip" title="si-action-undo"></i>
                  </li>
                  <li>
                    <i class="si si-action-redo" data-bs-toggle="tooltip" title="si-action-redo"></i>
                  </li>
                  <li>
                    <i class="si si-wrench" data-bs-toggle="tooltip" title="si-wrench"></i>
                  </li>
                  <li>
                    <i class="si si-umbrella" data-bs-toggle="tooltip" title="si-umbrella"></i>
                  </li>
                  <li>
                    <i class="si si-trash" data-bs-toggle="tooltip" title="si-trash"></i>
                  </li>
                  <li>
                    <i class="si si-tag" data-bs-toggle="tooltip" title="si-tag"></i>
                  </li>
                  <li>
                    <i class="si si-support" data-bs-toggle="tooltip" title="si-support"></i>
                  </li>
                  <li>
                    <i class="si si-frame" data-bs-toggle="tooltip" title="si-frame"></i>
                  </li>
                  <li>
                    <i class="si si-size-fullscreen" data-bs-toggle="tooltip" title="si-size-fullscreen"></i>
                  </li>
                  <li>
                    <i class="si si-size-actual" data-bs-toggle="tooltip" title="si-size-actual"></i>
                  </li>
                  <li>
                    <i class="si si-shuffle" data-bs-toggle="tooltip" title="si-shuffle"></i>
                  </li>
                  <li>
                    <i class="si si-share-alt" data-bs-toggle="tooltip" title="si-share-alt"></i>
                  </li>
                  <li>
                    <i class="si si-share" data-bs-toggle="tooltip" title="si-share"></i>
                  </li>
                  <li>
                    <i class="si si-rocket" data-bs-toggle="tooltip" title="si-rocket"></i>
                  </li>
                  <li>
                    <i class="si si-question" data-bs-toggle="tooltip" title="si-question"></i>
                  </li>
                  <li>
                    <i class="si si-pie-chart" data-bs-toggle="tooltip" title="si-pie-chart"></i>
                  </li>
                  <li>
                    <i class="si si-pencil" data-bs-toggle="tooltip" title="si-pencil"></i>
                  </li>
                  <li>
                    <i class="si si-note" data-bs-toggle="tooltip" title="si-note"></i>
                  </li>
                  <li>
                    <i class="si si-loop" data-bs-toggle="tooltip" title="si-loop"></i>
                  </li>
                  <li>
                    <i class="si si-home" data-bs-toggle="tooltip" title="si-home"></i>
                  </li>
                  <li>
                    <i class="si si-grid" data-bs-toggle="tooltip" title="si-grid"></i>
                  </li>
                  <li>
                    <i class="si si-graph" data-bs-toggle="tooltip" title="si-graph"></i>
                  </li>
                  <li>
                    <i class="si si-microphone" data-bs-toggle="tooltip" title="si-microphone"></i>
                  </li>
                  <li>
                    <i class="si si-music-tone-alt" data-bs-toggle="tooltip" title="si-music-tone-alt"></i>
                  </li>
                  <li>
                    <i class="si si-music-tone" data-bs-toggle="tooltip" title="si-music-tone"></i>
                  </li>
                  <li>
                    <i class="si si-earphones-alt" data-bs-toggle="tooltip" title="si-earphones-alt"></i>
                  </li>
                  <li>
                    <i class="si si-earphones" data-bs-toggle="tooltip" title="si-earphones"></i>
                  </li>
                  <li>
                    <i class="si si-equalizer" data-bs-toggle="tooltip" title="si-equalizer"></i>
                  </li>
                  <li>
                    <i class="si si-like" data-bs-toggle="tooltip" title="si-like"></i>
                  </li>
                  <li>
                    <i class="si si-dislike" data-bs-toggle="tooltip" title="si-dislike"></i>
                  </li>
                  <li>
                    <i class="si si-control-start" data-bs-toggle="tooltip" title="si-control-start"></i>
                  </li>
                  <li>
                    <i class="si si-control-rewind" data-bs-toggle="tooltip" title="si-control-rewind"></i>
                  </li>
                  <li>
                    <i class="si si-control-play" data-bs-toggle="tooltip" title="si-control-play"></i>
                  </li>
                  <li>
                    <i class="si si-control-pause" data-bs-toggle="tooltip" title="si-control-pause"></i>
                  </li>
                  <li>
                    <i class="si si-control-forward" data-bs-toggle="tooltip" title="si-control-forward"></i>
                  </li>
                  <li>
                    <i class="si si-control-end" data-bs-toggle="tooltip" title="si-control-end"></i>
                  </li>
                  <li>
                    <i class="si si-volume-1" data-bs-toggle="tooltip" title="si-volume-1"></i>
                  </li>
                  <li>
                    <i class="si si-volume-2" data-bs-toggle="tooltip" title="si-volume-2"></i>
                  </li>
                  <li>
                    <i class="si si-volume-off" data-bs-toggle="tooltip" title="si-volume-off"></i>
                  </li>
                  <li>
                    <i class="si si-calendar" data-bs-toggle="tooltip" title="si-calendar"></i>
                  </li>
                  <li>
                    <i class="si si-bulb" data-bs-toggle="tooltip" title="si-bulb"></i>
                  </li>
                  <li>
                    <i class="si si-chart" data-bs-toggle="tooltip" title="si-chart"></i>
                  </li>
                  <li>
                    <i class="si si-ban" data-bs-toggle="tooltip" title="si-ban"></i>
                  </li>
                  <li>
                    <i class="si si-bubble" data-bs-toggle="tooltip" title="si-bubble"></i>
                  </li>
                  <li>
                    <i class="si si-camrecorder" data-bs-toggle="tooltip" title="si-camrecorder"></i>
                  </li>
                  <li>
                    <i class="si si-camera" data-bs-toggle="tooltip" title="si-camera"></i>
                  </li>
                  <li>
                    <i class="si si-cloud-download" data-bs-toggle="tooltip" title="si-cloud-download"></i>
                  </li>
                  <li>
                    <i class="si si-cloud-upload" data-bs-toggle="tooltip" title="si-cloud-upload"></i>
                  </li>
                  <li>
                    <i class="si si-envelope" data-bs-toggle="tooltip" title="si-envelope"></i>
                  </li>
                  <li>
                    <i class="si si-eye" data-bs-toggle="tooltip" title="si-eye"></i>
                  </li>
                  <li>
                    <i class="si si-flag" data-bs-toggle="tooltip" title="si-flag"></i>
                  </li>
                  <li>
                    <i class="si si-heart" data-bs-toggle="tooltip" title="si-heart"></i>
                  </li>
                  <li>
                    <i class="si si-info" data-bs-toggle="tooltip" title="si-info"></i>
                  </li>
                  <li>
                    <i class="si si-key" data-bs-toggle="tooltip" title="si-key"></i>
                  </li>
                  <li>
                    <i class="si si-link" data-bs-toggle="tooltip" title="si-link"></i>
                  </li>
                  <li>
                    <i class="si si-lock" data-bs-toggle="tooltip" title="si-lock"></i>
                  </li>
                  <li>
                    <i class="si si-lock-open" data-bs-toggle="tooltip" title="si-lock-open"></i>
                  </li>
                  <li>
                    <i class="si si-magnifier" data-bs-toggle="tooltip" title="si-magnifier"></i>
                  </li>
                  <li>
                    <i class="si si-magnifier-add" data-bs-toggle="tooltip" title="si-magnifier-add"></i>
                  </li>
                  <li>
                    <i class="si si-magnifier-remove" data-bs-toggle="tooltip" title="si-magnifier-remove"></i>
                  </li>
                  <li>
                    <i class="si si-paper-clip" data-bs-toggle="tooltip" title="si-paper-clip"></i>
                  </li>
                  <li>
                    <i class="si si-paper-plane" data-bs-toggle="tooltip" title="si-paper-plane"></i>
                  </li>
                  <li>
                    <i class="si si-power" data-bs-toggle="tooltip" title="si-power"></i>
                  </li>
                  <li>
                    <i class="si si-refresh" data-bs-toggle="tooltip" title="si-refresh"></i>
                  </li>
                  <li>
                    <i class="si si-reload" data-bs-toggle="tooltip" title="si-reload"></i>
                  </li>
                  <li>
                    <i class="si si-settings" data-bs-toggle="tooltip" title="si-settings"></i>
                  </li>
                  <li>
                    <i class="si si-star" data-bs-toggle="tooltip" title="si-star"></i>
                  </li>
                  <li>
                    <i class="si si-symbol-female" data-bs-toggle="tooltip" title="si-symbol-female"></i>
                  </li>
                  <li>
                    <i class="si si-symbol-male" data-bs-toggle="tooltip" title="si-symbol-male"></i>
                  </li>
                  <li>
                    <i class="si si-target" data-bs-toggle="tooltip" title="si-target"></i>
                  </li>
                  <li>
                    <i class="si si-credit-card" data-bs-toggle="tooltip" title="si-credit-card"></i>
                  </li>
                  <li>
                    <i class="si si-paypal" data-bs-toggle="tooltip" title="si-paypal"></i>
                  </li>
                  <li>
                    <i class="si si-social-tumblr" data-bs-toggle="tooltip" title="si-social-tumblr"></i>
                  </li>
                  <li>
                    <i class="si si-social-twitter" data-bs-toggle="tooltip" title="si-social-twitter"></i>
                  </li>
                  <li>
                    <i class="si si-social-facebook" data-bs-toggle="tooltip" title="si-social-facebook"></i>
                  </li>
                  <li>
                    <i class="si si-social-instagram" data-bs-toggle="tooltip" title="si-social-instagram"></i>
                  </li>
                  <li>
                    <i class="si si-social-linkedin" data-bs-toggle="tooltip" title="si-social-linkedin"></i>
                  </li>
                  <li>
                    <i class="si si-social-pinterest" data-bs-toggle="tooltip" title="si-social-pinterest"></i>
                  </li>
                  <li>
                    <i class="si si-social-github" data-bs-toggle="tooltip" title="si-social-github"></i>
                  </li>
                  <li>
                    <i class="si si-social-google" data-bs-toggle="tooltip" title="si-social-google"></i>
                  </li>
                  <li>
                    <i class="si si-social-reddit" data-bs-toggle="tooltip" title="si-social-reddit"></i>
                  </li>
                  <li>
                    <i class="si si-social-skype" data-bs-toggle="tooltip" title="si-social-skype"></i>
                  </li>
                  <li>
                    <i class="si si-social-dribbble" data-bs-toggle="tooltip" title="si-social-dribbble"></i>
                  </li>
                  <li>
                    <i class="si si-social-behance" data-bs-toggle="tooltip" title="si-social-behance"></i>
                  </li>
                  <li>
                    <i class="si si-social-foursqare" data-bs-toggle="tooltip" title="si-social-foursqare"></i>
                  </li>
                  <li>
                    <i class="si si-social-soundcloud" data-bs-toggle="tooltip" title="si-social-soundcloud"></i>
                  </li>
                  <li>
                    <i class="si si-social-spotify" data-bs-toggle="tooltip" title="si-social-spotify"></i>
                  </li>
                  <li>
                    <i class="si si-social-stumbleupon" data-bs-toggle="tooltip" title="si-social-stumbleupon"></i>
                  </li>
                  <li>
                    <i class="si si-social-youtube" data-bs-toggle="tooltip" title="si-social-youtube"></i>
                  </li>
                  <li>
                    <i class="si si-social-dropbox" data-bs-toggle="tooltip" title="si-social-dropbox"></i>
                  </li>
                  <li>
                    <i class="si si-social-vkontakte" data-bs-toggle="tooltip" title="si-social-vkontakte"></i>
                  </li>
                  <li>
                    <i class="si si-social-steam" data-bs-toggle="tooltip" title="si-social-steam"></i>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <!-- /Chart -->
      </div>
    </div>
  </div>
  <!-- /Page Wrapper -->
{% endblock %}