Gapminder/vizabi

<div class="vzb-timeslider vzb-ts-loading">
  <div class="vzb-ts-slider-wrapper">
    <svg class="vzb-ts-slider">
      <g>
        <g class="vzb-ts-slider-axis"></g>
        <g class="vzb-ts-slider-progress"></g>
        <g class="vzb-ts-slider-select"></g>
        <line class="vzb-ts-slider-forecastboundary"></line>
        <circle class="vzb-ts-slider-handle"></circle>
        <text class="vzb-ts-slider-value"></text>
        <line class="vzb-ts-slider-slide"></line>
      </g>
      </svg>
  </div>

  <!-- SVG VIZABI ICONS
       source: https://github.com/encharm/Font-Awesome-SVG-PNG/ -->
  <div class="vzb-ts-btns">
    <button class="vzb-ts-btn-loading vzb-ts-btn">
      <div class='vzb-loader'></div>
    </button>
    <button class="vzb-ts-btn-play vzb-ts-btn">
      <svg class="vzb-icon vzb-icon-play" viewBox="3 3 42 42"
           xmlns="http://www.w3.org/2000/svg">
        <path xmlns="http://www.w3.org/2000/svg" d="M24 4C12.95 4 4 12.95 4 24s8.95 20 20 20 20-8.95 20-20S35.05 4 24 4zm-4 29V15l12 9-12 9z"/>
      </svg>
    </button>
    <button class="vzb-ts-btn-pause vzb-ts-btn">
      <svg class="vzb-icon vzb-icon-pause" viewBox="3 3 42 42"
           xmlns="http://www.w3.org/2000/svg">
        <path xmlns="http://www.w3.org/2000/svg" d="M24 4C12.95 4 4 12.95 4 24s8.95 20 20 20 20-8.95 20-20S35.05 4 24 4zm-2 28h-4V16h4v16zm8 0h-4V16h4v16z"/>
      </svg>
    </button>
  </div>
</div>