{% load humanize %}
<div class="info-box bg-{{ color }}">
    {% if not hide_icon %}
        <span class="info-box-icon"><i class="fa fa-{{ icon }}"></i></span>
    {% endif %}
    <div class="info-box-content">
        <span class="info-box-text">{{ header }}</span>
        <span class="info-box-number">{{ number }} {{ unit }}</span>
        {% if percent %}
            <div class="progress">
                <div class="progress-bar" style="width: {{ percent }}%"></div>
            </div>
            {% if how_long %}
                <span class="progress-description">
                    {{ percent }}% Increase in {{ how_long }}
                </span>
            {% endif %}
        {% endif %}
    </div><!-- /.info-box-content -->
</div><!-- /.info-box -->
