diff --git a/tests/django_admin/admin/app_list.html b/tests/django_admin/admin/app_list.html
index b20be2a..7159a9b 100644
--- a/tests/django_admin/admin/app_list.html
+++ b/tests/django_admin/admin/app_list.html
@@ -2,62 +2,62 @@
 {% if app_list %}
     {% for app in app_list %}
         <div class="app-{{ app.app_label }} module{% if app.app_url in request.path %}current-app{% endif %}">
-        <table>
-            <caption>
-            <a href="{{ app.app_url }}"
-               class="section"
-               title="{% blocktranslate with name=app.name %}Models in the {{ name }} application{% endblocktranslate %}">
-                {{ app.name }}
-            </a>
-            </caption>
-            {% for model in app.models %}
-                <tr class="model-{{ model.object_name|lower }}{% if model.admin_url in request.path %} current-model{% endif %}">
-                {% if model.admin_url %}
-                    <th scope="row">
-                        <a href="{{ model.admin_url }}"
-                            {% if model.admin_url in request.path %}
-                                aria-current="page"
+            <table>
+                <caption>
+                <a href="{{ app.app_url }}"
+                   class="section"
+                   title="{% blocktranslate with name=app.name %}Models in the {{ name }} application{% endblocktranslate %}">
+                    {{ app.name }}
+                </a>
+                </caption>
+                {% for model in app.models %}
+                    <tr class="model-{{ model.object_name|lower }}{% if model.admin_url in request.path %} current-model{% endif %}">
+                        {% if model.admin_url %}
+                            <th scope="row">
+                                <a href="{{ model.admin_url }}"
+                                    {% if model.admin_url in request.path %}
+                                        aria-current="page"
+                                    {% endif %}
+                                    >
+                                    {{ model.name }}
+                                </a>
+                            </th>
+                        {% else %}
+                            <th scope="row">{{ model.name }}</th>
+                        {% endif %}
+                        {% if model.add_url %}
+                            <td>
+                                <a href="{{ model.add_url }}" class="addlink">
+                                    {% translate 'Add' %}
+                                </a>
+                            </td>
+                        {% else %}
+                            <td></td>
+                        {% endif %}
+                        {% if model.admin_url and show_changelinks %}
+                            {% if model.view_only %}
+                                <td>
+                                    <a href="{{ model.admin_url }}" class="viewlink">
+                                        {% translate 'View' %}
+                                    </a>
+                                </td>
+                            {% else %}
+                                <td>
+                                    <a href="{{ model.admin_url }}" class="changelink">
+                                        {% translate 'Change' %}
+                                    </a>
+                                </td>
                             {% endif %}
-                            >
-                            {{ model.name }}
-                        </a>
-                    </th>
-                {% else %}
-                    <th scope="row">{{ model.name }}</th>
-                {% endif %}
-                {% if model.add_url %}
-                    <td>
-                        <a href="{{ model.add_url }}" class="addlink">
-                            {% translate 'Add' %}
-                        </a>
-                    </td>
-                {% else %}
-                    <td></td>
-                {% endif %}
-                {% if model.admin_url and show_changelinks %}
-                    {% if model.view_only %}
-                        <td>
-                            <a href="{{ model.admin_url }}" class="viewlink">
-                                {% translate 'View' %}
-                            </a>
-                        </td>
-                    {% else %}
-                        <td>
-                            <a href="{{ model.admin_url }}" class="changelink">
-                                {% translate 'Change' %}
-                            </a>
-                        </td>
-                    {% endif %}
-                {% elif show_changelinks %}
-                    <td></td>
-                {% endif %}
-            </tr>
-        {% endfor %}
-    </table>
-</div>
-{% endfor %}
+                        {% elif show_changelinks %}
+                            <td></td>
+                        {% endif %}
+                    </tr>
+                {% endfor %}
+            </table>
+        </div>
+    {% endfor %}
 {% else %}
-<p>
-{% translate 'You don’t have permission to view or edit anything.' %}
-</p>
+    <p>
+        {% translate 'You don’t have permission to view or edit anything.' %}
+    </p>
 {% endif %}
diff --git a/tests/django_admin/admin/base.html b/tests/django_admin/admin/base.html
index 89852c9..b5fe1b8 100644
--- a/tests/django_admin/admin/base.html
+++ b/tests/django_admin/admin/base.html
@@ -29,94 +29,94 @@
     </head>
     <body class="{% if is_popup %}popup {% endif %}{% block bodyclass %}{% endblock %}"
           data-admin-utc-offset="{% now ">
-    <!-- Container -->
-    <div id="container">
-        {% if not is_popup %}
-            <!-- Header -->
-            {% block header %}
-                <div id="header">
-                    <div id="branding">
-                        {% block branding %}{% endblock %}
-                    </div>
-                    {% block usertools %}
-                        {% if has_permission %}
-                            <div id="user-tools">
-                                {% block welcome-msg %}
-                                    {% translate 'Welcome,' %}
-                                    <strong>{% firstof user.get_short_name user.get_username %}</strong>
-                                    .
-                                {% endblock %}
-                                {% block userlinks %}
-                                    {% if site_url %}
-                                        <a href="{{ site_url }}">{% translate 'View site' %}</a>
-                                        /
-                                    {% endif %}
-                                    {% if user.is_active and user.is_staff %}
-                                        {% url 'django-admindocs-docroot' as docsroot %}
-                                        {% if docsroot %}
-                                            <a href="{{ docsroot }}">{% translate 'Documentation' %}</a>
+        <!-- Container -->
+        <div id="container">
+            {% if not is_popup %}
+                <!-- Header -->
+                {% block header %}
+                    <div id="header">
+                        <div id="branding">
+                            {% block branding %}{% endblock %}
+                        </div>
+                        {% block usertools %}
+                            {% if has_permission %}
+                                <div id="user-tools">
+                                    {% block welcome-msg %}
+                                        {% translate 'Welcome,' %}
+                                        <strong>{% firstof user.get_short_name user.get_username %}</strong>
+                                        .
+                                    {% endblock %}
+                                    {% block userlinks %}
+                                        {% if site_url %}
+                                            <a href="{{ site_url }}">{% translate 'View site' %}</a>
                                             /
                                         {% endif %}
-                                    {% endif %}
-                                    {% if user.has_usable_password %}
-                                        <a href="{% url 'admin:password_change' %}">
-                                            {% translate 'Change password' %}
+                                        {% if user.is_active and user.is_staff %}
+                                            {% url 'django-admindocs-docroot' as docsroot %}
+                                            {% if docsroot %}
+                                                <a href="{{ docsroot }}">{% translate 'Documentation' %}</a>
+                                                /
+                                            {% endif %}
+                                        {% endif %}
+                                        {% if user.has_usable_password %}
+                                            <a href="{% url 'admin:password_change' %}">
+                                                {% translate 'Change password' %}
+                                            </a>
+                                            /
+                                        {% endif %}
+                                        <a href="{% url 'admin:logout' %}">
+                                            {% translate 'Log out' %}
                                         </a>
-                                        /
-                                    {% endif %}
-                                    <a href="{% url 'admin:logout' %}">
-                                        {% translate 'Log out' %}
-                                    </a>
-                                {% endblock %}
+                                    {% endblock %}
+                                </div>
+                            {% endif %}
+                        {% endblock %}
+                        {% block nav-global %}{% endblock %}</div>{% endblock %}
+                        <!-- END Header -->
+                        {% block breadcrumbs %}
+                            <div class="breadcrumbs">
+                                <a href="{% url 'admin:index' %}">{% translate 'Home' %}</a>
+                                {% if title %}&rsaquo; {{ title }}{% endif %}
                             </div>
-                        {% endif %}
-                    {% endblock %}
-                    {% block nav-global %}{% endblock %}</div>{% endblock %}
-                    <!-- END Header -->
-                    {% block breadcrumbs %}
-                        <div class="breadcrumbs">
-                            <a href="{% url 'admin:index' %}">{% translate 'Home' %}</a>
-                            {% if title %}&rsaquo; {{ title }}{% endif %}
-                        </div>
-                    {% endblock %}{% endif %}
-                    <div class="main" id="main">
-                        {% if not is_popup and is_nav_sidebar_enabled %}
-                            {% block nav-sidebar %}
-                                {% include "admin/nav_sidebar.html" %}{% endblock %}{% endif %}
-                                <div class="content">
-                                    {% block messages %}
-                                        {% if messages %}
-                                            <ul class="messagelist">
-                                                {% for message in messages %}
-                                                    <li{% if message.tags %}class="{{ message.tags }}"{% endif %}>{{ message|capfirst }}
-                                                </li>
-                                            {% endfor %}
-                                        </ul>
-                                    {% endif %}
-                                {% endblock messages %}
-                                <!-- Content -->
-                                <div id="content" class="{% block coltype %}colM{% endblock %}">
-                                {% block pretitle %}{% endblock %}
-                                {% block content_title %}{% if title %}
-                                    <h1>{{ title }}</h1>
-                                {% endif %}{% endblock %}
-                                {% block content_subtitle %}{% if subtitle %}
-                                    <h2>{{ subtitle }}</h2>
-                                {% endif %}{% endblock %}
-                                {% block content %}
-                                    {% block object-tools %}{% endblock %}
-                                    {{ content }}
-                                {% endblock %}
-                                {% block sidebar %}{% endblock %}
-                                <br class="clear">
+                        {% endblock %}{% endif %}
+                        <div class="main" id="main">
+                            {% if not is_popup and is_nav_sidebar_enabled %}
+                                {% block nav-sidebar %}
+                                    {% include "admin/nav_sidebar.html" %}{% endblock %}{% endif %}
+                                    <div class="content">
+                                        {% block messages %}
+                                            {% if messages %}
+                                                <ul class="messagelist">
+                                                    {% for message in messages %}
+                                                        <li{% if message.tags %}class="{{ message.tags }}"{% endif %}>{{ message|capfirst }}
+                                                        </li>
+                                                    {% endfor %}
+                                                </ul>
+                                            {% endif %}
+                                        {% endblock messages %}
+                                        <!-- Content -->
+                                        <div id="content" class="{% block coltype %}colM{% endblock %}">
+                                            {% block pretitle %}{% endblock %}
+                                            {% block content_title %}{% if title %}
+                                                <h1>{{ title }}</h1>
+                                            {% endif %}{% endblock %}
+                                            {% block content_subtitle %}{% if subtitle %}
+                                                <h2>{{ subtitle }}</h2>
+                                            {% endif %}{% endblock %}
+                                            {% block content %}
+                                                {% block object-tools %}{% endblock %}
+                                                {{ content }}
+                                            {% endblock %}
+                                            {% block sidebar %}{% endblock %}
+                                            <br class="clear">
+                                        </div>
+                                        <!-- END Content -->
+                                        {% block footer %}
+                                            <div id="footer"></div>
+                                        {% endblock %}
+                                    </div>
+                                </div>
                             </div>
-                            <!-- END Content -->
-                            {% block footer %}
-                                <div id="footer"></div>
-                            {% endblock %}
-                        </div>
-                    </div>
-                </div>
-                <!-- END Container -->
-            </body>
-        </html>
+                            <!-- END Container -->
+                        </body>
+                    </html>
diff --git a/tests/django_admin/admin/change_form.html b/tests/django_admin/admin/change_form.html
index 48d5671..e187223 100644
--- a/tests/django_admin/admin/change_form.html
+++ b/tests/django_admin/admin/change_form.html
@@ -56,42 +56,42 @@
                   {% endif %} {% if form_url %}action="{{ form_url }}"
                   {% endif %} method="post"
                   id="{{ opts.model_name }}_form">
-            {% csrf_token %}{% block form_top %}{% endblock %}
-            <div>
-                {% if is_popup %}
-                    <input type="hidden" name="{{ is_popup_var }}" value="1">
-                {% endif %}
-                {% if to_field %}
-                    <input type="hidden" name="{{ to_field_var }}" value="{{ to_field }}">
-                {% endif %}
-                {% if save_on_top %}
-                    {% block submit_buttons_top %}
-                        {% submit_row %}{% endblock %}{% endif %}
-                        {% if errors %}
-                            <p class="errornote">
-                                {% if errors|length == 1 %}{% translate "Please correct the error below." %}{% else %}
-                                    {% translate "Please correct the errors below." %}{% endif %}
-                                </p>
-                                {{ adminform.form.non_field_errors }}
-                            {% endif %}
-                            {% block field_sets %}
-                                {% for fieldset in adminform %}
-                                    {% include "admin/includes/fieldset.html" %}{% endfor %}
-                                {% endblock %}
-                                {% block after_field_sets %}{% endblock %}
-                                {% block inline_field_sets %}
-                                    {% for inline_admin_formset in inline_admin_formsets %}
-                                        {% include inline_admin_formset.opts.template %}{% endfor %}
+                {% csrf_token %}{% block form_top %}{% endblock %}
+                <div>
+                    {% if is_popup %}
+                        <input type="hidden" name="{{ is_popup_var }}" value="1">
+                    {% endif %}
+                    {% if to_field %}
+                        <input type="hidden" name="{{ to_field_var }}" value="{{ to_field }}">
+                    {% endif %}
+                    {% if save_on_top %}
+                        {% block submit_buttons_top %}
+                            {% submit_row %}{% endblock %}{% endif %}
+                            {% if errors %}
+                                <p class="errornote">
+                                    {% if errors|length == 1 %}{% translate "Please correct the error below." %}{% else %}
+                                        {% translate "Please correct the errors below." %}{% endif %}
+                                    </p>
+                                    {{ adminform.form.non_field_errors }}
+                                {% endif %}
+                                {% block field_sets %}
+                                    {% for fieldset in adminform %}
+                                        {% include "admin/includes/fieldset.html" %}{% endfor %}
                                     {% endblock %}
-                                    {% block after_related_objects %}{% endblock %}
-                                    {% block submit_buttons_bottom %}
-                                        {% submit_row %}{% endblock %}
-                                        {% block admin_change_form_document_ready %}
-                                            <script id="django-admin-form-add-constants" src="{% static 'admin/js/change_form.js' %}" {% if adminform and add %}data-model-name="{{ opts.model_name }}" {% endif %} async></script>
+                                    {% block after_field_sets %}{% endblock %}
+                                    {% block inline_field_sets %}
+                                        {% for inline_admin_formset in inline_admin_formsets %}
+                                            {% include inline_admin_formset.opts.template %}{% endfor %}
                                         {% endblock %}
-                                        {# JavaScript for prepopulated fields #}
-                                        {% prepopulated_fields_js %}
-                                    </div>
-                                </form>
-                            </div>
-                        {% endblock %}
+                                        {% block after_related_objects %}{% endblock %}
+                                        {% block submit_buttons_bottom %}
+                                            {% submit_row %}{% endblock %}
+                                            {% block admin_change_form_document_ready %}
+                                                <script id="django-admin-form-add-constants" src="{% static 'admin/js/change_form.js' %}" {% if adminform and add %}data-model-name="{{ opts.model_name }}" {% endif %} async></script>
+                                            {% endblock %}
+                                            {# JavaScript for prepopulated fields #}
+                                            {% prepopulated_fields_js %}
+                                        </div>
+                                    </form>
+                                </div>
+                            {% endblock %}
diff --git a/tests/django_admin/admin/change_list.html b/tests/django_admin/admin/change_list.html
index ececaa4..a29b361 100644
--- a/tests/django_admin/admin/change_list.html
+++ b/tests/django_admin/admin/change_list.html
@@ -57,57 +57,57 @@
             {{ cl.formset.non_form_errors }}
         {% endif %}
         <div class="module{% if cl.has_filters %}filtered{% endif %}" id="changelist">
-        <div class="changelist-form-container">
-            {% block search %}
-                {% search_form cl %}
-            {% endblock %}
-            {% block date_hierarchy %}
-                {% if cl.date_hierarchy %}
-                    {% date_hierarchy cl %}
-                {% endif %}
-            {% endblock %}
-            <form id="changelist-form" method="post"
-                {% if cl.formset and cl.formset.is_multipart %}
-                    enctype="multipart/form-data"
-                {% endif %}
-                novalidate>
-                {% csrf_token %}
-                {% if cl.formset %}
-                    <div>
-                        {{ cl.formset.management_form }}
+            <div class="changelist-form-container">
+                {% block search %}
+                    {% search_form cl %}
+                {% endblock %}
+                {% block date_hierarchy %}
+                    {% if cl.date_hierarchy %}
+                        {% date_hierarchy cl %}
+                    {% endif %}
+                {% endblock %}
+                <form id="changelist-form" method="post"
+                    {% if cl.formset and cl.formset.is_multipart %}
+                        enctype="multipart/form-data"
+                    {% endif %}
+                    novalidate>
+                    {% csrf_token %}
+                    {% if cl.formset %}
+                        <div>
+                            {{ cl.formset.management_form }}
+                        </div>
+                    {% endif %}
+                    {% block result_list %}
+                        {% if action_form and actions_on_top and cl.show_admin_actions %}
+                            {% admin_actions %}
+                        {% endif %}
+                        {% result_list cl %}
+                        {% if action_form and actions_on_bottom and cl.show_admin_actions %}
+                            {% admin_actions %}
+                        {% endif %}
+                    {% endblock %}
+                    {% block pagination %}
+                        {% pagination cl %}
+                    {% endblock %}
+                </form>
+            </div>
+            {% block filters %}
+                {% if cl.has_filters %}
+                    <div id="changelist-filter">
+                        <h2>{% translate 'Filter' %}</h2>
+                        {% if cl.has_active_filters %}
+                            <h3 id="changelist-filter-clear">
+                                <a href="{{ cl.clear_all_filters_qs }}">
+                                    &#10006; {% translate "Clear all filters" %}
+                                </a>
+                            </h3>
+                        {% endif %}
+                        {% for spec in cl.filter_specs %}
+                            {% admin_list_filter cl spec %}
+                        {% endfor %}
                     </div>
                 {% endif %}
-                {% block result_list %}
-                    {% if action_form and actions_on_top and cl.show_admin_actions %}
-                        {% admin_actions %}
-                    {% endif %}
-                    {% result_list cl %}
-                    {% if action_form and actions_on_bottom and cl.show_admin_actions %}
-                        {% admin_actions %}
-                    {% endif %}
-                {% endblock %}
-                {% block pagination %}
-                    {% pagination cl %}
-                {% endblock %}
-            </form>
+            {% endblock %}
         </div>
-        {% block filters %}
-            {% if cl.has_filters %}
-                <div id="changelist-filter">
-                    <h2>{% translate 'Filter' %}</h2>
-                    {% if cl.has_active_filters %}
-                        <h3 id="changelist-filter-clear">
-                            <a href="{{ cl.clear_all_filters_qs }}">
-                                &#10006; {% translate "Clear all filters" %}
-                            </a>
-                        </h3>
-                    {% endif %}
-                    {% for spec in cl.filter_specs %}
-                        {% admin_list_filter cl spec %}
-                    {% endfor %}
-                </div>
-            {% endif %}
-        {% endblock %}
     </div>
-</div>
 {% endblock %}
diff --git a/tests/django_admin/admin/edit_inline/stacked.html b/tests/django_admin/admin/edit_inline/stacked.html
index dacb1a4..610b3ff 100644
--- a/tests/django_admin/admin/edit_inline/stacked.html
+++ b/tests/django_admin/admin/edit_inline/stacked.html
@@ -14,40 +14,40 @@
         {% for inline_admin_form in inline_admin_formset %}
             <div class="inline-related{% if inline_admin_form.original or inline_admin_form.show_url %} has_original{% endif %}{% if forloop.last and inline_admin_formset.has_add_permission %} empty-form last-related{% endif %}"
                  id="{{ inline_admin_formset.formset.prefix }}-{% if not forloop.last %}{{ forloop.counter0 }}{% else %}empty{% endif %}">
-            <h3>
-                <b>
-                {{ inline_admin_formset.opts.verbose_name|capfirst }}:
-                </b>
-                <span class="inline_label">
-                    {% if inline_admin_form.original %}
-                        {{ inline_admin_form.original }}
-                        {% if inline_admin_form.model_admin.show_change_link and inline_admin_form.model_admin.has_registered_model %}
-                            <a href="{% url inline_admin_form.model_admin.opts|admin_urlname:'change' inline_admin_form.original.pk|admin_urlquote %}"
-                               class="{% if inline_admin_formset.has_change_permission %}inlinechangelink{% else %}inlineviewlink{% endif %}">
-                            {% if inline_admin_formset.has_change_permission %}{% translate "Change" %}{% else %}{% translate "View" %}{% endif %}
+                <h3>
+                    <b>
+                    {{ inline_admin_formset.opts.verbose_name|capfirst }}:
+                    </b>
+                    <span class="inline_label">
+                        {% if inline_admin_form.original %}
+                            {{ inline_admin_form.original }}
+                            {% if inline_admin_form.model_admin.show_change_link and inline_admin_form.model_admin.has_registered_model %}
+                                <a href="{% url inline_admin_form.model_admin.opts|admin_urlname:'change' inline_admin_form.original.pk|admin_urlquote %}"
+                                   class="{% if inline_admin_formset.has_change_permission %}inlinechangelink{% else %}inlineviewlink{% endif %}">
+                                    {% if inline_admin_formset.has_change_permission %}{% translate "Change" %}{% else %}{% translate "View" %}{% endif %}
+                                </a>
+                            {% endif %}
+                        {% else %}
+                            #{{ forloop.counter }}
+                        {% endif %}
+                    </span>
+                    {% if inline_admin_form.show_url %}
+                        <a href="{{ inline_admin_form.absolute_url }}">
+                            {% translate "View on site" %}
                         </a>
                     {% endif %}
-                {% else %}
-                    #{{ forloop.counter }}
-                {% endif %}
-            </span>
-            {% if inline_admin_form.show_url %}
-                <a href="{{ inline_admin_form.absolute_url }}">
-                    {% translate "View on site" %}
-                </a>
-            {% endif %}
-            {% if inline_admin_formset.formset.can_delete and inline_admin_formset.has_delete_permission and inline_admin_form.original %}
-                <span class="delete">
-                    {{ inline_admin_form.deletion_field.field }} {{ inline_admin_form.deletion_field.label_tag }}
-                </span>
-            {% endif %}
-        </h3>
-        {% if inline_admin_form.form.non_field_errors %}{{ inline_admin_form.form.non_field_errors }}{% endif %}
-        {% for fieldset in inline_admin_form %}
-            {% include "admin/includes/fieldset.html" %}{% endfor %}
-            {% if inline_admin_form.needs_explicit_pk_field %}{{ inline_admin_form.pk_field.field }}{% endif %}
-            {% if inline_admin_form.fk_field %}{{ inline_admin_form.fk_field.field }}{% endif %}
-        </div>
-    {% endfor %}
-</fieldset>
-</div>
+                    {% if inline_admin_formset.formset.can_delete and inline_admin_formset.has_delete_permission and inline_admin_form.original %}
+                        <span class="delete">
+                            {{ inline_admin_form.deletion_field.field }} {{ inline_admin_form.deletion_field.label_tag }}
+                        </span>
+                    {% endif %}
+                </h3>
+                {% if inline_admin_form.form.non_field_errors %}{{ inline_admin_form.form.non_field_errors }}{% endif %}
+                {% for fieldset in inline_admin_form %}
+                    {% include "admin/includes/fieldset.html" %}{% endfor %}
+                    {% if inline_admin_form.needs_explicit_pk_field %}{{ inline_admin_form.pk_field.field }}{% endif %}
+                    {% if inline_admin_form.fk_field %}{{ inline_admin_form.fk_field.field }}{% endif %}
+                </div>
+            {% endfor %}
+        </fieldset>
+    </div>
diff --git a/tests/django_admin/admin/edit_inline/tabular.html b/tests/django_admin/admin/edit_inline/tabular.html
index 491868b..23cdeec 100644
--- a/tests/django_admin/admin/edit_inline/tabular.html
+++ b/tests/django_admin/admin/edit_inline/tabular.html
@@ -4,107 +4,107 @@
      data-inline-type="tabular"
      data-inline-formset="{{ inline_admin_formset.inline_formset_data }}">
     <div class="tabular inline-related {% if forloop.last %}last-related{% endif %}">
-    {{ inline_admin_formset.formset.management_form }}
-    <fieldset class="module {{ inline_admin_formset.classes }}">
-        {% if inline_admin_formset.formset.max_num == 1 %}
-            <h2>{{ inline_admin_formset.opts.verbose_name|capfirst }}</h2>
-        {% else %}
-            <h2>{{ inline_admin_formset.opts.verbose_name_plural|capfirst }}</h2>
-        {% endif %}
-        {{ inline_admin_formset.formset.non_form_errors }}
-        <table>
-            <thead>
-                <tr>
-                    <th class="original"></th>
-                    {% for field in inline_admin_formset.fields %}
-                        {% if not field.widget.is_hidden %}
-                            <th class="column-{{ field.name }}{% if field.required %}required{% endif %}">
-                            {{ field.label|capfirst }}
-                            {% if field.help_text %}
-                                <img src="{% static "
-                                     admin/img/icon-unknown.svg" %}" class="help help-tooltip"
-                                     width="10"
-                                     height="10"
-                                     alt="({{ field.help_text|striptags }})"
-                                     title="{{ field.help_text|striptags }}">
-                                {% endif %}
-                            </th>
+        {{ inline_admin_formset.formset.management_form }}
+        <fieldset class="module {{ inline_admin_formset.classes }}">
+            {% if inline_admin_formset.formset.max_num == 1 %}
+                <h2>{{ inline_admin_formset.opts.verbose_name|capfirst }}</h2>
+            {% else %}
+                <h2>{{ inline_admin_formset.opts.verbose_name_plural|capfirst }}</h2>
+            {% endif %}
+            {{ inline_admin_formset.formset.non_form_errors }}
+            <table>
+                <thead>
+                    <tr>
+                        <th class="original"></th>
+                        {% for field in inline_admin_formset.fields %}
+                            {% if not field.widget.is_hidden %}
+                                <th class="column-{{ field.name }}{% if field.required %}required{% endif %}">
+                                    {{ field.label|capfirst }}
+                                    {% if field.help_text %}
+                                        <img src="{% static "
+                                             admin/img/icon-unknown.svg" %}" class="help help-tooltip"
+                                             width="10"
+                                             height="10"
+                                             alt="({{ field.help_text|striptags }})"
+                                             title="{{ field.help_text|striptags }}">
+                                    {% endif %}
+                                </th>
+                            {% endif %}
+                        {% endfor %}
+                        {% if inline_admin_formset.formset.can_delete and inline_admin_formset.has_delete_permission %}
+                            <th>{% translate "Delete?" %}</th>
                         {% endif %}
-                    {% endfor %}
-                    {% if inline_admin_formset.formset.can_delete and inline_admin_formset.has_delete_permission %}
-                        <th>{% translate "Delete?" %}</th>
-                    {% endif %}
-                </tr>
-            </thead>
-            <tbody>
-                {% for inline_admin_form in inline_admin_formset %}
-                    {% if inline_admin_form.form.non_field_errors %}
-                        <tr class="row-form-errors">
-                            <td colspan="{{ inline_admin_form|cell_count }}">
-                                {{ inline_admin_form.form.non_field_errors }}
-                            </td>
-                        </tr>
-                    {% endif %}
-                    <tr class="form-row {% if inline_admin_form.original or inline_admin_form.show_url %}has_original{% endif %}{% if forloop.last and inline_admin_formset.has_add_permission %} empty-form{% endif %}"
-                        id="{{ inline_admin_formset.formset.prefix }}-{% if not forloop.last %}{{ forloop.counter0 }}{% else %}empty{% endif %}">
-                    <td class="original">
-                        {% if inline_admin_form.original or inline_admin_form.show_url %}
-                            <p>
-                                {% if inline_admin_form.original %}
-                                    {{ inline_admin_form.original }}
-                                    {% if inline_admin_form.model_admin.show_change_link and inline_admin_form.model_admin.has_registered_model %}
-                                        <a href="{% url inline_admin_form.model_admin.opts|admin_urlname:'change' inline_admin_form.original.pk|admin_urlquote %}"
-                                           class="{% if inline_admin_formset.has_change_permission %}inlinechangelink{% else %}inlineviewlink{% endif %}">
-                                        {% if inline_admin_formset.has_change_permission %}{% translate "Change" %}{% else %}{% translate "View" %}{% endif %}
-                                    </a>
+                    </tr>
+                </thead>
+                <tbody>
+                    {% for inline_admin_form in inline_admin_formset %}
+                        {% if inline_admin_form.form.non_field_errors %}
+                            <tr class="row-form-errors">
+                                <td colspan="{{ inline_admin_form|cell_count }}">
+                                    {{ inline_admin_form.form.non_field_errors }}
+                                </td>
+                            </tr>
+                        {% endif %}
+                        <tr class="form-row {% if inline_admin_form.original or inline_admin_form.show_url %}has_original{% endif %}{% if forloop.last and inline_admin_formset.has_add_permission %} empty-form{% endif %}"
+                            id="{{ inline_admin_formset.formset.prefix }}-{% if not forloop.last %}{{ forloop.counter0 }}{% else %}empty{% endif %}">
+                            <td class="original">
+                                {% if inline_admin_form.original or inline_admin_form.show_url %}
+                                    <p>
+                                        {% if inline_admin_form.original %}
+                                            {{ inline_admin_form.original }}
+                                            {% if inline_admin_form.model_admin.show_change_link and inline_admin_form.model_admin.has_registered_model %}
+                                                <a href="{% url inline_admin_form.model_admin.opts|admin_urlname:'change' inline_admin_form.original.pk|admin_urlquote %}"
+                                                   class="{% if inline_admin_formset.has_change_permission %}inlinechangelink{% else %}inlineviewlink{% endif %}">
+                                                    {% if inline_admin_formset.has_change_permission %}{% translate "Change" %}{% else %}{% translate "View" %}{% endif %}
+                                                </a>
+                                            {% endif %}
+                                        {% endif %}
+                                        {% if inline_admin_form.show_url %}
+                                            <a href="{{ inline_admin_form.absolute_url }}">
+                                                {% translate "View on site" %}
+                                            </a>
+                                        {% endif %}
+                                    </p>
                                 {% endif %}
-                            {% endif %}
-                            {% if inline_admin_form.show_url %}
-                                <a href="{{ inline_admin_form.absolute_url }}">
-                                    {% translate "View on site" %}
-                                </a>
-                            {% endif %}
-                        </p>
-                    {% endif %}
-                    {% if inline_admin_form.needs_explicit_pk_field %}{{ inline_admin_form.pk_field.field }}{% endif %}
-                    {% if inline_admin_form.fk_field %}{{ inline_admin_form.fk_field.field }}{% endif %}
-                    {% spaceless %}
-                        {% for fieldset in inline_admin_form %}
-                            {% for line in fieldset %}
-                                {% for field in line %}
-                                    {% if not field.is_readonly and field.field.is_hidden %}{{ field.field }}{% endif %}
+                                {% if inline_admin_form.needs_explicit_pk_field %}{{ inline_admin_form.pk_field.field }}{% endif %}
+                                {% if inline_admin_form.fk_field %}{{ inline_admin_form.fk_field.field }}{% endif %}
+                                {% spaceless %}
+                                    {% for fieldset in inline_admin_form %}
+                                        {% for line in fieldset %}
+                                            {% for field in line %}
+                                                {% if not field.is_readonly and field.field.is_hidden %}{{ field.field }}{% endif %}
+                                            {% endfor %}
+                                        {% endfor %}
+                                    {% endfor %}
+                                {% endspaceless %}
+                            </td>
+                            {% for fieldset in inline_admin_form %}
+                                {% for line in fieldset %}
+                                    {% for field in line %}
+                                        {% if field.is_readonly or not field.field.is_hidden %}
+                                            <td{% if field.field.name %}class="field-{{ field.field.name }}"{% endif %}>
+                                                {% if field.is_readonly %}
+                                                    <p>
+                                                        {{ field.contents }}
+                                                    </p>
+                                                {% else %}
+                                                    {{ field.field.errors.as_ul }}
+                                                    {{ field.field }}
+                                                {% endif %}
+                                            </td>
+                                        {% endif %}
+                                    {% endfor %}
                                 {% endfor %}
                             {% endfor %}
-                        {% endfor %}
-                    {% endspaceless %}
-                </td>
-                {% for fieldset in inline_admin_form %}
-                    {% for line in fieldset %}
-                        {% for field in line %}
-                            {% if field.is_readonly or not field.field.is_hidden %}
-                                <td{% if field.field.name %}class="field-{{ field.field.name }}"{% endif %}>
-                                {% if field.is_readonly %}
-                                    <p>
-                                        {{ field.contents }}
-                                    </p>
-                                {% else %}
-                                    {{ field.field.errors.as_ul }}
-                                    {{ field.field }}
-                                {% endif %}
-                            </td>
-                        {% endif %}
+                            {% if inline_admin_formset.formset.can_delete and inline_admin_formset.has_delete_permission %}
+                                <td class="delete">
+                                    {% if inline_admin_form.original %}{{ inline_admin_form.deletion_field.field }}{% endif %}
+                                </td>
+                            {% endif %}
+                        </tr>
                     {% endfor %}
-                {% endfor %}
-            {% endfor %}
-            {% if inline_admin_formset.formset.can_delete and inline_admin_formset.has_delete_permission %}
-                <td class="delete">
-                    {% if inline_admin_form.original %}{{ inline_admin_form.deletion_field.field }}{% endif %}
-                </td>
-            {% endif %}
-        </tr>
-    {% endfor %}
-</tbody>
-</table>
-</fieldset>
-</div>
+                </tbody>
+            </table>
+        </fieldset>
+    </div>
 </div>
diff --git a/tests/django_admin/admin/includes/fieldset.html b/tests/django_admin/admin/includes/fieldset.html
index 4d36059..738498b 100644
--- a/tests/django_admin/admin/includes/fieldset.html
+++ b/tests/django_admin/admin/includes/fieldset.html
@@ -7,31 +7,31 @@
     {% endif %}
     {% for line in fieldset %}
         <div class="form-row{% if line.fields|length_is:'1' and line.errors %} errors{% endif %}{% if not line.has_visible_field %}hidden{% endif %}{% for field in line %}{% if field.field.name %}field-{{ field.field.name }}{% endif %}{% endfor %}">
-        {% if line.fields|length_is:'1' %}{{ line.errors }}{% endif %}
-        {% for field in line %}
-            <div
-                {% if not line.fields|length_is:'1' %}
-                    class="fieldBox {% if field.field.name %}field-{{ field.field.name }}{% endif %}{% if not field.is_readonly and field.errors %} errors{% endif %}{% if field.field.is_hidden %}hidden{% endif %}"{% elif field.is_checkbox %} class="checkbox-row"{% endif %}>
-                    {% if not line.fields|length_is:'1' and not field.is_readonly %}{{ field.errors }}{% endif %}
-                    {% if field.is_checkbox %}
-                        {{ field.field }}{{ field.label_tag }}
-                    {% else %}
-                        {{ field.label_tag }}
-                        {% if field.is_readonly %}
-                            <div class="readonly">
-                                {{ field.contents }}
-                            </div>
+            {% if line.fields|length_is:'1' %}{{ line.errors }}{% endif %}
+            {% for field in line %}
+                <div
+                    {% if not line.fields|length_is:'1' %}
+                        class="fieldBox {% if field.field.name %}field-{{ field.field.name }}{% endif %}{% if not field.is_readonly and field.errors %} errors{% endif %}{% if field.field.is_hidden %}hidden{% endif %}"{% elif field.is_checkbox %} class="checkbox-row"{% endif %}>
+                        {% if not line.fields|length_is:'1' and not field.is_readonly %}{{ field.errors }}{% endif %}
+                        {% if field.is_checkbox %}
+                            {{ field.field }}{{ field.label_tag }}
                         {% else %}
-                            {{ field.field }}
+                            {{ field.label_tag }}
+                            {% if field.is_readonly %}
+                                <div class="readonly">
+                                    {{ field.contents }}
+                                </div>
+                            {% else %}
+                                {{ field.field }}
+                            {% endif %}
                         {% endif %}
-                    {% endif %}
-                    {% if field.field.help_text %}
-                        <div class="help">
-                            {{ field.field.help_text|safe }}
-                        </div>
-                    {% endif %}
-                </div>
-            {% endfor %}
-        </div>
-    {% endfor %}
-</fieldset>
+                        {% if field.field.help_text %}
+                            <div class="help">
+                                {{ field.field.help_text|safe }}
+                            </div>
+                        {% endif %}
+                    </div>
+                {% endfor %}
+            </div>
+        {% endfor %}
+    </fieldset>
diff --git a/tests/django_admin/admin/index.html b/tests/django_admin/admin/index.html
index 867311b..957bc81 100644
--- a/tests/django_admin/admin/index.html
+++ b/tests/django_admin/admin/index.html
@@ -28,26 +28,26 @@
                 <ul class="actionlist">
                     {% for entry in admin_log %}
                         <li class="{% if entry.is_addition %}addlink{% endif %}{% if entry.is_change %}changelink{% endif %}{% if entry.is_deletion %}deletelink{% endif %}">
-                        {% if entry.is_deletion or not entry.get_admin_url %}
-                            {{ entry.object_repr }}
-                        {% else %}
-                            <a href="{{ entry.get_admin_url }}">
+                            {% if entry.is_deletion or not entry.get_admin_url %}
                                 {{ entry.object_repr }}
-                            </a>
+                            {% else %}
+                                <a href="{{ entry.get_admin_url }}">
+                                    {{ entry.object_repr }}
+                                </a>
+                            {% endif %}
+                            <br>
+                            {% if entry.content_type %}
+                                <span class="mini quiet">
+                                    {% filter capfirst %}{{ entry.content_type.name }}
+                                {% endfilter %}
+                            </span>
+                        {% else %}
+                            <span class="mini quiet">{% translate 'Unknown content' %}</span>
                         {% endif %}
-                        <br>
-                        {% if entry.content_type %}
-                            <span class="mini quiet">
-                                {% filter capfirst %}{{ entry.content_type.name }}
-                            {% endfilter %}
-                        </span>
-                    {% else %}
-                        <span class="mini quiet">{% translate 'Unknown content' %}</span>
-                    {% endif %}
-                </li>
-            {% endfor %}
-        </ul>
-    {% endif %}
-</div>
+                    </li>
+                {% endfor %}
+            </ul>
+        {% endif %}
+    </div>
 </div>
 {% endblock %}
diff --git a/tests/django_admin/admin/search_form.html b/tests/django_admin/admin/search_form.html
index ec2f252..adf76c7 100644
--- a/tests/django_admin/admin/search_form.html
+++ b/tests/django_admin/admin/search_form.html
@@ -6,16 +6,16 @@
                 <!-- DIV needed for valid HTML -->
                 <label for="searchbar">
                     <img src="{% static "admin/img/search.svg" %}" alt="Search">
-                    </label>
-                    <input type="text" size="40" name="{{ search_var }}" value="{{ cl.query }}" id="searchbar">
-                    <input type="submit" value="{% translate 'Search' %}">
-                    {% if show_result_count %}
-                        <span class="small quiet">
-                            {% blocktranslate count counter=cl.result_count %}
-                                {{ counter }} result{% plural %}{{ counter }} results
-                            {% endblocktranslate %}
-                            (
-                            <a href="?{% if cl.is_popup %}{{ is_popup_var }}=1{% endif %}">
+                </label>
+                <input type="text" size="40" name="{{ search_var }}" value="{{ cl.query }}" id="searchbar">
+                <input type="submit" value="{% translate 'Search' %}">
+                {% if show_result_count %}
+                    <span class="small quiet">
+                        {% blocktranslate count counter=cl.result_count %}
+                            {{ counter }} result{% plural %}{{ counter }} results
+                        {% endblocktranslate %}
+                        (
+                        <a href="?{% if cl.is_popup %}{{ is_popup_var }}=1{% endif %}">
                             {% if cl.show_full_result_count %}
                                 {% blocktranslate with full_result_count=cl.full_result_count %}
                                     {{ full_result_count }} total
diff --git a/tests/django_admin/admin/widgets/clearable_file_input.html b/tests/django_admin/admin/widgets/clearable_file_input.html
index c24d089..0197dab 100644
--- a/tests/django_admin/admin/widgets/clearable_file_input.html
+++ b/tests/django_admin/admin/widgets/clearable_file_input.html
@@ -7,9 +7,7 @@
                 <input type="checkbox" name="{{ widget.checkbox_name }}" id="{{ widget.checkbox_id }}"
                 {% if widget.attrs.disabled %}disabled {% endif %}
                 >
-                <label for="{{ widget.checkbox_id }}">
-                    {{ widget.clear_checkbox_label }}
-                </label>
+                <label for="{{ widget.checkbox_id }}">{{ widget.clear_checkbox_label }}</label>
             </span>
         {% endif %}
         <br>
diff --git a/tests/django_admin/admin/widgets/related_widget_wrapper.html b/tests/django_admin/admin/widgets/related_widget_wrapper.html
index 176d89a..295f23d 100644
--- a/tests/django_admin/admin/widgets/related_widget_wrapper.html
+++ b/tests/django_admin/admin/widgets/related_widget_wrapper.html
@@ -10,25 +10,25 @@
                        data-href-template="{{ change_related_template_url }}?{{ url_params }}"
                        title="{% blocktranslate %}Change selected {{ model }}{% endblocktranslate %}">
                         <img src="{% static 'admin/img/icon-changelink.svg' %}" alt="{% translate 'Change' %}">
-                        </a>
-                    {% endif %}
-                    {% if can_add_related %}
-                        <a class="related-widget-wrapper-link add-related"
-                           id="add_id_{{ name }}"
-                           href="{{ add_related_url }}?{{ url_params }}"
-                           title="{% blocktranslate %}Add another {{ model }}{% endblocktranslate %}">
-                            <img src="{% static 'admin/img/icon-addlink.svg' %}" alt="{% translate 'Add' %}">
-                            </a>
-                        {% endif %}
-                        {% if can_delete_related %}
-                            <a class="related-widget-wrapper-link delete-related"
-                               id="delete_id_{{ name }}"
-                               data-href-template="{{ delete_related_template_url }}?{{ url_params }}"
-                               title="{% blocktranslate %}Delete selected {{ model }}{% endblocktranslate %}">
-                                <img src="{% static 'admin/img/icon-deletelink.svg' %}" alt="{% translate 'Delete' %}">
-                                </a>
-                            {% endif %}
-                        {% endif %}
-                    {% endspaceless %}
-                {% endblock %}
-            </div>
+                    </a>
+                {% endif %}
+                {% if can_add_related %}
+                    <a class="related-widget-wrapper-link add-related"
+                       id="add_id_{{ name }}"
+                       href="{{ add_related_url }}?{{ url_params }}"
+                       title="{% blocktranslate %}Add another {{ model }}{% endblocktranslate %}">
+                        <img src="{% static 'admin/img/icon-addlink.svg' %}" alt="{% translate 'Add' %}">
+                    </a>
+                {% endif %}
+                {% if can_delete_related %}
+                    <a class="related-widget-wrapper-link delete-related"
+                       id="delete_id_{{ name }}"
+                       data-href-template="{{ delete_related_template_url }}?{{ url_params }}"
+                       title="{% blocktranslate %}Delete selected {{ model }}{% endblocktranslate %}">
+                        <img src="{% static 'admin/img/icon-deletelink.svg' %}" alt="{% translate 'Delete' %}">
+                    </a>
+                {% endif %}
+            {% endif %}
+        {% endspaceless %}
+    {% endblock %}
+</div>
diff --git a/tests/django_admin/admin/widgets/split_datetime.html b/tests/django_admin/admin/widgets/split_datetime.html
index 8d4f327..9355a62 100644
--- a/tests/django_admin/admin/widgets/split_datetime.html
+++ b/tests/django_admin/admin/widgets/split_datetime.html
@@ -1,7 +1,11 @@
 <p class="datetime">
-    {{ date_label }} {% with widget=widget.subwidgets.0 %}
-    {% include widget.template_name %}{% endwith %}
+    {{ date_label }}
+    {% with widget=widget.subwidgets.0 %}
+        {% include widget.template_name %}
+    {% endwith %}
     <br>
-    {{ time_label }} {% with widget=widget.subwidgets.1 %}
-    {% include widget.template_name %}{% endwith %}
+    {{ time_label }}
+    {% with widget=widget.subwidgets.1 %}
+        {% include widget.template_name %}
+    {% endwith %}
 </p>
diff --git a/tests/django_admin/registration/password_reset_confirm.html b/tests/django_admin/registration/password_reset_confirm.html
index 1f8c454..be40a0e 100644
--- a/tests/django_admin/registration/password_reset_confirm.html
+++ b/tests/django_admin/registration/password_reset_confirm.html
@@ -21,16 +21,12 @@
                 <input class="hidden" autocomplete="username" value="{{ form.user.get_username }}">
                 <div class="form-row field-password1">
                     {{ form.new_password1.errors }}
-                    <label for="id_new_password1">
-                        {% translate 'New password:' %}
-                    </label>
+                    <label for="id_new_password1">{% translate 'New password:' %}</label>
                     {{ form.new_password1 }}
                 </div>
                 <div class="form-row field-password2">
                     {{ form.new_password2.errors }}
-                    <label for="id_new_password2">
-                        {% translate 'Confirm password:' %}
-                    </label>
+                    <label for="id_new_password2">{% translate 'Confirm password:' %}</label>
                     {{ form.new_password2 }}
                 </div>
                 <input type="submit" value="{% translate 'Change my password' %}">
diff --git a/tests/django_admin/registration/password_reset_form.html b/tests/django_admin/registration/password_reset_form.html
index 82a204d..a9bee27 100644
--- a/tests/django_admin/registration/password_reset_form.html
+++ b/tests/django_admin/registration/password_reset_form.html
@@ -19,9 +19,7 @@
         <fieldset class="module aligned">
             <div class="form-row field-email">
                 {{ form.email.errors }}
-                <label for="id_email">
-                    {% translate 'Email address:' %}
-                </label>
+                <label for="id_email">{% translate 'Email address:' %}</label>
                 {{ form.email }}
             </div>
             <input type="submit" value="{% translate 'Reset my password' %}">
diff --git a/tests/django_cms/admin/cms/page/change_form.html b/tests/django_cms/admin/cms/page/change_form.html
index 53a51ad..c5a5b74 100644
--- a/tests/django_cms/admin/cms/page/change_form.html
+++ b/tests/django_cms/admin/cms/page/change_form.html
@@ -60,71 +60,74 @@
               {% endif %}action="?language={{ language }}{% if request.GET.parent_node %}&amp;parent_node={{ request.GET.parent_node }}{% endif %}{% if request.GET.source %}&amp;source={{ request.GET.source }}{% endif %}"
               method="post"
               id="page_form">
-        {% csrf_token %}
-        {% block form_top %}{% endblock %}
-        <div style="display: none;"><input type="hidden"
+            {% csrf_token %}
+            {% block form_top %}{% endblock %}
+            <div style="display: none;"><input type="hidden"
        name="language"
        value="{{ language }}"
        id="id_language"/></div>
-        {% if show_language_tabs and not show_permissions %}
-            <div id="page_form_lang_tabs">
-                {% for lang_code, lang_name in language_tabs %}
-                    <input type="button"
-                           onclick="CMS.API.changeLanguage('./?language={{ lang_code }}');"
-                           class="language_button {% if lang_code == language %}selected{% else %}{% if not lang_code in filled_languages %} notfilled{% endif %}{% endif %}"
-                           id="{{ lang_code }}button"
-                           name="{{ lang_code }}"
-                           value="{{ lang_name }}"/>
-                {% endfor %}
-                <div class="lang_tabs_line"></div>
-            </div>
-        {% endif %}
-        <div id="lang_tab_content">
-            {% if is_popup %}<input type="hidden" name="_popup" value="1" />{% endif %}
-            {% if save_on_top %}{% submit_row %}{% endif %}
-            {% if errors %}
-                <p class="errornote">
-                    {% blocktrans count errors|length as counter %}Please correct the error below.{% plural %}Please correct the errors below.{% endblocktrans %}
-                    </p>
-                    <ul class="errorlist">{% for error in adminform.form.non_field_errors %}<li>{{ error }}</li>{% endfor %}</ul>
-                {% endif %}
-                {% for fieldset in adminform %}
-                    {% include "admin/cms/page/includes/fieldset.html" %}{% endfor %}
-                    {% for inline_admin_formset in inline_admin_formsets %}
-                        {% include inline_admin_formset.opts.template %}{% endfor %}
-                        {% if show_permissions %}
-                            {% if CMS_PERMISSION and can_change_permissions %}
-                                <div class="inline-group">
-                                    <div class="tabular inline-related">
-                                        <fieldset id="inherited_permissions" class="module aligned collapse">
-                                            <h2>{% trans 'All permissions' %}</h2>
-                                            <div class="loading" rel="../permissions/">{% trans 'Loading...' %}</div>
-                                        </fieldset>
-                                    </div>
-                                </div>
-                            {% endif %}
-                        {% endif %}
-                        {% block after_related_objects %}{% endblock %}
-                        {% if add %}
-                            <div class="submit-row" {% if is_popup %} style="overflow: auto;">
-                                <input type="submit" name="_save" class="default" value="{% trans 'Save' %}"/>
-                                <input type="submit" name="_continue" value="{% trans 'Save and continue editing' %}"/>
-                            </div>
-                        {% else %}
-                            {% page_submit_row %}
-                        {% endif %}
-                    </div>
-                </form>
-            </div>
-            {% block admin_change_form_document_ready %}
-                {{ block.super }}
-            {% endblock %}
-            {% for url in unihandecode_urls %}<script src="{{ url }}" type="text/javascript"></script>{% endfor %}
-            {% if unihandecode_urls %}
-                <script>
-    var UNIHANDECODER = unihandecode.Unihan('{{ unihandecode_lang }}');
-                </script>
+            {% if show_language_tabs and not show_permissions %}
+                <div id="page_form_lang_tabs">
+                    {% for lang_code, lang_name in language_tabs %}
+                        <input type="button"
+                               onclick="CMS.API.changeLanguage('./?language={{ lang_code }}');"
+                               class="language_button {% if lang_code == language %}selected{% else %}{% if not lang_code in filled_languages %} notfilled{% endif %}{% endif %}"
+                               id="{{ lang_code }}button"
+                               name="{{ lang_code }}"
+                               value="{{ lang_name }}"/>
+                    {% endfor %}
+                    <div class="lang_tabs_line"></div>
+                </div>
             {% endif %}
-            {# JavaScript for prepopulated fields #}
-            {% prepopulated_fields_js %}
-        {% endblock %}
+            <div id="lang_tab_content">
+                {% if is_popup %}<input type="hidden" name="_popup" value="1" />{% endif %}
+                {% if save_on_top %}{% submit_row %}{% endif %}
+                {% if errors %}
+                    <p class="errornote">
+                        {% blocktrans count errors|length as counter %}Please correct the error below.{% plural %}Please correct the errors below.{% endblocktrans %}
+                        </p>
+                        <ul class="errorlist">{% for error in adminform.form.non_field_errors %}<li>{{ error }}</li>{% endfor %}</ul>
+                    {% endif %}
+                    {% for fieldset in adminform %}
+                        {% include "admin/cms/page/includes/fieldset.html" %}{% endfor %}
+                        {% for inline_admin_formset in inline_admin_formsets %}
+                            {% include inline_admin_formset.opts.template %}{% endfor %}
+                            {% if show_permissions %}
+                                {% if CMS_PERMISSION and can_change_permissions %}
+                                    <div class="inline-group">
+                                        <div class="tabular inline-related">
+                                            <fieldset id="inherited_permissions" class="module aligned collapse">
+                                                <h2>{% trans 'All permissions' %}</h2>
+                                                <div class="loading"
+                                                     rel="../permissions/">{% trans 'Loading...' %}</div>
+                                            </fieldset>
+                                        </div>
+                                    </div>
+                                {% endif %}
+                            {% endif %}
+                            {% block after_related_objects %}{% endblock %}
+                            {% if add %}
+                                <div class="submit-row" {% if is_popup %} style="overflow: auto;">
+                                    <input type="submit" name="_save" class="default" value="{% trans 'Save' %}"/>
+                                    <input type="submit"
+                                           name="_continue"
+                                           value="{% trans 'Save and continue editing' %}"/>
+                                </div>
+                            {% else %}
+                                {% page_submit_row %}
+                            {% endif %}
+                        </div>
+                    </form>
+                </div>
+                {% block admin_change_form_document_ready %}
+                    {{ block.super }}
+                {% endblock %}
+                {% for url in unihandecode_urls %}<script src="{{ url }}" type="text/javascript"></script>{% endfor %}
+                {% if unihandecode_urls %}
+                    <script>
+    var UNIHANDECODER = unihandecode.Unihan('{{ unihandecode_lang }}');
+                    </script>
+                {% endif %}
+                {# JavaScript for prepopulated fields #}
+                {% prepopulated_fields_js %}
+            {% endblock %}
diff --git a/tests/django_cms/admin/cms/page/permissions.html b/tests/django_cms/admin/cms/page/permissions.html
index 50034e2..b1e7e36 100644
--- a/tests/django_cms/admin/cms/page/permissions.html
+++ b/tests/django_cms/admin/cms/page/permissions.html
@@ -21,55 +21,55 @@
         <tbody>
             {% for row in rows %}
                 {% with permission=row.permission %}
-                <tr class="{% cycle 'row1' 'row2' %}">
-                    <td class="page">
-                        {% if row.is_global %}
-                            {% if row.can_change %}
-                                <a href="{% cms_admin_url 'cms_globalpagepermission_change' permission.id %}">
-                                    {% trans "(global)" %}
-                                </a>
-                            {% else %}
-                                {% trans "(global)" %}
-                            {% endif %}
-                        {% else %}
-                            {% if permission.page_id == page.id %}
-                                {% trans "(current)" %}
-                            {% else %}
+                    <tr class="{% cycle 'row1' 'row2' %}">
+                        <td class="page">
+                            {% if row.is_global %}
                                 {% if row.can_change %}
-                                    <a href="{% url opts|admin_urlname:'change' permission.page_id %}">
-                                        {{ permission.page }}
+                                    <a href="{% cms_admin_url 'cms_globalpagepermission_change' permission.id %}">
+                                        {% trans "(global)" %}
                                     </a>
                                 {% else %}
-                                    {{ permission.page }}
+                                    {% trans "(global)" %}
+                                {% endif %}
+                            {% else %}
+                                {% if permission.page_id == page.id %}
+                                    {% trans "(current)" %}
+                                {% else %}
+                                    {% if row.can_change %}
+                                        <a href="{% url opts|admin_urlname:'change' permission.page_id %}">
+                                            {{ permission.page }}
+                                        </a>
+                                    {% else %}
+                                        {{ permission.page }}
+                                    {% endif %}
                                 {% endif %}
                             {% endif %}
-                        {% endif %}
-                    </td>
-                    <td class="user">{{ permission.user|default_if_none:"-" }}</td>
-                    <td class="group">{{ permission.group|default_if_none:"-" }}</td>
-                    <td class="can_change">{{ permission.can_change|boolean_icon }}</td>
-                    <td class="can_add">{{ permission.can_add|boolean_icon }}</td>
-                    <td class="can_delete">{{ permission.can_delete|boolean_icon }}</td>
-                    <td class="can_publish">{{ permission.can_publish|boolean_icon }}</td>
-                    <td class="can_change_permissions">
-                        {{ permission.can_change_permissions|boolean_icon }}
-                    </td>
-                    <td class="can_move_page">{{ permission.can_move_page|boolean_icon }}</td>
-                    <td class="can_view">{{ permission.can_view|boolean_icon }}</td>
-                    <td class="grant_on">
-                        {% if row.is_global %}
-                            {% trans "All" %}
-                        {% else %}
-                            {{ permission.get_grant_on_display }}
-                        {% endif %}
-                    </td>
-                </tr>
-            {% endwith %}
-        {% endfor %}
-    </tbody>
-</table>
+                        </td>
+                        <td class="user">{{ permission.user|default_if_none:"-" }}</td>
+                        <td class="group">{{ permission.group|default_if_none:"-" }}</td>
+                        <td class="can_change">{{ permission.can_change|boolean_icon }}</td>
+                        <td class="can_add">{{ permission.can_add|boolean_icon }}</td>
+                        <td class="can_delete">{{ permission.can_delete|boolean_icon }}</td>
+                        <td class="can_publish">{{ permission.can_publish|boolean_icon }}</td>
+                        <td class="can_change_permissions">
+                            {{ permission.can_change_permissions|boolean_icon }}
+                        </td>
+                        <td class="can_move_page">{{ permission.can_move_page|boolean_icon }}</td>
+                        <td class="can_view">{{ permission.can_view|boolean_icon }}</td>
+                        <td class="grant_on">
+                            {% if row.is_global %}
+                                {% trans "All" %}
+                            {% else %}
+                                {{ permission.get_grant_on_display }}
+                            {% endif %}
+                        </td>
+                    </tr>
+                {% endwith %}
+            {% endfor %}
+        </tbody>
+    </table>
 {% else %}
-<p>
-    {% trans "Page doesn't inherit any permissions." %}
-</p>
+    <p>
+        {% trans "Page doesn't inherit any permissions." %}
+    </p>
 {% endif %}
diff --git a/tests/django_cms/admin/cms/page/submit_row.html b/tests/django_cms/admin/cms/page/submit_row.html
index 91199e8..0a35328 100644
--- a/tests/django_cms/admin/cms/page/submit_row.html
+++ b/tests/django_cms/admin/cms/page/submit_row.html
@@ -14,21 +14,21 @@
         {% if show_buttons %}
             <a href="{% url opts|admin_urlname:'change' object_id %}?language={{ language }}"
                class="cms-btn-group{% if basic_info_active %}cms-btn-active{% endif %}">
-            {% trans "Basic Settings" %}
-        </a>
-        <a href="{% url opts|admin_urlname:'advanced' object_id %}?language={{ language }}"
-           class="cms-btn-group{% if advanced_settings_active %}cms-btn-active{% endif %}">
-        {% trans "Advanced Settings" %}
-    </a>
-{% endif %}
-</p>
-{% if show_save_as_new %}
-<input type="submit" value="{% trans 'Save as new' %}" name="_saveasnew" />
-{% endif %}
-{% if show_save_and_add_another %}
-<input type="submit" value="{% trans 'Save and add another' %}" name="_addanother" />
-{% endif %}
-{% if show_save_and_continue %}
-<input type="submit" value="{% trans 'Save and continue editing' %}" name="_continue" />
-{% endif %}
+                {% trans "Basic Settings" %}
+            </a>
+            <a href="{% url opts|admin_urlname:'advanced' object_id %}?language={{ language }}"
+               class="cms-btn-group{% if advanced_settings_active %}cms-btn-active{% endif %}">
+                {% trans "Advanced Settings" %}
+            </a>
+        {% endif %}
+    </p>
+    {% if show_save_as_new %}
+        <input type="submit" value="{% trans 'Save as new' %}" name="_saveasnew" />
+    {% endif %}
+    {% if show_save_and_add_another %}
+        <input type="submit" value="{% trans 'Save and add another' %}" name="_addanother" />
+    {% endif %}
+    {% if show_save_and_continue %}
+        <input type="submit" value="{% trans 'Save and continue editing' %}" name="_continue" />
+    {% endif %}
 </div>
diff --git a/tests/django_cms/admin/cms/page/tree/actions_dropdown.html b/tests/django_cms/admin/cms/page/tree/actions_dropdown.html
index 8f4fa55..10695db 100644
--- a/tests/django_cms/admin/cms/page/tree/actions_dropdown.html
+++ b/tests/django_cms/admin/cms/page/tree/actions_dropdown.html
@@ -39,124 +39,124 @@
                            data-id="{{ page.pk }}"
                            data-node-id="{{ node.pk }}"
                            class="{% if has_add_permission %}js-cms-tree-item-paste{% endif %} {% if not has_add_permission or not paste_enabled %} cms-pagetree-dropdown-item-disabled{% endif %}">
-                        <span class="cms-icon cms-icon-alias"></span>
-                        <span>{% filter escapejs %}{% trans "Paste" %}{% endfilter %}</span>
-                    </a>
-                </li>
-                <li>
-                    {% if has_delete_permission %}
-                        <a href="{% url opts|admin_urlname:'delete' page.id %}?language={{ preview_language }}"
-                           title="{% filter escapejs %}{% trans ">
-                        {% else %}
-                            <a href="#" class="cms-pagetree-dropdown-item-disabled">
-                            {% endif %}
-                            <span class="cms-icon cms-icon-bin"></span>
-                            <span>{% filter escapejs %}{% trans "Delete" %}...{% endfilter %}</span>
+                            <span class="cms-icon cms-icon-alias"></span>
+                            <span>{% filter escapejs %}{% trans "Paste" %}{% endfilter %}</span>
                         </a>
                     </li>
-                    {% if has_change_permission and page.is_potential_home %}
-                        <li class="js-cms-tree-item-set-home">
-                            <a href="{% url opts|admin_urlname:'set_home' page.id %}"
-                               title="{% filter escapejs %}{% trans ">
-                                <span class="cms-icon cms-icon-home"></span>
-                                <span>{% filter escapejs %}{% trans "Set as home" %}{% endfilter %}</span>
-                            </a>
-                        </li>
-                    {% else %}
-                        <li class="js-cms-tree-item-set-home">
-                            <a href="#" class="cms-pagetree-dropdown-item-disabled">
-                                <span class="cms-icon cms-icon-home"></span>
-                                <span>{% filter escapejs %}{% trans "Set as home" %}{% endfilter %}</span>
-                            </a>
-                        </li>
-                    {% endif %}
                     <li>
-                        {% if has_change_advanced_settings_permission %}
-                            <a href="{% url opts|admin_urlname:'advanced' page.id %}"
+                        {% if has_delete_permission %}
+                            <a href="{% url opts|admin_urlname:'delete' page.id %}?language={{ preview_language }}"
                                title="{% filter escapejs %}{% trans ">
                             {% else %}
                                 <a href="#" class="cms-pagetree-dropdown-item-disabled">
                                 {% endif %}
-                                <span class="cms-icon cms-icon-cogs"></span>
-                                <span>{% filter escapejs %}{% trans "Advanced settings" %}{% endfilter %}</span>
+                                <span class="cms-icon cms-icon-bin"></span>
+                                <span>{% filter escapejs %}{% trans "Delete" %}...{% endfilter %}</span>
                             </a>
                         </li>
-                        {% if CMS_PERMISSION %}
-                            <li>
-                                {% if has_change_permissions_permission %}
-                                    <a href="{% url opts|admin_urlname:'permissions' page.id %}"
-                                       title="{% filter escapejs %}{% trans ">
-                                    {% else %}
-                                        <a href="#" class="cms-pagetree-dropdown-item-disabled">
-                                        {% endif %}
-                                        <span class="cms-icon cms-icon-lock"></span>
-                                        <span>{% filter escapejs %}{% trans "Permissions" %}{% endfilter %}</span>
-                                    </a>
-                                </li>
-                            {% endif %}
-                        {% endblock actions %}
-                        <li class="cms-pagetree-dropdown-separator">
-                            &nbsp;
-                        </li>
+                        {% if has_change_permission and page.is_potential_home %}
+                            <li class="js-cms-tree-item-set-home">
+                                <a href="{% url opts|admin_urlname:'set_home' page.id %}"
+                                   title="{% filter escapejs %}{% trans ">
+                                    <span class="cms-icon cms-icon-home"></span>
+                                    <span>{% filter escapejs %}{% trans "Set as home" %}{% endfilter %}</span>
+                                </a>
+                            </li>
+                        {% else %}
+                            <li class="js-cms-tree-item-set-home">
+                                <a href="#" class="cms-pagetree-dropdown-item-disabled">
+                                    <span class="cms-icon cms-icon-home"></span>
+                                    <span>{% filter escapejs %}{% trans "Set as home" %}{% endfilter %}</span>
+                                </a>
+                            </li>
+                        {% endif %}
                         <li>
-                            {% if page.publication_date %}
-                                <p title="{% filter escapejs %}{% trans ">
-                                    <strong>{% filter escapejs %}{% trans "publication date" %}{% endfilter %}:</strong>
-                                    {{ page.publication_date|date:"Y-m-d" }}
-                                </p>
-                            {% endif %}
-                            {% if page.publication_end_date %}
-                                <p title="{% filter escapejs %}{% trans ">
-                                    <strong>{% filter escapejs %}{% trans "publication end date" %}{% endfilter %}:</strong>
-                                    {{ page.publication_end_date|date:"Y-m-d" }}
-                                </p>
-                            {% endif %}
-                            <p title="{% filter escapejs %}{% trans ">
-                                <strong>{% filter escapejs %}{% trans "is restricted" %}{% endfilter %}:</strong>
-                                {% if page_is_restricted %}
-                                    {% filter escapejs %}{% trans "Yes" %}{% endfilter %}
+                            {% if has_change_advanced_settings_permission %}
+                                <a href="{% url opts|admin_urlname:'advanced' page.id %}"
+                                   title="{% filter escapejs %}{% trans ">
                                 {% else %}
-                                    {% filter escapejs %}{% trans "No" %}{% endfilter %}
+                                    <a href="#" class="cms-pagetree-dropdown-item-disabled">
+                                    {% endif %}
+                                    <span class="cms-icon cms-icon-cogs"></span>
+                                    <span>{% filter escapejs %}{% trans "Advanced settings" %}{% endfilter %}</span>
+                                </a>
+                            </li>
+                            {% if CMS_PERMISSION %}
+                                <li>
+                                    {% if has_change_permissions_permission %}
+                                        <a href="{% url opts|admin_urlname:'permissions' page.id %}"
+                                           title="{% filter escapejs %}{% trans ">
+                                        {% else %}
+                                            <a href="#" class="cms-pagetree-dropdown-item-disabled">
+                                            {% endif %}
+                                            <span class="cms-icon cms-icon-lock"></span>
+                                            <span>{% filter escapejs %}{% trans "Permissions" %}{% endfilter %}</span>
+                                        </a>
+                                    </li>
+                                {% endif %}
+                            {% endblock actions %}
+                            <li class="cms-pagetree-dropdown-separator">
+                                &nbsp;
+                            </li>
+                            <li>
+                                {% if page.publication_date %}
+                                    <p title="{% filter escapejs %}{% trans ">
+                                        <strong>{% filter escapejs %}{% trans "publication date" %}{% endfilter %}:</strong>
+                                        {{ page.publication_date|date:"Y-m-d" }}
+                                    </p>
+                                {% endif %}
+                                {% if page.publication_end_date %}
+                                    <p title="{% filter escapejs %}{% trans ">
+                                        <strong>{% filter escapejs %}{% trans "publication end date" %}{% endfilter %}:</strong>
+                                        {{ page.publication_end_date|date:"Y-m-d" }}
+                                    </p>
                                 {% endif %}
-                            </p>
-                            {% if page.changed_by %}
                                 <p title="{% filter escapejs %}{% trans ">
-                                    <strong>{% filter escapejs %}{% trans "last change by" %}{% endfilter %}:</strong>
-                                    {{ page.changed_by }}
+                                    <strong>{% filter escapejs %}{% trans "is restricted" %}{% endfilter %}:</strong>
+                                    {% if page_is_restricted %}
+                                        {% filter escapejs %}{% trans "Yes" %}{% endfilter %}
+                                    {% else %}
+                                        {% filter escapejs %}{% trans "No" %}{% endfilter %}
+                                    {% endif %}
                                 </p>
-                            {% endif %}
-                            {% if page.changed_date %}
-                                <p title="{% filter escapejs %}{% trans ">
-                                    <strong>
-                                    {% filter escapejs %}{% trans "last change on" %}{% endfilter %}:
-                                    </strong>
-                                    {{ page.changed_date|date:"Y-m-d H:i:s" }}
-                                </p>
-                            {% endif %}
-                            {% if page.get_template_display %}
-                                <p title="{% filter escapejs %}{% trans ">
-                                    <strong>
-                                    {% filter escapejs %}{% trans "template" %}{% endfilter %}:
-                                    </strong>
-                                    {{ page.get_template_display }}
-                                </p>
-                            {% endif %}
-                            {% if metadata %}
-                                <p title="{% filter escapejs %}{% trans ">
-                                    <strong>
-                                    {% filter escapejs %}{% trans "meta" %}{% endfilter %}:
-                                    </strong>
-                                    {{ metadata }}
-                                </p>
-                            {% endif %}
-                            {% if page.site %}
-                                <p title="{% filter escapejs %}{% trans ">
-                                    <strong>
-                                    {% filter escapejs %}{% trans "site" %}{% endfilter %}:
-                                    </strong>
-                                    {{ page.site }}
-                                </p>
-                            {% endif %}
-                        </li>
-                    </ul>
-                {% endspaceless %}
+                                {% if page.changed_by %}
+                                    <p title="{% filter escapejs %}{% trans ">
+                                        <strong>{% filter escapejs %}{% trans "last change by" %}{% endfilter %}:</strong>
+                                        {{ page.changed_by }}
+                                    </p>
+                                {% endif %}
+                                {% if page.changed_date %}
+                                    <p title="{% filter escapejs %}{% trans ">
+                                        <strong>
+                                        {% filter escapejs %}{% trans "last change on" %}{% endfilter %}:
+                                        </strong>
+                                        {{ page.changed_date|date:"Y-m-d H:i:s" }}
+                                    </p>
+                                {% endif %}
+                                {% if page.get_template_display %}
+                                    <p title="{% filter escapejs %}{% trans ">
+                                        <strong>
+                                        {% filter escapejs %}{% trans "template" %}{% endfilter %}:
+                                        </strong>
+                                        {{ page.get_template_display }}
+                                    </p>
+                                {% endif %}
+                                {% if metadata %}
+                                    <p title="{% filter escapejs %}{% trans ">
+                                        <strong>
+                                        {% filter escapejs %}{% trans "meta" %}{% endfilter %}:
+                                        </strong>
+                                        {{ metadata }}
+                                    </p>
+                                {% endif %}
+                                {% if page.site %}
+                                    <p title="{% filter escapejs %}{% trans ">
+                                        <strong>
+                                        {% filter escapejs %}{% trans "site" %}{% endfilter %}:
+                                        </strong>
+                                        {{ page.site }}
+                                    </p>
+                                {% endif %}
+                            </li>
+                        </ul>
+                    {% endspaceless %}
diff --git a/tests/django_cms/cms/toolbar/clipboard.html b/tests/django_cms/cms/toolbar/clipboard.html
index c923c45..58c14fe 100644
--- a/tests/django_cms/cms/toolbar/clipboard.html
+++ b/tests/django_cms/cms/toolbar/clipboard.html
@@ -3,6 +3,7 @@
     <div class="cms-plugins"></div>
     <div class="cms-clipboard-containers cms-dragarea cms-draggables">
         {% if clipboard_plugin %}
-            {% include cms_toolbar.templates.drag_item_template with clipboard="true" plugin=clipboard_plugin %}{% endif %}
-        </div>
+            {% include cms_toolbar.templates.drag_item_template with clipboard="true" plugin=clipboard_plugin %}
+        {% endif %}
     </div>
+</div>
diff --git a/tests/django_cms/cms/toolbar/dragitem.html b/tests/django_cms/cms/toolbar/dragitem.html
index ef49b78..5bee299 100644
--- a/tests/django_cms/cms/toolbar/dragitem.html
+++ b/tests/django_cms/cms/toolbar/dragitem.html
@@ -1,77 +1,79 @@
 {% load i18n l10n cms_tags %}
 {% with allow_children=plugin.get_plugin_class.allow_children disable_child_plugins=plugin.get_plugin_class.disable_child_plugins %}
-<div class="cms-draggable cms-draggable-{{ plugin.pk|unlocalize }} {% if not allow_children %}cms-draggable-disabled{% endif %} {% if clipboard %}cms-draggable-from-clipboard{% endif %}">
-<div class="cms-dragitem cms-dragitem-handler {% if plugin.child_plugin_instances %}cms-dragitem-collapsable{% endif %}">
-{% if not disabled_child %}
-    <div class="cms-submenu-btn cms-submenu-edit cms-btn" data-rel="edit">
-        <span class="cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
-              data-cms-tooltip="{% trans "></span>
-    </div>
-    <div class="cms-submenu-btn cms-submenu-add cms-btn {% if not allow_children %}cms-btn-disabled{% endif %}">
-    {% if not allow_children %}
-        <span class="cms-hover-tooltip" data-cms-tooltip="{% trans "></span>
-    {% else %}
-        <span class="cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
-              data-cms-tooltip="{% trans "></span>
-    {% endif %}
-</div>
-<div class="cms-submenu cms-submenu-settings cms-submenu-btn cms-btn"></div>
-{% else %}
-<div class="cms-hover-tooltip cms-hover-tooltip-left cms-plugin-disabled" tabindex="-1" data-cms-tooltip="{% trans ">
-    <span class="cms-icon cms-icon-lock"></span>
-</div>
-{% endif %}
-<div class="cms-submenu-dropdown cms-submenu-dropdown-settings">
-<div class="cms-dropdown-inner">
-    <div class="cms-submenu-item">
-        <a data-cms-icon="scissors" data-rel="cut" href="#">
-            {% trans "Cut" %}
-        </a>
-    </div>
-    <div class="cms-submenu-item">
-        <a data-cms-icon="copy" data-rel="copy" href="#">
-            {% trans "Copy" %}
-        </a>
-    </div>
-    <div class="cms-submenu-item">
-        <a data-cms-icon="paste" data-rel="paste" href="#">
-            {% trans "Paste" %}
-        </a>
-        <span class="cms-submenu-item-paste-tooltip cms-submenu-item-paste-tooltip-empty cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
-              data-cms-tooltip="{% trans "></span>
-        <span class="cms-submenu-item-paste-tooltip cms-submenu-item-paste-tooltip-restricted cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
-              data-cms-tooltip="{% trans "></span>
-        <span class="cms-submenu-item-paste-tooltip cms-submenu-item-paste-tooltip-disabled cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
-              data-cms-tooltip="{% trans "></span>
-    </div>
-    <div class="cms-submenu-item">
-        <a data-cms-icon="bin" data-rel="delete" href="#">
-            {% trans "Delete" %}
-        </a>
-    </div>
-    {% render_extra_menu_items plugin %}
-</div>
-</div>
-{% if not clipboard %}
-<div class="cms-plugin-picker" data-touch-action="pan-y">
-    <div class="cms-quicksearch">
-        <label>
-            <input type="text" placeholder="{% trans 'Filter plugins...' %}" />
-        </label>
-    </div>
-    {# plugin child classes here #}
-</div>
-{% endif %}
-<span class="cms-dragitem-text" title="{{ plugin.plugin_type }} ID: {{ plugin.pk }}">
-<strong>{{ plugin.get_plugin_name }}</strong>
-{{ plugin.get_short_description }}
-</span>
-</div>
-<div class="cms-collapsable-container cms-hidden {% if allow_children %}cms-draggables{% endif %}">
-{% if plugin.child_plugin_instances %}
-{% for child in plugin.child_plugin_instances %}
-{% include cms_toolbar.templates.drag_item_template with plugin=child disabled_child=disable_child_plugins %}{% endfor %}
-{% endif %}
-</div>
-</div>
-{% endwith %}
+    <div class="cms-draggable cms-draggable-{{ plugin.pk|unlocalize }} {% if not allow_children %}cms-draggable-disabled{% endif %} {% if clipboard %}cms-draggable-from-clipboard{% endif %}">
+        <div class="cms-dragitem cms-dragitem-handler {% if plugin.child_plugin_instances %}cms-dragitem-collapsable{% endif %}">
+            {% if not disabled_child %}
+                <div class="cms-submenu-btn cms-submenu-edit cms-btn" data-rel="edit">
+                    <span class="cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
+                          data-cms-tooltip="{% trans "></span>
+                </div>
+                <div class="cms-submenu-btn cms-submenu-add cms-btn {% if not allow_children %}cms-btn-disabled{% endif %}">
+                    {% if not allow_children %}
+                        <span class="cms-hover-tooltip" data-cms-tooltip="{% trans "></span>
+                    {% else %}
+                        <span class="cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
+                              data-cms-tooltip="{% trans "></span>
+                    {% endif %}
+                </div>
+                <div class="cms-submenu cms-submenu-settings cms-submenu-btn cms-btn"></div>
+            {% else %}
+                <div class="cms-hover-tooltip cms-hover-tooltip-left cms-plugin-disabled"
+                     tabindex="-1"
+                     data-cms-tooltip="{% trans ">
+                    <span class="cms-icon cms-icon-lock"></span>
+                </div>
+            {% endif %}
+            <div class="cms-submenu-dropdown cms-submenu-dropdown-settings">
+                <div class="cms-dropdown-inner">
+                    <div class="cms-submenu-item">
+                        <a data-cms-icon="scissors" data-rel="cut" href="#">
+                            {% trans "Cut" %}
+                        </a>
+                    </div>
+                    <div class="cms-submenu-item">
+                        <a data-cms-icon="copy" data-rel="copy" href="#">
+                            {% trans "Copy" %}
+                        </a>
+                    </div>
+                    <div class="cms-submenu-item">
+                        <a data-cms-icon="paste" data-rel="paste" href="#">
+                            {% trans "Paste" %}
+                        </a>
+                        <span class="cms-submenu-item-paste-tooltip cms-submenu-item-paste-tooltip-empty cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
+                              data-cms-tooltip="{% trans "></span>
+                        <span class="cms-submenu-item-paste-tooltip cms-submenu-item-paste-tooltip-restricted cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
+                              data-cms-tooltip="{% trans "></span>
+                        <span class="cms-submenu-item-paste-tooltip cms-submenu-item-paste-tooltip-disabled cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
+                              data-cms-tooltip="{% trans "></span>
+                    </div>
+                    <div class="cms-submenu-item">
+                        <a data-cms-icon="bin" data-rel="delete" href="#">
+                            {% trans "Delete" %}
+                        </a>
+                    </div>
+                    {% render_extra_menu_items plugin %}
+                </div>
+            </div>
+            {% if not clipboard %}
+                <div class="cms-plugin-picker" data-touch-action="pan-y">
+                    <div class="cms-quicksearch">
+                        <label>
+                            <input type="text" placeholder="{% trans 'Filter plugins...' %}" />
+                        </label>
+                    </div>
+                    {# plugin child classes here #}
+                </div>
+            {% endif %}
+            <span class="cms-dragitem-text" title="{{ plugin.plugin_type }} ID: {{ plugin.pk }}">
+                <strong>{{ plugin.get_plugin_name }}</strong>
+                {{ plugin.get_short_description }}
+            </span>
+        </div>
+        <div class="cms-collapsable-container cms-hidden {% if allow_children %}cms-draggables{% endif %}">
+            {% if plugin.child_plugin_instances %}
+                {% for child in plugin.child_plugin_instances %}
+                    {% include cms_toolbar.templates.drag_item_template with plugin=child disabled_child=disable_child_plugins %}{% endfor %}
+                {% endif %}
+            </div>
+        </div>
+    {% endwith %}
diff --git a/tests/django_cms/cms/toolbar/items/button.html b/tests/django_cms/cms/toolbar/items/button.html
index edf5d49..4b0c543 100644
--- a/tests/django_cms/cms/toolbar/items/button.html
+++ b/tests/django_cms/cms/toolbar/items/button.html
@@ -1,4 +1,4 @@
 <a href="{{ url }}"
    class="cms-btn{% if active %}cms-btn-active{% endif %}{% if disabled %}cms-btn-disabled{% endif %}{% if extra_classes %}{{ extra_classes|join:' ' }}{% endif %}">
-{{ name }}
+    {{ name }}
 </a>
diff --git a/tests/django_cms/cms/toolbar/items/button_modal.html b/tests/django_cms/cms/toolbar/items/button_modal.html
index bf4c3c5..190e93d 100644
--- a/tests/django_cms/cms/toolbar/items/button_modal.html
+++ b/tests/django_cms/cms/toolbar/items/button_modal.html
@@ -1,5 +1,5 @@
 <a href="{{ url }}" class="cms-btn{% if active %}cms-btn-active{% endif %}{% if disabled %}cms-btn-disabled{% endif %} {{ extra_classes|join:' ' }}" data-rel="modal"
-{% if on_close %}data-on-close="{{ on_close }}" {% endif %}
->
-{{ name }}
+    {% if on_close %}data-on-close="{{ on_close }}" {% endif %}
+    >
+    {{ name }}
 </a>
diff --git a/tests/django_cms/cms/toolbar/items/button_sideframe.html b/tests/django_cms/cms/toolbar/items/button_sideframe.html
index f92d38a..e8f61e0 100644
--- a/tests/django_cms/cms/toolbar/items/button_sideframe.html
+++ b/tests/django_cms/cms/toolbar/items/button_sideframe.html
@@ -1,5 +1,5 @@
 <a href="{{ url }}" class="cms-btn{% if active %}cms-btn-active{% endif %}{% if disabled %}cms-btn-disabled{% endif %} {{ extra_classes|join:' ' }}" data-rel="sideframe"
-{% if on_close %}data-on-close="{{ on_close }}" {% endif %}
->
-{{ name }}
+    {% if on_close %}data-on-close="{{ on_close }}" {% endif %}
+    >
+    {{ name }}
 </a>
diff --git a/tests/django_cms/cms/toolbar/items/dropdown_button.html b/tests/django_cms/cms/toolbar/items/dropdown_button.html
index a593b1e..ecdc8b6 100644
--- a/tests/django_cms/cms/toolbar/items/dropdown_button.html
+++ b/tests/django_cms/cms/toolbar/items/dropdown_button.html
@@ -1,5 +1,5 @@
 <a href="javascript: void 0"
    class="cms-btn cms-dropdown-toggle {% if active %}cms-btn-active{% endif %}{% if disabled %}cms-btn-disabled{% endif %} {{ extra_classes|join:' ' }}">
-{{ name }}
-<span class="cms-dropdown-caret"></span>
+    {{ name }}
+    <span class="cms-dropdown-caret"></span>
 </a>
diff --git a/tests/django_cms/cms/toolbar/items/item_ajax.html b/tests/django_cms/cms/toolbar/items/item_ajax.html
index 264d07c..d5032cb 100644
--- a/tests/django_cms/cms/toolbar/items/item_ajax.html
+++ b/tests/django_cms/cms/toolbar/items/item_ajax.html
@@ -1,13 +1,13 @@
 <li class="{% if active %}cms-toolbar-item-navigation-active{% endif %}{% if disabled %}cms-toolbar-item-navigation-disabled{% endif %} {{ extra_classes|join:' ' }}">
-<a
-    {% if disabled %}tabindex="-1" {% endif %}
-    href="{{ action }}" data-rel="ajax" data-method="{{ method }}" data-post="{{ data }}"
-    {% if question %}data-text="{{ question }}" {% endif %}
-    {% if on_success %}data-on-success="{{ on_success }}" {% endif %}
-    >
-    <span>
-        {{ name }}
-        <span class="cms-icon cms-icon-arrow"></span>
-    </span>
-</a>
+    <a
+        {% if disabled %}tabindex="-1" {% endif %}
+        href="{{ action }}" data-rel="ajax" data-method="{{ method }}" data-post="{{ data }}"
+        {% if question %}data-text="{{ question }}" {% endif %}
+        {% if on_success %}data-on-success="{{ on_success }}" {% endif %}
+        >
+        <span>
+            {{ name }}
+            <span class="cms-icon cms-icon-arrow"></span>
+        </span>
+    </a>
 </li>
diff --git a/tests/django_cms/cms/toolbar/items/item_link.html b/tests/django_cms/cms/toolbar/items/item_link.html
index 31f85ee..c7964be 100644
--- a/tests/django_cms/cms/toolbar/items/item_link.html
+++ b/tests/django_cms/cms/toolbar/items/item_link.html
@@ -1,10 +1,10 @@
 <li class="{% if active %}cms-toolbar-item-navigation-active{% endif %}{% if disabled %}cms-toolbar-item-navigation-disabled{% endif %} {{ extra_classes|join:' ' }}">
-<a
-    {% if disabled %}tabindex="-1" {% endif %}
-    href="{{ url }}">
-    <span>
-        {{ name }}
-        <span class="cms-icon cms-icon-arrow"></span>
-    </span>
-</a>
+    <a
+        {% if disabled %}tabindex="-1" {% endif %}
+        href="{{ url }}">
+        <span>
+            {{ name }}
+            <span class="cms-icon cms-icon-arrow"></span>
+        </span>
+    </a>
 </li>
diff --git a/tests/django_cms/cms/toolbar/items/item_modal.html b/tests/django_cms/cms/toolbar/items/item_modal.html
index bb50b80..4a7d88f 100644
--- a/tests/django_cms/cms/toolbar/items/item_modal.html
+++ b/tests/django_cms/cms/toolbar/items/item_modal.html
@@ -1,12 +1,12 @@
 <li class="{% if active %}cms-toolbar-item-navigation-active{% endif %}{% if disabled %}cms-toolbar-item-navigation-disabled{% endif %} {{ extra_classes|join:' ' }}">
-<a
-    {% if disabled %}tabindex="-1" {% endif %}
-    href="{{ url }}" data-rel="modal"
-    {% if on_close %}data-on-close="{{ on_close }}" {% endif %}
-    >
-    <span>
-        {{ name }}
-        <span class="cms-icon cms-icon-arrow"></span>
-    </span>
-</a>
+    <a
+        {% if disabled %}tabindex="-1" {% endif %}
+        href="{{ url }}" data-rel="modal"
+        {% if on_close %}data-on-close="{{ on_close }}" {% endif %}
+        >
+        <span>
+            {{ name }}
+            <span class="cms-icon cms-icon-arrow"></span>
+        </span>
+    </a>
 </li>
diff --git a/tests/django_cms/cms/toolbar/items/item_sideframe.html b/tests/django_cms/cms/toolbar/items/item_sideframe.html
index 918a904..e370b1a 100644
--- a/tests/django_cms/cms/toolbar/items/item_sideframe.html
+++ b/tests/django_cms/cms/toolbar/items/item_sideframe.html
@@ -1,12 +1,12 @@
 <li class="{% if active %}cms-toolbar-item-navigation-active{% endif %}{% if disabled %}cms-toolbar-item-navigation-disabled{% endif %} {{ extra_classes|join:' ' }}">
-<a
-    {% if disabled %}tabindex="-1" {% endif %}
-    href="{{ url }}" data-rel="sideframe"
-    {% if on_close %}data-on-close="{{ on_close }}" {% endif %}
-    >
-    <span>
-        {{ name }}
-        <span class="cms-icon cms-icon-arrow"></span>
-    </span>
-</a>
+    <a
+        {% if disabled %}tabindex="-1" {% endif %}
+        href="{{ url }}" data-rel="sideframe"
+        {% if on_close %}data-on-close="{{ on_close }}" {% endif %}
+        >
+        <span>
+            {{ name }}
+            <span class="cms-icon cms-icon-arrow"></span>
+        </span>
+    </a>
 </li>
diff --git a/tests/django_cms/cms/toolbar/items/menu.html b/tests/django_cms/cms/toolbar/items/menu.html
index c213ca2..1d5a51f 100644
--- a/tests/django_cms/cms/toolbar/items/menu.html
+++ b/tests/django_cms/cms/toolbar/items/menu.html
@@ -1,15 +1,15 @@
 <li class="{% if sub_level %}cms-toolbar-item-navigation-children {% endif %}{% if active %}cms-toolbar-item-navigation-active {% endif %}{% if disabled %}cms-toolbar-item-navigation-disabled {% endif %}">
-<a
-    {% if disabled %}tabindex="-1" {% endif %}
-    href="{{ url }}">
-    <span>
-        {{ title }}
-        <span class="cms-icon cms-icon-arrow"></span>
-    </span>
-</a>
-{% if items %}
-    <ul>
-        {% for item in items %}{{ item.render }}{% endfor %}
-    </ul>
-{% endif %}
+    <a
+        {% if disabled %}tabindex="-1" {% endif %}
+        href="{{ url }}">
+        <span>
+            {{ title }}
+            <span class="cms-icon cms-icon-arrow"></span>
+        </span>
+    </a>
+    {% if items %}
+        <ul>
+            {% for item in items %}{{ item.render }}{% endfor %}
+        </ul>
+    {% endif %}
 </li>
diff --git a/tests/django_cms/cms/toolbar/plugin.html b/tests/django_cms/cms/toolbar/plugin.html
index 0592900..aa4dc11 100644
--- a/tests/django_cms/cms/toolbar/plugin.html
+++ b/tests/django_cms/cms/toolbar/plugin.html
@@ -5,15 +5,15 @@
 {% if content %}
     {{ content }}{% elif render_model_icon %}
     <img src="{% static 'cms/img/toolbar/render_model_placeholder.png' %}">
-    {% elif render_model_add %}
-        <img src="{% static 'cms/img/toolbar/render_model_placeholder.png' %}">
-        {% else %}
-            {{ rendered_content }}
-        {% endif %}
-        {% spaceless %}
-            <template class="cms-plugin cms-plugin-end cms-plugin-{% if generic %}{{ generic.app_label }}-{{ generic.model_name }}-{% if attribute_name %}{{ attribute_name|slugify }}-{% endif %}{% endif %}{{ instance.pk|unlocalize }}{% if render_model_icon %} cms-render-model-icon{% elif render_model %} cms-render-model{% elif render_model_block %} cms-render-model cms-render-model-block{% elif render_model_add %} cms-render-model-add{% endif %}"></template>
-            {% addtoblock "js" %}
-                <script{% if generic %}data-cms-generic{% endif %} data-cms>
+{% elif render_model_add %}
+    <img src="{% static 'cms/img/toolbar/render_model_placeholder.png' %}">
+{% else %}
+    {{ rendered_content }}
+{% endif %}
+{% spaceless %}
+    <template class="cms-plugin cms-plugin-end cms-plugin-{% if generic %}{{ generic.app_label }}-{{ generic.model_name }}-{% if attribute_name %}{{ attribute_name|slugify }}-{% endif %}{% endif %}{{ instance.pk|unlocalize }}{% if render_model_icon %} cms-render-model-icon{% elif render_model %} cms-render-model{% elif render_model_block %} cms-render-model cms-render-model-block{% elif render_model_add %} cms-render-model-add{% endif %}"></template>
+    {% addtoblock "js" %}
+        <script{% if generic %}data-cms-generic{% endif %} data-cms>
 CMS._plugins.push(['cms-plugin-{% if generic %}{{ generic.app_label }}-{{ generic.model_name }}-{% if attribute_name %}{{ attribute_name|slugify }}-{% endif %}{% endif %}{{ instance.pk|unlocalize }}', {
     type: {% if generic %}'generic'{% else %}'plugin'{% endif %},
     placeholder_id: '{{ instance.placeholder_id|unlocalize }}',
@@ -39,6 +39,6 @@ CMS._plugins.push(['cms-plugin-{% if generic %}{{ generic.app_label }}-{{ generi
         copy_plugin: '{% if copy_url %}{{ copy_url }}{% else %}{% cms_admin_url "cms_page_copy_plugins" %}{% endif %}'
     } {% endlanguage %}
 }]);
-            </script>
-        {% endaddtoblock %}
-    {% endspaceless %}
+        </script>
+    {% endaddtoblock %}
+{% endspaceless %}
diff --git a/tests/django_cms/cms/toolbar/toolbar.html b/tests/django_cms/cms/toolbar/toolbar.html
index c14909c..9ea9861 100644
--- a/tests/django_cms/cms/toolbar/toolbar.html
+++ b/tests/django_cms/cms/toolbar/toolbar.html
@@ -3,7 +3,7 @@
      class="cms cms-reset {% if not user.is_authenticated %}cms-toolbar-auth{% endif %} {% if debug %}cms-toolbar-debug{% endif %}"
      dir="ltr"
      data-touch-action="none">
-{% block toolbar_top %}{% endblock toolbar_top %}
+    {% block toolbar_top %}{% endblock toolbar_top %}
     {# start: toolbar #}
     <div class="cms-toolbar">
         <div class="cms-debug-bar"></div>
@@ -36,4 +36,4 @@
     </div>
     {# end: toolbar #}
     {% block toolbar_bottom %}{% endblock toolbar_bottom %}
-    </div>
+</div>
diff --git a/tests/django_cms/cms/toolbar/toolbar_with_structure.html b/tests/django_cms/cms/toolbar/toolbar_with_structure.html
index a6e9f35..4854c8e 100644
--- a/tests/django_cms/cms/toolbar/toolbar_with_structure.html
+++ b/tests/django_cms/cms/toolbar/toolbar_with_structure.html
@@ -39,68 +39,70 @@
         {% endspaceless %}
     </div>
     {% if cms_toolbar.edit_mode_active %}
-        {% include 'cms/toolbar/clipboard.html' with clipboard_plugin=cms_toolbar.clipboard_plugin %}{% endif %}
-        <div class="cms-modal" tabindex="-1" data-touch-action="none">
-            <div class="cms-modal-head" data-touch-action="none">
-                <span class="cms-modal-title" data-touch-action="none">
-                    <span class="cms-modal-title-prefix"></span>
-                    <span class="cms-modal-title-suffix"></span>
-                </span>
-                <span tabindex="0"
-                      class="cms-modal-minimize cms-icon cms-icon-minus"
-                      title="{% trans 'Minimize' %}"></span>
-                <span tabindex="0"
-                      class="cms-modal-maximize cms-icon cms-icon-window"
-                      title="{% trans 'Maximize' %}"></span>
-                <span tabindex="0" class="cms-modal-close cms-icon cms-icon-close" title="{% trans 'Close' %}"></span>
-            </div>
-            <div class="cms-modal-breadcrumb" data-touch-action="pan-x"></div>
-            <div class="cms-modal-body">
-                <div class="cms-modal-shim"></div>
-                <div class="cms-modal-frame"></div>
-            </div>
-            <div class="cms-modal-foot">
-                <div class="cms-modal-buttons"></div>
-                <div class="cms-modal-resize">
-                    <span class="cms-icon cms-icon-handler"></span>
-                </div>
+        {% include 'cms/toolbar/clipboard.html' with clipboard_plugin=cms_toolbar.clipboard_plugin %}
+    {% endif %}
+    <div class="cms-modal" tabindex="-1" data-touch-action="none">
+        <div class="cms-modal-head" data-touch-action="none">
+            <span class="cms-modal-title" data-touch-action="none">
+                <span class="cms-modal-title-prefix"></span>
+                <span class="cms-modal-title-suffix"></span>
+            </span>
+            <span tabindex="0"
+                  class="cms-modal-minimize cms-icon cms-icon-minus"
+                  title="{% trans 'Minimize' %}"></span>
+            <span tabindex="0"
+                  class="cms-modal-maximize cms-icon cms-icon-window"
+                  title="{% trans 'Maximize' %}"></span>
+            <span tabindex="0" class="cms-modal-close cms-icon cms-icon-close" title="{% trans 'Close' %}"></span>
+        </div>
+        <div class="cms-modal-breadcrumb" data-touch-action="pan-x"></div>
+        <div class="cms-modal-body">
+            <div class="cms-modal-shim"></div>
+            <div class="cms-modal-frame"></div>
+        </div>
+        <div class="cms-modal-foot">
+            <div class="cms-modal-buttons"></div>
+            <div class="cms-modal-resize">
+                <span class="cms-icon cms-icon-handler"></span>
             </div>
         </div>
-        {# start: structure #}
-        <div class="cms-structure">
-            <div class="cms-structure-content" data-touch-action="pan-y">
-                {% if cms_renderer.load_structure %}
-                    {% for placeholder in cms_renderer.get_rendered_editable_placeholders %}
-                        <div class="cms-dragarea cms-dragarea-{{ placeholder.pk|unlocalize }}{% if placeholder.is_static %}cms-dragarea-static{% endif %}">
+    </div>
+    {# start: structure #}
+    <div class="cms-structure">
+        <div class="cms-structure-content" data-touch-action="pan-y">
+            {% if cms_renderer.load_structure %}
+                {% for placeholder in cms_renderer.get_rendered_editable_placeholders %}
+                    <div class="cms-dragarea cms-dragarea-{{ placeholder.pk|unlocalize }}{% if placeholder.is_static %}cms-dragarea-static{% endif %}">
                         {% include cms_toolbar.templates.dragbar_template with placeholder=placeholder %}
                         <div class="cms-draggables cms-draggables-root">
                             <div class="cms-draggables-empty">
                                 {% trans "Drop a plugin here" %}
                             </div>
                             {% for plugin in placeholder.get_cached_plugins %}
-                                {% include cms_toolbar.templates.drag_item_template with plugin=plugin %}{% endfor %}
-                            </div>
+                                {% include cms_toolbar.templates.drag_item_template with plugin=plugin %}
+                            {% endfor %}
                         </div>
-                    {% endfor %}
-                {% endif %}
+                    </div>
+                {% endfor %}
+            {% endif %}
+        </div>
+    </div>
+    {# end: structure #}
+    {% if cms_toolbar.redirect_url %}
+        <div class="cms-screenblock">
+            <div class="cms-screenblock-inner">
+                <h1>{% trans "This page has no preview!" %}</h1>
+                <p>
+                    {% trans "It is being redirected to:" %}
+                    <a href="{{ cms_toolbar.redirect_url }}">
+                        {{ cms_toolbar.redirect_url }}
+                    </a>
+                </p>
             </div>
         </div>
-        {# end: structure #}
-        {% if cms_toolbar.redirect_url %}
-            <div class="cms-screenblock">
-                <div class="cms-screenblock-inner">
-                    <h1>{% trans "This page has no preview!" %}</h1>
-                    <p>
-                        {% trans "It is being redirected to:" %}
-                        <a href="{{ cms_toolbar.redirect_url }}">
-                            {{ cms_toolbar.redirect_url }}
-                        </a>
-                    </p>
-                </div>
-            </div>
-        {% endif %}
-        <script type="text/javascript" data-cms>
+    {% endif %}
+    <script type="text/javascript" data-cms>
         var CMS = CMS || {};
         CMS._plugins = CMS._plugins || [];
-        </script>
-    {% endblock toolbar_bottom %}
+    </script>
+{% endblock toolbar_bottom %}
diff --git a/tests/django_cms/cms/wizards/includes/form_fields.html b/tests/django_cms/cms/wizards/includes/form_fields.html
index f2c075d..ec1db95 100755
--- a/tests/django_cms/cms/wizards/includes/form_fields.html
+++ b/tests/django_cms/cms/wizards/includes/form_fields.html
@@ -5,28 +5,28 @@
 <fieldset class="module aligned">
     {% for field in form.visible_fields %}
         <div class="form-row {{ field.name }}{% if field.errors %}errors{% endif %}">
-        {% if field.errors %}
-            <ul class="errorlist">
-                {% for error in field.errors %}
-                    <li>
-                        {{ error }}
-                    </li>
-                {% endfor %}
-            </ul>
-        {% endif %}
-        <div>
-            <label
-                {% if field.field.required %}class="required" {% endif %}
-                for="{{ field.id_for_label }}">
-                {{ field.label }}
-            </label>
-            {{ field }}
-            {% if field.help_text %}
-                <p class="help">
-                    {{ field.help_text }}
-                </p>
+            {% if field.errors %}
+                <ul class="errorlist">
+                    {% for error in field.errors %}
+                        <li>
+                            {{ error }}
+                        </li>
+                    {% endfor %}
+                </ul>
             {% endif %}
+            <div>
+                <label
+                    {% if field.field.required %}class="required" {% endif %}
+                    for="{{ field.id_for_label }}">
+                    {{ field.label }}
+                </label>
+                {{ field }}
+                {% if field.help_text %}
+                    <p class="help">
+                        {{ field.help_text }}
+                    </p>
+                {% endif %}
+            </div>
         </div>
-    </div>
-{% endfor %}
+    {% endfor %}
 </fieldset>
diff --git a/tests/django_cms/cms/wizards/wizardoptionwidget.html b/tests/django_cms/cms/wizards/wizardoptionwidget.html
index a9164da..536899b 100644
--- a/tests/django_cms/cms/wizards/wizardoptionwidget.html
+++ b/tests/django_cms/cms/wizards/wizardoptionwidget.html
@@ -1,11 +1,11 @@
 {% for group, entries, index in widget.optgroups %}
     {% for entry in entries %}
         <label tabindex="0" class="choice{% if forloop.parentloop.first %}active{% endif %}">
-        <input type="radio" name="{{ entry.name }}" value="{{ entry.value }}"
-        {% if forloop.parentloop.first %}checked {% endif %}
-        >
-        <strong>{{ entry.label }}</strong>
-        <span class="info">{{ entry.attrs.description }}</span>
-    </label>
-{% endfor %}
+            <input type="radio" name="{{ entry.name }}" value="{{ entry.value }}"
+            {% if forloop.parentloop.first %}checked {% endif %}
+            >
+            <strong>{{ entry.label }}</strong>
+            <span class="info">{{ entry.attrs.description }}</span>
+        </label>
+    {% endfor %}
 {% endfor %}
diff --git a/tests/django_ledger/auth/login.html b/tests/django_ledger/auth/login.html
index e10579f..316e116 100644
--- a/tests/django_ledger/auth/login.html
+++ b/tests/django_ledger/auth/login.html
@@ -15,18 +15,18 @@
                                     <img src="{% static 'django_ledger/logo/django-ledger-logo.png' %}" alt=""/>
                                 </div>
                             </div>
-{#
+                            {#
 <h1 class="title">
                         #}
                         {# Hero title#}
-{#
+                        {#
 </h1>
                     #}
-{#
+                    {#
 <h2 class="subtitle">
                 #}
                 {# Hero subtitle#}
-{#
+                {#
 </h2>
             #}
             <form action="{% url 'django_ledger:login' %}" method="post">
diff --git a/tests/django_ledger/includes/card_po.html b/tests/django_ledger/includes/card_po.html
index cb4f0d5..21e1c8e 100644
--- a/tests/django_ledger/includes/card_po.html
+++ b/tests/django_ledger/includes/card_po.html
@@ -14,56 +14,56 @@
                 <h3 class="is-size-4 has-text-weight-light">
                     Status:
                     <span class="{% if po_model.po_status == 'draft' %}has-text-danger{% elif po_model.po_status == 'approved' %}has-text-success{% endif %}">
-                    {{ po_model.get_po_status_display }}
-                </span>
-            </h3>
-            <h3 class="is-size-4 has-text-weight-light">
-                Inventory Purchase:
-                {% if po_model.for_inventory %}
-                    <span class="icon has-text-success">{% icon 'ant-design:check-circle-filled' 24 %}</span>
-                {% else %}
-                    <span class="icon is-small has-text-danger">
-                        {% icon 'maki:roadblock-11' 24 %}
+                        {{ po_model.get_po_status_display }}
                     </span>
-                {% endif %}
-            </h3>
-            <h3 class="is-size-4 has-text-weight-light">
-                Fulfilled:
-                {% if po_model.fulfilled %}
-                    <span class="icon has-text-success">{% icon 'ant-design:check-circle-filled' 24 %}</span>
-                    {{ po_model.fulfillment_date | date }}
-                {% else %}
-                    <span class="icon is-small has-text-danger">
-                        {% icon 'maki:roadblock-11' 24 %}
-                    </span>
-                {% endif %}
-            </h3>
+                </h3>
+                <h3 class="is-size-4 has-text-weight-light">
+                    Inventory Purchase:
+                    {% if po_model.for_inventory %}
+                        <span class="icon has-text-success">{% icon 'ant-design:check-circle-filled' 24 %}</span>
+                    {% else %}
+                        <span class="icon is-small has-text-danger">
+                            {% icon 'maki:roadblock-11' 24 %}
+                        </span>
+                    {% endif %}
+                </h3>
+                <h3 class="is-size-4 has-text-weight-light">
+                    Fulfilled:
+                    {% if po_model.fulfilled %}
+                        <span class="icon has-text-success">{% icon 'ant-design:check-circle-filled' 24 %}</span>
+                        {{ po_model.fulfillment_date | date }}
+                    {% else %}
+                        <span class="icon is-small has-text-danger">
+                            {% icon 'maki:roadblock-11' 24 %}
+                        </span>
+                    {% endif %}
+                </h3>
+            </div>
+            <footer class="card-footer">
+                <a href="{% url 'django_ledger:po-update' entity_slug=entity_slug po_pk=po_model.uuid %}"
+                   class="card-footer-item has-text-primary has-text-centered">
+                    {% trans 'Update' %}
+                </a>
+                <a onclick="djLedger.toggleModal('{{ po_model.get_html_id }}')"
+                   class="card-footer-item has-text-info has-text-centered">
+                    {% trans 'Mark as Fulfilled' %}
+                </a>
+                <a href="{% url 'django_ledger:po-delete' entity_slug=entity_slug po_pk=po_model.uuid %}"
+                   class="card-footer-item has-text-danger has-text-centered">
+                    {% trans 'Delete' %}
+                </a>
+            </footer>
         </div>
-        <footer class="card-footer">
-            <a href="{% url 'django_ledger:po-update' entity_slug=entity_slug po_pk=po_model.uuid %}"
-               class="card-footer-item has-text-primary has-text-centered">
-                {% trans 'Update' %}
-            </a>
-            <a onclick="djLedger.toggleModal('{{ po_model.get_html_id }}')"
-               class="card-footer-item has-text-info has-text-centered">
-                {% trans 'Mark as Fulfilled' %}
-            </a>
-            <a href="{% url 'django_ledger:po-delete' entity_slug=entity_slug po_pk=po_model.uuid %}"
-               class="card-footer-item has-text-danger has-text-centered">
-                {% trans 'Delete' %}
-            </a>
-        </footer>
+    {% endif %}
+{% else %}
+    <div class="box has-text-centered">
+        <a href="{% url 'django_ledger:po-create' entity_slug=entity_slug %}">
+            <span class="icon is-large has-text-grey">
+                {% icon "ic:baseline-add-circle-outline" 48 %}
+            </span>
+        </a>
+        <h2 class="is-size-3 has-text-grey">
+            {% trans 'New PO' %}
+        </h2>
     </div>
 {% endif %}
-{% else %}
-<div class="box has-text-centered">
-    <a href="{% url 'django_ledger:po-create' entity_slug=entity_slug %}">
-        <span class="icon is-large has-text-grey">
-            {% icon "ic:baseline-add-circle-outline" 48 %}
-        </span>
-    </a>
-    <h2 class="is-size-3 has-text-grey">
-        {% trans 'New PO' %}
-    </h2>
-</div>
-{% endif %}
diff --git a/tests/django_ledger/includes/nav.html b/tests/django_ledger/includes/nav.html
index 77269b6..b0ceaee 100644
--- a/tests/django_ledger/includes/nav.html
+++ b/tests/django_ledger/includes/nav.html
@@ -8,32 +8,32 @@
         <div class="navbar-brand">
             <a class="navbar-item" href="{% url 'django_ledger:home' %}">
                 <img src="{% static 'django_ledger/logo/django-ledger-logo_1.png' %}" height="28">
-                </a>
-                <a role="button"
-                   class="navbar-burger burger"
-                   aria-label="menu"
-                   aria-expanded="false"
-                   data-target="djl-navbar-menu">
-                    <span aria-hidden="true"></span>
-                    <span aria-hidden="true"></span>
-                    <span aria-hidden="true"></span>
-                </a>
-            </div>
-            <div id="djl-navbar-menu" class="navbar-menu">
-                {% navigation_menu 'mobile' %}
-                <div class="navbar-end">
-                    <div class="navbar-item">
-                        <a href="{% url 'django_ledger:logout' %}" class="button is-small is-danger is-outlined">
-                            {% trans 'Logout' %}
-                        </a>
-                    </div>
-                    <div class="navbar-item">
-                        {% feedback_button %}
-                    </div>
-                    <div class="navbar-item">
-                        v{% current_version %}
-                    </div>
+            </a>
+            <a role="button"
+               class="navbar-burger burger"
+               aria-label="menu"
+               aria-expanded="false"
+               data-target="djl-navbar-menu">
+                <span aria-hidden="true"></span>
+                <span aria-hidden="true"></span>
+                <span aria-hidden="true"></span>
+            </a>
+        </div>
+        <div id="djl-navbar-menu" class="navbar-menu">
+            {% navigation_menu 'mobile' %}
+            <div class="navbar-end">
+                <div class="navbar-item">
+                    <a href="{% url 'django_ledger:logout' %}" class="button is-small is-danger is-outlined">
+                        {% trans 'Logout' %}
+                    </a>
+                </div>
+                <div class="navbar-item">
+                    {% feedback_button %}
+                </div>
+                <div class="navbar-item">
+                    v{% current_version %}
                 </div>
             </div>
         </div>
-    </nav>
+    </div>
+</nav>
diff --git a/tests/django_ledger/po_detail.html b/tests/django_ledger/po_detail.html
index 2e99aaf..3ec1572 100644
--- a/tests/django_ledger/po_detail.html
+++ b/tests/django_ledger/po_detail.html
@@ -69,43 +69,43 @@
                                             <td>{{ item.quantity }}</td>
                                             <td>{{ item.unit_cost }}</td>
                                             <td class="{% if item.is_cancelled %}djl-is-strikethrough{% endif %}">
-                                            {% currency_symbol %}{{ item.total_amount | currency_format }}
-                                        </td>
-                                        <td class="has-text-weight-bold {% if item.is_cancelled %}has-text-danger{% endif %}">
-                                        {% if item.po_item_status %}{{ item.get_po_item_status_display }}{% endif %}
-                                    </td>
+                                                {% currency_symbol %}{{ item.total_amount | currency_format }}
+                                            </td>
+                                            <td class="has-text-weight-bold {% if item.is_cancelled %}has-text-danger{% endif %}">
+                                                {% if item.po_item_status %}{{ item.get_po_item_status_display }}{% endif %}
+                                            </td>
+                                            <td>
+                                                {% if item.bill_model_id %}
+                                                    <a class="is-small is-light button"
+                                                       href="{% url 'django_ledger:bill-detail' entity_slug=view.kwargs.entity_slug bill_pk=item.bill_model_id %}">
+                                                        View Bill
+                                                    </a>
+                                                {% endif %}
+                                            </td>
+                                        </tr>
+                                    {% endfor %}
+                                </tbody>
+                                <tfoot>
+                                <tr>
+                                    <td></td>
+                                    <td></td>
                                     <td>
-                                        {% if item.bill_model_id %}
-                                            <a class="is-small is-light button"
-                                               href="{% url 'django_ledger:bill-detail' entity_slug=view.kwargs.entity_slug bill_pk=item.bill_model_id %}">
-                                                View Bill
-                                            </a>
-                                        {% endif %}
+                                        Total PO Amount
                                     </td>
+                                    <td class="has-text-weight-bold">
+                                        {% currency_symbol %}{{ total_amount_due | currency_format }}
+                                    </td>
+                                    <td></td>
+                                    <td></td>
                                 </tr>
-                            {% endfor %}
-                        </tbody>
-                        <tfoot>
-                        <tr>
-                            <td></td>
-                            <td></td>
-                            <td>
-                                Total PO Amount
-                            </td>
-                            <td class="has-text-weight-bold">
-                                {% currency_symbol %}{{ total_amount_due | currency_format }}
-                            </td>
-                            <td></td>
-                            <td></td>
-                        </tr>
-                        </tfoot>
-                    </table>
+                                </tfoot>
+                            </table>
+                        </div>
+                    </div>
+                    <div class=" column is-12">
+                        {% include 'django_ledger/includes/card_markdown.html' with style='card_1' title='PO Notes' notes_html=po_model.notes_html %}
+                    </div>
                 </div>
             </div>
-            <div class=" column is-12">
-                {% include 'django_ledger/includes/card_markdown.html' with style='card_1' title='PO Notes' notes_html=po_model.notes_html %}
-            </div>
         </div>
-    </div>
-</div>
-{% endblock %}
+    {% endblock %}
diff --git a/tests/django_ledger/tags/data_import_job_txs_imported.html b/tests/django_ledger/tags/data_import_job_txs_imported.html
index 38cf19e..49f40c7 100644
--- a/tests/django_ledger/tags/data_import_job_txs_imported.html
+++ b/tests/django_ledger/tags/data_import_job_txs_imported.html
@@ -16,17 +16,17 @@
                     <td>{{ imported_tx.date_posted }}</td>
                     <td>{{ imported_tx.name }}</td>
                     <td class="{% if imported_tx.amount < 0 %}has-text-danger{% endif %} has-text-centered">
-                    ${{ imported_tx.amount }}
-                </td>
-                <td>{{ imported_tx.earnings_account }}</td>
-                <td>{{ imported_tx.tx }}</td>
-                <td class="has-text-centered">
-                    <a href="" class="button is-small is-primary">
-                        View
-                    </a>
-                </td>
-            </tr>
-        {% endfor %}
-    </tbody>
-</table>
+                        ${{ imported_tx.amount }}
+                    </td>
+                    <td>{{ imported_tx.earnings_account }}</td>
+                    <td>{{ imported_tx.tx }}</td>
+                    <td class="has-text-centered">
+                        <a href="" class="button is-small is-primary">
+                            View
+                        </a>
+                    </td>
+                </tr>
+            {% endfor %}
+        </tbody>
+    </table>
 </div>
diff --git a/tests/django_ledger/tags/data_import_job_txs_table.html b/tests/django_ledger/tags/data_import_job_txs_table.html
index 83a36a8..c3c9770 100644
--- a/tests/django_ledger/tags/data_import_job_txs_table.html
+++ b/tests/django_ledger/tags/data_import_job_txs_table.html
@@ -28,26 +28,26 @@
                     <td>{{ txf.date_posted.value }}</td>
                     <td>{{ txf.name.value }}</td>
                     <td class="{% if txf.amount.value < 0 %}has-text-danger{% endif %}">
-                    ${{ txf.amount.value }}
-                </td>
-                <td>{{ txf.earnings_account }}</td>
-                <td>{{ txf.tx_import }}</td>
-            </tr>
-        {% endfor %}
-    </tbody>
-</table>
+                        ${{ txf.amount.value }}
+                    </td>
+                    <td>{{ txf.earnings_account }}</td>
+                    <td>{{ txf.tx_import }}</td>
+                </tr>
+            {% endfor %}
+        </tbody>
+    </table>
 </div>
 <div class="columns is-centered">
-<div class="column is-4 has-text-centered">
-    <button class="button is-primary is-small is-fullwidth">
-        {% trans 'Save/Import' %}
-    </button>
-</div>
-<div class="column is-4 has-text-centered">
-    <a class="button is-info is-small is-fullwidth"
-       href="{% url 'django_ledger:bank-account-update' entity_slug=view.kwargs.entity_slug bank_account_pk=bank_account_model.uuid %}">
-        {% trans 'Bank Account' %}
-    </a>
-</div>
+    <div class="column is-4 has-text-centered">
+        <button class="button is-primary is-small is-fullwidth">
+            {% trans 'Save/Import' %}
+        </button>
+    </div>
+    <div class="column is-4 has-text-centered">
+        <a class="button is-info is-small is-fullwidth"
+           href="{% url 'django_ledger:bank-account-update' entity_slug=view.kwargs.entity_slug bank_account_pk=bank_account_model.uuid %}">
+            {% trans 'Bank Account' %}
+        </a>
+    </div>
 </div>
 </form>
diff --git a/tests/django_ledger/tags/vendor_table.html b/tests/django_ledger/tags/vendor_table.html
index 7ebf2fa..908e87a 100644
--- a/tests/django_ledger/tags/vendor_table.html
+++ b/tests/django_ledger/tags/vendor_table.html
@@ -26,7 +26,7 @@
                             </div>
                             <div class="dropdown-menu" id="dropdown-menu-{{ vendor.uuid }}" role="menu">
                                 <div class="dropdown-content">
-{#
+                                    {#
 <a href="" class="dropdown-item has-text-success">
 View
 </a>
diff --git a/tests/django_ledger/unit_list.html b/tests/django_ledger/unit_list.html
index 206026f..c781729 100644
--- a/tests/django_ledger/unit_list.html
+++ b/tests/django_ledger/unit_list.html
@@ -26,13 +26,13 @@
                     <div class="column is-4">
                         <div class="card">
                             <div class="card-content">
-{#
+                                {#
 <p class="subtitle has-text-grey has-text-right">
                             #}
-{#
+                            {#
 <span class="icon">{% icon "bi:cash-stack" 16 %}</span>
                         #}
-{#                                    {% trans 'Unit' %}
+                        {# {% trans 'Unit' %}
 </p>
                     #}
                     <p class="title">
diff --git a/tests/django_oscar/oscar/base.html b/tests/django_oscar/oscar/base.html
index b325658..5c7cd8a 100644
--- a/tests/django_oscar/oscar/base.html
+++ b/tests/django_oscar/oscar/base.html
@@ -2,46 +2,47 @@
 {% load static %}
 <!DOCTYPE html>
 <html lang="{{ LANGUAGE_CODE|default:"en-gb" }}" class="{% block html_class %}no-js{% endblock %}">
-<head>
-    <title>
-    {% block title %}{{ shop_name }} - {{ shop_tagline }}{% endblock %}
-    </title>
-    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
-    <meta name="created" content="{% now "jS M Y h:i" %}" />
-    <meta name="description" content="{% block description %}{% endblock %}" />
-    <meta name="viewport" content="{% block viewport %}width=device-width{% endblock %}" />
-    {% block favicon %}
-        <link rel="shortcut icon" href="{% static "oscar/favicon.ico" %}" />
-    {% endblock %}
-    {# Block where global CSS will go. #}
-    {% block styles %}{% endblock %}
-    {# Additional CSS - specific to certain pages #}
-    {% block extrastyles %}{% endblock %}
-    {% block extrahead %}{% endblock %}
-    {% block tracking %}
-        {# Default to using Google analytics #}
-        {% include "oscar/partials/google_analytics.html" %}{% endblock %}
+    <head>
+        <title>
+        {% block title %}{{ shop_name }} - {{ shop_tagline }}{% endblock %}
+        </title>
+        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
+        <meta name="created" content="{% now "jS M Y h:i" %}" />
+        <meta name="description" content="{% block description %}{% endblock %}" />
+        <meta name="viewport" content="{% block viewport %}width=device-width{% endblock %}" />
+        {% block favicon %}
+            <link rel="shortcut icon" href="{% static "oscar/favicon.ico" %}" />
+        {% endblock %}
+        {# Block where global CSS will go. #}
+        {% block styles %}{% endblock %}
+        {# Additional CSS - specific to certain pages #}
+        {% block extrastyles %}{% endblock %}
+        {% block extrahead %}{% endblock %}
+        {% block tracking %}
+            {# Default to using Google analytics #}
+            {% include "oscar/partials/google_analytics.html" %}
+        {% endblock %}
     </head>
     <body id="{% block body_id %}default{% endblock %}" class="{% block body_class %}default{% endblock %}">
-    {# Main content goes in this 'layout' block #}
-    {% block layout %}{% endblock %}
-    {# Scripts loaded from a CDN. #}
-    {% block cdn_scripts %}
-        <!-- jQuery -->
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
-        <script>window.jQuery || document.write('<script src="{% static "oscar/js/jquery/jquery.min.js" %}"><\/script>')
-        </script>
-    {% endblock %}
-    {# Local scripts #}
-    {% block scripts %}{% endblock %}
-    {# Additional JS scripts #}
-    {% block extrascripts %}{% endblock %}
-    {# Block for body onload functions #}
-    <script>
+        {# Main content goes in this 'layout' block #}
+        {% block layout %}{% endblock %}
+        {# Scripts loaded from a CDN. #}
+        {% block cdn_scripts %}
+            <!-- jQuery -->
+            <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
+            <script>window.jQuery || document.write('<script src="{% static "oscar/js/jquery/jquery.min.js" %}"><\/script>')
+            </script>
+        {% endblock %}
+        {# Local scripts #}
+        {% block scripts %}{% endblock %}
+        {# Additional JS scripts #}
+        {% block extrascripts %}{% endblock %}
+        {# Block for body onload functions #}
+        <script>
             $(function() {
                 {% block onbodyload %}{% endblock %}
             });
-    </script>
-    {# Page meta-data - this is populated by the 'metadata' template context processor #}
-</body>
+        </script>
+        {# Page meta-data - this is populated by the 'metadata' template context processor #}
+    </body>
 </html>
diff --git a/tests/django_oscar/oscar/basket/basket.html b/tests/django_oscar/oscar/basket/basket.html
index a42c3ff..58c60ee 100644
--- a/tests/django_oscar/oscar/basket/basket.html
+++ b/tests/django_oscar/oscar/basket/basket.html
@@ -22,12 +22,13 @@
 {% endblock %}
 {% block content %}
     {# Use a partial template so that AJAX can be used to re-render basket #}
-    {% include 'oscar/basket/partials/basket_content.html' %}{% endblock content %}
-    {% block onbodyload %}
-        {{ block.super }}
-        {# We pass in the URL to send AJAX requests to #}
-        var options = {
-        'basketURL': '{% url 'basket:summary' %}'
-        };
-        oscar.basket.init(options);
-    {% endblock %}
+    {% include 'oscar/basket/partials/basket_content.html' %}
+{% endblock content %}
+{% block onbodyload %}
+    {{ block.super }}
+    {# We pass in the URL to send AJAX requests to #}
+    var options = {
+    'basketURL': '{% url 'basket:summary' %}'
+    };
+    oscar.basket.init(options);
+{% endblock %}
diff --git a/tests/django_oscar/oscar/basket/partials/basket_content.html b/tests/django_oscar/oscar/basket/partials/basket_content.html
index 7a5c7a3..85f8b6a 100644
--- a/tests/django_oscar/oscar/basket/partials/basket_content.html
+++ b/tests/django_oscar/oscar/basket/partials/basket_content.html
@@ -42,236 +42,236 @@
             {{ formset.management_form }}
             {% for form in formset %}
                 {% with line=form.instance product=form.instance.product %}
-                {% purchase_info_for_line request line as session %}
-                <div class="basket-items">
-                    <div class="row">
-                        <div class="col-md-2">
-                            {{ form.id }}
-                            {% with image=product.primary_image %}
-                            {% oscar_thumbnail image.original "100x100" upscale=False as thumb %}
-                            <a href="{{ product.get_absolute_url }}">
-                                <img class="img-thumbnail w-auto mx-auto my-0"
-                                     src="{{ thumb.url }}"
-                                     alt="{{ product.get_title }}"/>
-                            </a>
-                        {% endwith %}
-                    </div>
-                    <div class="col-md-4">
-                        <h3>
-                            <a href="{{ product.get_absolute_url }}">
-                                {{ line.description }}
-                            </a>
-                        </h3>
-                        <p class="availability {{ session.availability.code }}">
-                            {{ session.availability.message }}
-                        </p>
-                    </div>
-                    <div class="col-md-3">
-                        <div class="checkout-quantity">
-                            <div class="input-group {% if form.errors %}error{% endif %}">
-                            {% render_field form.quantity class+="form-control" %}
-                            <div class="input-group-append">
-                                <button class="btn btn-secondary"
-                                        type="submit"
-                                        data-loading-text="{% trans 'Updating...' %}">
-                                    {% trans "Update" %}
-                                </button>
+                    {% purchase_info_for_line request line as session %}
+                    <div class="basket-items">
+                        <div class="row">
+                            <div class="col-md-2">
+                                {{ form.id }}
+                                {% with image=product.primary_image %}
+                                    {% oscar_thumbnail image.original "100x100" upscale=False as thumb %}
+                                    <a href="{{ product.get_absolute_url }}">
+                                        <img class="img-thumbnail w-auto mx-auto my-0"
+                                             src="{{ thumb.url }}"
+                                             alt="{{ product.get_title }}"/>
+                                    </a>
+                                {% endwith %}
+                            </div>
+                            <div class="col-md-4">
+                                <h3>
+                                    <a href="{{ product.get_absolute_url }}">
+                                        {{ line.description }}
+                                    </a>
+                                </h3>
+                                <p class="availability {{ session.availability.code }}">
+                                    {{ session.availability.message }}
+                                </p>
+                            </div>
+                            <div class="col-md-3">
+                                <div class="checkout-quantity">
+                                    <div class="input-group {% if form.errors %}error{% endif %}">
+                                        {% render_field form.quantity class+="form-control" %}
+                                        <div class="input-group-append">
+                                            <button class="btn btn-secondary"
+                                                    type="submit"
+                                                    data-loading-text="{% trans 'Updating...' %}">
+                                                {% trans "Update" %}
+                                            </button>
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="basket-line-actions">
+                                    <a href="#" data-id="{{ forloop.counter0 }}" data-behaviours="remove">
+                                        {% trans "Remove" %}
+                                    </a>
+                                    {% if user.is_authenticated %}
+                                        |
+                                        <a href="#" data-id="{{ forloop.counter0 }}" data-behaviours="save">
+                                            {% trans "Save for later" %}
+                                        </a>
+                                    {% endif %}
+                                    <div style="display:none">
+                                        {{ form.save_for_later }}
+                                        {{ form.DELETE }}
+                                    </div>
+                                    {% for field_errors in form.errors.values %}
+                                        {% for error in field_errors %}
+                                            <span class="error-block">
+                                                <i class="fas fa-exclamation"></i>
+                                                {{ error }}
+                                            </span>
+                                        {% endfor %}
+                                    {% endfor %}
+                                </div>
+                            </div>
+                            <div class="col-md-1">
+                                {% if not line.unit_price_incl_tax and not line.unit_tax_excl_tax %}
+                                    <p class="text-right">
+                                        &mdash;
+                                    </p>
+                                {% else %}
+                                    <p class="price_color text-right">
+                                        <span class="price-title d-md-none">{% trans "Price" %}:</span>
+                                        {% if line.is_tax_known %}
+                                            {{ line.unit_price_incl_tax|currency:line.price_currency }}
+                                        {% else %}
+                                            {{ line.unit_price_excl_tax|currency:line.price_currency }}
+                                        {% endif %}
+                                    </p>
+                                {% endif %}
+                            </div>
+                            <div class="col-md-2">
+                                {% if not line.line_price_incl_tax and not line_price_excl_tax %}
+                                    <p class="text-right">
+                                        &mdash;
+                                    </p>
+                                {% else %}
+                                    <p class="price_color text-right">
+                                        <span class="price-title d-md-none">{% trans "Total" %}:</span>
+                                        {% if line.is_tax_known %}
+                                            {{ line.line_price_incl_tax|currency:line.price_currency }}
+                                        {% else %}
+                                            {{ line.line_price_excl_tax|currency:line.price_currency }}
+                                        {% endif %}
+                                    </p>
+                                {% endif %}
                             </div>
                         </div>
                     </div>
-                    <div class="basket-line-actions">
-                        <a href="#" data-id="{{ forloop.counter0 }}" data-behaviours="remove">
-                            {% trans "Remove" %}
+                {% endwith %}
+            {% endfor %}
+        </form>
+    {% endblock %}
+    <div class="row">
+        {% block vouchers %}
+            {# Hide the entire section if a custom BasketView doesn't pass in a voucher form #}
+            {% if voucher_form %}
+                <div class="col-sm-6">
+                    <div class="sub-header">
+                        <h2>{% trans "Voucher/promo code" %}</h2>
+                    </div>
+                    <p id="voucher_form_link">
+                        <a href="#voucher" class="btn btn-secondary btn-full">
+                            {% trans "I have a voucher code..." %}
                         </a>
-                        {% if user.is_authenticated %}
-                            |
-                            <a href="#" data-id="{{ forloop.counter0 }}" data-behaviours="save">
-                                {% trans "Save for later" %}
+                    </p>
+                    <div id="voucher_form_container" style="display:none">
+                        <form id="voucher_form" action="{% url 'basket:vouchers-add' %}" method="post">
+                            {% csrf_token %}
+                            {% include "oscar/partials/form_fields.html" with form=voucher_form %}
+                            <button type="submit" class="btn btn-info" data-loading-text="{% trans 'Adding...' %}">
+                                {% trans "Add voucher" %}
+                            </button>
+                            {% trans "or" %}
+                            <a href="#" id="voucher_form_cancel">
+                                {% trans "cancel" %}
                             </a>
-                        {% endif %}
-                        <div style="display:none">
-                            {{ form.save_for_later }}
-                            {{ form.DELETE }}
-                        </div>
-                        {% for field_errors in form.errors.values %}
-                            {% for error in field_errors %}
-                                <span class="error-block">
-                                    <i class="fas fa-exclamation"></i>
-                                    {{ error }}
-                                </span>
-                            {% endfor %}
-                        {% endfor %}
+                        </form>
                     </div>
                 </div>
-                <div class="col-md-1">
-                    {% if not line.unit_price_incl_tax and not line.unit_tax_excl_tax %}
-                        <p class="text-right">
-                            &mdash;
-                        </p>
-                    {% else %}
-                        <p class="price_color text-right">
-                            <span class="price-title d-md-none">{% trans "Price" %}:</span>
-                            {% if line.is_tax_known %}
-                                {{ line.unit_price_incl_tax|currency:line.price_currency }}
-                            {% else %}
-                                {{ line.unit_price_excl_tax|currency:line.price_currency }}
-                            {% endif %}
-                        </p>
-                    {% endif %}
+            {% endif %}
+        {% endblock vouchers %}
+        {% block baskettotals %}
+            <div class="col-sm-6">
+                <div class="sub-header">
+                    <h2>{% trans "Totals" %}</h2>
                 </div>
-                <div class="col-md-2">
-                    {% if not line.line_price_incl_tax and not line_price_excl_tax %}
-                        <p class="text-right">
-                            &mdash;
-                        </p>
-                    {% else %}
-                        <p class="price_color text-right">
-                            <span class="price-title d-md-none">{% trans "Total" %}:</span>
-                            {% if line.is_tax_known %}
-                                {{ line.line_price_incl_tax|currency:line.price_currency }}
-                            {% else %}
-                                {{ line.line_price_excl_tax|currency:line.price_currency }}
-                            {% endif %}
-                        </p>
-                    {% endif %}
+                {% include 'oscar/basket/partials/basket_totals.html' with editable=1 %}
+            </div>
+        {% endblock baskettotals %}
+    </div>
+    {% block formactions %}
+        <div class="form-group clearfix">
+            <div class="row">
+                <div class="col-sm-4 offset-sm-8">
+                    <a href="{% url 'checkout:index' %}" class="btn btn-lg btn-primary btn-block">
+                        {% trans "Proceed to checkout" %}
+                    </a>
                 </div>
             </div>
         </div>
-    {% endwith %}
-{% endfor %}
-</form>
-{% endblock %}
-<div class="row">
-{% block vouchers %}
-{# Hide the entire section if a custom BasketView doesn't pass in a voucher form #}
-{% if voucher_form %}
-    <div class="col-sm-6">
-        <div class="sub-header">
-            <h2>{% trans "Voucher/promo code" %}</h2>
-        </div>
-        <p id="voucher_form_link">
-            <a href="#voucher" class="btn btn-secondary btn-full">
-                {% trans "I have a voucher code..." %}
-            </a>
-        </p>
-        <div id="voucher_form_container" style="display:none">
-            <form id="voucher_form" action="{% url 'basket:vouchers-add' %}" method="post">
-                {% csrf_token %}
-                {% include "oscar/partials/form_fields.html" with form=voucher_form %}
-                <button type="submit" class="btn btn-info" data-loading-text="{% trans 'Adding...' %}">
-                    {% trans "Add voucher" %}
-                </button>
-                {% trans "or" %}
-                <a href="#" id="voucher_form_cancel">
-                    {% trans "cancel" %}
-                </a>
-            </form>
-        </div>
-    </div>
-{% endif %}
-{% endblock vouchers %}
-{% block baskettotals %}
-<div class="col-sm-6">
-    <div class="sub-header">
-        <h2>{% trans "Totals" %}</h2>
-    </div>
-    {% include 'oscar/basket/partials/basket_totals.html' with editable=1 %}
-</div>
-{% endblock baskettotals %}
-</div>
-{% block formactions %}
-<div class="form-group clearfix">
-<div class="row">
-    <div class="col-sm-4 offset-sm-8">
-        <a href="{% url 'checkout:index' %}" class="btn btn-lg btn-primary btn-block">
-            {% trans "Proceed to checkout" %}
-        </a>
-    </div>
-</div>
-</div>
-{% endblock formactions %}
+    {% endblock formactions %}
 {% else %}
-{% block emptybasket %}
-<p>
-{% trans "Your basket is empty." %}
-<a href="{{ homepage_url }}">{% trans "Continue shopping" %}</a>
-</p>
-{% endblock %}
+    {% block emptybasket %}
+        <p>
+            {% trans "Your basket is empty." %}
+            <a href="{{ homepage_url }}">{% trans "Continue shopping" %}</a>
+        </p>
+    {% endblock %}
 {% endif %}
 {% block savedbasket %}
-{% if user.is_authenticated and saved_formset %}
-<div class="card card-body">
-<div class="sub-header">
-    <h2>{% trans "Items to buy later" %}</h2>
-</div>
-<div class="row basket-title d-none d-md-flex">
-    <div class="col-md-8 h4">
-        {% trans "Items" %}
-    </div>
-    <div class="col-md-2 h4 text-center">
-        {% trans "Price" %}
-    </div>
-    <div class="col-md-2">
-        &nbsp;
-    </div>
-</div>
-<form action="{% url 'basket:saved' %}" method="post" id="saved_basket_formset">
-    {% csrf_token %}
-    {{ saved_formset.management_form }}
-    {% for form in saved_formset %}
-        {% purchase_info_for_product request form.instance.product as session %}
-        <div class="basket-items">
-            <div class="row">
-                <div class="col-md-2">
-                    {{ form.id }}
-                    {% with image=form.instance.product.primary_image %}
-                    {% oscar_thumbnail image.original "100x100" upscale=False as thumb %}
-                    <a href="{{ form.instance.product.get_absolute_url }}">
-                        <img class="card card-body mx-auto"
-                             src="{{ thumb.url }}"
-                             alt="{{ form.instance.product.get_title }}">
-                        </a>
-                    {% endwith %}
+    {% if user.is_authenticated and saved_formset %}
+        <div class="card card-body">
+            <div class="sub-header">
+                <h2>{% trans "Items to buy later" %}</h2>
+            </div>
+            <div class="row basket-title d-none d-md-flex">
+                <div class="col-md-8 h4">
+                    {% trans "Items" %}
                 </div>
-                <div class="col-md-6">
-                    <h3>
-                        <a href="{{ form.instance.product.get_absolute_url }}">
-                            {{ form.instance.description }}
-                        </a>
-                    </h3>
-                    <p class="availability {{ session.availability.code }}">
-                        {{ session.availability.message }}
-                    </p>
-                    <a href="#" data-id="{{ forloop.counter0 }}" data-behaviours="remove">
-                        {% trans "Remove" %}
-                    </a>
-                    <div style="display:none">
-                        {{ form.move_to_basket }}
-                        {{ form.DELETE }}
-                    </div>
-                </div>
-                {% purchase_info_for_product request form.instance.product as saved %}
-                <div class="col-md-2 text-center">
-                    <p class="price_color">
-                        {% if saved.price.is_tax_known %}
-                            {{ saved.price.incl_tax|currency:saved.price.currency }}
-                        {% else %}
-                            {{ saved.price.excl_tax|currency:saved.price.currency }}
-                        {% endif %}
-                    </p>
+                <div class="col-md-2 h4 text-center">
+                    {% trans "Price" %}
                 </div>
                 <div class="col-md-2">
-                    <a href="#"
-                       data-id="{{ forloop.counter0 }}"
-                       class="btn float-right btn-block"
-                       data-behaviours="move">
-                        {% trans "Move to basket" %}
-                    </a>
+                    &nbsp;
                 </div>
             </div>
+            <form action="{% url 'basket:saved' %}" method="post" id="saved_basket_formset">
+                {% csrf_token %}
+                {{ saved_formset.management_form }}
+                {% for form in saved_formset %}
+                    {% purchase_info_for_product request form.instance.product as session %}
+                    <div class="basket-items">
+                        <div class="row">
+                            <div class="col-md-2">
+                                {{ form.id }}
+                                {% with image=form.instance.product.primary_image %}
+                                    {% oscar_thumbnail image.original "100x100" upscale=False as thumb %}
+                                    <a href="{{ form.instance.product.get_absolute_url }}">
+                                        <img class="card card-body mx-auto"
+                                             src="{{ thumb.url }}"
+                                             alt="{{ form.instance.product.get_title }}">
+                                    </a>
+                                {% endwith %}
+                            </div>
+                            <div class="col-md-6">
+                                <h3>
+                                    <a href="{{ form.instance.product.get_absolute_url }}">
+                                        {{ form.instance.description }}
+                                    </a>
+                                </h3>
+                                <p class="availability {{ session.availability.code }}">
+                                    {{ session.availability.message }}
+                                </p>
+                                <a href="#" data-id="{{ forloop.counter0 }}" data-behaviours="remove">
+                                    {% trans "Remove" %}
+                                </a>
+                                <div style="display:none">
+                                    {{ form.move_to_basket }}
+                                    {{ form.DELETE }}
+                                </div>
+                            </div>
+                            {% purchase_info_for_product request form.instance.product as saved %}
+                            <div class="col-md-2 text-center">
+                                <p class="price_color">
+                                    {% if saved.price.is_tax_known %}
+                                        {{ saved.price.incl_tax|currency:saved.price.currency }}
+                                    {% else %}
+                                        {{ saved.price.excl_tax|currency:saved.price.currency }}
+                                    {% endif %}
+                                </p>
+                            </div>
+                            <div class="col-md-2">
+                                <a href="#"
+                                   data-id="{{ forloop.counter0 }}"
+                                   class="btn float-right btn-block"
+                                   data-behaviours="move">
+                                    {% trans "Move to basket" %}
+                                </a>
+                            </div>
+                        </div>
+                    </div>
+                {% endfor %}
+            </form>
         </div>
-    {% endfor %}
-</form>
-</div>
-{% endif %}
+    {% endif %}
 {% endblock %}
diff --git a/tests/django_oscar/oscar/basket/partials/basket_quick.html b/tests/django_oscar/oscar/basket/partials/basket_quick.html
index 3afa05f..e138866 100644
--- a/tests/django_oscar/oscar/basket/partials/basket_quick.html
+++ b/tests/django_oscar/oscar/basket/partials/basket_quick.html
@@ -11,11 +11,11 @@
                     <div class="col-sm-3">
                         <div class="image_container w-100">
                             {% with image=line.product.primary_image %}
-                            {% oscar_thumbnail image.original "100x100" upscale=False as thumb %}
-                            <a href="{{ line.product.get_absolute_url }}">
-                                <img src="{{ thumb.url }}"
-                                     alt="{{ line.product.get_title }}"
-                                     class="img-thumbnail w-auto mx-auto my-0">
+                                {% oscar_thumbnail image.original "100x100" upscale=False as thumb %}
+                                <a href="{{ line.product.get_absolute_url }}">
+                                    <img src="{{ thumb.url }}"
+                                         alt="{{ line.product.get_title }}"
+                                         class="img-thumbnail w-auto mx-auto my-0">
                                 </a>
                             {% endwith %}
                         </div>
diff --git a/tests/django_oscar/oscar/basket/partials/basket_totals.html b/tests/django_oscar/oscar/basket/partials/basket_totals.html
index 807b08d..07f1eff 100644
--- a/tests/django_oscar/oscar/basket/partials/basket_totals.html
+++ b/tests/django_oscar/oscar/basket/partials/basket_totals.html
@@ -12,280 +12,280 @@
                 </tr>
             {% endblock %}
             {% with offer_discounts=basket.offer_discounts voucher_discounts=basket.grouped_voucher_discounts %}
-            {% block discount_totals %}
-                {% if offer_discounts or voucher_discounts %}
-                    {# Basket total will be discounted so we show a before and after version #}
-                    <tr>
-                        <td>{% trans "Basket total (before discounts)" %}</td>
-                        <td class="text-right">
-                            {% if basket.is_tax_known and not show_tax_separately %}
-                                {{ basket.total_incl_tax_excl_discounts|currency:basket.currency }}
-                            {% else %}
-                                {{ basket.total_excl_tax_excl_discounts|currency:basket.currency }}
-                            {% endif %}
-                        </td>
-                    </tr>
-                    {% for discount in offer_discounts %}
+                {% block discount_totals %}
+                    {% if offer_discounts or voucher_discounts %}
+                        {# Basket total will be discounted so we show a before and after version #}
                         <tr>
-                            <td class="basket-discount">
-                                <span class="badge badge-success">{% trans "Discount" %}</span>
-                                {{ discount.name }}
-                                {% if discount.description %}
-                                    <br/>
-                                    <small>
-                                    {{ discount.description }}
-                                    </small>
+                            <td>{% trans "Basket total (before discounts)" %}</td>
+                            <td class="text-right">
+                                {% if basket.is_tax_known and not show_tax_separately %}
+                                    {{ basket.total_incl_tax_excl_discounts|currency:basket.currency }}
+                                {% else %}
+                                    {{ basket.total_excl_tax_excl_discounts|currency:basket.currency }}
                                 {% endif %}
                             </td>
-                            <td class="text-right">-{{ discount.discount|currency:basket.currency }}</td>
                         </tr>
-                    {% endfor %}
-                    {% if voucher_discounts %}
-                        <tr>
-                            <th colspan="2">
-                                <h3>{% trans "Vouchers" %}</h3>
-                            </th>
-                        </tr>
-                        {% for discount in voucher_discounts %}
+                        {% for discount in offer_discounts %}
                             <tr>
-                                <td>
-                                    {{ discount.voucher.name }} ({{ discount.voucher.code }})
-                                    {% if editable %}
-                                        <form action="{% url 'basket:vouchers-remove' pk=discount.voucher.id %}"
-                                              method="POST">
-                                            {% csrf_token %}
-                                            <input type="submit"
-                                                   value="{% trans 'Remove' %}"
-                                                   class="btn btn-sm btn-danger"/>
-                                        </form>
+                                <td class="basket-discount">
+                                    <span class="badge badge-success">{% trans "Discount" %}</span>
+                                    {{ discount.name }}
+                                    {% if discount.description %}
+                                        <br/>
+                                        <small>
+                                        {{ discount.description }}
+                                        </small>
                                     {% endif %}
                                 </td>
                                 <td class="text-right">-{{ discount.discount|currency:basket.currency }}</td>
                             </tr>
                         {% endfor %}
+                        {% if voucher_discounts %}
+                            <tr>
+                                <th colspan="2">
+                                    <h3>{% trans "Vouchers" %}</h3>
+                                </th>
+                            </tr>
+                            {% for discount in voucher_discounts %}
+                                <tr>
+                                    <td>
+                                        {{ discount.voucher.name }} ({{ discount.voucher.code }})
+                                        {% if editable %}
+                                            <form action="{% url 'basket:vouchers-remove' pk=discount.voucher.id %}"
+                                                  method="POST">
+                                                {% csrf_token %}
+                                                <input type="submit"
+                                                       value="{% trans 'Remove' %}"
+                                                       class="btn btn-sm btn-danger"/>
+                                            </form>
+                                        {% endif %}
+                                    </td>
+                                    <td class="text-right">-{{ discount.discount|currency:basket.currency }}</td>
+                                </tr>
+                            {% endfor %}
+                        {% endif %}
                     {% endif %}
-                {% endif %}
-            {% endblock %}
-            {% block basket_total %}
-                {% if offer_discounts or voucher_discounts %}
-                    <tr>
-                        <th class="total">{% trans "Basket total (after discounts)" %}</th>
-                        <th class="total text-right">
-                            {% if not show_tax_separately and basket.is_tax_known %}
-                                {{ basket.total_incl_tax|currency:basket.currency }}
-                            {% else %}
-                                {{ basket.total_excl_tax|currency:basket.currency }}
-                            {% endif %}
-                        </th>
-                    </tr>
-                {% else %}
-                    {# No discounts to basket #}
-                    <tr>
-                        <th class="total">{% trans "Basket total" %}</th>
-                        <th class="total text-right">
-                            {% if not show_tax_separately and basket.is_tax_known %}
-                                {{ basket.total_incl_tax|currency:basket.currency }}
-                            {% else %}
-                                {{ basket.total_excl_tax|currency:basket.currency }}
-                            {% endif %}
-                        </th>
-                    </tr>
-                {% endif %}
-            {% endblock %}
-        {% endwith %}
-        {% block shipping_totals %}
-            <tr>
-                <th>&nbsp;</th>
-                <td></td>
-            </tr>
-            <tr>
-                <th colspan="2">
-                    <h3>{% trans "Shipping" %}</h3>
-                    {% if shipping_methods|length > 1 and editable %}
-                        <small>
-                        {% trans "Alternative shipping methods can be chosen during checkout" %}
-                        </small>
+                {% endblock %}
+                {% block basket_total %}
+                    {% if offer_discounts or voucher_discounts %}
+                        <tr>
+                            <th class="total">{% trans "Basket total (after discounts)" %}</th>
+                            <th class="total text-right">
+                                {% if not show_tax_separately and basket.is_tax_known %}
+                                    {{ basket.total_incl_tax|currency:basket.currency }}
+                                {% else %}
+                                    {{ basket.total_excl_tax|currency:basket.currency }}
+                                {% endif %}
+                            </th>
+                        </tr>
+                    {% else %}
+                        {# No discounts to basket #}
+                        <tr>
+                            <th class="total">{% trans "Basket total" %}</th>
+                            <th class="total text-right">
+                                {% if not show_tax_separately and basket.is_tax_known %}
+                                    {{ basket.total_incl_tax|currency:basket.currency }}
+                                {% else %}
+                                    {{ basket.total_excl_tax|currency:basket.currency }}
+                                {% endif %}
+                            </th>
+                        </tr>
                     {% endif %}
-                </th>
-            </tr>
-            {% if not shipping_method.is_discounted %}
-                <tr>
-                    <th class="total">{{ shipping_method.name }}</th>
-                    <th class="total text-right">
-                        {% if not show_tax_separately and shipping_charge.is_tax_known %}
-                            {{ shipping_charge.incl_tax|currency:basket.currency }}
-                        {% else %}
-                            {{ shipping_charge.excl_tax|currency:basket.currency }}
-                        {% endif %}
-                    </th>
-                </tr>
-            {% else %}
-                {% shipping_charge_discount shipping_method basket as shipping_discount %}
-                {% shipping_charge_excl_discount shipping_method basket as shipping_charge_excl_discount %}
-                {# As shipping is discounted, we break it down into its original charge and a discount #}
-                <tr>
-                    <th class="total">{% trans "Shipping method" %}</th>
-                    <td class="total text-right">{{ shipping_method.name }}</td>
-                </tr>
-                <tr>
-                    <td>{% trans "Shipping total (before discounts)" %}</td>
-                    <td class="text-right">
-                        {% if not show_tax_separately and shipping_charge_excl_discount.is_tax_known %}
-                            {{ shipping_charge_excl_discount.incl_tax|currency:basket.currency }}
-                        {% else %}
-                            {{ shipping_charge_excl_discount.excl_tax|currency:basket.currency }}
-                        {% endif %}
-                    </td>
-                </tr>
-                {# This section needs adjustment to when taxes are shown separately #}
-                <tr>
-                    <td class="basket-discount">
-                        <span class="badge badge-success">{% trans "Discount" %}</span>
-                        {{ shipping_method.discount_name }}
-                    </td>
-                    <td class="text-right">-{{ shipping_discount|currency:basket.currency }}</td>
-                </tr>
-                <tr>
-                    <th class="total">
-                        {% trans "Shipping total (after discounts)" %}
-                    </th>
-                    <th class="total text-right">
-                        {% if not show_tax_separately and shipping_charge.is_tax_known %}
-                            {{ shipping_charge.incl_tax|currency:basket.currency }}
-                        {% else %}
-                            {{ shipping_charge.excl_tax|currency:basket.currency }}
-                        {% endif %}
-                    </th>
-                </tr>
-            {% endif %}
-        {% endblock %}
-        {% block surcharges %}
-            {% if surcharges %}
+                {% endblock %}
+            {% endwith %}
+            {% block shipping_totals %}
                 <tr>
                     <th>&nbsp;</th>
                     <td></td>
                 </tr>
                 <tr>
                     <th colspan="2">
-                        <h3>{% trans "Surcharges" %}</h3>
+                        <h3>{% trans "Shipping" %}</h3>
+                        {% if shipping_methods|length > 1 and editable %}
+                            <small>
+                            {% trans "Alternative shipping methods can be chosen during checkout" %}
+                            </small>
+                        {% endif %}
                     </th>
                 </tr>
-                {% for surcharge in surcharges %}
+                {% if not shipping_method.is_discounted %}
                     <tr>
-                        <th class="total">
-                            {{ surcharge.surcharge.name }}
-                        </th>
-                        <th class="total align-right">
-                            {% if not show_tax_separately and surcharge.price.is_tax_known %}
-                                {{ surcharge.price.incl_tax|currency:basket.currency }}
+                        <th class="total">{{ shipping_method.name }}</th>
+                        <th class="total text-right">
+                            {% if not show_tax_separately and shipping_charge.is_tax_known %}
+                                {{ shipping_charge.incl_tax|currency:basket.currency }}
                             {% else %}
-                                {{ surcharge.price.excl_tax|currency:basket.currency }}
+                                {{ shipping_charge.excl_tax|currency:basket.currency }}
                             {% endif %}
                         </th>
                     </tr>
-                {% endfor %}
-            {% endif %}
-        {% endblock %}
-        {% block tax_totals %}
-            {% if show_tax_separately %}
-                <tr>
-                    <th>
-                        &nbsp;
-                    </th>
-                    <td></td>
-                </tr>
-                <tr>
-                    <th colspan="2">
-                        <h3>
-                            {% trans "Tax" %}
-                        </h3>
-                    </th>
-                </tr>
-                <tr>
-                    <th class="total">
-                        {% trans "Basket" %}
-                    </th>
-                    <th class="total text-right">
-                        {{ basket.total_tax|currency:basket.currency }}
-                    </th>
-                </tr>
-                <tr>
-                    <th class="total">
-                        {% trans "Shipping" %}
-                    </th>
-                    <th class="total text-right">
-                        {{ shipping_charge.tax|currency:basket.currency }}
-                    </th>
-                </tr>
-            {% endif %}
-        {% endblock %}
-        {% block post_order_action_totals %}
-            {% if basket.post_order_actions %}
-                <tr>
-                    <th>
-                        &nbsp;
-                    </th>
-                    <td></td>
-                </tr>
-                <tr>
-                    <th>
-                        <h3>
-                            {% trans "Post order actions" %}
-                        </h3>
-                        <small>
-                        {% trans "These will be applied once your order is placed." %}
-                        </small>
-                    </th>
-                    <td></td>
-                </tr>
-                {% for discount in basket.post_order_actions %}
+                {% else %}
+                    {% shipping_charge_discount shipping_method basket as shipping_discount %}
+                    {% shipping_charge_excl_discount shipping_method basket as shipping_charge_excl_discount %}
+                    {# As shipping is discounted, we break it down into its original charge and a discount #}
                     <tr>
-                        <td class="total" colspan="2">
-                            <span class="badge badge-success">
-                                {{ discount.name }}
-                            </span>
-                            <br/>
-                            <p>
-                                {{ discount.description }}
-                            </p>
+                        <th class="total">{% trans "Shipping method" %}</th>
+                        <td class="total text-right">{{ shipping_method.name }}</td>
+                    </tr>
+                    <tr>
+                        <td>{% trans "Shipping total (before discounts)" %}</td>
+                        <td class="text-right">
+                            {% if not show_tax_separately and shipping_charge_excl_discount.is_tax_known %}
+                                {{ shipping_charge_excl_discount.incl_tax|currency:basket.currency }}
+                            {% else %}
+                                {{ shipping_charge_excl_discount.excl_tax|currency:basket.currency }}
+                            {% endif %}
                         </td>
                     </tr>
-                {% endfor %}
-            {% endif %}
-        {% endblock %}
-        {% block order_total %}
-            <tr>
-                <th>
-                    &nbsp;
-                </th>
-                <td></td>
-            </tr>
-            <tr>
-                <th class="total">
-                    <h3>
-                        {% trans "Order total" %}
-                    </h3>
-                </th>
-                <td class="total text-right">
-                    <h3 class="price_color">
-                        {% if order_total.is_tax_known %}
-                            {{ order_total.incl_tax|currency:basket.currency }}
-                        {% else %}
-                            {{ order_total.excl_tax|currency:basket.currency }}
-                        {% endif %}
-                    </h3>
-                </td>
-            </tr>
-            {% if not order_total.is_tax_known %}
+                    {# This section needs adjustment to when taxes are shown separately #}
+                    <tr>
+                        <td class="basket-discount">
+                            <span class="badge badge-success">{% trans "Discount" %}</span>
+                            {{ shipping_method.discount_name }}
+                        </td>
+                        <td class="text-right">-{{ shipping_discount|currency:basket.currency }}</td>
+                    </tr>
+                    <tr>
+                        <th class="total">
+                            {% trans "Shipping total (after discounts)" %}
+                        </th>
+                        <th class="total text-right">
+                            {% if not show_tax_separately and shipping_charge.is_tax_known %}
+                                {{ shipping_charge.incl_tax|currency:basket.currency }}
+                            {% else %}
+                                {{ shipping_charge.excl_tax|currency:basket.currency }}
+                            {% endif %}
+                        </th>
+                    </tr>
+                {% endif %}
+            {% endblock %}
+            {% block surcharges %}
+                {% if surcharges %}
+                    <tr>
+                        <th>&nbsp;</th>
+                        <td></td>
+                    </tr>
+                    <tr>
+                        <th colspan="2">
+                            <h3>{% trans "Surcharges" %}</h3>
+                        </th>
+                    </tr>
+                    {% for surcharge in surcharges %}
+                        <tr>
+                            <th class="total">
+                                {{ surcharge.surcharge.name }}
+                            </th>
+                            <th class="total align-right">
+                                {% if not show_tax_separately and surcharge.price.is_tax_known %}
+                                    {{ surcharge.price.incl_tax|currency:basket.currency }}
+                                {% else %}
+                                    {{ surcharge.price.excl_tax|currency:basket.currency }}
+                                {% endif %}
+                            </th>
+                        </tr>
+                    {% endfor %}
+                {% endif %}
+            {% endblock %}
+            {% block tax_totals %}
+                {% if show_tax_separately %}
+                    <tr>
+                        <th>
+                            &nbsp;
+                        </th>
+                        <td></td>
+                    </tr>
+                    <tr>
+                        <th colspan="2">
+                            <h3>
+                                {% trans "Tax" %}
+                            </h3>
+                        </th>
+                    </tr>
+                    <tr>
+                        <th class="total">
+                            {% trans "Basket" %}
+                        </th>
+                        <th class="total text-right">
+                            {{ basket.total_tax|currency:basket.currency }}
+                        </th>
+                    </tr>
+                    <tr>
+                        <th class="total">
+                            {% trans "Shipping" %}
+                        </th>
+                        <th class="total text-right">
+                            {{ shipping_charge.tax|currency:basket.currency }}
+                        </th>
+                    </tr>
+                {% endif %}
+            {% endblock %}
+            {% block post_order_action_totals %}
+                {% if basket.post_order_actions %}
+                    <tr>
+                        <th>
+                            &nbsp;
+                        </th>
+                        <td></td>
+                    </tr>
+                    <tr>
+                        <th>
+                            <h3>
+                                {% trans "Post order actions" %}
+                            </h3>
+                            <small>
+                            {% trans "These will be applied once your order is placed." %}
+                            </small>
+                        </th>
+                        <td></td>
+                    </tr>
+                    {% for discount in basket.post_order_actions %}
+                        <tr>
+                            <td class="total" colspan="2">
+                                <span class="badge badge-success">
+                                    {{ discount.name }}
+                                </span>
+                                <br/>
+                                <p>
+                                    {{ discount.description }}
+                                </p>
+                            </td>
+                        </tr>
+                    {% endfor %}
+                {% endif %}
+            {% endblock %}
+            {% block order_total %}
                 <tr>
-                    <td>
-                        <small>
-                        {% trans "Taxes will be added during checkout." %}
-                        </small>
+                    <th>
+                        &nbsp;
+                    </th>
+                    <td></td>
+                </tr>
+                <tr>
+                    <th class="total">
+                        <h3>
+                            {% trans "Order total" %}
+                        </h3>
+                    </th>
+                    <td class="total text-right">
+                        <h3 class="price_color">
+                            {% if order_total.is_tax_known %}
+                                {{ order_total.incl_tax|currency:basket.currency }}
+                            {% else %}
+                                {{ order_total.excl_tax|currency:basket.currency }}
+                            {% endif %}
+                        </h3>
                     </td>
                 </tr>
-            {% endif %}
-        {% endblock %}
-    </tbody>
-</table>
+                {% if not order_total.is_tax_known %}
+                    <tr>
+                        <td>
+                            <small>
+                            {% trans "Taxes will be added during checkout." %}
+                            </small>
+                        </td>
+                    </tr>
+                {% endif %}
+            {% endblock %}
+        </tbody>
+    </table>
 </div>
diff --git a/tests/django_oscar/oscar/catalogue/browse.html b/tests/django_oscar/oscar/catalogue/browse.html
index ef1cf17..2a3e8dc 100644
--- a/tests/django_oscar/oscar/catalogue/browse.html
+++ b/tests/django_oscar/oscar/catalogue/browse.html
@@ -53,81 +53,82 @@
     <div class="side_categories card card-body bg-light">
         {% for field, data in facet_data.items %}
             {% if data.results %}
-                {% include 'oscar/search/partials/facet.html' with name=data.name items=data.results %}{% endif %}
-            {% endfor %}
-        </div>
-    {% endif %}
+                {% include 'oscar/search/partials/facet.html' with name=data.name items=data.results %}
+            {% endif %}
+        {% endfor %}
+    </div>
+{% endif %}
 {% endblock %}
 {% block content %}
-    <form method="get">
-        {# Render other search params as hidden inputs #}
-        {% for value in selected_facets %}
-            <input type="hidden" name="selected_facets" value="{{ value }}" />
-        {% endfor %}
-        <input type="hidden" name="q" value="{{ search_form.q.value|default_if_none:"" }}" />
-        {% if paginator.count %}
-            {% if paginator.num_pages > 1 %}
-                {% blocktrans with start=page_obj.start_index end=page_obj.end_index count num_results=paginator.count %}
-                    <strong>{{ num_results }}</strong>
-                    result - showing
-                    <strong>{{ start }}</strong>
-                    to
-                    <strong>{{ end }}</strong>
-                    .
-                    {% plural %}
-                    <strong>{{ num_results }}</strong>
-                    results - showing
-                    <strong>{{ start }}</strong>
-                    to
-                    <strong>{{ end }}</strong>
-                    .
-                {% endblocktrans %}
-            {% else %}
-                {% blocktrans count num_results=paginator.count %}
-                    <strong>{{ num_results }}</strong>
-                    result.
-                    {% plural %}
-                    <strong>
-                    {{ num_results }}
-                    </strong>
-                    results.
-                {% endblocktrans %}
-            {% endif %}
-            {% if form %}
-                <div class="float-right">
-                    {% include "oscar/partials/form_field.html" with field=form.sort_by style='horizontal' %}
-                </div>
-            {% endif %}
+<form method="get">
+    {# Render other search params as hidden inputs #}
+    {% for value in selected_facets %}
+        <input type="hidden" name="selected_facets" value="{{ value }}" />
+    {% endfor %}
+    <input type="hidden" name="q" value="{{ search_form.q.value|default_if_none:"" }}" />
+    {% if paginator.count %}
+        {% if paginator.num_pages > 1 %}
+            {% blocktrans with start=page_obj.start_index end=page_obj.end_index count num_results=paginator.count %}
+                <strong>{{ num_results }}</strong>
+                result - showing
+                <strong>{{ start }}</strong>
+                to
+                <strong>{{ end }}</strong>
+                .
+                {% plural %}
+                <strong>{{ num_results }}</strong>
+                results - showing
+                <strong>{{ start }}</strong>
+                to
+                <strong>{{ end }}</strong>
+                .
+            {% endblocktrans %}
         {% else %}
-            <p>
-                {% trans "
+            {% blocktrans count num_results=paginator.count %}
+                <strong>{{ num_results }}</strong>
+                result.
+                {% plural %}
                 <strong>
-                0
+                {{ num_results }}
                 </strong>
-                results." %}
-            </p>
+                results.
+            {% endblocktrans %}
         {% endif %}
-    </form>
-    {% if products %}
-        <section>
-            <div>
-                <ol class="row list-unstyled ml-0 pl-0">
-                    {% for product in products %}
-                        <li class="col-sm-6 col-md-4 col-lg-3">
-                            {% render_product product %}
-                        </li>
-                    {% endfor %}
-                </ol>
-                {% include "oscar/partials/pagination.html" %}
+        {% if form %}
+            <div class="float-right">
+                {% include "oscar/partials/form_field.html" with field=form.sort_by style='horizontal' %}
             </div>
-        </section>
+        {% endif %}
     {% else %}
-        <p class="nonefound">
-            {% trans "No products found." %}
+        <p>
+            {% trans "
+            <strong>
+            0
+            </strong>
+            results." %}
         </p>
     {% endif %}
+</form>
+{% if products %}
+    <section>
+        <div>
+            <ol class="row list-unstyled ml-0 pl-0">
+                {% for product in products %}
+                    <li class="col-sm-6 col-md-4 col-lg-3">
+                        {% render_product product %}
+                    </li>
+                {% endfor %}
+            </ol>
+            {% include "oscar/partials/pagination.html" %}
+        </div>
+    </section>
+{% else %}
+    <p class="nonefound">
+        {% trans "No products found." %}
+    </p>
+{% endif %}
 {% endblock content %}
 {% block onbodyload %}
-    {{ block.super }}
-    oscar.search.init();
+{{ block.super }}
+oscar.search.init();
 {% endblock %}
diff --git a/tests/django_oscar/oscar/catalogue/detail.html b/tests/django_oscar/oscar/catalogue/detail.html
index 4bd3cc1..346b2f3 100644
--- a/tests/django_oscar/oscar/catalogue/detail.html
+++ b/tests/django_oscar/oscar/catalogue/detail.html
@@ -15,28 +15,28 @@
                 <a href="{{ homepage_url }}">{% trans "Home" %}</a>
             </li>
             {% with category=product.get_categories.first %}
-            {% for c in category.get_ancestors_and_self %}
-                <li class="breadcrumb-item">
-                    <a href="{{ c.get_absolute_url }}">
-                        {{ c.name }}
-                    </a>
+                {% for c in category.get_ancestors_and_self %}
+                    <li class="breadcrumb-item">
+                        <a href="{{ c.get_absolute_url }}">
+                            {{ c.name }}
+                        </a>
+                    </li>
+                {% endfor %}
+                <li class="breadcrumb-item active" aria-current="page">
+                    {{ product.get_title }}
                 </li>
-            {% endfor %}
-            <li class="breadcrumb-item active" aria-current="page">
-                {{ product.get_title }}
-            </li>
-            {% get_back_button as backbutton %}
-            {% if backbutton %}
-                <li class="float-right">
-                    <a href="{{ backbutton.url }}">
-                        <i class="fas fa-arrow-left"></i>
-                        {{ backbutton.title }}
-                    </a>
-                </li>
-            {% endif %}
-        {% endwith %}
-    </ol>
-</nav>
+                {% get_back_button as backbutton %}
+                {% if backbutton %}
+                    <li class="float-right">
+                        <a href="{{ backbutton.url }}">
+                            <i class="fas fa-arrow-left"></i>
+                            {{ backbutton.title }}
+                        </a>
+                    </li>
+                {% endif %}
+            {% endwith %}
+        </ol>
+    </nav>
 {% endblock %}
 {% block header %}{% endblock header %}
 {% block content %}
@@ -65,171 +65,174 @@
                 {% endif %}
                 <h1>{{ product.get_title }}</h1>
                 {% block product_stock_record %}
-                    {% include "oscar/catalogue/partials/stock_record.html" with verbose=1 %}{% endblock %}
-                    {% iffeature "reviews" %}
-                        {% include "oscar/catalogue/reviews/partials/review_stars.html" %}{% endiffeature %}
-                        <hr/>
-                        {% if not product.is_parent %}
-                            {% block product_basket_form %}
-                                {% include "oscar/catalogue/partials/add_to_basket_form.html" %}{% endblock %}
-                            {% else %}
-                                {% block variants %}
-                                    <h2>{% trans 'Variants:' %}</h2>
-                                    {% for child in product.children.public %}
-                                        {% purchase_info_for_product request child as child_session %}
-                                        {% if child_session.availability.is_available_to_buy %}
-                                            <a href="{{ child.get_absolute_url }}">
-                                                {{ child.get_title }}
-                                            </a>
-                                            <br>
-                                        {% endif %}
-                                    {% endfor %}
-                                {% endblock %}
-                            {% endif %}
-                        </div>
-                        <!-- /col-sm-6 -->
-                    {% endblock %}
-                </div>
-                <!-- /row -->
-                {% block product_description %}
-                    {% if product.description %}
-                        <div id="product_description" class="sub-header">
-                            <h2>{% trans "Product Description" %}</h2>
-                        </div>
-                        <p>
-                            {{ product.description|safe }}
-                        </p>
-                    {% endif %}
-                {% endblock %}
-                {% block product_info %}
-                    <div class="sub-header">
-                        <h2>{% trans "Product Information" %}</h2>
-                    </div>
-                    <table class="table table-striped">
-                        {% if product.upc %}
-                            <tr>
-                                <th>{% trans "UPC" %}</th>
-                                <td>{{ product.upc }}</td>
-                            </tr>
-                        {% endif %}
-                        <tr>
-                            <th>{% trans "Product Type" %}</th>
-                            <td>{{ product.get_product_class.name }}</td>
-                        </tr>
-                        {% purchase_info_for_product request product as session %}
-                        {% if session.price.exists %}
-                            <tr>
-                                <th>{% trans "Price (excl. tax)" %}</th>
-                                <td>{{ session.price.excl_tax|currency:session.price.currency }}</td>
-                            </tr>
-                            {% if session.price.is_tax_known %}
-                                <tr>
-                                    <th>
-                                        {% trans "Price (incl. tax)" %}
-                                    </th>
-                                    <td>
-                                        {{ session.price.incl_tax|currency:session.price.currency }}
-                                    </td>
-                                </tr>
-                                <tr>
-                                    <th>
-                                        {% trans "Tax" %}
-                                    </th>
-                                    <td>
-                                        {{ session.price.tax|currency:session.price.currency }}
-                                    </td>
-                                </tr>
-                            {% endif %}
-                            <tr>
-                                <th>
-                                    {% trans "Availability" %}
-                                </th>
-                                <td>
-                                    {{ session.availability.message }}
-                                </td>
-                            </tr>
-                        {% endif %}
-                        {% for av in product.get_attribute_values %}
-                            <tr>
-                                <th>
-                                    {{ av.attribute.name }}
-                                </th>
-                                <td>
-                                    {{ av.value_as_html }}
-                                </td>
-                            </tr>
-                        {% endfor %}
-                        {% iffeature "reviews" %}
-                            <tr>
-                                <th>
-                                    {% trans "Number of reviews" %}
-                                </th>
-                                <td>
-                                    {{ product.num_approved_reviews }}
-                                </td>
-                            </tr>
-                        {% endiffeature %}
-                    </table>
+                    {% include "oscar/catalogue/partials/stock_record.html" with verbose=1 %}
                 {% endblock %}
                 {% iffeature "reviews" %}
-                    {% block product_review %}
-                        <section>
-                            <div id="reviews" class="sub-header">
-                                {% if product.num_approved_reviews > 3 %}
-                                    <a href="{% url 'catalogue:reviews-list' product_slug=product.slug product_pk=product.id %}"
-                                       class="btn float-right">
-                                        {% trans "See all reviews" %}
-                                    </a>
-                                {% endif %}
-                                <h2>
-                                    {% trans "Customer Reviews" %}
-                                </h2>
-                            </div>
-                            {% if product.num_approved_reviews == 0 %}
-                                <p>
-                                    {% if product|is_review_permitted:user %}
-                                        {% url 'catalogue:reviews-add' product_slug=product.slug product_pk=product.id as add_review_url %}
-                                        {% blocktrans %}
-                                            This product does not have any reviews yet -
-                                            <a href="{{ add_review_url }}#addreview">
-                                                be the first to write one
-                                            </a>
-                                            .
-                                        {% endblocktrans %}
-                                    {% else %}
-                                        {% trans "This product does not have any reviews yet" %}.
-                                    {% endif %}
-                                </p>
-                            {% else %}
-                                <ol class="list-unstyled review-list">
-                                    {% for review in product.reviews.approved.all|slice:":3" %}
-                                        <li>
-                                            {% include 'oscar/catalogue/partials/review.html' %}
-                                        </li>
-                                    {% endfor %}
-                                </ol>
-                            {% endif %}
-                        </section>
-                    {% endblock product_review %}
+                    {% include "oscar/catalogue/reviews/partials/review_stars.html" %}
                 {% endiffeature %}
-                {% with recommended_products=product.sorted_recommended_products|slice:":6" %}
-                {% if recommended_products %}
-                    <div class="sub-header">
-                        <h2>
-                            {% trans "Recommended items" %}
-                        </h2>
-                    </div>
-                    <ul class="row list-unstyled mx-0">
-                        {% for product in recommended_products %}
-                            <li class="col-sm-4 col-md-3 col-lg-3">
-                                {% render_product product %}
+                <hr/>
+                {% if not product.is_parent %}
+                    {% block product_basket_form %}
+                        {% include "oscar/catalogue/partials/add_to_basket_form.html" %}
+                    {% endblock %}
+                {% else %}
+                    {% block variants %}
+                        <h2>{% trans 'Variants:' %}</h2>
+                        {% for child in product.children.public %}
+                            {% purchase_info_for_product request child as child_session %}
+                            {% if child_session.availability.is_available_to_buy %}
+                                <a href="{{ child.get_absolute_url }}">
+                                    {{ child.get_title }}
+                                </a>
+                                <br>
+                            {% endif %}
+                        {% endfor %}
+                    {% endblock %}
+                {% endif %}
+            </div>
+            <!-- /col-sm-6 -->
+        {% endblock %}
+    </div>
+    <!-- /row -->
+    {% block product_description %}
+        {% if product.description %}
+            <div id="product_description" class="sub-header">
+                <h2>{% trans "Product Description" %}</h2>
+            </div>
+            <p>
+                {{ product.description|safe }}
+            </p>
+        {% endif %}
+    {% endblock %}
+    {% block product_info %}
+        <div class="sub-header">
+            <h2>{% trans "Product Information" %}</h2>
+        </div>
+        <table class="table table-striped">
+            {% if product.upc %}
+                <tr>
+                    <th>{% trans "UPC" %}</th>
+                    <td>{{ product.upc }}</td>
+                </tr>
+            {% endif %}
+            <tr>
+                <th>{% trans "Product Type" %}</th>
+                <td>{{ product.get_product_class.name }}</td>
+            </tr>
+            {% purchase_info_for_product request product as session %}
+            {% if session.price.exists %}
+                <tr>
+                    <th>{% trans "Price (excl. tax)" %}</th>
+                    <td>{{ session.price.excl_tax|currency:session.price.currency }}</td>
+                </tr>
+                {% if session.price.is_tax_known %}
+                    <tr>
+                        <th>
+                            {% trans "Price (incl. tax)" %}
+                        </th>
+                        <td>
+                            {{ session.price.incl_tax|currency:session.price.currency }}
+                        </td>
+                    </tr>
+                    <tr>
+                        <th>
+                            {% trans "Tax" %}
+                        </th>
+                        <td>
+                            {{ session.price.tax|currency:session.price.currency }}
+                        </td>
+                    </tr>
+                {% endif %}
+                <tr>
+                    <th>
+                        {% trans "Availability" %}
+                    </th>
+                    <td>
+                        {{ session.availability.message }}
+                    </td>
+                </tr>
+            {% endif %}
+            {% for av in product.get_attribute_values %}
+                <tr>
+                    <th>
+                        {{ av.attribute.name }}
+                    </th>
+                    <td>
+                        {{ av.value_as_html }}
+                    </td>
+                </tr>
+            {% endfor %}
+            {% iffeature "reviews" %}
+                <tr>
+                    <th>
+                        {% trans "Number of reviews" %}
+                    </th>
+                    <td>
+                        {{ product.num_approved_reviews }}
+                    </td>
+                </tr>
+            {% endiffeature %}
+        </table>
+    {% endblock %}
+    {% iffeature "reviews" %}
+        {% block product_review %}
+            <section>
+                <div id="reviews" class="sub-header">
+                    {% if product.num_approved_reviews > 3 %}
+                        <a href="{% url 'catalogue:reviews-list' product_slug=product.slug product_pk=product.id %}"
+                           class="btn float-right">
+                            {% trans "See all reviews" %}
+                        </a>
+                    {% endif %}
+                    <h2>
+                        {% trans "Customer Reviews" %}
+                    </h2>
+                </div>
+                {% if product.num_approved_reviews == 0 %}
+                    <p>
+                        {% if product|is_review_permitted:user %}
+                            {% url 'catalogue:reviews-add' product_slug=product.slug product_pk=product.id as add_review_url %}
+                            {% blocktrans %}
+                                This product does not have any reviews yet -
+                                <a href="{{ add_review_url }}#addreview">
+                                    be the first to write one
+                                </a>
+                                .
+                            {% endblocktrans %}
+                        {% else %}
+                            {% trans "This product does not have any reviews yet" %}.
+                        {% endif %}
+                    </p>
+                {% else %}
+                    <ol class="list-unstyled review-list">
+                        {% for review in product.reviews.approved.all|slice:":3" %}
+                            <li>
+                                {% include 'oscar/catalogue/partials/review.html' %}
                             </li>
                         {% endfor %}
-                    </ul>
+                    </ol>
                 {% endif %}
-            {% endwith %}
-            {% recently_viewed_products current_product=product %}
-        </article>
-        <!-- End of product page -->
-    {% endblock content %}
-    {% block extrascripts %}{{ block.super }}{% endblock %}
+            </section>
+        {% endblock product_review %}
+    {% endiffeature %}
+    {% with recommended_products=product.sorted_recommended_products|slice:":6" %}
+        {% if recommended_products %}
+            <div class="sub-header">
+                <h2>
+                    {% trans "Recommended items" %}
+                </h2>
+            </div>
+            <ul class="row list-unstyled mx-0">
+                {% for product in recommended_products %}
+                    <li class="col-sm-4 col-md-3 col-lg-3">
+                        {% render_product product %}
+                    </li>
+                {% endfor %}
+            </ul>
+        {% endif %}
+    {% endwith %}
+    {% recently_viewed_products current_product=product %}
+</article>
+<!-- End of product page -->
+{% endblock content %}
+{% block extrascripts %}{{ block.super }}{% endblock %}
diff --git a/tests/django_oscar/oscar/catalogue/partials/add_to_basket_form.html b/tests/django_oscar/oscar/catalogue/partials/add_to_basket_form.html
index 9674784..e639915 100644
--- a/tests/django_oscar/oscar/catalogue/partials/add_to_basket_form.html
+++ b/tests/django_oscar/oscar/catalogue/partials/add_to_basket_form.html
@@ -19,29 +19,29 @@
         </button>
     </form>
     {% iffeature "wishlists" %}
-        {% include "oscar/catalogue/partials/add_to_wishlist.html" %}{% endiffeature %}
+        {% include "oscar/catalogue/partials/add_to_wishlist.html" %}
+    {% endiffeature %}
+{% else %}
+    {% if has_active_alert %}
+        <p>
+            {% trans "You have an active stock alert for this product." %}
+        </p>
     {% else %}
-        {% if has_active_alert %}
+        <form id="alert_form"
+              method="post"
+              action="{% url 'customer:alert-create' pk=product.id %}"
+              class="add-to-basket mb-0">
+            {% csrf_token %}
             <p>
-                {% trans "You have an active stock alert for this product." %}
+                {% trans "You can get an email alert when this product is back in stock." %}
             </p>
-        {% else %}
-            <form id="alert_form"
-                  method="post"
-                  action="{% url 'customer:alert-create' pk=product.id %}"
-                  class="add-to-basket mb-0">
-                {% csrf_token %}
-                <p>
-                    {% trans "You can get an email alert when this product is back in stock." %}
-                </p>
-                {% include "oscar/partials/form_fields.html" with form=alert_form %}
-                <button type="submit"
-                        class="btn btn-lg btn-info w-100"
-                        data-loading-text="{% trans 'Submitting...' %}">
-                    {% trans "Notify me" %}
-                </button>
-            </form>
-        {% endif %}
-        {% iffeature "wishlists" %}
-            {% include "oscar/catalogue/partials/add_to_wishlist.html" %}{% endiffeature %}
-        {% endif %}
+            {% include "oscar/partials/form_fields.html" with form=alert_form %}
+            <button type="submit" class="btn btn-lg btn-info w-100" data-loading-text="{% trans 'Submitting...' %}">
+                {% trans "Notify me" %}
+            </button>
+        </form>
+    {% endif %}
+    {% iffeature "wishlists" %}
+        {% include "oscar/catalogue/partials/add_to_wishlist.html" %}
+    {% endiffeature %}
+{% endif %}
diff --git a/tests/django_oscar/oscar/catalogue/partials/add_to_wishlist.html b/tests/django_oscar/oscar/catalogue/partials/add_to_wishlist.html
index e3b80f7..c75b1b5 100644
--- a/tests/django_oscar/oscar/catalogue/partials/add_to_wishlist.html
+++ b/tests/django_oscar/oscar/catalogue/partials/add_to_wishlist.html
@@ -2,68 +2,68 @@
 {% load wishlist_tags %}
 {% if user.is_authenticated %}
     {% with wishlists=user.wishlists.all %}
-    {# Select wishlists that contains product #}
-    {% wishlists_containing_product wishlists product as product_wishlists %}
-    {% if wishlists %}
-        <div class="btn-group btn-wishlist align-bottom">
-            <a class="btn btn-lg dropdown-toggle" data-toggle="dropdown" href="#">
-                {% trans "Add to wish list" %}
-            </a>
-            <ul class="dropdown-menu dropdown-menu-right">
-                {% for wishlist in wishlists %}
-                    {% if wishlist not in product_wishlists %}
-                        <li>
-                            <a href="{% url 'customer:wishlists-add-product' key=wishlist.key product_pk=product.pk %}"
-                               class="dropdown-item">
-                                {% blocktrans with name=wishlist.name %}
-                                    Add to '{{ name }}' wish list
-                                {% endblocktrans %}
-                            </a>
-                        </li>
-                    {% endif %}
-                {% endfor %}
-                <li>
-                    <a href="{% url 'customer:wishlists-create-with-product' product_pk=product.pk %}"
-                       class="dropdown-item">
-                        {% trans 'Create a new wishlist' %}
-                    </a>
-                </li>
-            </ul>
-        </div>
-    {% else %}
-        {# 1 or no existing wishlists - show a simple button #}
-        <form id="add_to_wishlist_form"
-              action="{% url 'customer:wishlists-add-product' product_pk=product.pk %}"
-              method="post"
-              class="btn-wishlist align-bottom">
-            {% csrf_token %}
-            <button type="submit" class="btn btn-lg" data-loading-text="{% trans 'Adding...' %}">
-                {% trans "Add to wish list" %}
-            </button>
-        </form>
-    {% endif %}
-    {% for wishlist in product_wishlists %}
-        <form action="{% url 'customer:wishlists-remove-product' key=wishlist.key product_pk=product.id %}"
-              method="post">
-            {% csrf_token %}
-            {% blocktrans with name=wishlist.name url=wishlist.get_absolute_url %}
-                <span class="float-left">
-                    Product is in
-                    <a href="{{ url }}">'{{ name }}'</a>
-                    wishlist.
-                </span>
-            {% endblocktrans %}
-            <button type="submit" class="btn btn-sm float-right" data-loading-text="{% trans 'Removing...' %}">
-                {% trans "Remove" %}
-            </button>
-        </form>
-    {% endfor %}
-{% endwith %}
+        {# Select wishlists that contains product #}
+        {% wishlists_containing_product wishlists product as product_wishlists %}
+        {% if wishlists %}
+            <div class="btn-group btn-wishlist align-bottom">
+                <a class="btn btn-lg dropdown-toggle" data-toggle="dropdown" href="#">
+                    {% trans "Add to wish list" %}
+                </a>
+                <ul class="dropdown-menu dropdown-menu-right">
+                    {% for wishlist in wishlists %}
+                        {% if wishlist not in product_wishlists %}
+                            <li>
+                                <a href="{% url 'customer:wishlists-add-product' key=wishlist.key product_pk=product.pk %}"
+                                   class="dropdown-item">
+                                    {% blocktrans with name=wishlist.name %}
+                                        Add to '{{ name }}' wish list
+                                    {% endblocktrans %}
+                                </a>
+                            </li>
+                        {% endif %}
+                    {% endfor %}
+                    <li>
+                        <a href="{% url 'customer:wishlists-create-with-product' product_pk=product.pk %}"
+                           class="dropdown-item">
+                            {% trans 'Create a new wishlist' %}
+                        </a>
+                    </li>
+                </ul>
+            </div>
+        {% else %}
+            {# 1 or no existing wishlists - show a simple button #}
+            <form id="add_to_wishlist_form"
+                  action="{% url 'customer:wishlists-add-product' product_pk=product.pk %}"
+                  method="post"
+                  class="btn-wishlist align-bottom">
+                {% csrf_token %}
+                <button type="submit" class="btn btn-lg" data-loading-text="{% trans 'Adding...' %}">
+                    {% trans "Add to wish list" %}
+                </button>
+            </form>
+        {% endif %}
+        {% for wishlist in product_wishlists %}
+            <form action="{% url 'customer:wishlists-remove-product' key=wishlist.key product_pk=product.id %}"
+                  method="post">
+                {% csrf_token %}
+                {% blocktrans with name=wishlist.name url=wishlist.get_absolute_url %}
+                    <span class="float-left">
+                        Product is in
+                        <a href="{{ url }}">'{{ name }}'</a>
+                        wishlist.
+                    </span>
+                {% endblocktrans %}
+                <button type="submit" class="btn btn-sm float-right" data-loading-text="{% trans 'Removing...' %}">
+                    {% trans "Remove" %}
+                </button>
+            </form>
+        {% endfor %}
+    {% endwith %}
 {% else %}
-<button class="btn btn-lg btn-wishlist align-bottom"
-        disabled="disabled"
-        title="{% trans 'Please login to add products to a wish list.' %}">
-    {% trans 'Add to wish list' %}
-</button>
-<br/>
+    <button class="btn btn-lg btn-wishlist align-bottom"
+            disabled="disabled"
+            title="{% trans 'Please login to add products to a wish list.' %}">
+        {% trans 'Add to wish list' %}
+    </button>
+    <br/>
 {% endif %}
diff --git a/tests/django_oscar/oscar/catalogue/partials/gallery.html b/tests/django_oscar/oscar/catalogue/partials/gallery.html
index 002d19c..eb7aa40 100644
--- a/tests/django_oscar/oscar/catalogue/partials/gallery.html
+++ b/tests/django_oscar/oscar/catalogue/partials/gallery.html
@@ -1,51 +1,51 @@
 {% load i18n %}
 {% load image_tags %}
 {% with all_images=product.get_all_images %}
-{# use length rather then count as the images get queried anyways #}
-{% if all_images|length > 1 %}
-    <div id="product_gallery" class="carousel slide">
-        <div class="img-thumbnail mb-3">
-            <div class="carousel-inner">
-                {% for image in all_images %}
-                    <div class="carousel-item {% if forloop.first %}active{% endif %}">
-                    {% oscar_thumbnail image.original "440x400" upscale=False as thumb %}
-                    <img src="{{ thumb.url }}" alt="{{ product.get_title }}" />
+    {# use length rather then count as the images get queried anyways #}
+    {% if all_images|length > 1 %}
+        <div id="product_gallery" class="carousel slide">
+            <div class="img-thumbnail mb-3">
+                <div class="carousel-inner">
+                    {% for image in all_images %}
+                        <div class="carousel-item {% if forloop.first %}active{% endif %}">
+                            {% oscar_thumbnail image.original "440x400" upscale=False as thumb %}
+                            <img src="{{ thumb.url }}" alt="{{ product.get_title }}" />
+                        </div>
+                    {% endfor %}
                 </div>
-            {% endfor %}
+                <a class="carousel-control-prev" href="#product_gallery" role="button" data-slide="prev">
+                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+                    <span class="sr-only">{% trans "Previous" %}</span>
+                </a>
+                <a class="carousel-control-next" href="#product_gallery" role="button" data-slide="next">
+                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
+                    <span class="sr-only">{% trans "Next" %}</span>
+                </a>
+            </div>
+            <ol class="carousel-indicators img-thumbnail">
+                {% for image in all_images %}
+                    <li data-target="#product_gallery"
+                        data-slide-to="{{ forloop.counter0 }}"
+                        class="{% if forloop.first %}active{% endif %}">
+                        {% oscar_thumbnail image.original "65x55" crop="center" as thumb %}
+                        <img src="{{ thumb.url }}" alt="{{ product.get_title }}" />
+                    </li>
+                {% endfor %}
+            </ol>
         </div>
-        <a class="carousel-control-prev" href="#product_gallery" role="button" data-slide="prev">
-            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
-            <span class="sr-only">{% trans "Previous" %}</span>
-        </a>
-        <a class="carousel-control-next" href="#product_gallery" role="button" data-slide="next">
-            <span class="carousel-control-next-icon" aria-hidden="true"></span>
-            <span class="sr-only">{% trans "Next" %}</span>
-        </a>
-    </div>
-    <ol class="carousel-indicators img-thumbnail">
-        {% for image in all_images %}
-            <li data-target="#product_gallery"
-                data-slide-to="{{ forloop.counter0 }}"
-                class="{% if forloop.first %}active{% endif %}">
-            {% oscar_thumbnail image.original "65x55" crop="center" as thumb %}
-            <img src="{{ thumb.url }}" alt="{{ product.get_title }}" />
-        </li>
-    {% endfor %}
-</ol>
-</div>
-{% else %}
-{# Only one image to show #}
-<div id="product_gallery" class="carousel">
-<div class="img-thumbnail">
-    <div class="carousel-inner">
-        <div class="carousel-item active">
-            {% with image=product.primary_image %}
-            {% oscar_thumbnail image.original "440x400" upscale=False as thumb %}
-            <img src="{{ thumb.url }}" alt="{{ product.get_title }}" />
-        {% endwith %}
-    </div>
-</div>
-</div>
-</div>
-{% endif %}
+    {% else %}
+        {# Only one image to show #}
+        <div id="product_gallery" class="carousel">
+            <div class="img-thumbnail">
+                <div class="carousel-inner">
+                    <div class="carousel-item active">
+                        {% with image=product.primary_image %}
+                            {% oscar_thumbnail image.original "440x400" upscale=False as thumb %}
+                            <img src="{{ thumb.url }}" alt="{{ product.get_title }}" />
+                        {% endwith %}
+                    </div>
+                </div>
+            </div>
+        </div>
+    {% endif %}
 {% endwith %}
diff --git a/tests/django_oscar/oscar/catalogue/partials/product.html b/tests/django_oscar/oscar/catalogue/partials/product.html
index 07ad908..0273250 100644
--- a/tests/django_oscar/oscar/catalogue/partials/product.html
+++ b/tests/django_oscar/oscar/catalogue/partials/product.html
@@ -7,9 +7,11 @@
         {% block product_image %}
             <div class="image_container w-100">
                 {% with image=product.primary_image %}
-                {% oscar_thumbnail image.original "x155" upscale=False as thumb %}
-                <a href="{{ product.get_absolute_url }}">
-                    <img src="{{ thumb.url }}" alt="{{ product.get_title }}" class="img-thumbnail w-auto mx-auto my-0">
+                    {% oscar_thumbnail image.original "x155" upscale=False as thumb %}
+                    <a href="{{ product.get_absolute_url }}">
+                        <img src="{{ thumb.url }}"
+                             alt="{{ product.get_title }}"
+                             class="img-thumbnail w-auto mx-auto my-0">
                     </a>
                 {% endwith %}
             </div>
@@ -36,8 +38,9 @@
             <div class="product_price w-100">
                 {% include "oscar/catalogue/partials/stock_record.html" %}
                 {% if not product.is_parent and not product.has_options %}
-                    {% include "oscar/catalogue/partials/add_to_basket_form_compact.html" %}{% endif %}
-                </div>
-            {% endblock %}
-        </article>
-    {% endblock %}
+                    {% include "oscar/catalogue/partials/add_to_basket_form_compact.html" %}
+                {% endif %}
+            </div>
+        {% endblock %}
+    </article>
+{% endblock %}
diff --git a/tests/django_oscar/oscar/catalogue/reviews/review_detail.html b/tests/django_oscar/oscar/catalogue/reviews/review_detail.html
index 0c6b06c..8bcb6d1 100644
--- a/tests/django_oscar/oscar/catalogue/reviews/review_detail.html
+++ b/tests/django_oscar/oscar/catalogue/reviews/review_detail.html
@@ -10,36 +10,36 @@
                 <a href="{{ homepage_url }}">{% trans "Home" %}</a>
             </li>
             {% with category=product.categories.all.0 %}
-            {% for c in category.get_ancestors_and_self %}
+                {% for c in category.get_ancestors_and_self %}
+                    <li class="breadcrumb-item">
+                        <a href="{{ c.get_absolute_url }}">
+                            {{ c.name }}
+                        </a>
+                    </li>
+                {% endfor %}
                 <li class="breadcrumb-item">
-                    <a href="{{ c.get_absolute_url }}">
-                        {{ c.name }}
+                    <a href="{{ product.get_absolute_url }}">
+                        {{ product.title }}
                     </a>
                 </li>
-            {% endfor %}
-            <li class="breadcrumb-item">
-                <a href="{{ product.get_absolute_url }}">
-                    {{ product.title }}
-                </a>
+                <li class="breadcrumb-item">
+                    <a href="{% url 'catalogue:reviews-list' product_slug=product.slug product_pk=product.pk %}">
+                        {% trans "Reviews" %}
+                    </a>
+                </li>
+            {% endwith %}
+            <li class="breadcrumb-item active" aria-current="page">
+                {{ review.title }}
             </li>
-            <li class="breadcrumb-item">
-                <a href="{% url 'catalogue:reviews-list' product_slug=product.slug product_pk=product.pk %}">
-                    {% trans "Reviews" %}
-                </a>
-            </li>
-        {% endwith %}
-        <li class="breadcrumb-item active" aria-current="page">
-            {{ review.title }}
-        </li>
-    </ol>
-</nav>
+        </ol>
+    </nav>
 {% endblock %}
 {% block headertext %}
-{% trans "Customer reviews" %}
+    {% trans "Customer reviews" %}
 {% endblock %}
 {% block content %}
-<section>
-    {% include 'oscar/catalogue/reviews/review_product.html' %}
-    {% include 'oscar/catalogue/partials/review.html' %}
-</section>
+    <section>
+        {% include 'oscar/catalogue/reviews/review_product.html' %}
+        {% include 'oscar/catalogue/partials/review.html' %}
+    </section>
 {% endblock %}
diff --git a/tests/django_oscar/oscar/catalogue/reviews/review_form.html b/tests/django_oscar/oscar/catalogue/reviews/review_form.html
index cc42883..f54c580 100644
--- a/tests/django_oscar/oscar/catalogue/reviews/review_form.html
+++ b/tests/django_oscar/oscar/catalogue/reviews/review_form.html
@@ -10,41 +10,44 @@
                 {% csrf_token %}
                 {% include 'oscar/partials/form_field.html' with field=form.title %}
                 <div class="reviewrating form-group {% if form.score.errors %}error{% endif %}">
-                <label for="{{ form.score.auto_id }}" class="col-form-label required">
-                    {{ form.score.label|safe }}
-                </label>
-                <div class="controls">
-                    {{ form.score }}
-                    <div class="star-rating {% if form.score.value == '1' %}One{% elif form.score.value == '2' %}Two{% elif form.score.value == '3' %}Three{% elif form.score.value == '4' %}Four{% elif form.score.value == '5' %}Five{% endif %}">
-                    <i class="fas fa-star"></i>
-                    <i class="fas fa-star"></i>
-                    <i class="fas fa-star"></i>
-                    <i class="fas fa-star"></i>
-                    <i class="fas fa-star"></i>
-                </div>
-                {% for error in form.score.errors %}
-                    <span class="error-block">
-                        <i class="fas fa-exclamation"></i>
-                        {{ error }}
-                    </span>
-                {% endfor %}
+                    <label for="{{ form.score.auto_id }}" class="col-form-label required">
+                        {{ form.score.label|safe }}
+                    </label>
+                    <div class="controls">
+                        {{ form.score }}
+                        <div class="star-rating {% if form.score.value == '1' %}One{% elif form.score.value == '2' %}Two{% elif form.score.value == '3' %}Three{% elif form.score.value == '4' %}Four{% elif form.score.value == '5' %}Five{% endif %}">
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                        </div>
+                        {% for error in form.score.errors %}
+                            <span class="error-block">
+                                <i class="fas fa-exclamation"></i>
+                                {{ error }}
+                            </span>
+                        {% endfor %}
+                    </div>
+                    {% comment %}
+                    {% include 'oscar/partials/form_field.html' with field=form.score %}
+                {% endcomment %}
             </div>
-            {% comment %}
-            {% include 'oscar/partials/form_field.html' with field=form.score %}{% endcomment %}
-        </div>
-        {% include 'oscar/partials/form_field.html' with field=form.body %}
-        {% if form.name %}
-            {% include 'oscar/partials/form_field.html' with field=form.name %}{% endif %}
+            {% include 'oscar/partials/form_field.html' with field=form.body %}
+            {% if form.name %}
+                {% include 'oscar/partials/form_field.html' with field=form.name %}
+            {% endif %}
             {% if form.email %}
-                {% include 'oscar/partials/form_field.html' with field=form.email %}{% endif %}
-                <button type="submit" class="btn btn-primary btn-lg" data-loading-text="{% trans 'Saving...' %}">
-                    {% trans "Save review" %}
-                </button>
-                {% trans "or" %}
-                <a href="{{ product.get_absolute_url }}">
-                    {% trans "cancel" %}
-                </a>
-            </fieldset>
-        </form>
-    </div>
+                {% include 'oscar/partials/form_field.html' with field=form.email %}
+            {% endif %}
+            <button type="submit" class="btn btn-primary btn-lg" data-loading-text="{% trans 'Saving...' %}">
+                {% trans "Save review" %}
+            </button>
+            {% trans "or" %}
+            <a href="{{ product.get_absolute_url }}">
+                {% trans "cancel" %}
+            </a>
+        </fieldset>
+    </form>
+</div>
 {% endblock %}
diff --git a/tests/django_oscar/oscar/catalogue/reviews/review_list.html b/tests/django_oscar/oscar/catalogue/reviews/review_list.html
index c71ce96..52c47ca 100644
--- a/tests/django_oscar/oscar/catalogue/reviews/review_list.html
+++ b/tests/django_oscar/oscar/catalogue/reviews/review_list.html
@@ -11,41 +11,42 @@
                 <a href="{{ homepage_url }}">{% trans "Home" %}</a>
             </li>
             {% with category=product.categories.all.0 %}
-            {% for c in category.get_ancestors_and_self %}
+                {% for c in category.get_ancestors_and_self %}
+                    <li class="breadcrumb-item">
+                        <a href="{{ c.get_absolute_url }}">
+                            {{ c.name }}
+                        </a>
+                    </li>
+                {% endfor %}
                 <li class="breadcrumb-item">
-                    <a href="{{ c.get_absolute_url }}">
-                        {{ c.name }}
+                    <a href="{{ product.get_absolute_url }}">
+                        {{ product.title }}
                     </a>
                 </li>
-            {% endfor %}
-            <li class="breadcrumb-item">
-                <a href="{{ product.get_absolute_url }}">
-                    {{ product.title }}
-                </a>
+            {% endwith %}
+            <li class="breadcrumb-item active" aria-current="page">
+                {% trans "All reviews" %}
             </li>
-        {% endwith %}
-        <li class="breadcrumb-item active" aria-current="page">
-            {% trans "All reviews" %}
-        </li>
-    </ol>
-</nav>
+        </ol>
+    </nav>
 {% endblock %}
 {% block headertext %}
-{% trans "Customer reviews" %}
+    {% trans "Customer reviews" %}
 {% endblock %}
 {% block content %}
-<section>
-    {% include 'oscar/catalogue/reviews/review_product.html' %}
-    {% if reviews %}
-        <form method="get" class="form-inline">
-            {% include "oscar/partials/form_fields_inline.html" with form=form %}
-            <button type="submit" class="btn btn-secondary">
-                {% trans "Go" %}
-            </button>
-        </form>
-        <hr>
-        {% for review in reviews %}
-            {% include 'oscar/catalogue/partials/review.html' %}{% endfor %}
+    <section>
+        {% include 'oscar/catalogue/reviews/review_product.html' %}
+        {% if reviews %}
+            <form method="get" class="form-inline">
+                {% include "oscar/partials/form_fields_inline.html" with form=form %}
+                <button type="submit" class="btn btn-secondary">
+                    {% trans "Go" %}
+                </button>
+            </form>
+            <hr>
+            {% for review in reviews %}
+                {% include 'oscar/catalogue/partials/review.html' %}
+            {% endfor %}
             {% include 'oscar/partials/pagination.html' %}
         {% else %}
             <p>
diff --git a/tests/django_oscar/oscar/catalogue/reviews/review_product.html b/tests/django_oscar/oscar/catalogue/reviews/review_product.html
index cfad5d0..8a9b163 100644
--- a/tests/django_oscar/oscar/catalogue/reviews/review_product.html
+++ b/tests/django_oscar/oscar/catalogue/reviews/review_product.html
@@ -3,9 +3,9 @@
     <div class="col-sm-2">
         <div class="image_container w-100">
             {% with image=product.primary_image %}
-            {% oscar_thumbnail image.original "x155" upscale=False as thumb %}
-            <a href="{{ product.get_absolute_url }}">
-                <img src="{{ thumb.url }}" alt="{{ product.get_title }}" class="img-thumbnail w-auto mx-auto my-0">
+                {% oscar_thumbnail image.original "x155" upscale=False as thumb %}
+                <a href="{{ product.get_absolute_url }}">
+                    <img src="{{ thumb.url }}" alt="{{ product.get_title }}" class="img-thumbnail w-auto mx-auto my-0">
                 </a>
             {% endwith %}
         </div>
diff --git a/tests/django_oscar/oscar/checkout/checkout.html b/tests/django_oscar/oscar/checkout/checkout.html
index 4f1ba60..8c327f3 100644
--- a/tests/django_oscar/oscar/checkout/checkout.html
+++ b/tests/django_oscar/oscar/checkout/checkout.html
@@ -7,167 +7,168 @@
     {% trans "Checkout" %} | {{ block.super }}
 {% endblock %}
 {% block checkout_nav %}
-    {% include 'oscar/checkout/nav.html' %}{% endblock %}
-    {% block content %}
-        {% if error %}
-            <div class="alert alert-danger">
-                {{ error }}
-            </div>
-        {% endif %}
-        <div class="row shipping-payment">
-            {% block shipping_address %}
-                <div class="col-sm-6">
-                    <div class="sub-header">
-                        <h2>{% trans "Shipping" %}</h2>
-                    </div>
-                    {% if shipping_address %}
-                        <div class="card card-body bg-light">
-                            <h3>
-                                {% trans "Address" %}
-                                {% block shipping_address_actions %}
-                                    <a href="{% url 'checkout:shipping-address' %}" class="float-right">
-                                        {% trans "Change" %}
-                                    </a>
-                                {% endblock %}
-                            </h3>
-                            <address>
-                                {% for field in shipping_address.active_address_fields %}
-                                    {{ field }}
-                                    <br/>
-                                {% endfor %}
-                            </address>
-                            {% if shipping_address.phone_number %}
-                                <h4>{% trans "Contact" %}</h4>
-                                <p>
-                                    {% trans "Phone" %}: {{ shipping_address.phone_number }}
-                                    {% if guest_email %}
-                                        <br/>
-                                        {% trans "Email" %}: {{ guest_email }}
-                                    {% endif %}
-                                </p>
-                            {% endif %}
-                            {% if shipping_address.notes %}
-                                <h4>{% trans "Instructions" %}</h4>
-                                <p>
-                                    {{ shipping_address.notes|linebreaks }}
-                                </p>
-                            {% endif %}
-                        </div>
-                    {% endif %}
-                    {% if shipping_method %}
-                        <div class="card card-body bg-light card card-body bg-light-info">
-                            <h3>
-                                {% trans "Shipping method" %}
-                                {% block shipping_method_actions %}
-                                    <a href="{% url 'checkout:shipping-method' %}" class="float-right">
-                                        {% trans "Change" %}
-                                    </a>
-                                {% endblock %}
-                            </h3>
-                            <p>
-                                {{ shipping_method.name }}
-                                {% if shipping_method.description %}- {{ shipping_method.description|safe }}{% endif %}
-                            </p>
-                        </div>
-                    {% endif %}
+    {% include 'oscar/checkout/nav.html' %}
+{% endblock %}
+{% block content %}
+    {% if error %}
+        <div class="alert alert-danger">
+            {{ error }}
+        </div>
+    {% endif %}
+    <div class="row shipping-payment">
+        {% block shipping_address %}
+            <div class="col-sm-6">
+                <div class="sub-header">
+                    <h2>{% trans "Shipping" %}</h2>
                 </div>
-            {% endblock shipping_address %}
-            {# You will almost certainly want to override this block to provide a payment summary #}
-            {% block payment_method %}
-                <div class="col-sm-6">
-                    <div class="sub-header">
-                        <h2>{% trans "Payment" %}</h2>
-                    </div>
-                    <div class="card card-body bg-light card card-body bg-light-success">
+                {% if shipping_address %}
+                    <div class="card card-body bg-light">
                         <h3>
-                            {% trans "Payment" %}
-                            <a href="{% url 'checkout:payment-details' %}" class="float-right">
-                                {% trans "Change" %}
-                            </a>
+                            {% trans "Address" %}
+                            {% block shipping_address_actions %}
+                                <a href="{% url 'checkout:shipping-address' %}" class="float-right">
+                                    {% trans "Change" %}
+                                </a>
+                            {% endblock %}
+                        </h3>
+                        <address>
+                            {% for field in shipping_address.active_address_fields %}
+                                {{ field }}
+                                <br/>
+                            {% endfor %}
+                        </address>
+                        {% if shipping_address.phone_number %}
+                            <h4>{% trans "Contact" %}</h4>
+                            <p>
+                                {% trans "Phone" %}: {{ shipping_address.phone_number }}
+                                {% if guest_email %}
+                                    <br/>
+                                    {% trans "Email" %}: {{ guest_email }}
+                                {% endif %}
+                            </p>
+                        {% endif %}
+                        {% if shipping_address.notes %}
+                            <h4>{% trans "Instructions" %}</h4>
+                            <p>
+                                {{ shipping_address.notes|linebreaks }}
+                            </p>
+                        {% endif %}
+                    </div>
+                {% endif %}
+                {% if shipping_method %}
+                    <div class="card card-body bg-light card card-body bg-light-info">
+                        <h3>
+                            {% trans "Shipping method" %}
+                            {% block shipping_method_actions %}
+                                <a href="{% url 'checkout:shipping-method' %}" class="float-right">
+                                    {% trans "Change" %}
+                                </a>
+                            {% endblock %}
                         </h3>
                         <p>
-                            {% trans "Payment details to go here" %}
+                            {{ shipping_method.name }}
+                            {% if shipping_method.description %}- {{ shipping_method.description|safe }}{% endif %}
                         </p>
                     </div>
+                {% endif %}
+            </div>
+        {% endblock shipping_address %}
+        {# You will almost certainly want to override this block to provide a payment summary #}
+        {% block payment_method %}
+            <div class="col-sm-6">
+                <div class="sub-header">
+                    <h2>{% trans "Payment" %}</h2>
                 </div>
-            {% endblock payment_method %}
+                <div class="card card-body bg-light card card-body bg-light-success">
+                    <h3>
+                        {% trans "Payment" %}
+                        <a href="{% url 'checkout:payment-details' %}" class="float-right">
+                            {% trans "Change" %}
+                        </a>
+                    </h3>
+                    <p>
+                        {% trans "Payment details to go here" %}
+                    </p>
+                </div>
+            </div>
+        {% endblock payment_method %}
+    </div>
+    {% block order_contents %}
+        <div class="sub-header">
+            {% block order_contents_actions %}
+                <a href="{% url 'basket:summary' %}" class="float-right">
+                    {% trans "Edit order contents" %}
+                </a>
+            {% endblock %}
+            <h2>{% trans "Order contents" %}</h2>
         </div>
-        {% block order_contents %}
-            <div class="sub-header">
-                {% block order_contents_actions %}
-                    <a href="{% url 'basket:summary' %}" class="float-right">
-                        {% trans "Edit order contents" %}
-                    </a>
-                {% endblock %}
-                <h2>{% trans "Order contents" %}</h2>
+        <div class="basket-title">
+            <div class="row">
+                <p class="col-sm-9 h4">
+                    {% trans "Item" %}
+                </p>
+                <p class="col-sm-1 h4 text-center">
+                    {% trans "Quantity" %}
+                </p>
+                <p class="col-sm-2 h4 text-right">
+                    {% trans "Total" %}
+                </p>
             </div>
-            <div class="basket-title">
+        </div>
+        {% for line in basket.all_lines %}
+            {% purchase_info_for_line request line as session %}
+            <div class="basket-items">
                 <div class="row">
-                    <p class="col-sm-9 h4">
-                        {% trans "Item" %}
-                    </p>
-                    <p class="col-sm-1 h4 text-center">
-                        {% trans "Quantity" %}
-                    </p>
-                    <p class="col-sm-2 h4 text-right">
-                        {% trans "Total" %}
-                    </p>
-                </div>
-            </div>
-            {% for line in basket.all_lines %}
-                {% purchase_info_for_line request line as session %}
-                <div class="basket-items">
-                    <div class="row">
-                        <div class="col-sm-2">
-                            <div class="image_container w-100">
-                                {% with image=line.product.primary_image %}
+                    <div class="col-sm-2">
+                        <div class="image_container w-100">
+                            {% with image=line.product.primary_image %}
                                 {% oscar_thumbnail image.original "100x100" upscale=False as thumb %}
                                 <a href="{{ form.instance.product.get_absolute_url }}">
                                     <img src="{{ thumb.url }}"
                                          alt="{{ product.get_title }}"
                                          class="img-thumbnail w-auto mx-auto my-0">
-                                    </a>
-                                {% endwith %}
-                            </div>
-                        </div>
-                        <div class="col-sm-7">
-                            <h3>
-                                <a href="{{ line.product.get_absolute_url }}">
-                                    {{ line.description }}
                                 </a>
-                            </h3>
-                            <span class="availability {{ session.availability.code }}">
-                                {{ session.availability.message }}
-                            </span>
-                        </div>
-                        <div class="col-sm-1 text-center">
-                            {{ line.quantity }}
-                        </div>
-                        <div class="col-sm-2 text-right">
-                            <p class="price_color">
-                                {% if not show_tax_separately and line.is_tax_known %}
-                                    {{ line.line_price_incl_tax|currency:basket.currency }}
-                                {% else %}
-                                    {{ line.line_price_excl_tax|currency:basket.currency }}
-                                {% endif %}
-                            </p>
+                            {% endwith %}
                         </div>
                     </div>
-                </div>
-            {% endfor %}
-            <div class="row">
-                <div class="col-sm-6">
-                    &nbsp;
-                </div>
-                <div class="col-sm-6">
-                    <div class="sub-header">
-                        <h2>{% trans 'Totals' %}</h2>
+                    <div class="col-sm-7">
+                        <h3>
+                            <a href="{{ line.product.get_absolute_url }}">
+                                {{ line.description }}
+                            </a>
+                        </h3>
+                        <span class="availability {{ session.availability.code }}">
+                            {{ session.availability.message }}
+                        </span>
+                    </div>
+                    <div class="col-sm-1 text-center">
+                        {{ line.quantity }}
+                    </div>
+                    <div class="col-sm-2 text-right">
+                        <p class="price_color">
+                            {% if not show_tax_separately and line.is_tax_known %}
+                                {{ line.line_price_incl_tax|currency:basket.currency }}
+                            {% else %}
+                                {{ line.line_price_excl_tax|currency:basket.currency }}
+                            {% endif %}
+                        </p>
                     </div>
-                    {% include 'oscar/basket/partials/basket_totals.html' %}
                 </div>
             </div>
-        {% endblock order_contents %}
-        {% block shipping_method %}{% endblock shipping_method %}
-            {% block payment_details %}{% endblock payment_details %}
-                {% block place_order %}{% endblock place_order %}
-                {% endblock content %}
+        {% endfor %}
+        <div class="row">
+            <div class="col-sm-6">
+                &nbsp;
+            </div>
+            <div class="col-sm-6">
+                <div class="sub-header">
+                    <h2>{% trans 'Totals' %}</h2>
+                </div>
+                {% include 'oscar/basket/partials/basket_totals.html' %}
+            </div>
+        </div>
+    {% endblock order_contents %}
+    {% block shipping_method %}{% endblock shipping_method %}
+    {% block payment_details %}{% endblock payment_details %}
+    {% block place_order %}{% endblock place_order %}
+{% endblock content %}
diff --git a/tests/django_oscar/oscar/checkout/gateway.html b/tests/django_oscar/oscar/checkout/gateway.html
index 240ba24..3f1830b 100644
--- a/tests/django_oscar/oscar/checkout/gateway.html
+++ b/tests/django_oscar/oscar/checkout/gateway.html
@@ -5,23 +5,24 @@
     {% trans "Checkout gateway" %} | {{ block.super }}
 {% endblock %}
 {% block checkout_nav %}
-    {% include 'oscar/checkout/nav.html' with step=0 %}{% endblock %}
-    {% block checkout_title %}
-        {% trans "Who are you?" %}
-    {% endblock %}
-    {% block content %}
-        <form method="post" class="card card-body bg-light">
-            {% csrf_token %}
-            {{ form.non_field_errors }}
-            {% include "oscar/partials/form_field.html" with field=form.username %}
-            <div class="form-group">
-                <div class="controls">
-                    <div class="radio">
-                        {{ form.options.0 }}
-                    </div>
+    {% include 'oscar/checkout/nav.html' with step=0 %}
+{% endblock %}
+{% block checkout_title %}
+    {% trans "Who are you?" %}
+{% endblock %}
+{% block content %}
+    <form method="post" class="card card-body bg-light">
+        {% csrf_token %}
+        {{ form.non_field_errors }}
+        {% include "oscar/partials/form_field.html" with field=form.username %}
+        <div class="form-group">
+            <div class="controls">
+                <div class="radio">
+                    {{ form.options.0 }}
                 </div>
             </div>
-            <div class="form-group {% if form.password.errors %}error{% endif %}">
+        </div>
+        <div class="form-group {% if form.password.errors %}error{% endif %}">
             {{ form.options.errors }}
             <div class="controls">
                 <div class="radio">
diff --git a/tests/django_oscar/oscar/checkout/layout.html b/tests/django_oscar/oscar/checkout/layout.html
index 76ed5ec..e15919e 100644
--- a/tests/django_oscar/oscar/checkout/layout.html
+++ b/tests/django_oscar/oscar/checkout/layout.html
@@ -42,4 +42,5 @@
         </div>
         <!-- /page_inner -->
     </div>
-    {% include "oscar/partials/footer_checkout.html" %}{% endblock %}
+    {% include "oscar/partials/footer_checkout.html" %}
+{% endblock %}
diff --git a/tests/django_oscar/oscar/checkout/nav.html b/tests/django_oscar/oscar/checkout/nav.html
index 8a41194..b23c643 100644
--- a/tests/django_oscar/oscar/checkout/nav.html
+++ b/tests/django_oscar/oscar/checkout/nav.html
@@ -39,7 +39,8 @@
 <li >
 3 %}visited
 {% else %}
-disabled{% endif %}
+disabled
+{% endif %}
 {% endif %}
 {% endif %}
 ">
diff --git a/tests/django_oscar/oscar/checkout/payment_details.html b/tests/django_oscar/oscar/checkout/payment_details.html
index dd925cf..8f60f4b 100644
--- a/tests/django_oscar/oscar/checkout/payment_details.html
+++ b/tests/django_oscar/oscar/checkout/payment_details.html
@@ -4,43 +4,44 @@
     {% trans "Payment details" %} | {{ block.super }}
 {% endblock %}
 {% block checkout_nav %}
-    {% include 'oscar/checkout/nav.html' with step=3 %}{% endblock %}
-    {% block checkout_title %}
-        {% trans "Enter payment details" %}
-    {% endblock %}
-    {% block order_contents %}{% endblock %}
-    {% block shipping_address %}{% endblock %}
-    {% block shipping_method %}{% endblock %}
-    {% block payment_method %}{% endblock %}
-    {% block payment_details %}
-        {% block payment_details_content %}
-            <p>
-                {% trans "This page needs implementing within your project. You may want to use one of Oscar's payment gateway libraries:" %}
-            </p>
-            <ul>
-                <li>
-                    <a href="https://github.com/django-oscar/django-oscar-paypal">
-                        django-oscar-paypal
-                    </a>
-                </li>
-                <li>
-                    <a href="https://github.com/django-oscar/django-oscar-adyen">
-                        django-oscar-adyen
-                    </a>
-                </li>
-                <li>
-                    <a href="https://github.com/django-oscar/django-oscar-docdata">
-                        django-oscar-docdata
-                    </a>
-                </li>
-                <li>
-                    <a href="https://github.com/django-oscar/django-oscar-accounts">
-                        django-oscar-accounts
-                    </a>
-                </li>
-            </ul>
-            <a id="view_preview" href="{% url 'checkout:preview' %}" class="btn btn-primary btn-lg">
-                {% trans "Continue" %}
-            </a>
-        {% endblock payment_details_content %}
-    {% endblock payment_details %}
+    {% include 'oscar/checkout/nav.html' with step=3 %}
+{% endblock %}
+{% block checkout_title %}
+    {% trans "Enter payment details" %}
+{% endblock %}
+{% block order_contents %}{% endblock %}
+{% block shipping_address %}{% endblock %}
+{% block shipping_method %}{% endblock %}
+{% block payment_method %}{% endblock %}
+{% block payment_details %}
+    {% block payment_details_content %}
+        <p>
+            {% trans "This page needs implementing within your project. You may want to use one of Oscar's payment gateway libraries:" %}
+        </p>
+        <ul>
+            <li>
+                <a href="https://github.com/django-oscar/django-oscar-paypal">
+                    django-oscar-paypal
+                </a>
+            </li>
+            <li>
+                <a href="https://github.com/django-oscar/django-oscar-adyen">
+                    django-oscar-adyen
+                </a>
+            </li>
+            <li>
+                <a href="https://github.com/django-oscar/django-oscar-docdata">
+                    django-oscar-docdata
+                </a>
+            </li>
+            <li>
+                <a href="https://github.com/django-oscar/django-oscar-accounts">
+                    django-oscar-accounts
+                </a>
+            </li>
+        </ul>
+        <a id="view_preview" href="{% url 'checkout:preview' %}" class="btn btn-primary btn-lg">
+            {% trans "Continue" %}
+        </a>
+    {% endblock payment_details_content %}
+{% endblock payment_details %}
diff --git a/tests/django_oscar/oscar/checkout/preview.html b/tests/django_oscar/oscar/checkout/preview.html
index 8768bf3..fb29f5a 100644
--- a/tests/django_oscar/oscar/checkout/preview.html
+++ b/tests/django_oscar/oscar/checkout/preview.html
@@ -4,34 +4,35 @@
     {% trans "Order preview" %} | {{ block.super }}
 {% endblock %}
 {% block checkout_nav %}
-    {% include 'oscar/checkout/nav.html' with step=4 %}{% endblock %}
-    {% block checkout_title %}
-        {% trans "Preview order" %}
-    {% endblock %}
-    {% block place_order %}
-        <form method="post" action="{% url 'checkout:preview' %}" id="place_order_form">
-            {% csrf_token %}
-            <input type="hidden" name="action" value="place_order" />
-            {% comment %}
-            When submitting sensitive data on the payment details page (eg a bankcard)
-            we don't want to save the data and so we pass the bound form to the preview
-            template and render it in a hidden div. Then the payment information will
-            get re-submitted when the user confirms the order.
-        {% endcomment %}
-        <div style="display:none">
-            {% block hiddenforms %}{% endblock %}
-        </div>
-        <div class="form-group clearfix">
-            <div class="row">
-                <div class="col-sm-3 offset-sm-9">
-                    <button id='place-order'
-                            type="submit"
-                            class="btn btn-primary btn-lg btn-block"
-                            data-loading-text="{% trans 'Submitting...' %}">
-                        {% trans "Place order" %}
-                    </button>
-                </div>
+    {% include 'oscar/checkout/nav.html' with step=4 %}
+{% endblock %}
+{% block checkout_title %}
+    {% trans "Preview order" %}
+{% endblock %}
+{% block place_order %}
+    <form method="post" action="{% url 'checkout:preview' %}" id="place_order_form">
+        {% csrf_token %}
+        <input type="hidden" name="action" value="place_order" />
+        {% comment %}
+        When submitting sensitive data on the payment details page (eg a bankcard)
+        we don't want to save the data and so we pass the bound form to the preview
+        template and render it in a hidden div. Then the payment information will
+        get re-submitted when the user confirms the order.
+    {% endcomment %}
+    <div style="display:none">
+        {% block hiddenforms %}{% endblock %}
+    </div>
+    <div class="form-group clearfix">
+        <div class="row">
+            <div class="col-sm-3 offset-sm-9">
+                <button id='place-order'
+                        type="submit"
+                        class="btn btn-primary btn-lg btn-block"
+                        data-loading-text="{% trans 'Submitting...' %}">
+                    {% trans "Place order" %}
+                </button>
             </div>
         </div>
-    </form>
+    </div>
+</form>
 {% endblock place_order %}
diff --git a/tests/django_oscar/oscar/checkout/shipping_address.html b/tests/django_oscar/oscar/checkout/shipping_address.html
index d08d749..098fe8e 100644
--- a/tests/django_oscar/oscar/checkout/shipping_address.html
+++ b/tests/django_oscar/oscar/checkout/shipping_address.html
@@ -4,104 +4,105 @@
     {% trans "Shipping address" %} | {{ block.super }}
 {% endblock %}
 {% block checkout_nav %}
-    {% include 'oscar/checkout/nav.html' with step=1 %}{% endblock %}
-    {% block checkout_title %}
-        {% trans "Shipping address" %}
-    {% endblock %}
-    {% block order_contents %}{% endblock %}
-    {% block shipping_address %}
-        <div class="col-sm-12">
-            <div class="sub-header">
-                <h2>{% trans "Where should we ship to?" %}</h2>
-            </div>
-            {% if user.is_authenticated %}
-                {% if addresses %}
-                    <h3>{% trans "An address from your address book?" %}</h3>
-                    <div class="choose-block">
-                        <div class="row">
-                            {% for address in addresses %}
-                                {% block select_address_form %}
-                                    <div class="col-sm-6 d-flex">
-                                        <div class="card card-body bg-light">
-                                            <address>
-                                                {% block select_address_fields %}
-                                                    {% for field in address.active_address_fields %}
-                                                        <span>{{ field }}</span>
-                                                        {% if not forloop.first %}<br/>{% endif %}
-                                                    {% endfor %}
-                                                {% endblock %}
-                                            </address>
-                                            <form action="{% url 'checkout:shipping-address' %}"
-                                                  method="post"
-                                                  id="select_shipping_address_{{ address.id }}"
-                                                  class="mb-0">
-                                                {% csrf_token %}
-                                                <input type="hidden" name="action" value="ship_to" />
-                                                <input type="hidden" name="address_id" value="{{ address.id }}" />
-                                                {% if address.is_default_for_shipping %}
-                                                    <button type="submit"
-                                                            class="btn btn-success btn-large ship-address"
-                                                            data-loading-text="{% trans 'Saving...' %}">
-                                                        <i class="fas fa-check-circle"></i>
-                                                        {% trans "Ship to your default shipping address" %}
-                                                    </button>
-                                                {% else %}
-                                                    <button type="submit"
-                                                            class="btn btn-primary btn-large ship-address"
-                                                            data-loading-text="{% trans 'Saving...' %}">
-                                                        {% trans "Ship to this address" %}
-                                                    </button>
-                                                {% endif %}
-                                                <div class="btn-group address-controls">
-                                                    <a href="{% url 'checkout:user-address-update' pk=address.id %}"
-                                                       class="btn btn-secondary">
-                                                        {% trans "Edit address" %}
+    {% include 'oscar/checkout/nav.html' with step=1 %}
+{% endblock %}
+{% block checkout_title %}
+    {% trans "Shipping address" %}
+{% endblock %}
+{% block order_contents %}{% endblock %}
+{% block shipping_address %}
+    <div class="col-sm-12">
+        <div class="sub-header">
+            <h2>{% trans "Where should we ship to?" %}</h2>
+        </div>
+        {% if user.is_authenticated %}
+            {% if addresses %}
+                <h3>{% trans "An address from your address book?" %}</h3>
+                <div class="choose-block">
+                    <div class="row">
+                        {% for address in addresses %}
+                            {% block select_address_form %}
+                                <div class="col-sm-6 d-flex">
+                                    <div class="card card-body bg-light">
+                                        <address>
+                                            {% block select_address_fields %}
+                                                {% for field in address.active_address_fields %}
+                                                    <span>{{ field }}</span>
+                                                    {% if not forloop.first %}<br/>{% endif %}
+                                                {% endfor %}
+                                            {% endblock %}
+                                        </address>
+                                        <form action="{% url 'checkout:shipping-address' %}"
+                                              method="post"
+                                              id="select_shipping_address_{{ address.id }}"
+                                              class="mb-0">
+                                            {% csrf_token %}
+                                            <input type="hidden" name="action" value="ship_to" />
+                                            <input type="hidden" name="address_id" value="{{ address.id }}" />
+                                            {% if address.is_default_for_shipping %}
+                                                <button type="submit"
+                                                        class="btn btn-success btn-large ship-address"
+                                                        data-loading-text="{% trans 'Saving...' %}">
+                                                    <i class="fas fa-check-circle"></i>
+                                                    {% trans "Ship to your default shipping address" %}
+                                                </button>
+                                            {% else %}
+                                                <button type="submit"
+                                                        class="btn btn-primary btn-large ship-address"
+                                                        data-loading-text="{% trans 'Saving...' %}">
+                                                    {% trans "Ship to this address" %}
+                                                </button>
+                                            {% endif %}
+                                            <div class="btn-group address-controls">
+                                                <a href="{% url 'checkout:user-address-update' pk=address.id %}"
+                                                   class="btn btn-secondary">
+                                                    {% trans "Edit address" %}
+                                                </a>
+                                                <button class="btn btn-secondary dropdown-toggle"
+                                                        data-toggle="dropdown"></button>
+                                                <ul class="dropdown-menu">
+                                                    <a href="{% url 'checkout:user-address-delete' pk=address.id %}"
+                                                       class="btn-remove-address nav-link">
+                                                        {% trans "Delete" %}
                                                     </a>
-                                                    <button class="btn btn-secondary dropdown-toggle"
-                                                            data-toggle="dropdown"></button>
-                                                    <ul class="dropdown-menu">
-                                                        <a href="{% url 'checkout:user-address-delete' pk=address.id %}"
-                                                           class="btn-remove-address nav-link">
-                                                            {% trans "Delete" %}
-                                                        </a>
-                                                    </ul>
-                                                </div>
-                                            </form>
-                                        </div>
+                                                </ul>
+                                            </div>
+                                        </form>
                                     </div>
-                                    {% if forloop.counter|divisibleby:2 %}
-                                    </div>
-                                    <div class="row">
-                                    {% endif %}
-                                {% endblock %}
-                            {% endfor %}
+                                </div>
+                                {% if forloop.counter|divisibleby:2 %}
+                                </div>
+                                <div class="row">
+                                {% endif %}
+                            {% endblock %}
+                        {% endfor %}
+                    </div>
+                </div>
+                <h3>{% trans "Or a new address?" %}</h3>
+            {% endif %}
+        {% endif %}
+        {% block new_address_form %}
+            <div class="card card-body bg-light">
+                <form action="{% url 'checkout:shipping-address' %}" method="post" id="new_shipping_address">
+                    {% csrf_token %}
+                    {% include "oscar/partials/form_fields.html" with form=form style='horizontal' %}
+                    <div class="form-group row">
+                        <div class="offset-sm-4 col-sm-8">
+                            <button type="submit"
+                                    class="btn btn-lg btn-primary"
+                                    data-loading-text="{% trans 'Continuing...' %}">
+                                {% trans "Continue" %}
+                            </button>
+                            {% trans "or" %}
+                            <a href="{% url 'basket:summary' %}">
+                                {% trans "return to basket" %}
+                            </a>
                         </div>
                     </div>
-                    <h3>{% trans "Or a new address?" %}</h3>
-                {% endif %}
-            {% endif %}
-            {% block new_address_form %}
-                <div class="card card-body bg-light">
-                    <form action="{% url 'checkout:shipping-address' %}" method="post" id="new_shipping_address">
-                        {% csrf_token %}
-                        {% include "oscar/partials/form_fields.html" with form=form style='horizontal' %}
-                        <div class="form-group row">
-                            <div class="offset-sm-4 col-sm-8">
-                                <button type="submit"
-                                        class="btn btn-lg btn-primary"
-                                        data-loading-text="{% trans 'Continuing...' %}">
-                                    {% trans "Continue" %}
-                                </button>
-                                {% trans "or" %}
-                                <a href="{% url 'basket:summary' %}">
-                                    {% trans "return to basket" %}
-                                </a>
-                            </div>
-                        </div>
-                    </form>
-                </div>
-            {% endblock %}
-        </div>
-    {% endblock shipping_address %}
-    {% block shipping_method %}{% endblock %}
-    {% block payment_method %}{% endblock %}
+                </form>
+            </div>
+        {% endblock %}
+    </div>
+{% endblock shipping_address %}
+{% block shipping_method %}{% endblock %}
+{% block payment_method %}{% endblock %}
diff --git a/tests/django_oscar/oscar/checkout/shipping_methods.html b/tests/django_oscar/oscar/checkout/shipping_methods.html
index 4c424c4..41a804e 100644
--- a/tests/django_oscar/oscar/checkout/shipping_methods.html
+++ b/tests/django_oscar/oscar/checkout/shipping_methods.html
@@ -6,64 +6,65 @@
     {% trans "Shipping method" %} | {{ block.super }}
 {% endblock %}
 {% block checkout_nav %}
-    {% include 'oscar/checkout/nav.html' with step=2 %}{% endblock %}
-    {% block checkout_title %}
-        {% trans "Shipping method" %}
-    {% endblock %}
-    {% block order_contents %}{% endblock %}
-    {% block shipping_address %}{% endblock %}
-    {% block payment_method %}{% endblock %}
-    {% block shipping_method %}
-        <div class="basket-title">
-            <div class="row">
-                <h4 class="col-sm-8 m-0">{% trans "Method" %}</h4>
-                <h4 class="col-sm-3 m-0">{% trans "Cost" %}</h4>
-            </div>
+    {% include 'oscar/checkout/nav.html' with step=2 %}
+{% endblock %}
+{% block checkout_title %}
+    {% trans "Shipping method" %}
+{% endblock %}
+{% block order_contents %}{% endblock %}
+{% block shipping_address %}{% endblock %}
+{% block payment_method %}{% endblock %}
+{% block shipping_method %}
+    <div class="basket-title">
+        <div class="row">
+            <h4 class="col-sm-8 m-0">{% trans "Method" %}</h4>
+            <h4 class="col-sm-3 m-0">{% trans "Cost" %}</h4>
         </div>
-        {% for method in methods %}
-            <div class="basket-items">
-                <div class="row">
-                    <div class="col-sm-8">
-                        <h4>{{ method.name }}</h4>
-                        {% if method.description %}
-                            <p>
-                                {{ method.description|safe }}
-                            </p>
-                        {% endif %}
-                        {% if method.is_discounted %}
-                            <small>
-                            {% shipping_charge_discount method basket as discount %}
-                            {% blocktrans with amount=discount|currency:basket.currency name=method.discount_name %}
-                                This includes a discount of
-                                <strong>{{ amount }}</strong>
-                                as
-                                your basket qualifies for the
-                                <strong>{{ name }}</strong>
-                                offer.
-                            {% endblocktrans %}
-                            </small>
-                        {% endif %}
-                    </div>
-                    <div class="col-sm-1">
-                        {% shipping_charge method basket as charge %}
-                        {% if charge.is_tax_known %}
-                            {{ charge.incl_tax|currency:basket.currency }}
-                        {% else %}
-                            {{ charge.excl_tax|currency:basket.currency }}
-                        {% endif %}
-                    </div>
-                    <div class="col-sm-3">
-                        <form method="post" action="{% url 'checkout:shipping-method' %}">
-                            {% csrf_token %}
-                            <input type="hidden" name="method_code" value="{{ method.code }}" />
-                            <button type="submit"
-                                    class="btn btn-lg btn-primary float-right"
-                                    data-loading-text="{% trans 'Submitting...' %}">
-                                {% trans "Select option" %}
-                            </button>
-                        </form>
-                    </div>
+    </div>
+    {% for method in methods %}
+        <div class="basket-items">
+            <div class="row">
+                <div class="col-sm-8">
+                    <h4>{{ method.name }}</h4>
+                    {% if method.description %}
+                        <p>
+                            {{ method.description|safe }}
+                        </p>
+                    {% endif %}
+                    {% if method.is_discounted %}
+                        <small>
+                        {% shipping_charge_discount method basket as discount %}
+                        {% blocktrans with amount=discount|currency:basket.currency name=method.discount_name %}
+                            This includes a discount of
+                            <strong>{{ amount }}</strong>
+                            as
+                            your basket qualifies for the
+                            <strong>{{ name }}</strong>
+                            offer.
+                        {% endblocktrans %}
+                        </small>
+                    {% endif %}
+                </div>
+                <div class="col-sm-1">
+                    {% shipping_charge method basket as charge %}
+                    {% if charge.is_tax_known %}
+                        {{ charge.incl_tax|currency:basket.currency }}
+                    {% else %}
+                        {{ charge.excl_tax|currency:basket.currency }}
+                    {% endif %}
+                </div>
+                <div class="col-sm-3">
+                    <form method="post" action="{% url 'checkout:shipping-method' %}">
+                        {% csrf_token %}
+                        <input type="hidden" name="method_code" value="{{ method.code }}" />
+                        <button type="submit"
+                                class="btn btn-lg btn-primary float-right"
+                                data-loading-text="{% trans 'Submitting...' %}">
+                            {% trans "Select option" %}
+                        </button>
+                    </form>
                 </div>
             </div>
-        {% endfor %}
-    {% endblock shipping_method %}
+        </div>
+    {% endfor %}
+{% endblock shipping_method %}
diff --git a/tests/django_oscar/oscar/checkout/thank_you.html b/tests/django_oscar/oscar/checkout/thank_you.html
index 914f31a..e7310c7 100644
--- a/tests/django_oscar/oscar/checkout/thank_you.html
+++ b/tests/django_oscar/oscar/checkout/thank_you.html
@@ -9,217 +9,219 @@
     | {{ block.super }}
 {% endblock title %}
 {% block checkout_nav %}
-    {% include 'oscar/checkout/nav.html' with step=5 %}{% endblock %}
-    {% block checkout_title %}
+    {% include 'oscar/checkout/nav.html' with step=5 %}
+{% endblock %}
+{% block checkout_title %}
+    {% blocktrans with number=order.number %}
+        Order {{ number }}: confirmation
+    {% endblocktrans %}
+{% endblock %}
+{% block content %}
+    <p class="lead">
         {% blocktrans with number=order.number %}
-            Order {{ number }}: confirmation
+            Your order has been placed and a confirmation email has been sent - your order number is
+            <strong>{{ number }}</strong>
+            .
         {% endblocktrans %}
-    {% endblock %}
-    {% block content %}
-        <p class="lead">
-            {% blocktrans with number=order.number %}
-                Your order has been placed and a confirmation email has been sent - your order number is
-                <strong>{{ number }}</strong>
-                .
-            {% endblocktrans %}
-            {% trans "Please make a note of this reference or print this page and quote it in any communication with us regarding your order." %}
-        </p>
-        <div class="row shipping-payment">
-            <div class="col-sm-6">
-                {% block shipping_info %}
-                    <div class="sub-header">
-                        <h2>{% trans "Shipping" %}</h2>
-                    </div>
-                    <div class="card card-body bg-light">
-                        <h3>{% trans "Address" %}</h3>
-                        {% if order.shipping_address %}
-                            <address>
-                                {% for field in order.shipping_address.active_address_fields %}
-                                    {{ field }}
+        {% trans "Please make a note of this reference or print this page and quote it in any communication with us regarding your order." %}
+    </p>
+    <div class="row shipping-payment">
+        <div class="col-sm-6">
+            {% block shipping_info %}
+                <div class="sub-header">
+                    <h2>{% trans "Shipping" %}</h2>
+                </div>
+                <div class="card card-body bg-light">
+                    <h3>{% trans "Address" %}</h3>
+                    {% if order.shipping_address %}
+                        <address>
+                            {% for field in order.shipping_address.active_address_fields %}
+                                {{ field }}
+                                <br/>
+                            {% endfor %}
+                        </address>
+                        {% if order.shipping_address.phone_number %}
+                            <h4>{% trans "Contact" %}</h4>
+                            <p>
+                                {% trans "Phone" %}: {{ order.shipping_address.phone_number }}
+                                {% if order.guest_email %}
                                     <br/>
-                                {% endfor %}
-                            </address>
-                            {% if order.shipping_address.phone_number %}
-                                <h4>{% trans "Contact" %}</h4>
-                                <p>
-                                    {% trans "Phone" %}: {{ order.shipping_address.phone_number }}
-                                    {% if order.guest_email %}
-                                        <br/>
-                                        {% trans "Email" %}: {{ order.guest_email }}
-                                    {% endif %}
-                                </p>
-                            {% endif %}
-                            {% if order.shipping_address.notes %}
-                                <h4>{% trans "Instructions" %}</h4>
-                                <p>
-                                    {{ order.shipping_address.notes|linebreaks }}
-                                </p>
-                            {% endif %}
-                        {% else %}
-                            <p>
-                                {% trans "No shipping address required." %}
-                            </p>
-                        {% endif %}
-                    </div>
-                    <div class="card card-body bg-light">
-                        <h3>{% trans "Shipping method" %}</h3>
-                        <p>
-                            {{ order.shipping_method }}
-                        </p>
-                    </div>
-                {% endblock %}
-            </div>
-            <div class="col-sm-6">
-                {% block payment_info %}
-                    <div class="sub-header">
-                        <h2>{% trans "Payment" %}</h2>
-                    </div>
-                    <div class="card card-body bg-light">
-                        <h3>{% trans "Payment" %}</h3>
-                        {% for source in order.sources.all %}
-                            <p>
-                                {% if source.reference %}
-                                    {% blocktrans with amount=source.amount_allocated|currency:source.currency type=source.source_type.name reference=source.reference %}
-                                        Allocation of {{ amount }} from type {{ type }} (reference: {{ reference }})
-                                    {% endblocktrans %}
-                                {% else %}
-                                    {% blocktrans with amount=source.amount_allocated|currency:source.currency type=source.source_type.name %}
-                                        Allocation of {{ amount }} from type {{ type }}
-                                    {% endblocktrans %}
+                                    {% trans "Email" %}: {{ order.guest_email }}
                                 {% endif %}
                             </p>
-                            {% empty %}
-                            <p>
-                                {% trans "No payment was required for this order." %}
-                            </p>
-                        {% endfor %}
-                        {% if order.billing_address %}
-                            <h4>{% trans "Billing address" %}</h4>
-                            <address>
-                                {% for field in order.billing_address.active_address_fields %}
-                                    {{ field }}
-                                    <br/>
-                                {% endfor %}
-                            </address>
                         {% endif %}
-                    </div>
-                {% endblock %}
-            </div>
-        </div>
-        {% block order_contents %}
-            <div class="sub-header">
-                <h2>{% trans "Order contents" %}</h2>
-            </div>
-            <div class="basket-title">
-                <div class="row">
-                    <p class="col-sm-9 h4">
-                        {% trans "Items purchased" %}
-                    </p>
-                    <p class="col-sm-1 h4 text-center">
-                        {% trans "Quantity" %}
-                    </p>
-                    <p class="col-sm-2 h4 text-right">
-                        {% trans "Total" %}
+                        {% if order.shipping_address.notes %}
+                            <h4>{% trans "Instructions" %}</h4>
+                            <p>
+                                {{ order.shipping_address.notes|linebreaks }}
+                            </p>
+                        {% endif %}
+                    {% else %}
+                        <p>
+                            {% trans "No shipping address required." %}
+                        </p>
+                    {% endif %}
+                </div>
+                <div class="card card-body bg-light">
+                    <h3>{% trans "Shipping method" %}</h3>
+                    <p>
+                        {{ order.shipping_method }}
                     </p>
                 </div>
+            {% endblock %}
+        </div>
+        <div class="col-sm-6">
+            {% block payment_info %}
+                <div class="sub-header">
+                    <h2>{% trans "Payment" %}</h2>
+                </div>
+                <div class="card card-body bg-light">
+                    <h3>{% trans "Payment" %}</h3>
+                    {% for source in order.sources.all %}
+                        <p>
+                            {% if source.reference %}
+                                {% blocktrans with amount=source.amount_allocated|currency:source.currency type=source.source_type.name reference=source.reference %}
+                                    Allocation of {{ amount }} from type {{ type }} (reference: {{ reference }})
+                                {% endblocktrans %}
+                            {% else %}
+                                {% blocktrans with amount=source.amount_allocated|currency:source.currency type=source.source_type.name %}
+                                    Allocation of {{ amount }} from type {{ type }}
+                                {% endblocktrans %}
+                            {% endif %}
+                        </p>
+                        {% empty %}
+                        <p>
+                            {% trans "No payment was required for this order." %}
+                        </p>
+                    {% endfor %}
+                    {% if order.billing_address %}
+                        <h4>{% trans "Billing address" %}</h4>
+                        <address>
+                            {% for field in order.billing_address.active_address_fields %}
+                                {{ field }}
+                                <br/>
+                            {% endfor %}
+                        </address>
+                    {% endif %}
+                </div>
+            {% endblock %}
+        </div>
+    </div>
+    {% block order_contents %}
+        <div class="sub-header">
+            <h2>{% trans "Order contents" %}</h2>
+        </div>
+        <div class="basket-title">
+            <div class="row">
+                <p class="col-sm-9 h4">
+                    {% trans "Items purchased" %}
+                </p>
+                <p class="col-sm-1 h4 text-center">
+                    {% trans "Quantity" %}
+                </p>
+                <p class="col-sm-2 h4 text-right">
+                    {% trans "Total" %}
+                </p>
             </div>
-            {% for line in order.lines.all %}
-                <div class="basket-items">
-                    <div class="row">
-                        <div class="col-sm-2">
-                            <div class="image_container w-100">
-                                {% with image=line.product.primary_image %}
+        </div>
+        {% for line in order.lines.all %}
+            <div class="basket-items">
+                <div class="row">
+                    <div class="col-sm-2">
+                        <div class="image_container w-100">
+                            {% with image=line.product.primary_image %}
                                 {% oscar_thumbnail image.original "200x200" upscale=False as thumb %}
                                 <a href="{{ line.product.get_absolute_url }}">
                                     <img src="{{ thumb.url }}"
                                          alt="{{ product.get_title }}"
                                          class="img-thumbnail w-auto mx-auto my-0">
-                                    </a>
-                                {% endwith %}
-                            </div>
-                        </div>
-                        <div class="col-sm-7">
-                            <h3>
-                                <a href="{{ line.product.get_absolute_url }}">
-                                    {{ line.description }}
                                 </a>
-                            </h3>
-                            {% if line.upc %}
-                                <p>
-                                    {{ line.upc }}
-                                </p>
-                            {% endif %}
+                            {% endwith %}
                         </div>
-                        <div class="col-sm-1 text-center">
-                            {{ line.quantity }}
-                        </div>
-                        <div class="col-sm-2 text-right">
-                            <p class="price_color">
-                                {% if show_tax_separately %}
-                                    {{ line.line_price_before_discounts_excl_tax|currency:order.currency }}
-                                {% else %}
-                                    {{ line.line_price_before_discounts_incl_tax|currency:order.currency }}
-                                {% endif %}
+                    </div>
+                    <div class="col-sm-7">
+                        <h3>
+                            <a href="{{ line.product.get_absolute_url }}">
+                                {{ line.description }}
+                            </a>
+                        </h3>
+                        {% if line.upc %}
+                            <p>
+                                {{ line.upc }}
                             </p>
-                        </div>
+                        {% endif %}
                     </div>
-                </div>
-            {% endfor %}
-            {% block basket_totals %}
-                <div class="row">
-                    <div class="col-sm-6">
-                        &nbsp;
+                    <div class="col-sm-1 text-center">
+                        {{ line.quantity }}
                     </div>
-                    <div class="col-sm-6">
-                        <div class="sub-header">
-                            <h2>
-                                {% trans 'Totals' %}
-                            </h2>
-                        </div>
-                        {% include 'oscar/order/partials/basket_totals.html' %}
-                    </div>
-                </div>
-            {% endblock basket_totals %}
-        {% endblock order_contents %}
-        {% block order_tracking %}
-            {% if not order.user %}
-                <div class="sub-header">
-                    <h2>
-                        {% trans "Tracking your order" %}
-                    </h2>
-                </div>
-                <p>
-                    {% trans "You can track the status of your order" %}
-                    <a class="btn btn-primary"
-                       href="{% url 'customer:anon-order' order_number=order.number hash=order.verification_hash %}">
-                        {% trans "View order status" %}
-                    </a>
-                    .
-                </p>
-            {% endif %}
-        {% endblock %}
-        {% block order_actions %}
-            <div class="form-group">
-                <div class="row">
-                    <div class="col-sm-4">
-                        <p>
-                            <a onclick="window.print()" href="#" class="btn btn-primary btn-block btn-lg">
-                                {% trans "Print this page" %}
-                            </a>
-                        </p>
-                    </div>
-                    <div class="col-sm-4 offset-sm-4">
-                        <p>
-                            <a href="{{ homepage_url }}" class="btn btn-primary btn-block btn-lg">
-                                {% trans "Continue shopping" %}
-                            </a>
+                    <div class="col-sm-2 text-right">
+                        <p class="price_color">
+                            {% if show_tax_separately %}
+                                {{ line.line_price_before_discounts_excl_tax|currency:order.currency }}
+                            {% else %}
+                                {{ line.line_price_before_discounts_incl_tax|currency:order.currency }}
+                            {% endif %}
                         </p>
                     </div>
                 </div>
             </div>
-        {% endblock order_actions %}
-    {% endblock content %}
-    {% block tracking %}
-        {% if send_analytics_event %}
-            {% include "oscar/partials/google_analytics_transaction.html" %}{% endif %}
-        {% endblock %}
+        {% endfor %}
+        {% block basket_totals %}
+            <div class="row">
+                <div class="col-sm-6">
+                    &nbsp;
+                </div>
+                <div class="col-sm-6">
+                    <div class="sub-header">
+                        <h2>
+                            {% trans 'Totals' %}
+                        </h2>
+                    </div>
+                    {% include 'oscar/order/partials/basket_totals.html' %}
+                </div>
+            </div>
+        {% endblock basket_totals %}
+    {% endblock order_contents %}
+    {% block order_tracking %}
+        {% if not order.user %}
+            <div class="sub-header">
+                <h2>
+                    {% trans "Tracking your order" %}
+                </h2>
+            </div>
+            <p>
+                {% trans "You can track the status of your order" %}
+                <a class="btn btn-primary"
+                   href="{% url 'customer:anon-order' order_number=order.number hash=order.verification_hash %}">
+                    {% trans "View order status" %}
+                </a>
+                .
+            </p>
+        {% endif %}
+    {% endblock %}
+    {% block order_actions %}
+        <div class="form-group">
+            <div class="row">
+                <div class="col-sm-4">
+                    <p>
+                        <a onclick="window.print()" href="#" class="btn btn-primary btn-block btn-lg">
+                            {% trans "Print this page" %}
+                        </a>
+                    </p>
+                </div>
+                <div class="col-sm-4 offset-sm-4">
+                    <p>
+                        <a href="{{ homepage_url }}" class="btn btn-primary btn-block btn-lg">
+                            {% trans "Continue shopping" %}
+                        </a>
+                    </p>
+                </div>
+            </div>
+        </div>
+    {% endblock order_actions %}
+{% endblock content %}
+{% block tracking %}
+    {% if send_analytics_event %}
+        {% include "oscar/partials/google_analytics_transaction.html" %}
+    {% endif %}
+{% endblock %}
diff --git a/tests/django_oscar/oscar/checkout/user_address_delete.html b/tests/django_oscar/oscar/checkout/user_address_delete.html
index 93a7ff1..013212e 100644
--- a/tests/django_oscar/oscar/checkout/user_address_delete.html
+++ b/tests/django_oscar/oscar/checkout/user_address_delete.html
@@ -8,31 +8,32 @@
 {% block payment_method %}{% endblock %}
 {% block payment_details %}{% endblock %}
 {% block checkout_nav %}
-    {% include 'oscar/checkout/nav.html' with step=1 %}{% endblock %}
-    {% block checkout_title %}
-        {% trans "Delete address?" %}
-    {% endblock %}
-    {% block shipping_address %}
-        <form method="post" id="delete_address_{{ object.id }}">
-            {% csrf_token %}
-            <div class="card card-body bg-light">
-                <address>
-                    {% for field in object.active_address_fields %}
-                        {{ field }}
-                        <br/>
-                    {% endfor %}
-                </address>
-            </div>
-            <p>
-                {% trans "Are you sure you want to delete this address?" %}
-                <button type="submit" class="btn btn-danger" data-loading-text="{% trans 'Submitting...' %}">
-                    {% trans "Yes!" %}
-                </button>
-                {% trans "or" %}
-                <a href="{% url 'checkout:shipping-address' %}">
-                    {% trans "cancel" %}
-                </a>
-                .
-            </p>
-        </form>
-    {% endblock shipping_address %}
+    {% include 'oscar/checkout/nav.html' with step=1 %}
+{% endblock %}
+{% block checkout_title %}
+    {% trans "Delete address?" %}
+{% endblock %}
+{% block shipping_address %}
+    <form method="post" id="delete_address_{{ object.id }}">
+        {% csrf_token %}
+        <div class="card card-body bg-light">
+            <address>
+                {% for field in object.active_address_fields %}
+                    {{ field }}
+                    <br/>
+                {% endfor %}
+            </address>
+        </div>
+        <p>
+            {% trans "Are you sure you want to delete this address?" %}
+            <button type="submit" class="btn btn-danger" data-loading-text="{% trans 'Submitting...' %}">
+                {% trans "Yes!" %}
+            </button>
+            {% trans "or" %}
+            <a href="{% url 'checkout:shipping-address' %}">
+                {% trans "cancel" %}
+            </a>
+            .
+        </p>
+    </form>
+{% endblock shipping_address %}
diff --git a/tests/django_oscar/oscar/checkout/user_address_form.html b/tests/django_oscar/oscar/checkout/user_address_form.html
index 6ce5da7..18ec4b2 100644
--- a/tests/django_oscar/oscar/checkout/user_address_form.html
+++ b/tests/django_oscar/oscar/checkout/user_address_form.html
@@ -8,29 +8,28 @@
 {% block payment_method %}{% endblock %}
 {% block payment_details %}{% endblock %}
 {% block checkout_nav %}
-    {% include 'oscar/checkout/nav.html' with step=1 %}{% endblock %}
-    {% block checkout_title %}
-        {% trans "Edit address" %}
-    {% endblock %}
-    {% block shipping_address %}
-        <div class="card card-body bg-light">
-            <form id="update_user_address" method="post">
-                {% csrf_token %}
-                {% include "oscar/partials/form_fields.html" with form=form style='horizontal' %}
-                <div class="form-group row">
-                    <div class="offset-sm-4 col-sm-8">
-                        <button type="submit"
-                                class="btn btn-lg btn-primary"
-                                data-loading-text="{% trans 'Saving...' %}">
-                            {% trans "Save" %}
-                        </button>
-                        {% trans "or" %}
-                        <a href="{% url 'checkout:shipping-address' %}">
-                            {% trans "cancel" %}
-                        </a>
-                        .
-                    </div>
+    {% include 'oscar/checkout/nav.html' with step=1 %}
+{% endblock %}
+{% block checkout_title %}
+    {% trans "Edit address" %}
+{% endblock %}
+{% block shipping_address %}
+    <div class="card card-body bg-light">
+        <form id="update_user_address" method="post">
+            {% csrf_token %}
+            {% include "oscar/partials/form_fields.html" with form=form style='horizontal' %}
+            <div class="form-group row">
+                <div class="offset-sm-4 col-sm-8">
+                    <button type="submit" class="btn btn-lg btn-primary" data-loading-text="{% trans 'Saving...' %}">
+                        {% trans "Save" %}
+                    </button>
+                    {% trans "or" %}
+                    <a href="{% url 'checkout:shipping-address' %}">
+                        {% trans "cancel" %}
+                    </a>
+                    .
                 </div>
-            </form>
-        </div>
-    {% endblock shipping_address %}
+            </div>
+        </form>
+    </div>
+{% endblock shipping_address %}
diff --git a/tests/django_oscar/oscar/communication/notifications/list.html b/tests/django_oscar/oscar/communication/notifications/list.html
index 7a5e688..3bc2fc2 100644
--- a/tests/django_oscar/oscar/communication/notifications/list.html
+++ b/tests/django_oscar/oscar/communication/notifications/list.html
@@ -5,87 +5,87 @@
         <li class="nav-item">
             <a href="{% url 'customer:notifications-inbox' %}"
                class="nav-link{% if list_type == 'inbox' %}active{% endif %}">
-            {% trans 'Inbox' %}
-        </a>
-    </li>
-    <li class="nav-item">
-        <a href="{% url 'customer:notifications-archive' %}"
-           class="nav-link{% if list_type == 'archive' %}active{% endif %}">
-        {% trans 'Archive' context 'noun' %}
-    </a>
-</li>
-</ul>
-{% if notifications %}
-{% include "oscar/partials/pagination.html" %}
-<form action="{% url 'customer:notifications-update' %}" method="post">
-    {% csrf_token %}
-    <table class="table table-striped table-bordered">
-        <tbody>
-            {% for notification in notifications %}
-                <tr>
-                    <td>
-                        <input type="checkbox" name="selected_notification" value="{{ notification.id }}"/>
-                    </td>
-                    <td>
-                        {% if notification.is_read %}
-                            <i class="fas fa-inbox"></i>
-                        {% else %}
-                            <i class="fas fa-envelope"></i>
-                        {% endif %}
-                    </td>
-                    <td>
-                        {% if notification.is_read %}
-                            {{ notification.subject|safe }}
-                        {% else %}
-                            <strong>{{ notification.subject|safe }}</strong>
-                        {% endif %}
-                        <br/>
-                        <em>{{ notification.date_sent }}</em>
-                    </td>
-                    <td>
-                        <a href="{% url 'customer:notifications-detail' pk=notification.pk %}"
-                           class="btn btn-info btn-sm">
-                            {% trans 'View' %}
-                        </a>
-                        {% if list_type == 'inbox' %}
-                            <a class="btn btn-success btn-sm" href="#" data-behaviours="archive">
-                                {% trans 'Archive' context 'verb' %}
-                            </a>
-                        {% endif %}
-                        <a class="btn btn-danger btn-sm" href="#" data-behaviours="delete">
-                            {% trans 'Delete' %}
-                        </a>
-                    </td>
-                </tr>
-            {% endfor %}
-        </tbody>
-    </table>
-    {% trans "With selected items:" %}
-    {% if list_type == 'inbox' %}
-        <button type="submit"
-                class="btn btn-success"
-                name="action"
-                value="archive"
-                data-loading-text="{% trans 'Archiving...' %}">
-            {% trans "Archive" context 'verb' %}
-        </button>
+                {% trans 'Inbox' %}
+            </a>
+        </li>
+        <li class="nav-item">
+            <a href="{% url 'customer:notifications-archive' %}"
+               class="nav-link{% if list_type == 'archive' %}active{% endif %}">
+                {% trans 'Archive' context 'noun' %}
+            </a>
+        </li>
+    </ul>
+    {% if notifications %}
+        {% include "oscar/partials/pagination.html" %}
+        <form action="{% url 'customer:notifications-update' %}" method="post">
+            {% csrf_token %}
+            <table class="table table-striped table-bordered">
+                <tbody>
+                    {% for notification in notifications %}
+                        <tr>
+                            <td>
+                                <input type="checkbox" name="selected_notification" value="{{ notification.id }}"/>
+                            </td>
+                            <td>
+                                {% if notification.is_read %}
+                                    <i class="fas fa-inbox"></i>
+                                {% else %}
+                                    <i class="fas fa-envelope"></i>
+                                {% endif %}
+                            </td>
+                            <td>
+                                {% if notification.is_read %}
+                                    {{ notification.subject|safe }}
+                                {% else %}
+                                    <strong>{{ notification.subject|safe }}</strong>
+                                {% endif %}
+                                <br/>
+                                <em>{{ notification.date_sent }}</em>
+                            </td>
+                            <td>
+                                <a href="{% url 'customer:notifications-detail' pk=notification.pk %}"
+                                   class="btn btn-info btn-sm">
+                                    {% trans 'View' %}
+                                </a>
+                                {% if list_type == 'inbox' %}
+                                    <a class="btn btn-success btn-sm" href="#" data-behaviours="archive">
+                                        {% trans 'Archive' context 'verb' %}
+                                    </a>
+                                {% endif %}
+                                <a class="btn btn-danger btn-sm" href="#" data-behaviours="delete">
+                                    {% trans 'Delete' %}
+                                </a>
+                            </td>
+                        </tr>
+                    {% endfor %}
+                </tbody>
+            </table>
+            {% trans "With selected items:" %}
+            {% if list_type == 'inbox' %}
+                <button type="submit"
+                        class="btn btn-success"
+                        name="action"
+                        value="archive"
+                        data-loading-text="{% trans 'Archiving...' %}">
+                    {% trans "Archive" context 'verb' %}
+                </button>
+            {% endif %}
+            <button type="submit"
+                    class="btn btn-danger"
+                    name="action"
+                    value="delete"
+                    data-loading-text="{% trans 'Deleting...' %}">
+                {% trans "Delete" %}
+            </button>
+        </form>
+        {% include "oscar/partials/pagination.html" %}
+    {% else %}
+        <p class="mt-3">
+            {% trans "There are no notifications to display." %}
+        </p>
     {% endif %}
-    <button type="submit"
-            class="btn btn-danger"
-            name="action"
-            value="delete"
-            data-loading-text="{% trans 'Deleting...' %}">
-        {% trans "Delete" %}
-    </button>
-</form>
-{% include "oscar/partials/pagination.html" %}
-{% else %}
-<p class="mt-3">
-    {% trans "There are no notifications to display." %}
-</p>
-{% endif %}
 {% endblock tabcontent %}
 {% block onbodyload %}
-{{ block.super }}
-oscar.notifications.init();
+    {{ block.super }}
+    oscar.notifications.init();
 {% endblock %}
diff --git a/tests/django_oscar/oscar/customer/address/address_form.html b/tests/django_oscar/oscar/customer/address/address_form.html
index 349fe8b..6b66494 100644
--- a/tests/django_oscar/oscar/customer/address/address_form.html
+++ b/tests/django_oscar/oscar/customer/address/address_form.html
@@ -9,5 +9,6 @@
 {% endblock %}
 {% block tabcontent %}
     {% with style='horizontal' %}
-    {% include "oscar/partials/form.html" %}{% endwith %}
+        {% include "oscar/partials/form.html" %}
+    {% endwith %}
 {% endblock tabcontent %}
diff --git a/tests/django_oscar/oscar/customer/alerts/alert_list.html b/tests/django_oscar/oscar/customer/alerts/alert_list.html
index f1f1b12..59db620 100644
--- a/tests/django_oscar/oscar/customer/alerts/alert_list.html
+++ b/tests/django_oscar/oscar/customer/alerts/alert_list.html
@@ -19,29 +19,29 @@
                     <tr>
                         <td>
                             {% with product=alert.product %}
-                            {% if product.is_public %}
-                                <a href="{{ product.get_absolute_url }}">
+                                {% if product.is_public %}
+                                    <a href="{{ product.get_absolute_url }}">
+                                        {{ product.get_title }}
+                                    </a>
+                                {% else %}
                                     {{ product.get_title }}
+                                {% endif %}
+                            {% endwith %}
+                        </td>
+                        <td>{{ alert.status }}</td>
+                        <td>{{ alert.date_created }}</td>
+                        <td>
+                            {% if alert.can_be_cancelled %}
+                                <a href="{% url 'customer:alerts-cancel-by-pk' pk=alert.pk %}?next={% url 'customer:alerts-list' %}"
+                                   class="btn btn-danger">
+                                    {% trans "Cancel" %}
                                 </a>
-                            {% else %}
-                                {{ product.get_title }}
                             {% endif %}
-                        {% endwith %}
-                    </td>
-                    <td>{{ alert.status }}</td>
-                    <td>{{ alert.date_created }}</td>
-                    <td>
-                        {% if alert.can_be_cancelled %}
-                            <a href="{% url 'customer:alerts-cancel-by-pk' pk=alert.pk %}?next={% url 'customer:alerts-list' %}"
-                               class="btn btn-danger">
-                                {% trans "Cancel" %}
-                            </a>
-                        {% endif %}
-                    </td>
-                </tr>
-            {% endfor %}
-        </table>
-        {% include "oscar/partials/pagination.html" %}
-    </form>
-{% endif %}
+                        </td>
+                    </tr>
+                {% endfor %}
+            </table>
+            {% include "oscar/partials/pagination.html" %}
+        </form>
+    {% endif %}
 {% endblock tabcontent %}
diff --git a/tests/django_oscar/oscar/customer/anon_order.html b/tests/django_oscar/oscar/customer/anon_order.html
index 420fb42..9f00b4b 100644
--- a/tests/django_oscar/oscar/customer/anon_order.html
+++ b/tests/django_oscar/oscar/customer/anon_order.html
@@ -18,134 +18,134 @@
         </p>
     {% endif %}
     {% with address=order.shipping_address %}
+        <div class="sub-header">
+            <h3>{% trans 'Shipping address' %}</h3>
+        </div>
+        <table class="table table-striped table-bordered">
+            <tr>
+                <th>{% trans 'Address' %}</th>
+                <td>
+                    {% for field in address.active_address_fields %}
+                        {{ field }}
+                        <br/>
+                    {% endfor %}
+                </td>
+            </tr>
+            {% if address.phone_number %}
+                <tr>
+                    <th>{% trans 'Contact number' %}</th>
+                    <td>{{ address.phone_number }}</td>
+                </tr>
+            {% endif %}
+            {% if address.notes %}
+                <tr>
+                    <th>{% trans 'Notes' %}</th>
+                    <td>{{ address.notes|linebreaks }}</td>
+                </tr>
+            {% endif %}
+        </table>
+    {% endwith %}
     <div class="sub-header">
-        <h3>{% trans 'Shipping address' %}</h3>
+        <h3>{% trans 'Shipping method' %}</h3>
     </div>
+    <p>
+        {{ order.shipping_method }}
+    </p>
+    <div class="sub-header">
+        <h3>{% trans 'Order contents' %}</h3>
+    </div>
+    {% csrf_token %}
     <table class="table table-striped table-bordered">
         <tr>
-            <th>{% trans 'Address' %}</th>
-            <td>
-                {% for field in address.active_address_fields %}
-                    {{ field }}
-                    <br/>
-                {% endfor %}
-            </td>
-        </tr>
-        {% if address.phone_number %}
-            <tr>
-                <th>{% trans 'Contact number' %}</th>
-                <td>{{ address.phone_number }}</td>
-            </tr>
-        {% endif %}
-        {% if address.notes %}
-            <tr>
-                <th>{% trans 'Notes' %}</th>
-                <td>{{ address.notes|linebreaks }}</td>
-            </tr>
-        {% endif %}
-    </table>
-{% endwith %}
-<div class="sub-header">
-    <h3>{% trans 'Shipping method' %}</h3>
-</div>
-<p>
-    {{ order.shipping_method }}
-</p>
-<div class="sub-header">
-    <h3>{% trans 'Order contents' %}</h3>
-</div>
-{% csrf_token %}
-<table class="table table-striped table-bordered">
-    <tr>
-        <th>{% trans 'Product' %}</th>
-        <th>
-            {% trans 'Status' %}
-        </th>
-        <th>
-            {% trans 'Quantity' %}
-        </th>
-        <th>
-            {% trans 'Line price excl. tax' %}
-        </th>
-        <th>
-            {% trans 'Line price incl. tax' %}
-        </th>
-        {% iffeature "reviews" %}
-            <th></th>
-        {% endiffeature %}
-    </tr>
-    {% for line in order.lines.all %}
-        <tr>
-            <td>
-                {% if product.is_public %}
-                    <a href="{{ line.product.get_absolute_url }}">
-                        {{ line.description }}
-                    </a>
-                {% else %}
-                    {{ line.description }}
-                {% endif %}
-            </td>
-            <td>
-                {{ line.shipping_status|default:"-" }}
-            </td>
-            <td>
-                {{ line.quantity }}
-            </td>
-            <td>
-                {{ line.line_price_before_discounts_excl_tax|currency:order.currency }}
-            </td>
-            <td>
-                {{ line.line_price_before_discounts_incl_tax|currency:order.currency }}
-            </td>
+            <th>{% trans 'Product' %}</th>
+            <th>
+                {% trans 'Status' %}
+            </th>
+            <th>
+                {% trans 'Quantity' %}
+            </th>
+            <th>
+                {% trans 'Line price excl. tax' %}
+            </th>
+            <th>
+                {% trans 'Line price incl. tax' %}
+            </th>
             {% iffeature "reviews" %}
-                <td>
-                    {% if line.product|is_review_permitted:user %}
-                        <a href="{% url 'catalogue:reviews-add' product_slug=line.product.slug product_pk=line.product.id %}"
-                           class="btn btn-primary">
-                            {% trans 'Write a review' %}
-                        </a>
-                    {% endif %}
-                </td>
+                <th></th>
             {% endiffeature %}
         </tr>
-    {% endfor %}
-    {% for discount in order.discounts.all %}
+        {% for line in order.lines.all %}
+            <tr>
+                <td>
+                    {% if product.is_public %}
+                        <a href="{{ line.product.get_absolute_url }}">
+                            {{ line.description }}
+                        </a>
+                    {% else %}
+                        {{ line.description }}
+                    {% endif %}
+                </td>
+                <td>
+                    {{ line.shipping_status|default:"-" }}
+                </td>
+                <td>
+                    {{ line.quantity }}
+                </td>
+                <td>
+                    {{ line.line_price_before_discounts_excl_tax|currency:order.currency }}
+                </td>
+                <td>
+                    {{ line.line_price_before_discounts_incl_tax|currency:order.currency }}
+                </td>
+                {% iffeature "reviews" %}
+                    <td>
+                        {% if line.product|is_review_permitted:user %}
+                            <a href="{% url 'catalogue:reviews-add' product_slug=line.product.slug product_pk=line.product.id %}"
+                               class="btn btn-primary">
+                                {% trans 'Write a review' %}
+                            </a>
+                        {% endif %}
+                    </td>
+                {% endiffeature %}
+            </tr>
+        {% endfor %}
+        {% for discount in order.discounts.all %}
+            <tr>
+                <td colspan="5">{{ discount.description }}</td>
+                <td>
+                    -{{ discount.amount|currency:order.currency }}
+                </td>
+                <td colspan="1"></td>
+            </tr>
+        {% endfor %}
+    </table>
+    <table class="table table-striped table-bordered">
+        <caption>
+        {% trans 'Totals' %}
+        </caption>
         <tr>
-            <td colspan="5">{{ discount.description }}</td>
+            <th>
+                {% trans 'Basket total (inc. tax)' %}
+            </th>
             <td>
-                -{{ discount.amount|currency:order.currency }}
+                {{ order.basket_total_incl_tax|currency:order.currency }}
             </td>
-            <td colspan="1"></td>
         </tr>
-    {% endfor %}
-</table>
-<table class="table table-striped table-bordered">
-    <caption>
-    {% trans 'Totals' %}
-    </caption>
-    <tr>
-        <th>
-            {% trans 'Basket total (inc. tax)' %}
-        </th>
-        <td>
-            {{ order.basket_total_incl_tax|currency:order.currency }}
-        </td>
-    </tr>
-    <tr>
-        <th>
-            {% trans 'Shipping charge (inc. tax)' %}
-        </th>
-        <td>
-            {{ order.shipping_incl_tax|currency:order.currency }}
-        </td>
-    </tr>
-    <tr>
-        <th>
-            {% trans 'Order total' %}
-        </th>
-        <td>
-            {{ order.total_incl_tax|currency:order.currency }}
-        </td>
-    </tr>
-</table>
+        <tr>
+            <th>
+                {% trans 'Shipping charge (inc. tax)' %}
+            </th>
+            <td>
+                {{ order.shipping_incl_tax|currency:order.currency }}
+            </td>
+        </tr>
+        <tr>
+            <th>
+                {% trans 'Order total' %}
+            </th>
+            <td>
+                {{ order.total_incl_tax|currency:order.currency }}
+            </td>
+        </tr>
+    </table>
 {% endblock content %}
diff --git a/tests/django_oscar/oscar/customer/baseaccountpage.html b/tests/django_oscar/oscar/customer/baseaccountpage.html
index 9b6d618..0d42872 100644
--- a/tests/django_oscar/oscar/customer/baseaccountpage.html
+++ b/tests/django_oscar/oscar/customer/baseaccountpage.html
@@ -26,9 +26,10 @@
 {% block column_left %}
     <ul class="nav nav-pills flex-column">
         {% block standard_tabs %}
-            {% include 'oscar/customer/partials/standard_tabs.html' %}{% endblock %}
-        </ul>
-    {% endblock %}
-    {% block content %}
-        {% block tabcontent %}{% endblock tabcontent %}
-        {% endblock content %}
+            {% include 'oscar/customer/partials/standard_tabs.html' %}
+        {% endblock %}
+    </ul>
+{% endblock %}
+{% block content %}
+    {% block tabcontent %}{% endblock tabcontent %}
+{% endblock content %}
diff --git a/tests/django_oscar/oscar/customer/history/recently_viewed_products.html b/tests/django_oscar/oscar/customer/history/recently_viewed_products.html
index b0827e9..20eb28e 100644
--- a/tests/django_oscar/oscar/customer/history/recently_viewed_products.html
+++ b/tests/django_oscar/oscar/customer/history/recently_viewed_products.html
@@ -1,16 +1,16 @@
 {% load i18n %}
 {% load product_tags %}
 {% with products_sliced=products|slice:":6" %}
-{% if products_sliced %}
-    <div class="sub-header">
-        <h2>{% trans 'Products you recently viewed' %}</h2>
-    </div>
-    <ul class="row list-unstyled mx-0">
-        {% for product in products_sliced %}
-            <li class="col-sm-4 col-md-3 col-lg-3">
-                {% render_product product %}
-            </li>
-        {% endfor %}
-    </ul>
-{% endif %}
+    {% if products_sliced %}
+        <div class="sub-header">
+            <h2>{% trans 'Products you recently viewed' %}</h2>
+        </div>
+        <ul class="row list-unstyled mx-0">
+            {% for product in products_sliced %}
+                <li class="col-sm-4 col-md-3 col-lg-3">
+                    {% render_product product %}
+                </li>
+            {% endfor %}
+        </ul>
+    {% endif %}
 {% endwith %}
diff --git a/tests/django_oscar/oscar/customer/order/order_detail.html b/tests/django_oscar/oscar/customer/order/order_detail.html
index 48df791..8b9361a 100644
--- a/tests/django_oscar/oscar/customer/order/order_detail.html
+++ b/tests/django_oscar/oscar/customer/order/order_detail.html
@@ -31,184 +31,188 @@
         <tbody>
             {% for line in order.lines.all %}
                 {% with product=line.product %}
-                <tr>
-                    <td>
-                        {% if product %}
-                            {% if product.is_public %}
-                                <p>
-                                    <a href="{{ product.get_absolute_url }}">
+                    <tr>
+                        <td>
+                            {% if product %}
+                                {% if product.is_public %}
+                                    <p>
+                                        <a href="{{ product.get_absolute_url }}">
+                                            {{ line.description }}
+                                        </a>
+                                    </p>
+                                {% else %}
+                                    <p>
                                         {{ line.description }}
-                                    </a>
-                                </p>
+                                    </p>
+                                {% endif %}
+                                {% iffeature "reviews" %}
+                                    {% if product|is_review_permitted:user %}
+                                        <a class="btn btn-secondary"
+                                           href="{% url 'catalogue:reviews-add' product_slug=product.slug product_pk=product.id %}#addreview">
+                                            {% trans 'Write a review' %}
+                                        </a>
+                                    {% endif %}
+                                {% endiffeature %}
                             {% else %}
                                 <p>
                                     {{ line.description }}
                                 </p>
                             {% endif %}
-                            {% iffeature "reviews" %}
-                                {% if product|is_review_permitted:user %}
-                                    <a class="btn btn-secondary"
-                                       href="{% url 'catalogue:reviews-add' product_slug=product.slug product_pk=product.id %}#addreview">
-                                        {% trans 'Write a review' %}
-                                    </a>
-                                {% endif %}
-                            {% endiffeature %}
-                        {% else %}
-                            <p>
-                                {{ line.description }}
-                            </p>
-                        {% endif %}
-                    </td>
-                    <td>{{ line.quantity }}</td>
-                    <td>{{ line.line_price_before_discounts_excl_tax|currency:order.currency }}</td>
-                    <td>{{ line.line_price_before_discounts_incl_tax|currency:order.currency }}</td>
-                    <td width="90">
-                        {% if product and product.is_public %}
-                            <form id="line_form_{{ line.id }}"
-                                  action="{% url 'customer:order-line' order_number=order.number line_id=line.id %}"
-                                  method="POST">
-                                {% csrf_token %}
-                                <input type="hidden" name="action" value="reorder" />
-                                <button id="reorder_line_{{ line.id }}"
-                                        class="btn btn-success"
-                                        type="submit"
-                                        data-loading-text="{% trans 'Re-ordering...' context 'Buy again' %}">
-                                    {% trans 'Re-order' context 'Buy again' %}
-                                </button>
-                            </form>
-                        {% else %}
-                            {% trans 'Not available anymore' %}
-                        {% endif %}
-                    </td>
-                </tr>
-            {% endwith %}
-        {% endfor %}
-        {% with discounts=order.basket_discounts %}
-        {% block discount_totals %}
-            {% if discounts %}
-                <tr>
-                    <td colspan="4">{% trans "Basket total (excl. discounts)" %}</td>
-                    <td colspan="2">
-                        {{ order.basket_total_before_discounts_incl_tax|currency:order.currency }}
-                    </td>
-                </tr>
-                {% for discount in discounts %}
-                    <tr>
-                        <td colspan="4">
-                            <span class="badge badge-success">{% trans "Discount" %}</span>
-                            {{ discount.offer_name }}
                         </td>
-                        <td colspan="2">- {{ discount.amount|currency:order.currency }}</td>
+                        <td>{{ line.quantity }}</td>
+                        <td>{{ line.line_price_before_discounts_excl_tax|currency:order.currency }}</td>
+                        <td>{{ line.line_price_before_discounts_incl_tax|currency:order.currency }}</td>
+                        <td width="90">
+                            {% if product and product.is_public %}
+                                <form id="line_form_{{ line.id }}"
+                                      action="{% url 'customer:order-line' order_number=order.number line_id=line.id %}"
+                                      method="POST">
+                                    {% csrf_token %}
+                                    <input type="hidden" name="action" value="reorder" />
+                                    <button id="reorder_line_{{ line.id }}"
+                                            class="btn btn-success"
+                                            type="submit"
+                                            data-loading-text="{% trans 'Re-ordering...' context 'Buy again' %}">
+                                        {% trans 'Re-order' context 'Buy again' %}
+                                    </button>
+                                </form>
+                            {% else %}
+                                {% trans 'Not available anymore' %}
+                            {% endif %}
+                        </td>
                     </tr>
-                {% endfor %}
-            {% endif %}
-        {% endblock discount_totals %}
-        {% block basket_total %}
-            {% if discounts %}
-                <tr>
-                    <th colspan="4">{% trans "Basket total (inc. discounts)" %}</th>
-                    <td colspan="2">
-                        {{ order.basket_total_incl_tax|currency:order.currency }}
-                    </td>
-                </tr>
-            {% else %}
-                <tr>
-                    <th colspan="4">{% trans "Basket total" %}</th>
-                    <td colspan="2">
-                        {{ order.basket_total_incl_tax|currency:order.currency }}
-                    </td>
-                </tr>
-            {% endif %}
-        {% endblock basket_total %}
-    {% endwith %}
-    {% block shipping_totals %}
-        {% if order.has_shipping_discounts %}
-            <tr>
-                <td colspan="4">{% trans "Shipping total (excl. discounts)" %}</td>
-                <td colspan="2">
-                    {{ order.shipping_before_discounts_incl_tax|currency:order.currency }}
-                </td>
-            </tr>
-            {% for discount in order.shipping_discounts %}
-                <tr>
-                    <td colspan="4">
-                        <span class="badge badge-success">{% trans "Discount" %}</span>
-                        {{ discount.offer_name }}
-                    </td>
-                    <td colspan="2">- {{ discount.amount|currency:order.currency }}</td>
-                </tr>
+                {% endwith %}
             {% endfor %}
-            <tr>
-                <th colspan="4">{% trans "Shipping total (inc. discounts)" %}</th>
-                <td colspan="2">
-                    {{ order.shipping_incl_tax|currency:order.currency }}
-                </td>
-            </tr>
-        {% else %}
-            <tr>
-                <th colspan="4">{% trans "Shipping total" %}</th>
-                <td colspan="2">
-                    {{ order.shipping_incl_tax|currency:order.currency }}
-                </td>
-            </tr>
-        {% endif %}
-    {% endblock %}
-    {% block order_total %}
+            {% with discounts=order.basket_discounts %}
+                {% block discount_totals %}
+                    {% if discounts %}
+                        <tr>
+                            <td colspan="4">{% trans "Basket total (excl. discounts)" %}</td>
+                            <td colspan="2">
+                                {{ order.basket_total_before_discounts_incl_tax|currency:order.currency }}
+                            </td>
+                        </tr>
+                        {% for discount in discounts %}
+                            <tr>
+                                <td colspan="4">
+                                    <span class="badge badge-success">{% trans "Discount" %}</span>
+                                    {{ discount.offer_name }}
+                                </td>
+                                <td colspan="2">- {{ discount.amount|currency:order.currency }}</td>
+                            </tr>
+                        {% endfor %}
+                    {% endif %}
+                {% endblock discount_totals %}
+                {% block basket_total %}
+                    {% if discounts %}
+                        <tr>
+                            <th colspan="4">{% trans "Basket total (inc. discounts)" %}</th>
+                            <td colspan="2">
+                                {{ order.basket_total_incl_tax|currency:order.currency }}
+                            </td>
+                        </tr>
+                    {% else %}
+                        <tr>
+                            <th colspan="4">{% trans "Basket total" %}</th>
+                            <td colspan="2">
+                                {{ order.basket_total_incl_tax|currency:order.currency }}
+                            </td>
+                        </tr>
+                    {% endif %}
+                {% endblock basket_total %}
+            {% endwith %}
+            {% block shipping_totals %}
+                {% if order.has_shipping_discounts %}
+                    <tr>
+                        <td colspan="4">{% trans "Shipping total (excl. discounts)" %}</td>
+                        <td colspan="2">
+                            {{ order.shipping_before_discounts_incl_tax|currency:order.currency }}
+                        </td>
+                    </tr>
+                    {% for discount in order.shipping_discounts %}
+                        <tr>
+                            <td colspan="4">
+                                <span class="badge badge-success">{% trans "Discount" %}</span>
+                                {{ discount.offer_name }}
+                            </td>
+                            <td colspan="2">- {{ discount.amount|currency:order.currency }}</td>
+                        </tr>
+                    {% endfor %}
+                    <tr>
+                        <th colspan="4">{% trans "Shipping total (inc. discounts)" %}</th>
+                        <td colspan="2">
+                            {{ order.shipping_incl_tax|currency:order.currency }}
+                        </td>
+                    </tr>
+                {% else %}
+                    <tr>
+                        <th colspan="4">{% trans "Shipping total" %}</th>
+                        <td colspan="2">
+                            {{ order.shipping_incl_tax|currency:order.currency }}
+                        </td>
+                    </tr>
+                {% endif %}
+            {% endblock %}
+            {% block order_total %}
+                <tr>
+                    <th colspan="4">
+                        {% trans 'Order total' %}
+                    </th>
+                    <td colspan="2">
+                        {{ order.total_incl_tax|currency:order.currency }}
+                    </td>
+                </tr>
+            {% endblock order_total %}
+        </tbody>
+    </table>
+    {% block order_actions %}
+        <form id="order_form_{{ order.id }}"
+              action="{% url 'customer:order' order_number=order.number %}"
+              method="post">
+            {% csrf_token %}
+            <input type="hidden" name="order_id" value="{{ order.id }}" />
+            <input type="hidden" name="action" value="reorder" />
+            <button type="submit"
+                    class="btn btn-success"
+                    data-loading-text="{% trans 'Re-ordering...' context 'Buy again' %}">
+                {% trans 'Re-order all items' context 'Buy again' %}
+            </button>
+        </form>
+    {% endblock order_actions %}
+    <hr>
+    <h2>{% trans 'Shipping Method' %}</h2>
+    <p>
+        {{ order.shipping_method }}
+    </p>
+    <hr>
+    <h2>
+        {% trans 'Shipping Address' %}
+    </h2>
+    <table class="table table-striped table-bordered">
         <tr>
-            <th colspan="4">
-                {% trans 'Order total' %}
+            <th>
+                {% trans 'Address' %}
             </th>
-            <td colspan="2">
-                {{ order.total_incl_tax|currency:order.currency }}
+            <th>
+                {% trans 'Contact Number' %}
+            </th>
+            <th>
+                {% trans 'Shipping Notes' %}
+            </th>
+        </tr>
+        <tr>
+            <td>
+                {% for field in order.shipping_address.active_address_fields %}
+                    {{ field }}
+                    <br/>
+                {% endfor %}
+            </td>
+            <td>
+                {{ order.shipping_address.phone_number|default:"-" }}
+            </td>
+            <td>
+                {{ order.shipping_address.notes|linebreaks }}
             </td>
         </tr>
-    {% endblock order_total %}
-</tbody>
-</table>
-{% block order_actions %}
-<form id="order_form_{{ order.id }}" action="{% url 'customer:order' order_number=order.number %}" method="post">
-    {% csrf_token %}
-    <input type="hidden" name="order_id" value="{{ order.id }}" />
-    <input type="hidden" name="action" value="reorder" />
-    <button type="submit" class="btn btn-success" data-loading-text="{% trans 'Re-ordering...' context 'Buy again' %}">
-        {% trans 'Re-order all items' context 'Buy again' %}
-    </button>
-</form>
-{% endblock order_actions %}
-<hr>
-<h2>{% trans 'Shipping Method' %}</h2>
-<p>
-{{ order.shipping_method }}
-</p>
-<hr>
-<h2>
-{% trans 'Shipping Address' %}
-</h2>
-<table class="table table-striped table-bordered">
-<tr>
-    <th>
-        {% trans 'Address' %}
-    </th>
-    <th>
-        {% trans 'Contact Number' %}
-    </th>
-    <th>
-        {% trans 'Shipping Notes' %}
-    </th>
-</tr>
-<tr>
-    <td>
-        {% for field in order.shipping_address.active_address_fields %}
-            {{ field }}
-            <br/>
-        {% endfor %}
-    </td>
-    <td>
-        {{ order.shipping_address.phone_number|default:"-" }}
-    </td>
-    <td>
-        {{ order.shipping_address.notes|linebreaks }}
-    </td>
-</tr>
-</table>
+    </table>
 {% endblock tabcontent %}
diff --git a/tests/django_oscar/oscar/customer/partials/standard_tabs.html b/tests/django_oscar/oscar/customer/partials/standard_tabs.html
index fac91f5..20ef1f3 100644
--- a/tests/django_oscar/oscar/customer/partials/standard_tabs.html
+++ b/tests/django_oscar/oscar/customer/partials/standard_tabs.html
@@ -2,39 +2,40 @@
 {% load display_tags %}
 <li class="nav-item">
     <a href="{% url 'customer:profile-view' %}" class="nav-link{% if active_tab == 'profile' %}active{% endif %}">
-    {% trans "Profile" %}
-</a>
+        {% trans "Profile" %}
+    </a>
 </li>
 <li class="nav-item">
-<a href="{% url 'customer:order-list' %}" class="nav-link{% if active_tab == 'orders' %}active{% endif %}">
-{% trans "Order History" %}
-</a>
+    <a href="{% url 'customer:order-list' %}" class="nav-link{% if active_tab == 'orders' %}active{% endif %}">
+        {% trans "Order History" %}
+    </a>
 </li>
 <li class="nav-item">
-<a href="{% url 'customer:address-list' %}" class="nav-link{% if active_tab == 'addresses' %}active{% endif %}">
-{% trans "Address Book" %}
-</a>
+    <a href="{% url 'customer:address-list' %}" class="nav-link{% if active_tab == 'addresses' %}active{% endif %}">
+        {% trans "Address Book" %}
+    </a>
 </li>
 <li class="nav-item">
-<a href="{% url 'customer:email-list' %}" class="nav-link{% if active_tab == 'emails' %}active{% endif %}">
-{% trans "Email History" %}
-</a>
+    <a href="{% url 'customer:email-list' %}" class="nav-link{% if active_tab == 'emails' %}active{% endif %}">
+        {% trans "Email History" %}
+    </a>
 </li>
 <li class="nav-item">
-<a href="{% url 'customer:alerts-list' %}" class="nav-link{% if active_tab == 'alerts' %}active{% endif %}">
-{% trans "Product Alerts" %}
-</a>
+    <a href="{% url 'customer:alerts-list' %}" class="nav-link{% if active_tab == 'alerts' %}active{% endif %}">
+        {% trans "Product Alerts" %}
+    </a>
 </li>
 <li class="nav-item">
-<a href="{% url 'customer:notifications-inbox' %}"
-   class="nav-link{% if active_tab == 'notifications' %}active{% endif %}">
-{% trans "Notifications" %}
-</a>
+    <a href="{% url 'customer:notifications-inbox' %}"
+       class="nav-link{% if active_tab == 'notifications' %}active{% endif %}">
+        {% trans "Notifications" %}
+    </a>
 </li>
 {% iffeature 'wishlists' %}
-<li class="nav-item">
-<a href="{% url 'customer:wishlists-list' %}" class="nav-link{% if active_tab == 'wishlists' %}active{% endif %}">
-{% trans "Wish Lists" %}
-</a>
-</li>
+    <li class="nav-item">
+        <a href="{% url 'customer:wishlists-list' %}"
+           class="nav-link{% if active_tab == 'wishlists' %}active{% endif %}">
+            {% trans "Wish Lists" %}
+        </a>
+    </li>
 {% endiffeature %}
diff --git a/tests/django_oscar/oscar/customer/profile/change_password_form.html b/tests/django_oscar/oscar/customer/profile/change_password_form.html
index fd01b95..c409b48 100644
--- a/tests/django_oscar/oscar/customer/profile/change_password_form.html
+++ b/tests/django_oscar/oscar/customer/profile/change_password_form.html
@@ -1,4 +1,5 @@
 {% extends "oscar/customer/baseaccountpage.html" %}
 {% load i18n %}
 {% block tabcontent %}
-    {% include 'oscar/partials/form.html' with form_id="change_password_form" %}{% endblock tabcontent %}
+    {% include 'oscar/partials/form.html' with form_id="change_password_form" %}
+{% endblock tabcontent %}
diff --git a/tests/django_oscar/oscar/customer/profile/profile_form.html b/tests/django_oscar/oscar/customer/profile/profile_form.html
index a406b2f..62904bf 100644
--- a/tests/django_oscar/oscar/customer/profile/profile_form.html
+++ b/tests/django_oscar/oscar/customer/profile/profile_form.html
@@ -1,4 +1,5 @@
 {% extends "oscar/customer/baseaccountpage.html" %}
 {% load i18n %}
 {% block tabcontent %}
-    {% include 'oscar/partials/form.html' with form_id="profile_form" %}{% endblock tabcontent %}
+    {% include 'oscar/partials/form.html' with form_id="profile_form" %}
+{% endblock tabcontent %}
diff --git a/tests/django_oscar/oscar/customer/wishlists/wishlists_detail.html b/tests/django_oscar/oscar/customer/wishlists/wishlists_detail.html
index 1dc8e97..3c5b2a7 100644
--- a/tests/django_oscar/oscar/customer/wishlists/wishlists_detail.html
+++ b/tests/django_oscar/oscar/customer/wishlists/wishlists_detail.html
@@ -38,94 +38,99 @@
                     </tr>
                     {% for subform in form %}
                         {% with line=subform.instance product=subform.instance.product %}
-                        <tr>
-                            <td>
-                                {% if product %}
-                                    {% with image=product.primary_image %}
-                                    {% oscar_thumbnail image.original "100x100" upscale=False as thumb %}
-                                    {% if product.is_public %}
-                                        <a href="{{ product.get_absolute_url }}">
-                                            <img class="img-thumbnail"
-                                                 src="{{ thumb.url }}"
-                                                 alt="{{ product.get_title }}"/>
+                            <tr>
+                                <td>
+                                    {% if product %}
+                                        {% with image=product.primary_image %}
+                                            {% oscar_thumbnail image.original "100x100" upscale=False as thumb %}
+                                            {% if product.is_public %}
+                                                <a href="{{ product.get_absolute_url }}">
+                                                    <img class="img-thumbnail"
+                                                         src="{{ thumb.url }}"
+                                                         alt="{{ product.get_title }}"/>
+                                                </a>
+                                            {% else %}
+                                                <img class="img-thumbnail"
+                                                     src="{{ thumb.url }}"
+                                                     alt="{{ product.get_title }}"/>
+                                            {% endif %}
+                                        {% endwith %}
+                                    {% endif %}
+                                </td>
+                                <td>
+                                    {% if product and product.is_public %}
+                                        <a href="{{ line.product.get_absolute_url }}">
+                                            {{ line.get_title }}
                                         </a>
                                     {% else %}
-                                        <img class="img-thumbnail"
-                                             src="{{ thumb.url }}"
-                                             alt="{{ product.get_title }}"/>
+                                        <em>{{ line.get_title }} ({% trans 'Not available anymore' %})</em>
                                     {% endif %}
-                                {% endwith %}
-                            {% endif %}
-                        </td>
-                        <td>
-                            {% if product and product.is_public %}
-                                <a href="{{ line.product.get_absolute_url }}">
-                                    {{ line.get_title }}
-                                </a>
-                            {% else %}
-                                <em>{{ line.get_title }} ({% trans 'Not available anymore' %})</em>
-                            {% endif %}
-                        </td>
-                        <td>
-                            {% for field in subform %}
-                                {% render_field field class+="form-control" %}
-                                {% for error in field.errors %}
-                                    <ul class="error-block">
-                                        <li>
-                                            {{ error }}
-                                        </li>
-                                    </ul>
-                                {% endfor %}
-                            {% endfor %}
-                        </td>
-                        <td>
-                            <div class="btn-group">
-                                {% if product %}
-                                    <a class="btn btn-secondary" href="{{ line.product.get_absolute_url }}">
-                                        {% trans 'View product' %}
-                                    </a>
-                                    <button class="btn btn-secondary dropdown-toggle" data-toggle="dropdown"></button>
-                                {% else %}
-                                    <a class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" href="#">
-                                        {% trans 'Actions' %}
-                                    </a>
-                                {% endif %}
-                                <ul class="dropdown-menu dropdown-menu-right">
-                                    <li>
-                                        <a href="{% url 'customer:wishlists-remove-product' key=wishlist.key line_pk=line.pk %}"
-                                           class="dropdown-item">
-                                            {% trans 'Remove' %}
-                                        </a>
-                                    </li>
-                                    {% for other_wishlist in other_wishlists %}
-                                        <li>
-                                            <a href="{% url 'customer:wishlists-move-product-to-another' key=wishlist.key line_pk=line.pk to_key=other_wishlist.key %}"
-                                               class="dropdown-item">
-                                                {% blocktrans with name=other_wishlist.name %}
-                                                    Move to '{{ name }}' wish list
-                                                {% endblocktrans %}
-                                            </a>
-                                        </li>
+                                </td>
+                                <td>
+                                    {% for field in subform %}
+                                        {% render_field field class+="form-control" %}
+                                        {% for error in field.errors %}
+                                            <ul class="error-block">
+                                                <li>
+                                                    {{ error }}
+                                                </li>
+                                            </ul>
+                                        {% endfor %}
                                     {% endfor %}
-                                </ul>
-                            </div>
+                                </td>
+                                <td>
+                                    <div class="btn-group">
+                                        {% if product %}
+                                            <a class="btn btn-secondary" href="{{ line.product.get_absolute_url }}">
+                                                {% trans 'View product' %}
+                                            </a>
+                                            <button class="btn btn-secondary dropdown-toggle"
+                                                    data-toggle="dropdown"></button>
+                                        {% else %}
+                                            <a class="btn btn-secondary dropdown-toggle"
+                                               data-toggle="dropdown"
+                                               href="#">
+                                                {% trans 'Actions' %}
+                                            </a>
+                                        {% endif %}
+                                        <ul class="dropdown-menu dropdown-menu-right">
+                                            <li>
+                                                <a href="{% url 'customer:wishlists-remove-product' key=wishlist.key line_pk=line.pk %}"
+                                                   class="dropdown-item">
+                                                    {% trans 'Remove' %}
+                                                </a>
+                                            </li>
+                                            {% for other_wishlist in other_wishlists %}
+                                                <li>
+                                                    <a href="{% url 'customer:wishlists-move-product-to-another' key=wishlist.key line_pk=line.pk to_key=other_wishlist.key %}"
+                                                       class="dropdown-item">
+                                                        {% blocktrans with name=other_wishlist.name %}
+                                                            Move to '{{ name }}' wish list
+                                                        {% endblocktrans %}
+                                                    </a>
+                                                </li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </td>
+                            </tr>
+                        {% endwith %}
+                    {% endfor %}
+                    <tr>
+                        <td colspan="2"></td>
+                        <td>
+                            <button class="btn btn-primary"
+                                    type="submit"
+                                    data-loading-text="{% trans 'Updating...' %}">
+                                {% trans "Update quantities" %}
+                            </button>
                         </td>
+                        <td></td>
                     </tr>
-                {% endwith %}
-            {% endfor %}
-            <tr>
-                <td colspan="2"></td>
-                <td>
-                    <button class="btn btn-primary" type="submit" data-loading-text="{% trans 'Updating...' %}">
-                        {% trans "Update quantities" %}
-                    </button>
-                </td>
-                <td></td>
-            </tr>
-        </tbody>
-    </table>
-</form>
-{% else %}
-{% trans "Your wish list is empty." %}
-{% endif %}
+                </tbody>
+            </table>
+        </form>
+    {% else %}
+        {% trans "Your wish list is empty." %}
+    {% endif %}
 {% endblock tabcontent %}
diff --git a/tests/django_oscar/oscar/dashboard/catalogue/attribute_option_group_form.html b/tests/django_oscar/oscar/dashboard/catalogue/attribute_option_group_form.html
index 470190a..cb04a1a 100644
--- a/tests/django_oscar/oscar/dashboard/catalogue/attribute_option_group_form.html
+++ b/tests/django_oscar/oscar/dashboard/catalogue/attribute_option_group_form.html
@@ -95,74 +95,75 @@
                                     {% endfor %}
                                 {% endif %}
                                 {% for field in form %}
-                                    {% include 'oscar/dashboard/partials/form_field.html' with field=field %}{% endfor %}
-                                </div>
+                                    {% include 'oscar/dashboard/partials/form_field.html' with field=field %}
+                                {% endfor %}
                             </div>
-                        {% endblock %}
-                        {% block attribute_options %}
-                            <div class="tab-pane" id="attribute_options">
-                                <div class="table-header">
-                                    <h3>{% trans "Attribute Options" %}</h3>
-                                </div>
-                                <div class="attribute-options">
-                                    <table class="table table-striped table-bordered">
-                                        {{ attribute_option_formset.management_form }}
-                                        {{ attribute_option_formset.non_form_errors }}
-                                        <col width="50%">
-                                        <col width="50%">
-                                        <thead>
+                        </div>
+                    {% endblock %}
+                    {% block attribute_options %}
+                        <div class="tab-pane" id="attribute_options">
+                            <div class="table-header">
+                                <h3>{% trans "Attribute Options" %}</h3>
+                            </div>
+                            <div class="attribute-options">
+                                <table class="table table-striped table-bordered">
+                                    {{ attribute_option_formset.management_form }}
+                                    {{ attribute_option_formset.non_form_errors }}
+                                    <col width="50%">
+                                    <col width="50%">
+                                    <thead>
+                                        <tr>
+                                            <th>{% trans "Option" %}</th>
+                                            <th>{% trans "Delete?" %}</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        {% for attribute_option_form in attribute_option_formset %}
                                             <tr>
-                                                <th>{% trans "Option" %}</th>
-                                                <th>{% trans "Delete?" %}</th>
+                                                {% for hidden_field in attribute_option_form.hidden_fields %}
+                                                    {{ hidden_field }}
+                                                {% endfor %}
+                                                <td>
+                                                    {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_option_form.option nolabel=True %}
+                                                </td>
+                                                <td>
+                                                    {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_option_form.DELETE nolabel=True %}
+                                                </td>
                                             </tr>
-                                        </thead>
-                                        <tbody>
-                                            {% for attribute_option_form in attribute_option_formset %}
-                                                <tr>
-                                                    {% for hidden_field in attribute_option_form.hidden_fields %}
-                                                        {{ hidden_field }}
-                                                    {% endfor %}
-                                                    <td>
-                                                        {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_option_form.option nolabel=True %}
-                                                    </td>
-                                                    <td>
-                                                        {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_option_form.DELETE nolabel=True %}
-                                                    </td>
-                                                </tr>
-                                            {% endfor %}
-                                        </tbody>
-                                    </table>
-                                </div>
+                                        {% endfor %}
+                                    </tbody>
+                                </table>
                             </div>
-                        {% endblock %}
-                    {% endblock tab_content %}
+                        </div>
+                    {% endblock %}
+                {% endblock tab_content %}
+            </div>
+        </div>
+    </div>
+    {% block fixed_actions_group %}
+        <div class="fixed-actions-group">
+            <div class="form-actions">
+                <div class="float-right">
+                    <a href="#"
+                        {% if not is_popup %}
+                            onclick="window.history.go(-1);return false"
+                        {% else %}
+                            onclick="window.close();return false;"
+                        {% endif %}
+                        >
+                        {% trans "Cancel" %}
+                    </a>
+                    {% trans "or" %}
+                    <button class="btn btn-primary" type="submit">
+                        {% trans "Save" %}
+                    </button>
                 </div>
             </div>
         </div>
-        {% block fixed_actions_group %}
-            <div class="fixed-actions-group">
-                <div class="form-actions">
-                    <div class="float-right">
-                        <a href="#"
-                            {% if not is_popup %}
-                                onclick="window.history.go(-1);return false"
-                            {% else %}
-                                onclick="window.close();return false;"
-                            {% endif %}
-                            >
-                            {% trans "Cancel" %}
-                        </a>
-                        {% trans "or" %}
-                        <button class="btn btn-primary" type="submit">
-                            {% trans "Save" %}
-                        </button>
-                    </div>
-                </div>
-            </div>
-        {% endblock fixed_actions_group %}
-    </form>
+    {% endblock fixed_actions_group %}
+</form>
 {% endblock dashboard_content %}
 {% block onbodyload %}
-    {{ block.super }}
-    oscar.dashboard.product_attributes.init();
+{{ block.super }}
+oscar.dashboard.product_attributes.init();
 {% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/catalogue/category_delete.html b/tests/django_oscar/oscar/dashboard/catalogue/category_delete.html
index 08669ba..5e7d3f9 100644
--- a/tests/django_oscar/oscar/dashboard/catalogue/category_delete.html
+++ b/tests/django_oscar/oscar/dashboard/catalogue/category_delete.html
@@ -11,40 +11,40 @@
             </li>
             <li class="breadcrumb-item">
                 <a href="{% if parent %}{% url 'dashboard:catalogue-category-detail-list' pk=parent.pk %}{% else %}{% url 'dashboard:catalogue-category-list' %}{% endif %}">
-                {% trans "Categories" %}
-            </a>
-        </li>
-        <li class="breadcrumb-item active" aria-current="page">
-            {% trans "Delete category?" %}
-        </li>
-    </ol>
-</nav>
+                    {% trans "Categories" %}
+                </a>
+            </li>
+            <li class="breadcrumb-item active" aria-current="page">
+                {% trans "Delete category?" %}
+            </li>
+        </ol>
+    </nav>
 {% endblock %}
 {% block headertext %}
-{% trans "Delete category?" %}
+    {% trans "Delete category?" %}
 {% endblock %}
 {% block dashboard_content %}
-<div class="table-header">
-    <h2>{% trans "Delete category" %}</h2>
-</div>
-<form method="post" class="card card-body bg-light">
-    {% csrf_token %}
-    {{ form }}
-    {% blocktrans with name=object.name %}
-        <p>
-            Delete category
-            <strong>{{ name }}</strong>
-            - are you sure?
-        </p>
-    {% endblocktrans %}
-    <div class="form-actions">
-        <button type="submit" class="btn btn-danger" data-loading-text="{% trans 'Deleting...' %}">
-            {% trans "Delete" %}
-        </button>
-        {% trans "or" %}
-        <a href="{% if parent %}{% url 'dashboard:catalogue-category-detail-list' pk=parent.pk %}{% else %}{% url 'dashboard:catalogue-category-list' %}{% endif %}">
-        {% trans "cancel" %}
-    </a>
-</div>
-</form>
+    <div class="table-header">
+        <h2>{% trans "Delete category" %}</h2>
+    </div>
+    <form method="post" class="card card-body bg-light">
+        {% csrf_token %}
+        {{ form }}
+        {% blocktrans with name=object.name %}
+            <p>
+                Delete category
+                <strong>{{ name }}</strong>
+                - are you sure?
+            </p>
+        {% endblocktrans %}
+        <div class="form-actions">
+            <button type="submit" class="btn btn-danger" data-loading-text="{% trans 'Deleting...' %}">
+                {% trans "Delete" %}
+            </button>
+            {% trans "or" %}
+            <a href="{% if parent %}{% url 'dashboard:catalogue-category-detail-list' pk=parent.pk %}{% else %}{% url 'dashboard:catalogue-category-list' %}{% endif %}">
+                {% trans "cancel" %}
+            </a>
+        </div>
+    </form>
 {% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/catalogue/category_form.html b/tests/django_oscar/oscar/dashboard/catalogue/category_form.html
index bf410ba..5441705 100644
--- a/tests/django_oscar/oscar/dashboard/catalogue/category_form.html
+++ b/tests/django_oscar/oscar/dashboard/catalogue/category_form.html
@@ -32,46 +32,47 @@
           enctype="multipart/form-data"
           data-behaviour="tab-nav-errors"
           autocomplete="off">
-    {% csrf_token %}
-    <div class="row">
-        {% block tab_nav %}
-            <div class="col-md-3">
-                <div class="tab-nav sticky-top">
-                    <div class="table-header">
-                        <h3>{% trans "Sections" %}</h3>
+        {% csrf_token %}
+        <div class="row">
+            {% block tab_nav %}
+                <div class="col-md-3">
+                    <div class="tab-nav sticky-top">
+                        <div class="table-header">
+                            <h3>{% trans "Sections" %}</h3>
+                        </div>
+                        <ul class="nav flex-column bs-docs-sidenav" id="category_update_tabs">
+                            {% block tabs %}
+                                <li class="nav-item">
+                                    <a class="nav-link active" href="#category_details" data-toggle="tab">
+                                        {% trans 'Category details' %}
+                                    </a>
+                                </li>
+                                <li class="nav-item">
+                                    <a class="nav-link" href="#seo" data-toggle="tab">
+                                        {% trans 'Search engine optimisation' %}
+                                    </a>
+                                </li>
+                            {% endblock tabs %}
+                        </ul>
                     </div>
-                    <ul class="nav flex-column bs-docs-sidenav" id="category_update_tabs">
-                        {% block tabs %}
-                            <li class="nav-item">
-                                <a class="nav-link active" href="#category_details" data-toggle="tab">
-                                    {% trans 'Category details' %}
-                                </a>
-                            </li>
-                            <li class="nav-item">
-                                <a class="nav-link" href="#seo" data-toggle="tab">
-                                    {% trans 'Search engine optimisation' %}
-                                </a>
-                            </li>
-                        {% endblock tabs %}
-                    </ul>
                 </div>
-            </div>
-        {% endblock tab_nav %}
-        <div class="col-md-9">
-            <div class="tab-content">
-                {% block tab_content %}
-                    {% block category_details %}
-                        <div class="tab-pane active" id="category_details">
-                            <div class="table-header">
-                                <h3>{% trans "Category details" %}</h3>
-                            </div>
-                            <div class="card card-body category-details">
-                                {% block category_details_content %}
-                                    <span class="error-block">{{ form.non_field_errors }}</span>
-                                    {% for field in form.hidden_fields %}{{ field }}{% endfor %}
-                                    {% for field in form.primary_form_fields %}
-                                        {% if 'attr' not in field.id_for_label %}
-                                            {% include 'oscar/dashboard/partials/form_field.html' with field=field %}{% endif %}
+            {% endblock tab_nav %}
+            <div class="col-md-9">
+                <div class="tab-content">
+                    {% block tab_content %}
+                        {% block category_details %}
+                            <div class="tab-pane active" id="category_details">
+                                <div class="table-header">
+                                    <h3>{% trans "Category details" %}</h3>
+                                </div>
+                                <div class="card card-body category-details">
+                                    {% block category_details_content %}
+                                        <span class="error-block">{{ form.non_field_errors }}</span>
+                                        {% for field in form.hidden_fields %}{{ field }}{% endfor %}
+                                        {% for field in form.primary_form_fields %}
+                                            {% if 'attr' not in field.id_for_label %}
+                                                {% include 'oscar/dashboard/partials/form_field.html' with field=field %}
+                                            {% endif %}
                                         {% endfor %}
                                     {% endblock category_details_content %}
                                 </div>
@@ -86,46 +87,47 @@
                                     {% block seo_content %}
                                         {% for field in form.seo_form_fields %}
                                             {% if 'attr' not in field.id_for_label %}
-                                                {% include 'oscar/dashboard/partials/form_field.html' with field=field %}{% endif %}
-                                            {% endfor %}
-                                        {% endblock seo_content %}
-                                    </div>
+                                                {% include 'oscar/dashboard/partials/form_field.html' with field=field %}
+                                            {% endif %}
+                                        {% endfor %}
+                                    {% endblock seo_content %}
                                 </div>
-                            {% endblock seo %}
-                        {% endblock tab_content %}
-                    </div>
+                            </div>
+                        {% endblock seo %}
+                    {% endblock tab_content %}
                 </div>
             </div>
-            {% block fixed_actions_group %}
-                <div class="fixed-actions-group">
-                    <div class="form-group">
-                        <div class="float-right">
-                            <a href="{% url 'dashboard:catalogue-category-list' %}">
-                                {% trans "Cancel" %}
-                            </a>
-                            {% trans "or" %}
-                            <button class="btn btn-secondary"
-                                    name="action"
-                                    type="submit"
-                                    value="continue"
-                                    data-loading-text="{% trans 'Saving...' %}">
-                                {% trans "Save and continue editing" %}
-                            </button>
-                            <button class="btn btn-primary"
-                                    name="action"
-                                    type="submit"
-                                    value="save"
-                                    data-loading-text="{% trans 'Saving...' %}">
-                                {% trans "Save" %}
-                            </button>
-                        </div>
-                        {% if category %}
-                            <a class="btn btn-success" href="{{ category.get_absolute_url }}">
-                                {% trans "View on site" %}
-                            </a>
-                        {% endif %}
+        </div>
+        {% block fixed_actions_group %}
+            <div class="fixed-actions-group">
+                <div class="form-group">
+                    <div class="float-right">
+                        <a href="{% url 'dashboard:catalogue-category-list' %}">
+                            {% trans "Cancel" %}
+                        </a>
+                        {% trans "or" %}
+                        <button class="btn btn-secondary"
+                                name="action"
+                                type="submit"
+                                value="continue"
+                                data-loading-text="{% trans 'Saving...' %}">
+                            {% trans "Save and continue editing" %}
+                        </button>
+                        <button class="btn btn-primary"
+                                name="action"
+                                type="submit"
+                                value="save"
+                                data-loading-text="{% trans 'Saving...' %}">
+                            {% trans "Save" %}
+                        </button>
                     </div>
+                    {% if category %}
+                        <a class="btn btn-success" href="{{ category.get_absolute_url }}">
+                            {% trans "View on site" %}
+                        </a>
+                    {% endif %}
                 </div>
-            {% endblock fixed_actions_group %}
-        </form>
-    {% endblock dashboard_content %}
+            </div>
+        {% endblock fixed_actions_group %}
+    </form>
+{% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/catalogue/category_row_actions.html b/tests/django_oscar/oscar/dashboard/catalogue/category_row_actions.html
index 2d4992b..df0a795 100644
--- a/tests/django_oscar/oscar/dashboard/catalogue/category_row_actions.html
+++ b/tests/django_oscar/oscar/dashboard/catalogue/category_row_actions.html
@@ -19,14 +19,14 @@
             </a>
             <a class="dropdown-item {% if not record.has_children %}disabled{% endif %}"
                href="{% if not record.has_children %}#{% else %}{% url 'dashboard:catalogue-category-detail-list' pk=record.pk %}{% endif %}">
-            {% trans "Edit children" %}
-        </a>
-        <a class="dropdown-item" href="{{ record.get_absolute_url }}">
-            {% trans "View on site" %}
-        </a>
-        <a class="dropdown-item" href="{% url 'dashboard:catalogue-category-delete' pk=record.id %}">
-            {% trans "Delete" %}
-        </a>
+                {% trans "Edit children" %}
+            </a>
+            <a class="dropdown-item" href="{{ record.get_absolute_url }}">
+                {% trans "View on site" %}
+            </a>
+            <a class="dropdown-item" href="{% url 'dashboard:catalogue-category-delete' pk=record.id %}">
+                {% trans "Delete" %}
+            </a>
+        </div>
     </div>
 </div>
-</div>
diff --git a/tests/django_oscar/oscar/dashboard/catalogue/messages/product_saved.html b/tests/django_oscar/oscar/dashboard/catalogue/messages/product_saved.html
index 6568115..58be09d 100644
--- a/tests/django_oscar/oscar/dashboard/catalogue/messages/product_saved.html
+++ b/tests/django_oscar/oscar/dashboard/catalogue/messages/product_saved.html
@@ -2,46 +2,46 @@
 {% load django_tables2 %}
 <p>
     {% with name=product.title parent_name=product.parent.title %}
-    {% if product.is_child %}
-        {% if creating %}
-            {% if product.title %}
+        {% if product.is_child %}
+            {% if creating %}
+                {% if product.title %}
+                    {% blocktrans %}
+                        Created product variant '{{ name }}'.
+                    {% endblocktrans %}
+                {% else %}
+                    {% blocktrans %}
+                        Created variant of '{{ parent_name }}'.
+                    {% endblocktrans %}
+                {% endif %}
+            {% else %}
+                {% if product.title %}
+                    {% blocktrans %}
+                        Updated product variant '{{ name }}'.
+                    {% endblocktrans %}
+                {% else %}
+                    {% blocktrans %}
+                        Updated a variant of '{{ parent_name }}'.
+                    {% endblocktrans %}
+                {% endif %}
+            {% endif %}
+        {% else %}
+            {% if creating %}
                 {% blocktrans %}
-                    Created product variant '{{ name }}'.
+                    Created product '{{ name }}'.
                 {% endblocktrans %}
             {% else %}
                 {% blocktrans %}
-                    Created variant of '{{ parent_name }}'.
-                {% endblocktrans %}
-            {% endif %}
-        {% else %}
-            {% if product.title %}
-                {% blocktrans %}
-                    Updated product variant '{{ name }}'.
-                {% endblocktrans %}
-            {% else %}
-                {% blocktrans %}
-                    Updated a variant of '{{ parent_name }}'.
+                    Updated product '{{ name }}'.
                 {% endblocktrans %}
             {% endif %}
         {% endif %}
-    {% else %}
-        {% if creating %}
-            {% blocktrans %}
-                Created product '{{ name }}'.
-            {% endblocktrans %}
-        {% else %}
-            {% blocktrans %}
-                Updated product '{{ name }}'.
-            {% endblocktrans %}
-        {% endif %}
-    {% endif %}
-{% endwith %}
+    {% endwith %}
 </p>
 <p>
-<a href="{% url 'dashboard:catalogue-product' pk=product.pk %}{% querystring %}" class="btn btn-success">
-    {% trans "Edit again" %}
-</a>
-<a href="{{ product.get_absolute_url }}" class="btn btn-success">
-    {% trans "View it on the site" %}
-</a>
+    <a href="{% url 'dashboard:catalogue-product' pk=product.pk %}{% querystring %}" class="btn btn-success">
+        {% trans "Edit again" %}
+    </a>
+    <a href="{{ product.get_absolute_url }}" class="btn btn-success">
+        {% trans "View it on the site" %}
+    </a>
 </p>
diff --git a/tests/django_oscar/oscar/dashboard/catalogue/option_form.html b/tests/django_oscar/oscar/dashboard/catalogue/option_form.html
index bc59103..2b8951d 100644
--- a/tests/django_oscar/oscar/dashboard/catalogue/option_form.html
+++ b/tests/django_oscar/oscar/dashboard/catalogue/option_form.html
@@ -67,33 +67,34 @@
                                 {% endfor %}
                             {% endif %}
                             {% for field in form %}
-                                {% include 'oscar/dashboard/partials/form_field.html' with field=field %}{% endfor %}
-                            </div>
+                                {% include 'oscar/dashboard/partials/form_field.html' with field=field %}
+                            {% endfor %}
                         </div>
-                    {% endblock %}
+                    </div>
+                {% endblock %}
+            </div>
+        </div>
+    </div>
+    {% block fixed_actions_group %}
+        <div class="fixed-actions-group">
+            <div class="form-actions">
+                <div class="float-right">
+                    <a href="#"
+                        {% if not is_popup %}
+                            onclick="window.history.go(-1);return false"
+                        {% else %}
+                            onclick="window.close();return false;"
+                        {% endif %}
+                        >
+                        {% trans "Cancel" %}
+                    </a>
+                    {% trans "or" %}
+                    <button class="btn btn-primary" type="submit">
+                        {% trans "Save" %}
+                    </button>
                 </div>
             </div>
         </div>
-        {% block fixed_actions_group %}
-            <div class="fixed-actions-group">
-                <div class="form-actions">
-                    <div class="float-right">
-                        <a href="#"
-                            {% if not is_popup %}
-                                onclick="window.history.go(-1);return false"
-                            {% else %}
-                                onclick="window.close();return false;"
-                            {% endif %}
-                            >
-                            {% trans "Cancel" %}
-                        </a>
-                        {% trans "or" %}
-                        <button class="btn btn-primary" type="submit">
-                            {% trans "Save" %}
-                        </button>
-                    </div>
-                </div>
-            </div>
-        {% endblock fixed_actions_group %}
-    </form>
+    {% endblock fixed_actions_group %}
+</form>
 {% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/catalogue/product_class_form.html b/tests/django_oscar/oscar/dashboard/catalogue/product_class_form.html
index fcefb8c..0f88192 100644
--- a/tests/django_oscar/oscar/dashboard/catalogue/product_class_form.html
+++ b/tests/django_oscar/oscar/dashboard/catalogue/product_class_form.html
@@ -79,82 +79,83 @@
                                     {% endfor %}
                                 {% endif %}
                                 {% for field in form %}
-                                    {% include 'oscar/dashboard/partials/form_field.html' with field=field %}{% endfor %}
-                                </div>
+                                    {% include 'oscar/dashboard/partials/form_field.html' with field=field %}
+                                {% endfor %}
                             </div>
-                        {% endblock %}
-                        {% block product_attributes %}
-                            <div class="tab-pane" id="product_attributes">
-                                <div class="table-header">
-                                    <h3>{% trans "Product attributes" %}</h3>
-                                </div>
-                                <div class="product-attributes">
-                                    <table class="table table-striped table-bordered">
-                                        {{ attributes_formset.management_form }}
-                                        {{ attributes_formset.non_form_errors }}
-                                        <col width="20%">
-                                        <col width="20%">
-                                        <col width="20%">
-                                        <thead>
+                        </div>
+                    {% endblock %}
+                    {% block product_attributes %}
+                        <div class="tab-pane" id="product_attributes">
+                            <div class="table-header">
+                                <h3>{% trans "Product attributes" %}</h3>
+                            </div>
+                            <div class="product-attributes">
+                                <table class="table table-striped table-bordered">
+                                    {{ attributes_formset.management_form }}
+                                    {{ attributes_formset.non_form_errors }}
+                                    <col width="20%">
+                                    <col width="20%">
+                                    <col width="20%">
+                                    <thead>
+                                        <tr>
+                                            <th>{% trans "Name" %}</th>
+                                            <th>{% trans "Code" %}</th>
+                                            <th>{% trans "Type" %}</th>
+                                            <th>{% trans "Required" %}</th>
+                                            <th>{% trans "Delete?" %}</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        {% for attribute_form in attributes_formset %}
                                             <tr>
-                                                <th>{% trans "Name" %}</th>
-                                                <th>{% trans "Code" %}</th>
-                                                <th>{% trans "Type" %}</th>
-                                                <th>{% trans "Required" %}</th>
-                                                <th>{% trans "Delete?" %}</th>
+                                                {% for hidden_field in attribute_form.hidden_fields %}
+                                                    {{ hidden_field }}
+                                                {% endfor %}
+                                                <td>
+                                                    {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.name nolabel=True %}
+                                                </td>
+                                                <td>
+                                                    {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.code nolabel=True %}
+                                                </td>
+                                                <td>
+                                                    {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.type nolabel=True %}
+                                                    {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.option_group nolabel=True %}
+                                                </td>
+                                                <td>
+                                                    {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.required nolabel=True %}
+                                                </td>
+                                                <td>
+                                                    {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.DELETE nolabel=True %}
+                                                </td>
                                             </tr>
-                                        </thead>
-                                        <tbody>
-                                            {% for attribute_form in attributes_formset %}
-                                                <tr>
-                                                    {% for hidden_field in attribute_form.hidden_fields %}
-                                                        {{ hidden_field }}
-                                                    {% endfor %}
-                                                    <td>
-                                                        {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.name nolabel=True %}
-                                                    </td>
-                                                    <td>
-                                                        {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.code nolabel=True %}
-                                                    </td>
-                                                    <td>
-                                                        {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.type nolabel=True %}
-                                                        {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.option_group nolabel=True %}
-                                                    </td>
-                                                    <td>
-                                                        {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.required nolabel=True %}
-                                                    </td>
-                                                    <td>
-                                                        {% include 'oscar/dashboard/partials/form_field.html' with field=attribute_form.DELETE nolabel=True %}
-                                                    </td>
-                                                </tr>
-                                            {% endfor %}
-                                        </tbody>
-                                    </table>
-                                </div>
+                                        {% endfor %}
+                                    </tbody>
+                                </table>
                             </div>
-                        {% endblock %}
-                    {% endblock tab_content %}
+                        </div>
+                    {% endblock %}
+                {% endblock tab_content %}
+            </div>
+        </div>
+    </div>
+    {% block fixed_actions_group %}
+        <div class="fixed-actions-group">
+            <div class="form-actions">
+                <div class="float-right">
+                    <a href="#" onclick="window.history.go(-1);return false" >
+                        {% trans "Cancel" %}
+                    </a>
+                    {% trans "or" %}
+                    <button class="btn btn-primary" type="submit">
+                        {% trans "Save" %}
+                    </button>
                 </div>
             </div>
         </div>
-        {% block fixed_actions_group %}
-            <div class="fixed-actions-group">
-                <div class="form-actions">
-                    <div class="float-right">
-                        <a href="#" onclick="window.history.go(-1);return false" >
-                            {% trans "Cancel" %}
-                        </a>
-                        {% trans "or" %}
-                        <button class="btn btn-primary" type="submit">
-                            {% trans "Save" %}
-                        </button>
-                    </div>
-                </div>
-            </div>
-        {% endblock fixed_actions_group %}
-    </form>
+    {% endblock fixed_actions_group %}
+</form>
 {% endblock dashboard_content %}
 {% block onbodyload %}
-    {{ block.super }}
-    oscar.dashboard.product_attributes.init();
+{{ block.super }}
+oscar.dashboard.product_attributes.init();
 {% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/catalogue/product_list.html b/tests/django_oscar/oscar/dashboard/catalogue/product_list.html
index bfa9464..19189e3 100644
--- a/tests/django_oscar/oscar/dashboard/catalogue/product_list.html
+++ b/tests/django_oscar/oscar/dashboard/catalogue/product_list.html
@@ -85,18 +85,18 @@
                     </div>
                     <div class="modal-body text-center">
                         <img class="img-fluid mx-auto">
-                        </div>
                     </div>
                 </div>
             </div>
-        {% endblock product_list %}
-    {% else %}
-        <p>
-            {% trans "No products found." %}
-        </p>
-    {% endif %}
+        </div>
+    {% endblock product_list %}
+{% else %}
+    <p>
+        {% trans "No products found." %}
+    </p>
+{% endif %}
 {% endblock dashboard_content %}
 {% block onbodyload %}
-    {{ block.super }}
-    oscar.dashboard.product_lists.init();
+{{ block.super }}
+oscar.dashboard.product_lists.init();
 {% endblock onbodyload %}
diff --git a/tests/django_oscar/oscar/dashboard/catalogue/product_row_image.html b/tests/django_oscar/oscar/dashboard/catalogue/product_row_image.html
index 408afb0..93a8acd 100644
--- a/tests/django_oscar/oscar/dashboard/catalogue/product_row_image.html
+++ b/tests/django_oscar/oscar/dashboard/catalogue/product_row_image.html
@@ -1,14 +1,14 @@
 {% load image_tags %}
 {% if record.primary_image.original.url %}
     {% with image=record.primary_image %}
-    {% oscar_thumbnail image.original "70x70" upscale=False as thumb %}
-    <a href="#" data-original="{{ image.original.url }}" class="sub-image">
-        <img src="{{ thumb.url }}"
-             alt="{% if image.caption %}{{ image.caption }}{% else %}{{ record.get_title }}{% endif %}"
-             height="{{ thumb.height }}"
-             width="{{ thumb.width }}">
-    </a>
-{% endwith %}
+        {% oscar_thumbnail image.original "70x70" upscale=False as thumb %}
+        <a href="#" data-original="{{ image.original.url }}" class="sub-image">
+            <img src="{{ thumb.url }}"
+                 alt="{% if image.caption %}{{ image.caption }}{% else %}{{ record.get_title }}{% endif %}"
+                 height="{{ thumb.height }}"
+                 width="{{ thumb.width }}">
+        </a>
+    {% endwith %}
 {% else %}
-—
+    —
 {% endif %}
diff --git a/tests/django_oscar/oscar/dashboard/catalogue/product_update.html b/tests/django_oscar/oscar/dashboard/catalogue/product_update.html
index 2881bf5..efce9f0 100644
--- a/tests/django_oscar/oscar/dashboard/catalogue/product_update.html
+++ b/tests/django_oscar/oscar/dashboard/catalogue/product_update.html
@@ -39,107 +39,108 @@
           enctype="multipart/form-data"
           data-behaviour="tab-nav-errors"
           autocomplete="off">
-    {% csrf_token %}
-    {% if parent %}
-        <div class="row">
-            <div class="col-md-12">
-                <div class="alert alert-info">
-                    {% url 'dashboard:catalogue-product' pk=parent.id as parent_url %}
-                    {% blocktrans with title=parent.title %}
-                        You are currently editing a product variant of
-                        <a href="{{ parent_url }}">{{ title }}</a>
-                        .
-                    {% endblocktrans %}
+        {% csrf_token %}
+        {% if parent %}
+            <div class="row">
+                <div class="col-md-12">
+                    <div class="alert alert-info">
+                        {% url 'dashboard:catalogue-product' pk=parent.id as parent_url %}
+                        {% blocktrans with title=parent.title %}
+                            You are currently editing a product variant of
+                            <a href="{{ parent_url }}">{{ title }}</a>
+                            .
+                        {% endblocktrans %}
+                    </div>
                 </div>
             </div>
-        </div>
-    {% endif %}
-    <div class="row">
-        {% block tab_nav %}
-            <div class="col-md-3">
-                <div class="tab-nav sticky-top">
-                    <div class="table-header">
-                        <h3>{% trans "Sections" %}</h3>
-                    </div>
-                    <ul class="nav flex-column bs-docs-sidenav" id="product_update_tabs">
-                        {% comment %}
-                        The navigation below is filtered heavily on the product structure.
-                        This intentionally is the only place where filtering is done, as
-                        deployments are likely to want to override certain aspects of what
-                        data is stored on products of a certain structure. This means that
-                        only one template block (instead of all affected) has to be altered.
-                    {% endcomment %}
-                    {% block tabs %}
-                        <li class="nav-item">
-                            <a class="nav-link active" href="#product_details" data-toggle="tab">
-                                {% trans 'Product details' %}
-                            </a>
-                        </li>
-                        {% if not parent %}
-                            <li class="nav-item">
-                                <a class="nav-link" href="#product_category" data-toggle="tab">
-                                    {% trans 'Categories' %}
-                                </a>
-                            </li>
-                        {% endif %}
-                        {% if product_class.has_attributes %}
-                            <li class="nav-item">
-                                <a class="nav-link" href="#product_attributes" data-toggle="tab">
-                                    {% trans 'Attributes' %}
-                                </a>
-                            </li>
-                        {% endif %}
-                        <li class="nav-item">
-                            <a class="nav-link" href="#product_images" data-toggle="tab">
-                                {% trans 'Images' %}
-                            </a>
-                        </li>
-                        {% if not product.is_parent %}
-                            <li class="nav-item">
-                                <a class="nav-link" href="#product_stock" data-toggle="tab">
-                                    {% trans 'Stock and pricing' %}
-                                </a>
-                            </li>
-                        {% endif %}
-                        {% if user.is_staff and not parent %}
-                            <li class="nav-item">
-                                <a class="nav-link" href="#child_products" data-toggle="tab">
-                                    {% trans 'Variants' %}
-                                </a>
-                            </li>
-                        {% endif %}
-                        {% if not parent %}
-                            <li class="nav-item">
-                                <a class="nav-link" href="#product_recommended" data-toggle="tab">
-                                    {% trans 'Upselling' %}
-                                </a>
-                            </li>
-                        {% endif %}
-                        <li class="nav-item">
-                            <a class="nav-link" href="#seo" data-toggle="tab">
-                                {% trans 'Search engine optimisation' %}
-                            </a>
-                        </li>
-                    {% endblock tabs %}
-                </ul>
-            </div>
-        </div>
-    {% endblock tab_nav %}
-    <div class="col-md-9">
-        <div class="tab-content">
-            {% block tab_content %}
-                {% block product_details %}
-                    <div class="tab-pane active" id="product_details">
+        {% endif %}
+        <div class="row">
+            {% block tab_nav %}
+                <div class="col-md-3">
+                    <div class="tab-nav sticky-top">
                         <div class="table-header">
-                            <h3>{% trans "Product details" %}</h3>
+                            <h3>{% trans "Sections" %}</h3>
                         </div>
-                        <div class="card card-body product-details">
-                            {% block product_details_content %}
-                                <span class="error-block">{{ form.non_field_errors }}</span>
-                                {% for field in form.hidden_fields %}{{ field }}{% endfor %}
-                                {% for field in form.primary_form_fields %}
-                                    {% if 'attr' not in field.id_for_label %}
-                                        {% include 'oscar/dashboard/partials/form_field.html' with field=field %}{% endif %}
+                        <ul class="nav flex-column bs-docs-sidenav" id="product_update_tabs">
+                            {% comment %}
+                            The navigation below is filtered heavily on the product structure.
+                            This intentionally is the only place where filtering is done, as
+                            deployments are likely to want to override certain aspects of what
+                            data is stored on products of a certain structure. This means that
+                            only one template block (instead of all affected) has to be altered.
+                        {% endcomment %}
+                        {% block tabs %}
+                            <li class="nav-item">
+                                <a class="nav-link active" href="#product_details" data-toggle="tab">
+                                    {% trans 'Product details' %}
+                                </a>
+                            </li>
+                            {% if not parent %}
+                                <li class="nav-item">
+                                    <a class="nav-link" href="#product_category" data-toggle="tab">
+                                        {% trans 'Categories' %}
+                                    </a>
+                                </li>
+                            {% endif %}
+                            {% if product_class.has_attributes %}
+                                <li class="nav-item">
+                                    <a class="nav-link" href="#product_attributes" data-toggle="tab">
+                                        {% trans 'Attributes' %}
+                                    </a>
+                                </li>
+                            {% endif %}
+                            <li class="nav-item">
+                                <a class="nav-link" href="#product_images" data-toggle="tab">
+                                    {% trans 'Images' %}
+                                </a>
+                            </li>
+                            {% if not product.is_parent %}
+                                <li class="nav-item">
+                                    <a class="nav-link" href="#product_stock" data-toggle="tab">
+                                        {% trans 'Stock and pricing' %}
+                                    </a>
+                                </li>
+                            {% endif %}
+                            {% if user.is_staff and not parent %}
+                                <li class="nav-item">
+                                    <a class="nav-link" href="#child_products" data-toggle="tab">
+                                        {% trans 'Variants' %}
+                                    </a>
+                                </li>
+                            {% endif %}
+                            {% if not parent %}
+                                <li class="nav-item">
+                                    <a class="nav-link" href="#product_recommended" data-toggle="tab">
+                                        {% trans 'Upselling' %}
+                                    </a>
+                                </li>
+                            {% endif %}
+                            <li class="nav-item">
+                                <a class="nav-link" href="#seo" data-toggle="tab">
+                                    {% trans 'Search engine optimisation' %}
+                                </a>
+                            </li>
+                        {% endblock tabs %}
+                    </ul>
+                </div>
+            </div>
+        {% endblock tab_nav %}
+        <div class="col-md-9">
+            <div class="tab-content">
+                {% block tab_content %}
+                    {% block product_details %}
+                        <div class="tab-pane active" id="product_details">
+                            <div class="table-header">
+                                <h3>{% trans "Product details" %}</h3>
+                            </div>
+                            <div class="card card-body product-details">
+                                {% block product_details_content %}
+                                    <span class="error-block">{{ form.non_field_errors }}</span>
+                                    {% for field in form.hidden_fields %}{{ field }}{% endfor %}
+                                    {% for field in form.primary_form_fields %}
+                                        {% if 'attr' not in field.id_for_label %}
+                                            {% include 'oscar/dashboard/partials/form_field.html' with field=field %}
+                                        {% endif %}
                                     {% endfor %}
                                 {% endblock product_details_content %}
                             </div>
@@ -195,47 +196,48 @@
                                     {{ image_formset.non_form_errors }}
                                     <ol class='upload-image'>
                                         {% for image_form in image_formset %}
-                                            {% include "oscar/dashboard/partials/product_images.html" with form=image_form %}{% endfor %}
-                                        </ol>
-                                        <p class="form-text">
-                                            {% trans 'Drag images to re-order them. Space for additional images will appear when images are added.' %}
-                                        </p>
-                                    </div>
-                                {% endblock product_images_content %}
-                            </div>
-                        {% endblock product_images %}
-                        {% block stockrecords %}
-                            <div class="tab-pane" id="product_stock">
-                                {% block stockrecords_content %}
-                                    <table class="table table-striped table-bordered">
-                                        <caption>
-                                        {% trans "Stock and pricing" %}
-                                        </caption>
-                                        {{ stockrecord_formset.management_form }}
-                                        {{ stockrecord_formset.non_form_errors }}
-                                        <thead>
-                                            <tr>
-                                                <th>{% trans "Partner" %}</th>
-                                                <th>{% trans "SKU" %}</th>
-                                                {% if product_class.track_stock %}
-                                                    <th>{% trans "Num in stock" %}</th>
-                                                    <th>{% trans "Num allocated" %}</th>
-                                                    <th>{% trans "Low stock threshold" %}</th>
-                                                {% endif %}
-                                                <th>{% trans "Currency" %}</th>
-                                                <th>
-                                                    {% trans "Price" %}
-                                                </th>
-                                                <th>
-                                                    {% trans "Delete?" %}
-                                                </th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            {% for stockrecord_form in stockrecord_formset %}
-                                                {% if stockrecord_form.non_field_errors %}
-                                                    <tr>
-                                                        <td colspan="{% if product_class.track_stock %}10{% else %}7{% endif %}">
+                                            {% include "oscar/dashboard/partials/product_images.html" with form=image_form %}
+                                        {% endfor %}
+                                    </ol>
+                                    <p class="form-text">
+                                        {% trans 'Drag images to re-order them. Space for additional images will appear when images are added.' %}
+                                    </p>
+                                </div>
+                            {% endblock product_images_content %}
+                        </div>
+                    {% endblock product_images %}
+                    {% block stockrecords %}
+                        <div class="tab-pane" id="product_stock">
+                            {% block stockrecords_content %}
+                                <table class="table table-striped table-bordered">
+                                    <caption>
+                                    {% trans "Stock and pricing" %}
+                                    </caption>
+                                    {{ stockrecord_formset.management_form }}
+                                    {{ stockrecord_formset.non_form_errors }}
+                                    <thead>
+                                        <tr>
+                                            <th>{% trans "Partner" %}</th>
+                                            <th>{% trans "SKU" %}</th>
+                                            {% if product_class.track_stock %}
+                                                <th>{% trans "Num in stock" %}</th>
+                                                <th>{% trans "Num allocated" %}</th>
+                                                <th>{% trans "Low stock threshold" %}</th>
+                                            {% endif %}
+                                            <th>{% trans "Currency" %}</th>
+                                            <th>
+                                                {% trans "Price" %}
+                                            </th>
+                                            <th>
+                                                {% trans "Delete?" %}
+                                            </th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        {% for stockrecord_form in stockrecord_formset %}
+                                            {% if stockrecord_form.non_field_errors %}
+                                                <tr>
+                                                    <td colspan="{% if product_class.track_stock %}10{% else %}7{% endif %}">
                                                         {% for error in stockrecord_form.non_field_errors %}
                                                             <span class="error-block errorlist">
                                                                 <i class="fas fa-exclamation"></i>
@@ -282,166 +284,167 @@
                     {% endblock stockrecords %}
                     {% block child_products %}
                         {% with children=product.children.all %}
-                        <div class="tab-pane" id="child_products">
-                            {% block child_products_content %}
-                                <table class='table table-striped table-bordered'>
+                            <div class="tab-pane" id="child_products">
+                                {% block child_products_content %}
+                                    <table class='table table-striped table-bordered'>
+                                        <caption>
+                                        {% trans "Variants" %}
+                                        <button class="btn btn-primary float-right"
+                                            {% if not product.can_be_parent %}disabled{% endif %}
+                                            name="action" type="submit" value="create-child" data-loading-text="{% trans 'Adding...' %}">
+                                            <i class="fas fa-plus-circle"></i>
+                                            {% trans "Add variant" %}
+                                        </button>
+                                        </caption>
+                                        {% if children %}
+                                            <tr>
+                                                <th>
+                                                    {% trans "Title" %}
+                                                </th>
+                                                <th>
+                                                    {% trans "Attributes" %}
+                                                </th>
+                                                <th>
+                                                    {% trans "Stock records" %}
+                                                </th>
+                                                <th>
+                                                    {% trans "Is public?" %}
+                                                </th>
+                                                <th>
+                                                    &nbsp;
+                                                </th>
+                                            </tr>
+                                            {% for child in children %}
+                                                <tr>
+                                                    <td>
+                                                        {{ child.get_title }}
+                                                    </td>
+                                                    <td>
+                                                        {{ child.attribute_summary }}
+                                                    </td>
+                                                    <td>
+                                                        {{ child.stockrecords.count }}
+                                                    </td>
+                                                    <td>
+                                                        {% if child.is_public %}
+                                                            <span class="true">✔</span>
+                                                        {% else %}
+                                                            <span class="false">✘</span>
+                                                        {% endif %}
+                                                    </td>
+                                                    <td>
+                                                        <a href="{% url 'dashboard:catalogue-product' pk=child.id %}"
+                                                           class="btn btn-primary">
+                                                            {% trans "Edit" %}
+                                                        </a>
+                                                        <a href="{% url 'dashboard:catalogue-product-delete' pk=child.id %}"
+                                                           class="btn btn-danger">
+                                                            {% trans "Delete" %}
+                                                        </a>
+                                                    </td>
+                                                </tr>
+                                            {% endfor %}
+                                        {% else %}
+                                            <tr>
+                                                <td colspan="5">
+                                                    {% if product.can_be_parent %}
+                                                        {% trans 'This product does not have any variants.' %}
+                                                    {% else %}
+                                                        {% trans "One can't add variants to this product at this point." %}
+                                                        {% if product.pk is None %}
+                                                            {% trans "Please save the product before trying to add variants." %}
+                                                        {% elif product.has_stockrecords %}
+                                                            {% trans 'This is likely because this product still has stock records.' %}
+                                                        {% endif %}
+                                                    {% endif %}
+                                                </td>
+                                            </tr>
+                                        {% endif %}
+                                    </table>
+                                {% endblock child_products_content %}
+                            </div>
+                        {% endwith %}
+                    {% endblock child_products %}
+                    {% block recommended_products %}
+                        <div class="tab-pane" id="product_recommended">
+                            {% block recommended_products_content %}
+                                <table class="table table-striped table-bordered">
                                     <caption>
-                                    {% trans "Variants" %}
-                                    <button class="btn btn-primary float-right" {% if not product.can_be_parent %}disabled{% endif %}
-                                    name="action" type="submit" value="create-child" data-loading-text="{% trans 'Adding...' %}">
-                                    <i class="fas fa-plus-circle"></i>
-                                    {% trans "Add variant" %}
-                                </button>
-                                </caption>
-                                {% if children %}
-                                    <tr>
-                                        <th>
-                                            {% trans "Title" %}
-                                        </th>
-                                        <th>
-                                            {% trans "Attributes" %}
-                                        </th>
-                                        <th>
-                                            {% trans "Stock records" %}
-                                        </th>
-                                        <th>
-                                            {% trans "Is public?" %}
-                                        </th>
-                                        <th>
-                                            &nbsp;
-                                        </th>
-                                    </tr>
-                                    {% for child in children %}
+                                    {% trans "Recommended products" %}
+                                    </caption>
+                                    {{ recommended_formset.management_form }}
+                                    {{ recommended_formset.non_form_errors }}
+                                    {% for recommended_form in recommended_formset %}
                                         <tr>
-                                            <td>
-                                                {{ child.get_title }}
-                                            </td>
-                                            <td>
-                                                {{ child.attribute_summary }}
-                                            </td>
-                                            <td>
-                                                {{ child.stockrecords.count }}
-                                            </td>
-                                            <td>
-                                                {% if child.is_public %}
-                                                    <span class="true">✔</span>
-                                                {% else %}
-                                                    <span class="false">✘</span>
-                                                {% endif %}
-                                            </td>
-                                            <td>
-                                                <a href="{% url 'dashboard:catalogue-product' pk=child.id %}"
-                                                   class="btn btn-primary">
-                                                    {% trans "Edit" %}
-                                                </a>
-                                                <a href="{% url 'dashboard:catalogue-product-delete' pk=child.id %}"
-                                                   class="btn btn-danger">
-                                                    {% trans "Delete" %}
-                                                </a>
+                                            <td class="form-inline">
+                                                {% include "oscar/dashboard/partials/form_fields_inline.html" with form=recommended_form %}
                                             </td>
                                         </tr>
                                     {% endfor %}
-                                {% else %}
-                                    <tr>
-                                        <td colspan="5">
-                                            {% if product.can_be_parent %}
-                                                {% trans 'This product does not have any variants.' %}
-                                            {% else %}
-                                                {% trans "One can't add variants to this product at this point." %}
-                                                {% if product.pk is None %}
-                                                    {% trans "Please save the product before trying to add variants." %}
-                                                {% elif product.has_stockrecords %}
-                                                    {% trans 'This is likely because this product still has stock records.' %}
-                                                {% endif %}
-                                            {% endif %}
-                                        </td>
-                                    </tr>
-                                {% endif %}
-                            </table>
-                        {% endblock child_products_content %}
-                    </div>
-                {% endwith %}
-            {% endblock child_products %}
-            {% block recommended_products %}
-                <div class="tab-pane" id="product_recommended">
-                    {% block recommended_products_content %}
-                        <table class="table table-striped table-bordered">
-                            <caption>
-                            {% trans "Recommended products" %}
-                            </caption>
-                            {{ recommended_formset.management_form }}
-                            {{ recommended_formset.non_form_errors }}
-                            {% for recommended_form in recommended_formset %}
-                                <tr>
-                                    <td class="form-inline">
-                                        {% include "oscar/dashboard/partials/form_fields_inline.html" with form=recommended_form %}
-                                    </td>
-                                </tr>
-                            {% endfor %}
-                        </table>
-                    {% endblock recommended_products_content %}
-                </div>
-            {% endblock recommended_products %}
-            {% block seo %}
-                <div class="tab-pane" id="seo">
-                    <div class="table-header">
-                        <h3>
-                            {% trans "Search engine optimisation" %}
-                        </h3>
-                    </div>
-                    <div class="card card-body">
-                        {% block seo_content %}
-                            {% for field in form.seo_form_fields %}
-                                {% if 'attr' not in field.id_for_label %}
-                                    {% include 'oscar/dashboard/partials/form_field.html' with field=field %}{% endif %}
-                                {% endfor %}
-                            {% endblock seo_content %}
+                                </table>
+                            {% endblock recommended_products_content %}
                         </div>
-                    </div>
-                {% endblock seo %}
-            {% endblock tab_content %}
-        </div>
-    </div>
-</div>
-{% block fixed_actions_group %}
-    <div class="fixed-actions-group">
-        <div class="form-group">
-            <div class="float-right">
-                <a href="{% url 'dashboard:catalogue-product-list' %}">
-                    {% trans "Cancel" %}
-                </a>
-                {% trans "or" %}
-                {% if parent %}
-                    <button class="btn btn-secondary"
-                            name="action"
-                            type="submit"
-                            value="create-another-child"
-                            data-loading-text="{% trans 'Saving...' %}">
-                        {% trans "Save and add another variant" %}
-                    </button>
-                {% endif %}
-                <button class="btn btn-secondary"
-                        name="action"
-                        type="submit"
-                        value="continue"
-                        data-loading-text="{% trans 'Saving...' %}">
-                    {% trans "Save and continue editing" %}
-                </button>
-                <button class="btn btn-primary"
-                        name="action"
-                        type="submit"
-                        value="save"
-                        data-loading-text="{% trans 'Saving...' %}">
-                    {% trans "Save" %}
-                </button>
+                    {% endblock recommended_products %}
+                    {% block seo %}
+                        <div class="tab-pane" id="seo">
+                            <div class="table-header">
+                                <h3>
+                                    {% trans "Search engine optimisation" %}
+                                </h3>
+                            </div>
+                            <div class="card card-body">
+                                {% block seo_content %}
+                                    {% for field in form.seo_form_fields %}
+                                        {% if 'attr' not in field.id_for_label %}
+                                            {% include 'oscar/dashboard/partials/form_field.html' with field=field %}{% endif %}
+                                        {% endfor %}
+                                    {% endblock seo_content %}
+                                </div>
+                            </div>
+                        {% endblock seo %}
+                    {% endblock tab_content %}
+                </div>
             </div>
-            {% if product %}
-                <a class="btn btn-success" href="{{ product.get_absolute_url }}">
-                    {% trans "View on site" %}
-                </a>
-            {% endif %}
         </div>
-    </div>
-{% endblock fixed_actions_group %}
-</form>
+        {% block fixed_actions_group %}
+            <div class="fixed-actions-group">
+                <div class="form-group">
+                    <div class="float-right">
+                        <a href="{% url 'dashboard:catalogue-product-list' %}">
+                            {% trans "Cancel" %}
+                        </a>
+                        {% trans "or" %}
+                        {% if parent %}
+                            <button class="btn btn-secondary"
+                                    name="action"
+                                    type="submit"
+                                    value="create-another-child"
+                                    data-loading-text="{% trans 'Saving...' %}">
+                                {% trans "Save and add another variant" %}
+                            </button>
+                        {% endif %}
+                        <button class="btn btn-secondary"
+                                name="action"
+                                type="submit"
+                                value="continue"
+                                data-loading-text="{% trans 'Saving...' %}">
+                            {% trans "Save and continue editing" %}
+                        </button>
+                        <button class="btn btn-primary"
+                                name="action"
+                                type="submit"
+                                value="save"
+                                data-loading-text="{% trans 'Saving...' %}">
+                            {% trans "Save" %}
+                        </button>
+                    </div>
+                    {% if product %}
+                        <a class="btn btn-success" href="{{ product.get_absolute_url }}">
+                            {% trans "View on site" %}
+                        </a>
+                    {% endif %}
+                </div>
+            </div>
+        {% endblock fixed_actions_group %}
+    </form>
 {% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/catalogue/stockalert_list.html b/tests/django_oscar/oscar/dashboard/catalogue/stockalert_list.html
index 2a254f7..c31ba78 100644
--- a/tests/django_oscar/oscar/dashboard/catalogue/stockalert_list.html
+++ b/tests/django_oscar/oscar/dashboard/catalogue/stockalert_list.html
@@ -68,34 +68,34 @@
                 <tr>
                     <td>
                         <a href="{% url 'dashboard:catalogue-product' alert.stockrecord.product.id %}{% if request.GET.urlencode %}?{{ request.GET.urlencode }}{% endif %}">
-                        {{ alert.stockrecord.product.get_title }}
-                    </a>
-                </td>
-                <td>{{ alert.stockrecord.partner.display_name }}</td>
-                <td>{{ alert.stockrecord.low_stock_threshold }}</td>
+                            {{ alert.stockrecord.product.get_title }}
+                        </a>
+                    </td>
+                    <td>{{ alert.stockrecord.partner.display_name }}</td>
+                    <td>{{ alert.stockrecord.low_stock_threshold }}</td>
+                    <td>
+                        {{ alert.stockrecord.net_stock_level }}
+                    </td>
+                    <td>
+                        {{ alert.date_created }}
+                    </td>
+                    <td>
+                        {{ alert.status }}
+                    </td>
+                    <td>
+                        <a class="btn btn-info"
+                           href="{% url 'dashboard:catalogue-product' pk=alert.stockrecord.product.id %}">
+                            {% trans "Update" %}
+                        </a>
+                    </td>
+                </tr>
+            {% endfor %}
+        {% else %}
+            <tr>
                 <td>
-                    {{ alert.stockrecord.net_stock_level }}
-                </td>
-                <td>
-                    {{ alert.date_created }}
-                </td>
-                <td>
-                    {{ alert.status }}
-                </td>
-                <td>
-                    <a class="btn btn-info"
-                       href="{% url 'dashboard:catalogue-product' pk=alert.stockrecord.product.id %}">
-                        {% trans "Update" %}
-                    </a>
+                    {% trans "No stock alerts found." %}
                 </td>
             </tr>
-        {% endfor %}
-    {% else %}
-        <tr>
-            <td>
-                {% trans "No stock alerts found." %}
-            </td>
-        </tr>
-    {% endif %}
-</table>
+        {% endif %}
+    </table>
 {% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/comms/detail.html b/tests/django_oscar/oscar/dashboard/comms/detail.html
index 613711b..df74fb1 100644
--- a/tests/django_oscar/oscar/dashboard/comms/detail.html
+++ b/tests/django_oscar/oscar/dashboard/comms/detail.html
@@ -51,133 +51,134 @@
                 </div>
             {% endif %}
             <div class="{% if preview %}tab-content{% else %}card card-body{% endif %}">
-            <div class="tab-pane {% if not preview %}active{% endif %}" id="email_form">
-            {% csrf_token %}
-            {% include 'oscar/dashboard/partials/form_field.html' with field=form.name %}
-            <div class="table-header">
-                <h3>{% trans "Email content" %}</h3>
-            </div>
-            <div class="card card-body">
-                <p>
-                    {% trans "These fields are rendered using Django's template system." %}
-                </p>
-                <p>
-                    {% trans "You can use the following variables:" %}
-                </p>
-                <dl>
-                    <dt>
-                    <code>
-                    {% templatetag openvariable %} user.get_full_name {% templatetag closevariable %}
-                    </code>
-                    </dt>
-                    <dd>
-                    {% trans "The full name of the user (if they have one)" %}
-                    </dd>
-                    <dt>
-                    <code>
-                    {% templatetag openvariable %} user.email {% templatetag closevariable %}
-                    </code>
-                    </dt>
-                    <dd>
-                    {% trans "The user's email address" %}
-                    </dd>
-                    <dt>
-                    <code>
-                    {% templatetag openvariable %} site.name {% templatetag closevariable %}
-                    </code>
-                    </dt>
-                    <dd>
-                    {% trans "The name of the site (eg example.com)" %}
-                    </dd>
-                    {% if commtype.is_order_related %}
-                        <dt>
-                        <code>
-                        {% templatetag openvariable %} order.number {% templatetag closevariable %}
-                        </code>
-                        </dt>
-                        <dd>
-                        {% trans "Order number" %}
-                        </dd>
-                    {% endif %}
-                </dl>
-            </div>
-            {% include 'oscar/dashboard/partials/form_field.html' with field=form.email_subject_template %}
-            {% include 'oscar/dashboard/partials/form_field.html' with field=form.email_body_template %}
-            {% include 'oscar/dashboard/partials/form_field.html' with field=form.email_body_html_template %}
-            <div class="table-header">
-                <h3>{% trans "Preview" %}</h3>
-            </div>
-            <div class="card card-body">
-                {% if commtype.is_order_related %}
-                    <p>
-                        {% trans "View a preview of this email using order:" %}
-                    </p>
-                    {% include 'oscar/dashboard/partials/form_field.html' with field=form.preview_order_number %}{% endif %}
-                    <button type="submit"
-                            class="btn btn-primary"
-                            name="show_preview"
-                            data-loading-text="{% trans 'Submitting...' %}">
-                        {% trans "View preview" %}
-                    </button>
-                    <p>
-                        {% trans "or send a preview to:" %}
-                    </p>
-                    {% include 'oscar/dashboard/partials/form_field.html' with field=form.preview_email %}
-                    <button type="submit"
-                            class="btn btn-secondary"
-                            name="send_preview"
-                            data-loading-text="{% trans 'Sending...' %}">
-                        {% trans "Send preview email" %}
+                <div class="tab-pane {% if not preview %}active{% endif %}" id="email_form">
+                    {% csrf_token %}
+                    {% include 'oscar/dashboard/partials/form_field.html' with field=form.name %}
+                    <div class="table-header">
+                        <h3>{% trans "Email content" %}</h3>
+                    </div>
+                    <div class="card card-body">
+                        <p>
+                            {% trans "These fields are rendered using Django's template system." %}
+                        </p>
+                        <p>
+                            {% trans "You can use the following variables:" %}
+                        </p>
+                        <dl>
+                            <dt>
+                            <code>
+                            {% templatetag openvariable %} user.get_full_name {% templatetag closevariable %}
+                            </code>
+                            </dt>
+                            <dd>
+                            {% trans "The full name of the user (if they have one)" %}
+                            </dd>
+                            <dt>
+                            <code>
+                            {% templatetag openvariable %} user.email {% templatetag closevariable %}
+                            </code>
+                            </dt>
+                            <dd>
+                            {% trans "The user's email address" %}
+                            </dd>
+                            <dt>
+                            <code>
+                            {% templatetag openvariable %} site.name {% templatetag closevariable %}
+                            </code>
+                            </dt>
+                            <dd>
+                            {% trans "The name of the site (eg example.com)" %}
+                            </dd>
+                            {% if commtype.is_order_related %}
+                                <dt>
+                                <code>
+                                {% templatetag openvariable %} order.number {% templatetag closevariable %}
+                                </code>
+                                </dt>
+                                <dd>
+                                {% trans "Order number" %}
+                                </dd>
+                            {% endif %}
+                        </dl>
+                    </div>
+                    {% include 'oscar/dashboard/partials/form_field.html' with field=form.email_subject_template %}
+                    {% include 'oscar/dashboard/partials/form_field.html' with field=form.email_body_template %}
+                    {% include 'oscar/dashboard/partials/form_field.html' with field=form.email_body_html_template %}
+                    <div class="table-header">
+                        <h3>{% trans "Preview" %}</h3>
+                    </div>
+                    <div class="card card-body">
+                        {% if commtype.is_order_related %}
+                            <p>
+                                {% trans "View a preview of this email using order:" %}
+                            </p>
+                            {% include 'oscar/dashboard/partials/form_field.html' with field=form.preview_order_number %}
+                        {% endif %}
+                        <button type="submit"
+                                class="btn btn-primary"
+                                name="show_preview"
+                                data-loading-text="{% trans 'Submitting...' %}">
+                            {% trans "View preview" %}
+                        </button>
+                        <p>
+                            {% trans "or send a preview to:" %}
+                        </p>
+                        {% include 'oscar/dashboard/partials/form_field.html' with field=form.preview_email %}
+                        <button type="submit"
+                                class="btn btn-secondary"
+                                name="send_preview"
+                                data-loading-text="{% trans 'Sending...' %}">
+                            {% trans "Send preview email" %}
+                        </button>
+                    </div>
+                </div>
+                <div class="tab-pane {% if preview %}active{% endif %}" id="email_preview">
+                    <table class="table table-striped table-bordered table-hover">
+                        <tr>
+                            <th>{% trans "Subject" %}</th>
+                            <td>{{ preview.subject }}</td>
+                        </tr>
+                        <tr>
+                            <th>{% trans "Body text" %}</th>
+                            <td>
+                                <pre>
+{{ preview.body }}
+                                </pre>
+                            </td>
+                        </tr>
+                        <tr>
+                            <th>{% trans "Body HTML" %}</th>
+                            <td>
+                                <iframe id="preview_box" width="100%" height="400">
+                                {{ preview.html }}
+                                </iframe>
+                            </td>
+                        </tr>
+                    </table>
+                </div>
+                <div class="form-actions">
+                    <button type="submit" class="btn btn-primary" data-loading-text="{% trans 'Saving...' %}">
+                        {% trans "Save" %}
                     </button>
+                    {% trans "or" %}
+                    <a href="{% url 'dashboard:comms-list' %}">
+                        {% trans "cancel" %}
+                    </a>
+                    .
                 </div>
             </div>
-            <div class="tab-pane {% if preview %}active{% endif %}" id="email_preview">
-            <table class="table table-striped table-bordered table-hover">
-                <tr>
-                    <th>{% trans "Subject" %}</th>
-                    <td>{{ preview.subject }}</td>
-                </tr>
-                <tr>
-                    <th>{% trans "Body text" %}</th>
-                    <td>
-                        <pre>
-{{ preview.body }}
-                        </pre>
-                    </td>
-                </tr>
-                <tr>
-                    <th>{% trans "Body HTML" %}</th>
-                    <td>
-                        <iframe id="preview_box" width="100%" height="400">
-                        {{ preview.html }}
-                        </iframe>
-                    </td>
-                </tr>
-            </table>
         </div>
-        <div class="form-actions">
-            <button type="submit" class="btn btn-primary" data-loading-text="{% trans 'Saving...' %}">
-                {% trans "Save" %}
-            </button>
-            {% trans "or" %}
-            <a href="{% url 'dashboard:comms-list' %}">
-                {% trans "cancel" %}
-            </a>
-            .
-        </div>
-    </div>
-</div>
-</form>
+    </form>
 {% endblock dashboard_content %}
 {% block onbodyload %}
-{{ block.super }}
-$(function() {
-// Sets the HTML email preview so it's css doesn't touch the page.
-var el_preview_html = document.getElementById('preview_box');
-var html = $(el_preview_html).text();
-var doc = el_preview_html.contentWindow.document;
-doc.open();
-doc.write(html);
-doc.close();
-});
+    {{ block.super }}
+    $(function() {
+    // Sets the HTML email preview so it's css doesn't touch the page.
+    var el_preview_html = document.getElementById('preview_box');
+    var html = $(el_preview_html).text();
+    var doc = el_preview_html.contentWindow.document;
+    doc.open();
+    doc.write(html);
+    doc.close();
+    });
 {% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/comms/list.html b/tests/django_oscar/oscar/dashboard/comms/list.html
index 4187193..14a585a 100644
--- a/tests/django_oscar/oscar/dashboard/comms/list.html
+++ b/tests/django_oscar/oscar/dashboard/comms/list.html
@@ -63,4 +63,5 @@
             </tbody>
         {% endif %}
     </table>
-    {% include "oscar/dashboard/partials/pagination.html" %}{% endblock dashboard_content %}
+    {% include "oscar/dashboard/partials/pagination.html" %}
+{% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/layout.html b/tests/django_oscar/oscar/dashboard/layout.html
index 197aa46..2f1838b 100644
--- a/tests/django_oscar/oscar/dashboard/layout.html
+++ b/tests/django_oscar/oscar/dashboard/layout.html
@@ -75,92 +75,92 @@
                 <ul class="navbar-nav">
                     {% for item in nav_items %}
                         <li class="nav-item {% if item.has_children %}dropdown{% endif %}">
-                        <a class="nav-link {% if item.has_children %}dropdown-toggle{% endif %}" href="{% if item.is_heading %}#{% else %}{{ item.url }}{% endif %}"
-                        {% if item.has_children %}
-                            id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
-                        {% endif %}
-                        >
-                        {% if item.icon %}<i class="{{ item.icon }}"></i>{% endif %}
-                        {{ item.label }}
-                    </a>
-                    {% if item.has_children %}
-                        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
-                            {% for subitem in item.children %}
-                                <a class="dropdown-item" href="{{ subitem.url }}">
-                                    {% if subitem.icon %}<i class="{{ subitem.icon }}"></i>{% endif %}
-                                    {{ subitem.label }}
-                                </a>
-                            {% endfor %}
-                        </div>
-                    {% endif %}
-                </li>
-            {% endfor %}
-        </ul>
-    </div>
-</nav>
-{% endblock %}
-<div class="container-fluid">
-{% block breadcrumbs %}
-    <nav aria-label="breadcrumb">
-        <ol class="breadcrumb">
-            <li class="breadcrumb-item active" aria-current="page">
-                <a href="{% url 'dashboard:index' %}">
-                    {% trans "Dashboard" %}
-                </a>
-            </li>
-        </ol>
-    </nav>
-{% endblock %}
-<div class="content">
-    {% include 'oscar/dashboard/partials/alert_messages.html' %}
-    {% block header %}
-        <div class="page-header">
-            <h1>{% block headertext %}{% endblock %}</h1>
-        </div>
+                            <a class="nav-link {% if item.has_children %}dropdown-toggle{% endif %}" href="{% if item.is_heading %}#{% else %}{{ item.url }}{% endif %}"
+                                {% if item.has_children %}
+                                    id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
+                                {% endif %}
+                                >
+                                {% if item.icon %}<i class="{{ item.icon }}"></i>{% endif %}
+                                {{ item.label }}
+                            </a>
+                            {% if item.has_children %}
+                                <div class="dropdown-menu" aria-labelledby="navbarDropdown">
+                                    {% for subitem in item.children %}
+                                        <a class="dropdown-item" href="{{ subitem.url }}">
+                                            {% if subitem.icon %}<i class="{{ subitem.icon }}"></i>{% endif %}
+                                            {{ subitem.label }}
+                                        </a>
+                                    {% endfor %}
+                                </div>
+                            {% endif %}
+                        </li>
+                    {% endfor %}
+                </ul>
+            </div>
+        </nav>
     {% endblock %}
-    <div class="page-content">
-        {% block content %}
-            {% block dashboard_content %}{% endblock dashboard_content %}
-            {% endblock content %}
+    <div class="container-fluid">
+        {% block breadcrumbs %}
+            <nav aria-label="breadcrumb">
+                <ol class="breadcrumb">
+                    <li class="breadcrumb-item active" aria-current="page">
+                        <a href="{% url 'dashboard:index' %}">
+                            {% trans "Dashboard" %}
+                        </a>
+                    </li>
+                </ol>
+            </nav>
+        {% endblock %}
+        <div class="content">
+            {% include 'oscar/dashboard/partials/alert_messages.html' %}
+            {% block header %}
+                <div class="page-header">
+                    <h1>{% block headertext %}{% endblock %}</h1>
+                </div>
+            {% endblock %}
+            <div class="page-content">
+                {% block content %}
+                    {% block dashboard_content %}{% endblock dashboard_content %}
+                {% endblock content %}
+            </div>
         </div>
     </div>
-</div>
-<!-- /container -->
+    <!-- /container -->
 {% endblock %}
 {# Local scripts #}
 {% block scripts %}
-<!-- Twitter Bootstrap -->
-<script src="{% static "oscar/js/bootstrap4/bootstrap.bundle.min.js" %}"></script>
-<!-- Oscar -->
-<script src="{% static "oscar/js/oscar/ui.js" %}"></script>
+    <!-- Twitter Bootstrap -->
+    <script src="{% static "oscar/js/bootstrap4/bootstrap.bundle.min.js" %}"></script>
+    <!-- Oscar -->
+    <script src="{% static "oscar/js/oscar/ui.js" %}"></script>
 {% endblock %}
 {% block extrascripts %}
-{{ block.super }}
-{# jQuery plugins #}
-<script src="{% static "oscar/js/mousewheel/jquery.mousewheel.js" %}"></script>
-<script src="{% static "oscar/js/bootstrap4-datetimepicker/moment-with-locales.min.js" %}"></script>
-<script src="{% static "oscar/js/bootstrap4-datetimepicker/tempusdominus-bootstrap-4.min.js" %}"></script>
-<script src="{% static "oscar/js/inputmask/jquery.inputmask.min.js" %}"></script>
-<script src="{% static "oscar/js/select2/select2.min.js" %}"></script>
-<script src="{% static "oscar/js/jquery-sortable/jquery-sortable-min.js" %}"></script>
-<script src="{% static "oscar/js/oscar/dashboard.js" %}"></script>
-<script src="{% static "oscar/js/oscar/RelatedObjectLookups.js" %}"></script>
-<script src="{% static "oscar/js/tinymce/tinymce.min.js" %}"></script>
-<script src="{% static "oscar/js/tinymce/jquery.tinymce.min.js" %}"></script>
+    {{ block.super }}
+    {# jQuery plugins #}
+    <script src="{% static "oscar/js/mousewheel/jquery.mousewheel.js" %}"></script>
+    <script src="{% static "oscar/js/bootstrap4-datetimepicker/moment-with-locales.min.js" %}"></script>
+    <script src="{% static "oscar/js/bootstrap4-datetimepicker/tempusdominus-bootstrap-4.min.js" %}"></script>
+    <script src="{% static "oscar/js/inputmask/jquery.inputmask.min.js" %}"></script>
+    <script src="{% static "oscar/js/select2/select2.min.js" %}"></script>
+    <script src="{% static "oscar/js/jquery-sortable/jquery-sortable-min.js" %}"></script>
+    <script src="{% static "oscar/js/oscar/dashboard.js" %}"></script>
+    <script src="{% static "oscar/js/oscar/RelatedObjectLookups.js" %}"></script>
+    <script src="{% static "oscar/js/tinymce/tinymce.min.js" %}"></script>
+    <script src="{% static "oscar/js/tinymce/jquery.tinymce.min.js" %}"></script>
 {% endblock %}
 {% block onbodyload %}
-{{ block.super }}
-// Javascript to enable link to tab
-var url = document.location.toString();
-if (url.match('#')) {
-$('.nav-list a[href="#' + url.split('#')[1] + '"]').tab('show');
-}
-// Change hash for page-reload
-$('.nav-list a').on('shown.bs.tab', function (e) {
-window.location.hash = e.target.hash;
-});
-options = {
-'languageCode': '{{ LANGUAGE_CODE }}'
-};
-oscar.dashboard.init(options);
+    {{ block.super }}
+    // Javascript to enable link to tab
+    var url = document.location.toString();
+    if (url.match('#')) {
+    $('.nav-list a[href="#' + url.split('#')[1] + '"]').tab('show');
+    }
+    // Change hash for page-reload
+    $('.nav-list a').on('shown.bs.tab', function (e) {
+    window.location.hash = e.target.hash;
+    });
+    options = {
+    'languageCode': '{{ LANGUAGE_CODE }}'
+    };
+    oscar.dashboard.init(options);
 {% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/offers/benefit_form.html b/tests/django_oscar/oscar/dashboard/offers/benefit_form.html
index 3163cd9..0256677 100644
--- a/tests/django_oscar/oscar/dashboard/offers/benefit_form.html
+++ b/tests/django_oscar/oscar/dashboard/offers/benefit_form.html
@@ -1,34 +1,36 @@
 {% extends 'oscar/dashboard/offers/step_form.html' %}
 {% load i18n %}
 {% block progress %}
-    {% include 'oscar/dashboard/offers/progress.html' with step=2 %}{% endblock %}
-    {% block form_fields %}
-        <span class="error-block">{{ form.non_field_errors }}</span>
-        {% if form.fields.custom_benefit.choices %}
-            <h4>{% trans "Build a new incentive" %}</h4>
-        {% endif %}
-        {% include "oscar/dashboard/partials/form_field.html" with field=form.range %}
-        <p>
-            {% url 'dashboard:range-list' as range_list_url %}
-            {% blocktrans %}
-                Ranges can be created and edited from within the
-                <a href="{{ range_list_url }}" target="_blank">
-                    range dashboard
-                </a>
-                .
-            {% endblocktrans %}
-        </p>
-        {% include "oscar/dashboard/partials/form_field.html" with field=form.type %}
-        {% include "oscar/dashboard/partials/form_field.html" with field=form.value %}
-        {% include "oscar/dashboard/partials/form_field.html" with field=form.max_affected_items %}
-        {% if form.fields.custom_benefit.choices %}
-            <h4>{% trans "...or choose a pre-defined one" %}</h4>
-            {% include "oscar/dashboard/partials/form_field.html" with field=form.custom_benefit %}{% endif %}
-        {% endblock %}
-        {% block submittext %}
-            {% trans "Continue to step 3" %}
-        {% endblock %}
-        {% block onbodyload %}
-            {{ block.super }}
-            oscar.dashboard.offers.init();
-        {% endblock %}
+    {% include 'oscar/dashboard/offers/progress.html' with step=2 %}
+{% endblock %}
+{% block form_fields %}
+    <span class="error-block">{{ form.non_field_errors }}</span>
+    {% if form.fields.custom_benefit.choices %}
+        <h4>{% trans "Build a new incentive" %}</h4>
+    {% endif %}
+    {% include "oscar/dashboard/partials/form_field.html" with field=form.range %}
+    <p>
+        {% url 'dashboard:range-list' as range_list_url %}
+        {% blocktrans %}
+            Ranges can be created and edited from within the
+            <a href="{{ range_list_url }}" target="_blank">
+                range dashboard
+            </a>
+            .
+        {% endblocktrans %}
+    </p>
+    {% include "oscar/dashboard/partials/form_field.html" with field=form.type %}
+    {% include "oscar/dashboard/partials/form_field.html" with field=form.value %}
+    {% include "oscar/dashboard/partials/form_field.html" with field=form.max_affected_items %}
+    {% if form.fields.custom_benefit.choices %}
+        <h4>{% trans "...or choose a pre-defined one" %}</h4>
+        {% include "oscar/dashboard/partials/form_field.html" with field=form.custom_benefit %}
+    {% endif %}
+{% endblock %}
+{% block submittext %}
+    {% trans "Continue to step 3" %}
+{% endblock %}
+{% block onbodyload %}
+    {{ block.super }}
+    oscar.dashboard.offers.init();
+{% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/offers/condition_form.html b/tests/django_oscar/oscar/dashboard/offers/condition_form.html
index 46fda11..886e522 100644
--- a/tests/django_oscar/oscar/dashboard/offers/condition_form.html
+++ b/tests/django_oscar/oscar/dashboard/offers/condition_form.html
@@ -1,31 +1,34 @@
 {% extends 'oscar/dashboard/offers/step_form.html' %}
 {% load i18n %}
 {% block summary %}
-    {% include 'oscar/dashboard/offers/summary.html' %}{% endblock %}
-    {% block progress %}
-        {% include 'oscar/dashboard/offers/progress.html' with step=3 %}{% endblock %}
-        {% block form_fields %}
-            <span class="error-block">{{ form.non_field_errors }}</span>
-            {% if form.fields.custom_condition.choices %}
-                <h4>{% trans "Build a new condition" %}</h4>
-            {% endif %}
-            {% include "oscar/dashboard/partials/form_field.html" with field=form.range %}
-            <p>
-                {% url 'dashboard:range-list' as range_list_url %}
-                {% blocktrans %}
-                    Ranges can be created and edited from within the
-                    <a href="{{ range_list_url }}" target="_blank">
-                        range dashboard
-                    </a>
-                    .
-                {% endblocktrans %}
-            </p>
-            {% include "oscar/dashboard/partials/form_field.html" with field=form.type %}
-            {% include "oscar/dashboard/partials/form_field.html" with field=form.value %}
-            {% if form.fields.custom_condition.choices %}
-                <h4>{% trans "...or choose a pre-defined one" %}</h4>
-                {% include "oscar/dashboard/partials/form_field.html" with field=form.custom_condition %}{% endif %}
-            {% endblock %}
-            {% block submittext %}
-                {% trans "Continue to step 4" %}
-            {% endblock %}
+    {% include 'oscar/dashboard/offers/summary.html' %}
+{% endblock %}
+{% block progress %}
+    {% include 'oscar/dashboard/offers/progress.html' with step=3 %}
+{% endblock %}
+{% block form_fields %}
+    <span class="error-block">{{ form.non_field_errors }}</span>
+    {% if form.fields.custom_condition.choices %}
+        <h4>{% trans "Build a new condition" %}</h4>
+    {% endif %}
+    {% include "oscar/dashboard/partials/form_field.html" with field=form.range %}
+    <p>
+        {% url 'dashboard:range-list' as range_list_url %}
+        {% blocktrans %}
+            Ranges can be created and edited from within the
+            <a href="{{ range_list_url }}" target="_blank">
+                range dashboard
+            </a>
+            .
+        {% endblocktrans %}
+    </p>
+    {% include "oscar/dashboard/partials/form_field.html" with field=form.type %}
+    {% include "oscar/dashboard/partials/form_field.html" with field=form.value %}
+    {% if form.fields.custom_condition.choices %}
+        <h4>{% trans "...or choose a pre-defined one" %}</h4>
+        {% include "oscar/dashboard/partials/form_field.html" with field=form.custom_condition %}
+    {% endif %}
+{% endblock %}
+{% block submittext %}
+    {% trans "Continue to step 4" %}
+{% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/offers/metadata_form.html b/tests/django_oscar/oscar/dashboard/offers/metadata_form.html
index 14c99ed..f2c48ad 100644
--- a/tests/django_oscar/oscar/dashboard/offers/metadata_form.html
+++ b/tests/django_oscar/oscar/dashboard/offers/metadata_form.html
@@ -1,7 +1,8 @@
 {% extends 'oscar/dashboard/offers/step_form.html' %}
 {% load i18n %}
 {% block progress %}
-    {% include 'oscar/dashboard/offers/progress.html' with step=1 %}{% endblock %}
-    {% block submittext %}
-        {% trans "Continue to step 2" %}
-    {% endblock %}
+    {% include 'oscar/dashboard/offers/progress.html' with step=1 %}
+{% endblock %}
+{% block submittext %}
+    {% trans "Continue to step 2" %}
+{% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/offers/offer_detail.html b/tests/django_oscar/oscar/dashboard/offers/offer_detail.html
index 2721623..f65e384 100644
--- a/tests/django_oscar/oscar/dashboard/offers/offer_detail.html
+++ b/tests/django_oscar/oscar/dashboard/offers/offer_detail.html
@@ -246,25 +246,26 @@
             <tbody>
                 {% for discount in order_discounts %}
                     {% with order=discount.order %}
-                    <tr>
-                        <td>
-                            <a href="{% url 'dashboard:order-detail' number=order.number %}">
-                                {{ order.number }}
-                            </a>
-                        </td>
-                        <td>
-                            {{ order.date_placed }}
-                        </td>
-                        <td>
-                            {{ order.total_incl_tax|currency }}
-                        </td>
-                        <td>
-                            {{ discount.amount|currency }}
-                        </td>
-                    </tr>
-                {% endwith %}
-            {% endfor %}
-        </tbody>
-    </table>
-    {% include 'oscar/dashboard/partials/pagination.html' %}{% endif %}
+                        <tr>
+                            <td>
+                                <a href="{% url 'dashboard:order-detail' number=order.number %}">
+                                    {{ order.number }}
+                                </a>
+                            </td>
+                            <td>
+                                {{ order.date_placed }}
+                            </td>
+                            <td>
+                                {{ order.total_incl_tax|currency }}
+                            </td>
+                            <td>
+                                {{ discount.amount|currency }}
+                            </td>
+                        </tr>
+                    {% endwith %}
+                {% endfor %}
+            </tbody>
+        </table>
+        {% include 'oscar/dashboard/partials/pagination.html' %}
+    {% endif %}
 {% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/offers/offer_list.html b/tests/django_oscar/oscar/dashboard/offers/offer_list.html
index 3a2fad3..da53f59 100644
--- a/tests/django_oscar/oscar/dashboard/offers/offer_list.html
+++ b/tests/django_oscar/oscar/dashboard/offers/offer_list.html
@@ -44,183 +44,184 @@
                         {{ field }}
                     {% else %}
                         <div class="form-group mr-2{% if field.errors %}error{% endif %}">
-                        {{ field.label_tag }}
-                        {% render_field field class+='form-control' %}
-                        {% for error in field.errors %}
-                            <ul class="error-block">
-                                <li>
-                                    {{ error }}
-                                </li>
-                            </ul>
-                        {% endfor %}
-                        {# No help text as it wraps #}
-                    </div>
-                {% endif %}
-            {% else %}
-                <input type="hidden" name="{{ field.name }}" value="{{ field.value|default_if_none:'' }}">
-            {% endif %}
-        {% endfor %}
-        <button type="submit" class="btn btn-primary mr-2" data-loading-text="{% trans 'Searching...' %}">
-            {% trans "Search" %}
-        </button>
-        <a data-toggle="modal" data-target="#SearchModal" href="#" class="mr-2">
-            {% trans "Advanced Search" %}
-        </a>
-        <a href="{% url 'dashboard:offer-list' %}" class="btn btn-secondary">
-            {% trans "Reset" %}
-        </a>
-    </form>
-    {# Search modal, if there are form errors the form is automatically openend #}
-    {% include "oscar/dashboard/partials/advanced_search_modal.html" with form=advanced_form style='horizontal' %}
-    {% if search_filters %}
-        <div class="search-filter-list">
-            <label>
-                Filters:
-            </label>
-            {% for filter in search_filters %}
-                <span class="badge badge-success">{{ filter }}</span>
-            {% endfor %}
-        </div>
-    {% endif %}
-</div>
-<form method="post" class="order_table">
-    {% csrf_token %}
-    <table class="table table-striped table-bordered table-hover">
-        <caption>
-        <i class="fas fa-gift"></i>
-        {% if search_filters %}
-            {% trans "Offer Search Results" %}
-        {% else %}
-            {% trans "All Offers" %}
-        {% endif %}
-        </caption>
-        {% if offers %}
-            <tr>
-                <th>{% anchor 'name' _('Offer name') %}</th>
-                <th>{% anchor 'offer_type' _('Offer type') %}</th>
-                {% if form.is_bound %}
-                    {% if form.is_voucher_offer_type or not form.cleaned_data.offer_type %}
-                        <th>{% trans "Num of vouchers" %}</th>
+                            {{ field.label_tag }}
+                            {% render_field field class+='form-control' %}
+                            {% for error in field.errors %}
+                                <ul class="error-block">
+                                    <li>
+                                        {{ error }}
+                                    </li>
+                                </ul>
+                            {% endfor %}
+                            {# No help text as it wraps #}
+                        </div>
                     {% endif %}
+                {% else %}
+                    <input type="hidden" name="{{ field.name }}" value="{{ field.value|default_if_none:'' }}">
                 {% endif %}
-                <th>{% anchor 'start_datetime' _('Start date') %}</th>
-                <th>{% anchor 'end_datetime' _('End date') %}</th>
-                <th>{% trans "Priority" %}</th>
-                <th>{% trans "Incentive" %}</th>
-                <th>{% trans "Condition" %}</th>
-                <th>{% trans "Is available?" %}</th>
-                <th>
-                    {% trans "Restrictions" %}
-                </th>
-                <th>
-                    {% anchor 'num_applications' _('Uses') %}
-                </th>
-                <th>
-                    {% anchor 'total_discount' _('Cost') %}
-                </th>
-                <th></th>
-            </tr>
-            {% for offer in offers %}
+            {% endfor %}
+            <button type="submit" class="btn btn-primary mr-2" data-loading-text="{% trans 'Searching...' %}">
+                {% trans "Search" %}
+            </button>
+            <a data-toggle="modal" data-target="#SearchModal" href="#" class="mr-2">
+                {% trans "Advanced Search" %}
+            </a>
+            <a href="{% url 'dashboard:offer-list' %}" class="btn btn-secondary">
+                {% trans "Reset" %}
+            </a>
+        </form>
+        {# Search modal, if there are form errors the form is automatically openend #}
+        {% include "oscar/dashboard/partials/advanced_search_modal.html" with form=advanced_form style='horizontal' %}
+        {% if search_filters %}
+            <div class="search-filter-list">
+                <label>Filters:</label>
+                {% for filter in search_filters %}
+                    <span class="badge badge-success">{{ filter }}</span>
+                {% endfor %}
+            </div>
+        {% endif %}
+    </div>
+    <form method="post" class="order_table">
+        {% csrf_token %}
+        <table class="table table-striped table-bordered table-hover">
+            <caption>
+            <i class="fas fa-gift"></i>
+            {% if search_filters %}
+                {% trans "Offer Search Results" %}
+            {% else %}
+                {% trans "All Offers" %}
+            {% endif %}
+            </caption>
+            {% if offers %}
                 <tr>
-                    <td>
-                        <a href="{% url 'dashboard:offer-detail' pk=offer.pk %}">
-                            {{ offer.name }}
-                        </a>
-                    </td>
-                    <td>
-                        {{ offer.offer_type }}
-                    </td>
+                    <th>{% anchor 'name' _('Offer name') %}</th>
+                    <th>{% anchor 'offer_type' _('Offer type') %}</th>
                     {% if form.is_bound %}
                         {% if form.is_voucher_offer_type or not form.cleaned_data.offer_type %}
-                            <td>
-                                {{ offer.vouchers.count }}
-                            </td>
+                            <th>{% trans "Num of vouchers" %}</th>
                         {% endif %}
                     {% endif %}
-                    <td>
-                        {{ offer.start_datetime|default:"-" }}
-                    </td>
-                    <td>
-                        {{ offer.end_datetime|default:"-" }}
-                    </td>
-                    <td>
-                        {{ offer.priority }}
-                    </td>
-                    <td>
-                        {{ offer.benefit.description|safe }}
-                    </td>
-                    <td>
-                        {{ offer.condition.description|safe }}
-                    </td>
-                    <td>
-                        {% if offer.is_available %}
-                            <span class="badge badge-success">{% trans "Yes" %}</span>
-                        {% else %}
-                            <span class="badge badge-danger">{% trans "No" %}</span>
-                        {% endif %}
-                    </td>
-                    <td>
-                        {% for restriction in offer.availability_restrictions %}
-                            {% if not restriction.is_satisfied %}
-                                <label class="badge badge-danger">
-                                    {{ restriction.description }}
-                                </label>
-                            {% else %}
-                                {{ restriction.description }}
-                                <br/>
+                    <th>{% anchor 'start_datetime' _('Start date') %}</th>
+                    <th>{% anchor 'end_datetime' _('End date') %}</th>
+                    <th>{% trans "Priority" %}</th>
+                    <th>{% trans "Incentive" %}</th>
+                    <th>{% trans "Condition" %}</th>
+                    <th>
+                        {% trans "Is available?" %}
+                    </th>
+                    <th>
+                        {% trans "Restrictions" %}
+                    </th>
+                    <th>
+                        {% anchor 'num_applications' _('Uses') %}
+                    </th>
+                    <th>
+                        {% anchor 'total_discount' _('Cost') %}
+                    </th>
+                    <th></th>
+                </tr>
+                {% for offer in offers %}
+                    <tr>
+                        <td>
+                            <a href="{% url 'dashboard:offer-detail' pk=offer.pk %}">
+                                {{ offer.name }}
+                            </a>
+                        </td>
+                        <td>
+                            {{ offer.offer_type }}
+                        </td>
+                        {% if form.is_bound %}
+                            {% if form.is_voucher_offer_type or not form.cleaned_data.offer_type %}
+                                <td>
+                                    {{ offer.vouchers.count }}
+                                </td>
                             {% endif %}
-                        {% endfor %}
-                    </td>
-                    <td>
-                        {{ offer.num_applications }}
-                    </td>
-                    <td>
-                        {{ offer.total_discount|currency }}
-                    </td>
-                    <td>
-                        <div class="btn-toolbar">
-                            <div class="dropdown">
-                                <button class="btn btn-secondary dropdown-toggle"
-                                        type="button"
-                                        id="dropdownMenuButton"
-                                        data-toggle="dropdown"
-                                        aria-haspopup="true"
-                                        aria-expanded="false">
-                                    {% trans "Actions" %}
-                                </button>
-                                <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
-                                    <a class="dropdown-item" href="{% url 'offer:detail' slug=offer.slug %}">
-                                        {% trans "Browse" %}
-                                    </a>
-                                    <a class="dropdown-item" href="{% url 'dashboard:offer-detail' pk=offer.pk %}">
-                                        {% trans "Stats" %}
-                                    </a>
-                                    <a class="dropdown-item" href="{% url 'dashboard:offer-metadata' pk=offer.pk %}">
-                                        {% trans "Edit" %}
-                                    </a>
-                                    {% if not offer.vouchers.exists %}
-                                        <a class="dropdown-item" href="{% url 'dashboard:offer-delete' pk=offer.pk %}">
-                                            {% trans "Delete" %}
+                        {% endif %}
+                        <td>
+                            {{ offer.start_datetime|default:"-" }}
+                        </td>
+                        <td>
+                            {{ offer.end_datetime|default:"-" }}
+                        </td>
+                        <td>
+                            {{ offer.priority }}
+                        </td>
+                        <td>
+                            {{ offer.benefit.description|safe }}
+                        </td>
+                        <td>
+                            {{ offer.condition.description|safe }}
+                        </td>
+                        <td>
+                            {% if offer.is_available %}
+                                <span class="badge badge-success">{% trans "Yes" %}</span>
+                            {% else %}
+                                <span class="badge badge-danger">{% trans "No" %}</span>
+                            {% endif %}
+                        </td>
+                        <td>
+                            {% for restriction in offer.availability_restrictions %}
+                                {% if not restriction.is_satisfied %}
+                                    <label class="badge badge-danger">{{ restriction.description }}</label>
+                                {% else %}
+                                    {{ restriction.description }}
+                                    <br/>
+                                {% endif %}
+                            {% endfor %}
+                        </td>
+                        <td>
+                            {{ offer.num_applications }}
+                        </td>
+                        <td>
+                            {{ offer.total_discount|currency }}
+                        </td>
+                        <td>
+                            <div class="btn-toolbar">
+                                <div class="dropdown">
+                                    <button class="btn btn-secondary dropdown-toggle"
+                                            type="button"
+                                            id="dropdownMenuButton"
+                                            data-toggle="dropdown"
+                                            aria-haspopup="true"
+                                            aria-expanded="false">
+                                        {% trans "Actions" %}
+                                    </button>
+                                    <div class="dropdown-menu dropdown-menu-right"
+                                         aria-labelledby="dropdownMenuButton">
+                                        <a class="dropdown-item" href="{% url 'offer:detail' slug=offer.slug %}">
+                                            {% trans "Browse" %}
                                         </a>
-                                    {% endif %}
+                                        <a class="dropdown-item" href="{% url 'dashboard:offer-detail' pk=offer.pk %}">
+                                            {% trans "Stats" %}
+                                        </a>
+                                        <a class="dropdown-item"
+                                           href="{% url 'dashboard:offer-metadata' pk=offer.pk %}">
+                                            {% trans "Edit" %}
+                                        </a>
+                                        {% if not offer.vouchers.exists %}
+                                            <a class="dropdown-item"
+                                               href="{% url 'dashboard:offer-delete' pk=offer.pk %}">
+                                                {% trans "Delete" %}
+                                            </a>
+                                        {% endif %}
+                                    </div>
                                 </div>
                             </div>
-                        </div>
+                        </td>
+                    </tr>
+                {% endfor %}
+            {% else %}
+                <tr>
+                    <td>
+                        {% trans "No offers found." %}
                     </td>
                 </tr>
-            {% endfor %}
-        {% else %}
-            <tr>
-                <td>
-                    {% trans "No offers found." %}
-                </td>
-            </tr>
-        {% endif %}
-    </table>
-    {% include "oscar/dashboard/partials/pagination.html" %}
-</form>
+            {% endif %}
+        </table>
+        {% include "oscar/dashboard/partials/pagination.html" %}
+    </form>
 {% endblock dashboard_content %}
 {% block onbodyload %}
-{{ block.super }}
-{% if advanced_form.errors %}$('#SearchModal').modal('show');{% endif %}
+    {{ block.super }}
+    {% if advanced_form.errors %}$('#SearchModal').modal('show');{% endif %}
 {% endblock onbodyload %}
diff --git a/tests/django_oscar/oscar/dashboard/offers/progress.html b/tests/django_oscar/oscar/dashboard/offers/progress.html
index 79d6504..2811d10 100644
--- a/tests/django_oscar/oscar/dashboard/offers/progress.html
+++ b/tests/django_oscar/oscar/dashboard/offers/progress.html
@@ -8,42 +8,42 @@
             {% if step == 2 or step == 3 or step == 4 %}
                 <a href="{% if session_offer.pk %}{% url 'dashboard:offer-metadata' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-metadata' %}{% endif %}"
                    class="nav-link visited">
-                {% trans "1. Name, description and type" %}
+                    {% trans "1. Name, description and type" %}
+                </a>
+            {% else %}
+                <a class="nav-link {% if step == 1 %}active{% else %}disabled text-reset{% endif %}">
+                    {% trans "1. Name, description and type" %}
+                </a>
+            {% endif %}
+        </li>
+        <li class="nav-item step2">
+            {% if step == 3 or step == 4 %}
+                <a href="{% if session_offer.pk %}{% url 'dashboard:offer-benefit' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-benefit' %}{% endif %}"
+                   class="nav-link visited">
+                    {% trans "2. Incentive" %}
+                </a>
+            {% else %}
+                <a class="nav-link {% if step == 2 %}active{% else %}disabled text-reset{% endif %}">
+                    {% trans "2. Incentive" %}
+                </a>
+            {% endif %}
+        </li>
+        <li class="nav-item step3">
+            {% if step == 4 %}
+                <a href="{% if session_offer.pk %}{% url 'dashboard:offer-condition' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-condition' %}{% endif %}"
+                   class="nav-link visited">
+                    {% trans "3. Condition" %}
+                </a>
+            {% else %}
+                <a class="nav-link {% if step == 3 %}active{% else %}disabled text-reset{% endif %}">
+                    {% trans "3. Condition" %}
+                </a>
+            {% endif %}
+        </li>
+        <li class="nav-item step4">
+            <a class="nav-link {% if step == 4 %}active{% else %}disabled text-reset{% endif %}">
+                {% trans "4. Restrictions" %}
             </a>
-        {% else %}
-            <a class="nav-link {% if step == 1 %}active{% else %}disabled text-reset{% endif %}">
-            {% trans "1. Name, description and type" %}
-        </a>
-    {% endif %}
-</li>
-<li class="nav-item step2">
-    {% if step == 3 or step == 4 %}
-        <a href="{% if session_offer.pk %}{% url 'dashboard:offer-benefit' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-benefit' %}{% endif %}"
-           class="nav-link visited">
-        {% trans "2. Incentive" %}
-    </a>
-{% else %}
-    <a class="nav-link {% if step == 2 %}active{% else %}disabled text-reset{% endif %}">
-    {% trans "2. Incentive" %}
-</a>
-{% endif %}
-</li>
-<li class="nav-item step3">
-{% if step == 4 %}
-<a href="{% if session_offer.pk %}{% url 'dashboard:offer-condition' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-condition' %}{% endif %}"
-   class="nav-link visited">
-{% trans "3. Condition" %}
-</a>
-{% else %}
-<a class="nav-link {% if step == 3 %}active{% else %}disabled text-reset{% endif %}">
-{% trans "3. Condition" %}
-</a>
-{% endif %}
-</li>
-<li class="nav-item step4">
-<a class="nav-link {% if step == 4 %}active{% else %}disabled text-reset{% endif %}">
-{% trans "4. Restrictions" %}
-</a>
-</li>
-</ul>
+        </li>
+    </ul>
 </div>
diff --git a/tests/django_oscar/oscar/dashboard/offers/restrictions_form.html b/tests/django_oscar/oscar/dashboard/offers/restrictions_form.html
index 60daffe..161453c 100644
--- a/tests/django_oscar/oscar/dashboard/offers/restrictions_form.html
+++ b/tests/django_oscar/oscar/dashboard/offers/restrictions_form.html
@@ -1,11 +1,13 @@
 {% extends 'oscar/dashboard/offers/step_form.html' %}
 {% load i18n %}
 {% block summary %}
-    {% include 'oscar/dashboard/offers/summary.html' %}{% endblock %}
-    {% block progress %}
-        {% include 'oscar/dashboard/offers/progress.html' with step=4 %}{% endblock %}
-        {% block form_actions_buttons %}
-            <button class="btn btn-primary" type="submit" data-loading-text="{% trans 'Saving...' %}">
-                {% trans "Save this offer" %}
-            </button>
-        {% endblock %}
+    {% include 'oscar/dashboard/offers/summary.html' %}
+{% endblock %}
+{% block progress %}
+    {% include 'oscar/dashboard/offers/progress.html' with step=4 %}
+{% endblock %}
+{% block form_actions_buttons %}
+    <button class="btn btn-primary" type="submit" data-loading-text="{% trans 'Saving...' %}">
+        {% trans "Save this offer" %}
+    </button>
+{% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/offers/step_form.html b/tests/django_oscar/oscar/dashboard/offers/step_form.html
index 885f634..4d63d14 100644
--- a/tests/django_oscar/oscar/dashboard/offers/step_form.html
+++ b/tests/django_oscar/oscar/dashboard/offers/step_form.html
@@ -51,9 +51,10 @@
     <div class="row">
         <div class="col-md-3">
             {% block progress %}
-                {% include 'oscar/dashboard/offers/progress.html' %}{% endblock %}
-            </div>
-            <div class="{% if session_offer %}col-md-6{% else %}col-md-9{% endif %}">
+                {% include 'oscar/dashboard/offers/progress.html' %}
+            {% endblock %}
+        </div>
+        <div class="{% if session_offer %}col-md-6{% else %}col-md-9{% endif %}">
             <form method="post" class="form-stacked wysiwyg fixed-actions">
                 <div class="table-header">
                     <h3>{{ title }}</h3>
@@ -61,45 +62,47 @@
                 <div class="card card-body">
                     {% csrf_token %}
                     {% block form_fields %}
-                        {% include "oscar/dashboard/partials/form_fields.html" with form=form %}{% endblock %}
-                        {% block form_extradata %}{% endblock %}
-                    </div>
-                    {% block form_actions %}
-                        <div class="fixed-actions-group">
-                            <div class="form-actions">
-                                <div class="float-right">
-                                    {% block form_actions_buttons %}
-                                        <button class="btn btn-primary"
+                        {% include "oscar/dashboard/partials/form_fields.html" with form=form %}
+                    {% endblock %}
+                    {% block form_extradata %}{% endblock %}
+                </div>
+                {% block form_actions %}
+                    <div class="fixed-actions-group">
+                        <div class="form-actions">
+                            <div class="float-right">
+                                {% block form_actions_buttons %}
+                                    <button class="btn btn-primary"
+                                            type="submit"
+                                            data-loading-text="{% trans 'Submitting...' %}">
+                                        {% block submittext %}
+                                            {% trans "Continue" %}
+                                        {% endblock %}
+                                    </button>
+                                    {% if offer %}
+                                        {# When editing offer, show saving button #}
+                                        <button class="btn btn-secondary"
+                                                name="save"
                                                 type="submit"
-                                                data-loading-text="{% trans 'Submitting...' %}">
-                                            {% block submittext %}
-                                                {% trans "Continue" %}
-                                            {% endblock %}
+                                                data-loading-text="{% trans 'Saving...' %}">
+                                            {% trans "Save changes" %}
                                         </button>
-                                        {% if offer %}
-                                            {# When editing offer, show saving button #}
-                                            <button class="btn btn-secondary"
-                                                    name="save"
-                                                    type="submit"
-                                                    data-loading-text="{% trans 'Saving...' %}">
-                                                {% trans "Save changes" %}
-                                            </button>
-                                        {% endif %}
-                                    {% endblock %}
-                                </div>
-                                <a class="btn btn-secondary" href="{% url 'dashboard:offer-list' %}">
-                                    {% trans "cancel" %}
-                                </a>
+                                    {% endif %}
+                                {% endblock %}
                             </div>
+                            <a class="btn btn-secondary" href="{% url 'dashboard:offer-list' %}">
+                                {% trans "cancel" %}
+                            </a>
                         </div>
-                    {% endblock form_actions %}
-                </form>
-            </div>
-            {% if session_offer %}
-                <div class="col-md-3">
-                    {% block summary %}
-                        {% include 'oscar/dashboard/offers/summary.html' %}{% endblock %}
                     </div>
-                {% endif %}
+                {% endblock form_actions %}
+            </form>
+        </div>
+        {% if session_offer %}
+            <div class="col-md-3">
+                {% block summary %}
+                    {% include 'oscar/dashboard/offers/summary.html' %}
+                {% endblock %}
             </div>
-        {% endblock dashboard_content %}
+        {% endif %}
+    </div>
+{% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/offers/summary.html b/tests/django_oscar/oscar/dashboard/offers/summary.html
index 6add8ab..ddef7ba 100644
--- a/tests/django_oscar/oscar/dashboard/offers/summary.html
+++ b/tests/django_oscar/oscar/dashboard/offers/summary.html
@@ -8,80 +8,80 @@
             <div class="d-flex">
                 <a href="{% if session_offer.pk %}{% url 'dashboard:offer-metadata' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-metadata' %}{% endif %}"
                    class="btn btn-secondary ml-auto">
-                {% trans "Edit" %}
-            </a>
-        </div>
-        <p>
-            <strong>{% trans "Name" %}:</strong>
-            <br />
-            {{ session_offer.name }}
-        </p>
-        {% if session_offer.description %}
+                    {% trans "Edit" %}
+                </a>
+            </div>
             <p>
-                <strong>{% trans "Description" %}:</strong>
+                <strong>{% trans "Name" %}:</strong>
                 <br />
-                {{ session_offer.description|safe|striptags|truncatewords:8 }}
+                {{ session_offer.name }}
             </p>
-        {% endif %}
-        <p>
-            <strong>{% trans "Type" %}:</strong>
-            <br />
-            {{ session_offer.offer_type }}
-        </p>
-    </div>
-{% endif %}
-{% if session_offer.benefit %}
-    <div class="card card-body">
-        <div class="d-flex">
-            <a href="{% if session_offer.pk %}{% url 'dashboard:offer-benefit' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-benefit' %}{% endif %}"
-               class="btn btn-secondary ml-auto">
-            {% trans "Edit" %}
-        </a>
-    </div>
-    <p>
-        <strong>{% trans "Incentive" %}:</strong>
-        <br />
-        {{ session_offer.benefit.description|safe }}
-    </p>
-</div>
-{% endif %}
-{% if session_offer.condition %}
-<div class="card card-body">
-    <div class="d-flex">
-        <a href="{% if session_offer.pk %}{% url 'dashboard:offer-condition' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-condition' %}{% endif %}"
-           class="btn btn-secondary ml-auto">
-        {% trans "Edit" %}
-    </a>
-</div>
-<p>
-    <strong>{% trans "Condition" %}:</strong>
-    <br />
-    {{ session_offer.condition.description|safe }}
-</p>
-</div>
-{% endif %}
-{% if session_offer.pk %}
-<div class="card card-body">
-<div class="d-flex">
-    <a href="{% if session_offer.pk %}{% url 'dashboard:offer-restrictions' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-restrictions' %}{% endif %}"
-       class="btn btn-secondary ml-auto">
-    {% trans "Edit" %}
-</a>
-</div>
-<p>
-<strong>{% trans "Restrictions" %}:</strong>
-</p>
-{% if offer.availability_restrictions %}
-<ul>
-    {% for restriction in offer.availability_restrictions %}
-        <li>
-            {{ restriction.description }}
-        </li>
-    {% endfor %}
-</ul>
-{% else %}
--
-{% endif %}
-</div>
-{% endif %}
+            {% if session_offer.description %}
+                <p>
+                    <strong>{% trans "Description" %}:</strong>
+                    <br />
+                    {{ session_offer.description|safe|striptags|truncatewords:8 }}
+                </p>
+            {% endif %}
+            <p>
+                <strong>{% trans "Type" %}:</strong>
+                <br />
+                {{ session_offer.offer_type }}
+            </p>
+        </div>
+    {% endif %}
+    {% if session_offer.benefit %}
+        <div class="card card-body">
+            <div class="d-flex">
+                <a href="{% if session_offer.pk %}{% url 'dashboard:offer-benefit' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-benefit' %}{% endif %}"
+                   class="btn btn-secondary ml-auto">
+                    {% trans "Edit" %}
+                </a>
+            </div>
+            <p>
+                <strong>{% trans "Incentive" %}:</strong>
+                <br />
+                {{ session_offer.benefit.description|safe }}
+            </p>
+        </div>
+    {% endif %}
+    {% if session_offer.condition %}
+        <div class="card card-body">
+            <div class="d-flex">
+                <a href="{% if session_offer.pk %}{% url 'dashboard:offer-condition' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-condition' %}{% endif %}"
+                   class="btn btn-secondary ml-auto">
+                    {% trans "Edit" %}
+                </a>
+            </div>
+            <p>
+                <strong>{% trans "Condition" %}:</strong>
+                <br />
+                {{ session_offer.condition.description|safe }}
+            </p>
+        </div>
+    {% endif %}
+    {% if session_offer.pk %}
+        <div class="card card-body">
+            <div class="d-flex">
+                <a href="{% if session_offer.pk %}{% url 'dashboard:offer-restrictions' pk=session_offer.pk %}{% else %}{% url 'dashboard:offer-restrictions' %}{% endif %}"
+                   class="btn btn-secondary ml-auto">
+                    {% trans "Edit" %}
+                </a>
+            </div>
+            <p>
+                <strong>{% trans "Restrictions" %}:</strong>
+            </p>
+            {% if offer.availability_restrictions %}
+                <ul>
+                    {% for restriction in offer.availability_restrictions %}
+                        <li>
+                            {{ restriction.description }}
+                        </li>
+                    {% endfor %}
+                </ul>
+            {% else %}
+                -
+            {% endif %}
+        </div>
+    {% endif %}
 </div>
diff --git a/tests/django_oscar/oscar/dashboard/orders/line_detail.html b/tests/django_oscar/oscar/dashboard/orders/line_detail.html
index 172378e..9f8ac93 100644
--- a/tests/django_oscar/oscar/dashboard/orders/line_detail.html
+++ b/tests/django_oscar/oscar/dashboard/orders/line_detail.html
@@ -203,70 +203,70 @@
                     {% for event_qty in line.shipping_event_quantities.all %}
                         <tr>
                             {% with event=event_qty.event %}
-                            <td>
-                                {{ event.event_type.name }}
-                            </td>
-                            <td>
-                                {{ event_qty.quantity }}
-                            </td>
-                            <td>
-                                {{ event.notes }}
-                            </td>
-                            <td>
-                                {{ event.date_created }}
-                            </td>
-                        {% endwith %}
-                    </tr>
-                    {% empty %}
-                    <tr>
-                        <td colspan="4">{% trans "No shipping events have occurred." %}</td>
-                    </tr>
-                {% endfor %}
-            </tbody>
-        </table>
-    </div>
-    <div class="col-md-4">
-        <div class="table-header">
-            <h3>
-                {% trans "Payment events" %}
-            </h3>
+                                <td>
+                                    {{ event.event_type.name }}
+                                </td>
+                                <td>
+                                    {{ event_qty.quantity }}
+                                </td>
+                                <td>
+                                    {{ event.notes }}
+                                </td>
+                                <td>
+                                    {{ event.date_created }}
+                                </td>
+                            {% endwith %}
+                        </tr>
+                        {% empty %}
+                        <tr>
+                            <td colspan="4">{% trans "No shipping events have occurred." %}</td>
+                        </tr>
+                    {% endfor %}
+                </tbody>
+            </table>
         </div>
-        <table class="table table-striped table-bordered">
-            <thead>
-                <tr>
-                    <th>
-                        {% trans "Event" %}
-                    </th>
-                    <th>
-                        {% trans "Quantity" %}
-                    </th>
-                    <th>
-                        {% trans "Date" %}
-                    </th>
-                </tr>
-            </thead>
-            <tbody>
-                {% for event_qty in line.payment_event_quantities.all %}
+        <div class="col-md-4">
+            <div class="table-header">
+                <h3>
+                    {% trans "Payment events" %}
+                </h3>
+            </div>
+            <table class="table table-striped table-bordered">
+                <thead>
                     <tr>
-                        {% with event=event_qty.event %}
-                        <td>
-                            {{ event.event_type.name }}
-                        </td>
-                        <td>
-                            {{ event_qty.quantity }}
-                        </td>
-                        <td>
-                            {{ event.date_created }}
-                        </td>
-                    {% endwith %}
-                </tr>
-                {% empty %}
-                <tr>
-                    <td colspan="3">{% trans "No payment events have occurred." %}</td>
-                </tr>
-            {% endfor %}
-        </tbody>
-    </table>
-</div>
-</div>
+                        <th>
+                            {% trans "Event" %}
+                        </th>
+                        <th>
+                            {% trans "Quantity" %}
+                        </th>
+                        <th>
+                            {% trans "Date" %}
+                        </th>
+                    </tr>
+                </thead>
+                <tbody>
+                    {% for event_qty in line.payment_event_quantities.all %}
+                        <tr>
+                            {% with event=event_qty.event %}
+                                <td>
+                                    {{ event.event_type.name }}
+                                </td>
+                                <td>
+                                    {{ event_qty.quantity }}
+                                </td>
+                                <td>
+                                    {{ event.date_created }}
+                                </td>
+                            {% endwith %}
+                        </tr>
+                        {% empty %}
+                        <tr>
+                            <td colspan="3">{% trans "No payment events have occurred." %}</td>
+                        </tr>
+                    {% endfor %}
+                </tbody>
+            </table>
+        </div>
+    </div>
 {% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/orders/order_detail.html b/tests/django_oscar/oscar/dashboard/orders/order_detail.html
index 57811f1..6a4f7cb 100644
--- a/tests/django_oscar/oscar/dashboard/orders/order_detail.html
+++ b/tests/django_oscar/oscar/dashboard/orders/order_detail.html
@@ -99,18 +99,18 @@
         </table>
     {% endblock order_information %}
     {% block additional_order_information %}{% endblock additional_order_information %}
-        <div class="sub-header">
-            <h2>
-                {% trans "Order Details" %}
-            </h2>
-        </div>
-        <div class="tabbable dashboard">
-            <ul class="nav nav-tabs mb-0" role="tablist">
-                {% block nav_tabs %}
-                    <li class="nav-item">
-                        <a class="nav-link {% if active_tab == 'lines' %}active{% endif %}"
-                           href="#lines"
-                           data-toggle="tab">
+    <div class="sub-header">
+        <h2>
+            {% trans "Order Details" %}
+        </h2>
+    </div>
+    <div class="tabbable dashboard">
+        <ul class="nav nav-tabs mb-0" role="tablist">
+            {% block nav_tabs %}
+                <li class="nav-item">
+                    <a class="nav-link {% if active_tab == 'lines' %}active{% endif %}"
+                       href="#lines"
+                       data-toggle="tab">
                         {% trans "Order contents" %}
                     </a>
                 </li>
@@ -118,971 +118,983 @@
                     <a class="nav-link {% if active_tab == 'shipping' %}active{% endif %}"
                        href="#shipping"
                        data-toggle="tab">
-                    {% trans "Shipping" %}
-                </a>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link {% if active_tab == 'payment' %}active{% endif %}"
-                   href="#payment"
-                   data-toggle="tab">
-                {% trans "Payment" %}
-            </a>
-        </li>
-        <li class="nav-item">
-            <a class="nav-link {% if active_tab == 'discounts' %}active{% endif %}"
-               href="#discounts"
-               data-toggle="tab">
-            {% trans "Discounts" %}
-        </a>
-    </li>
-    <li class="nav-item">
-        <a class="nav-link {% if active_tab == 'notes' %}active{% endif %}" href="#notes" data-toggle="tab">
-        {% trans "Notes" %}
-    </a>
-</li>
-{% endblock nav_tabs %}
-</ul>
-<div class="tab-content">
-<div class="tab-pane fade {% if active_tab == 'lines' %}show active{% endif %}" id="lines" role="tabpanel">
-<div class="table-header">
-<h3>
-    {% trans "Items ordered" %}
-</h3>
-</div>
-<form id="order_lines_form" method="post" class="form-inline">
-{% csrf_token %}
-{% block order_lines %}
-    <table class="table table-striped table-bordered table-hover">
-        <thead>
-            <tr>
-                <th></th>
-                <th></th>
-                <th>
-                    {% trans "Line ID" %}
-                </th>
-                <th>
-                    {% trans "Quantity" %}
-                </th>
-                <th>
-                    {% trans "Product" %}
-                </th>
-                <th>
-                    {% trans "UPC" %}
-                </th>
-                <th>
-                    {% trans "Status" %}
-                </th>
-                <th>
-                    {% trans "Supplier" %}
-                </th>
-                <th>
-                    {% trans "Supplier SKU" %}
-                </th>
-                <th>
-                    {% trans "Price excl tax (before discounts)" %}
-                </th>
-                <th>
-                    {% trans "Price inc tax (before discounts)" %}
-                </th>
-                <th>
-                    {% trans "Actions" %}
-                </th>
-            </tr>
-        </thead>
-        <tbody>
-            {% for line in lines %}
-                <tr>
-                    <td>
-                        <input type="checkbox" name="selected_line" value="{{ line.id }}" />
-                    </td>
-                    <td>
-                        <input type="text"
-                               name="selected_line_qty_{{ line.id }}"
-                               value="{{ line.quantity }}"
-                               size="2"
-                               style="width:40px"/>
-                    </td>
-                    <td>
-                        <a href="{% url 'dashboard:order-line-detail' number=order.number line_id=line.id %}">
-                            #{{ line.id }}
-                        </a>
-                    </td>
-                    <td>
-                        {{ line.quantity }}
-                    </td>
-                    <td>
-                        {% if line.product %}
-                            <a href="{% url 'dashboard:catalogue-product' pk=line.product.id %}">
-                                {{ line.title }}
-                            </a>
+                        {% trans "Shipping" %}
+                    </a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link {% if active_tab == 'payment' %}active{% endif %}"
+                       href="#payment"
+                       data-toggle="tab">
+                        {% trans "Payment" %}
+                    </a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link {% if active_tab == 'discounts' %}active{% endif %}"
+                       href="#discounts"
+                       data-toggle="tab">
+                        {% trans "Discounts" %}
+                    </a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link {% if active_tab == 'notes' %}active{% endif %}"
+                       href="#notes"
+                       data-toggle="tab">
+                        {% trans "Notes" %}
+                    </a>
+                </li>
+            {% endblock nav_tabs %}
+        </ul>
+        <div class="tab-content">
+            <div class="tab-pane fade {% if active_tab == 'lines' %}show active{% endif %}" id="lines" role="tabpanel">
+                <div class="table-header">
+                    <h3>
+                        {% trans "Items ordered" %}
+                    </h3>
+                </div>
+                <form id="order_lines_form" method="post" class="form-inline">
+                    {% csrf_token %}
+                    {% block order_lines %}
+                        <table class="table table-striped table-bordered table-hover">
+                            <thead>
+                                <tr>
+                                    <th></th>
+                                    <th></th>
+                                    <th>
+                                        {% trans "Line ID" %}
+                                    </th>
+                                    <th>
+                                        {% trans "Quantity" %}
+                                    </th>
+                                    <th>
+                                        {% trans "Product" %}
+                                    </th>
+                                    <th>
+                                        {% trans "UPC" %}
+                                    </th>
+                                    <th>
+                                        {% trans "Status" %}
+                                    </th>
+                                    <th>
+                                        {% trans "Supplier" %}
+                                    </th>
+                                    <th>
+                                        {% trans "Supplier SKU" %}
+                                    </th>
+                                    <th>
+                                        {% trans "Price excl tax (before discounts)" %}
+                                    </th>
+                                    <th>
+                                        {% trans "Price inc tax (before discounts)" %}
+                                    </th>
+                                    <th>
+                                        {% trans "Actions" %}
+                                    </th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                {% for line in lines %}
+                                    <tr>
+                                        <td>
+                                            <input type="checkbox" name="selected_line" value="{{ line.id }}" />
+                                        </td>
+                                        <td>
+                                            <input type="text"
+                                                   name="selected_line_qty_{{ line.id }}"
+                                                   value="{{ line.quantity }}"
+                                                   size="2"
+                                                   style="width:40px"/>
+                                        </td>
+                                        <td>
+                                            <a href="{% url 'dashboard:order-line-detail' number=order.number line_id=line.id %}">
+                                                #{{ line.id }}
+                                            </a>
+                                        </td>
+                                        <td>
+                                            {{ line.quantity }}
+                                        </td>
+                                        <td>
+                                            {% if line.product %}
+                                                <a href="{% url 'dashboard:catalogue-product' pk=line.product.id %}">
+                                                    {{ line.title }}
+                                                </a>
+                                            {% else %}
+                                                {{ line.title }}
+                                            {% endif %}
+                                        </td>
+                                        <td>
+                                            {{ line.upc|default:"-" }}
+                                        </td>
+                                        <td>
+                                            {{ line.status|default:"-" }}
+                                        </td>
+                                        <td>
+                                            {% if line.partner %}
+                                                <a href="{% url 'dashboard:partner-manage' pk=line.partner.id %}">
+                                                    {{ line.partner_name }}
+                                                </a>
+                                            {% else %}
+                                                {{ line.partner_name }}
+                                            {% endif %}
+                                        </td>
+                                        <td>
+                                            {{ line.partner_sku }}
+                                        </td>
+                                        <td class="text-right">
+                                            {{ line.line_price_before_discounts_excl_tax|currency:order.currency }}
+                                        </td>
+                                        <td class="text-right">
+                                            {{ line.line_price_before_discounts_incl_tax|currency:order.currency }}
+                                        </td>
+                                        <td>
+                                            <a href="{% url 'dashboard:order-line-detail' number=order.number line_id=line.id %}"
+                                               class="btn btn-secondary">
+                                                {% trans "View" %}
+                                            </a>
+                                        </td>
+                                    </tr>
+                                {% endfor %}
+                                <tr>
+                                    <td colspan="8"></td>
+                                    <th>
+                                        {% trans "Discount" %}
+                                    </th>
+                                    <td class="text-right">
+                                        {{ order.total_discount_excl_tax|currency:order.currency }}
+                                    </td>
+                                    <td class="text-right">
+                                        {{ order.total_discount_incl_tax|currency:order.currency }}
+                                    </td>
+                                    <td></td>
+                                </tr>
+                                {% with discounts=order.basket_discounts %}
+                                    {% if discounts %}
+                                        <tr>
+                                            <td colspan="8"></td>
+                                            <th>
+                                                {% trans "Basket total (excl. discounts)" %}
+                                            </th>
+                                            <td class="text-right">
+                                                {{ order.basket_total_before_discounts_excl_tax|currency:order.currency }}
+                                            </td>
+                                            <td class="text-right">
+                                                {{ order.basket_total_before_discounts_incl_tax|currency:order.currency }}
+                                            </td>
+                                            <td></td>
+                                        </tr>
+                                        {% for discount in discounts %}
+                                            <tr>
+                                                <td colspan="8"></td>
+                                                <td>
+                                                    <span class="badge badge-success">{% trans "Discount" %}</span>
+                                                    {{ discount.offer_name }}
+                                                </td>
+                                                <td class="text-right"></td>
+                                                <td class="text-right">- {{ discount.amount|currency:order.currency }}</td>
+                                                <td></td>
+                                            </tr>
+                                        {% endfor %}
+                                        <tr>
+                                            <td colspan="8"></td>
+                                            <th>
+                                                {% trans "Basket total (inc. discounts)" %}
+                                            </th>
+                                            <th class="text-right">
+                                                {{ order.basket_total_excl_tax|currency:order.currency }}
+                                            </th>
+                                            <th class="text-right">
+                                                {{ order.basket_total_incl_tax|currency:order.currency }}
+                                            </th>
+                                            <td></td>
+                                        </tr>
+                                    {% else %}
+                                        <tr>
+                                            <td colspan="8"></td>
+                                            <th>
+                                                {% trans "Basket total" %}
+                                            </th>
+                                            <th class="text-right">
+                                                {{ order.basket_total_excl_tax|currency:order.currency }}
+                                            </th>
+                                            <th class="text-right">
+                                                {{ order.basket_total_incl_tax|currency:order.currency }}
+                                            </th>
+                                            <td></td>
+                                        </tr>
+                                    {% endif %}
+                                {% endwith %}
+                                {% if order.has_shipping_discounts %}
+                                    <tr>
+                                        <td colspan="8"></td>
+                                        <td>
+                                            {% trans "Shipping total (excl. discounts)" %}
+                                        </td>
+                                        <td class="text-right">
+                                            {{ order.shipping_before_discounts_excl_tax|currency:order.currency }}
+                                        </td>
+                                        <td class="text-right">
+                                            {{ order.shipping_before_discounts_incl_tax|currency:order.currency }}
+                                        </td>
+                                        <td></td>
+                                    </tr>
+                                    {% for discount in order.shipping_discounts %}
+                                        <tr>
+                                            <td colspan="8"></td>
+                                            <td>
+                                                <span class="badge badge-success">
+                                                    {% trans "Discount" %}
+                                                </span>
+                                                {{ discount.offer_name }}
+                                            </td>
+                                            <td></td>
+                                            <td class="text-right">
+                                                - {{ discount.amount|currency:order.currency }}
+                                            </td>
+                                            <td></td>
+                                        </tr>
+                                    {% endfor %}
+                                    <tr>
+                                        <td colspan="8"></td>
+                                        <th>
+                                            {% trans "Shipping total (inc. discounts)" %}
+                                        </th>
+                                        <th class="text-right">
+                                            {{ order.shipping_excl_tax|currency:order.currency }}
+                                        </th>
+                                        <th class="text-right">
+                                            {{ order.shipping_incl_tax|currency:order.currency }}
+                                        </th>
+                                        <td></td>
+                                    </tr>
+                                {% else %}
+                                    <tr>
+                                        <td colspan="8"></td>
+                                        <th>
+                                            {% trans "Shipping total" %}
+                                        </th>
+                                        <th class="text-right">
+                                            {{ order.shipping_excl_tax|currency:order.currency }}
+                                        </th>
+                                        <th class="text-right">
+                                            {{ order.shipping_incl_tax|currency:order.currency }}
+                                        </th>
+                                        <td></td>
+                                    </tr>
+                                {% endif %}
+                                {% with surcharges=order.surcharges.all %}
+                                    {% if surcharges %}
+                                        {% for charge in surcharges %}
+                                            <tr>
+                                                <td colspan="8"></td>
+                                                <th>
+                                                    {% blocktrans with name=charge.name %}Surcharge {{ name }}{% endblocktrans %}
+                                                    </th>
+                                                    <th class="text-right">
+                                                        {{ charge.excl_tax|currency:order.currency }}
+                                                    </th>
+                                                    <th class="text-right">
+                                                        {{ charge.incl_tax|currency:order.currency }}
+                                                    </th>
+                                                    <td></td>
+                                                </tr>
+                                            {% endfor %}
+                                        {% endif %}
+                                    {% endwith %}
+                                    <tr>
+                                        <td colspan="8"></td>
+                                        <th>
+                                            {% trans "Order total" %}
+                                        </th>
+                                        <th class="text-right">
+                                            {{ order.total_excl_tax|currency:order.currency }}
+                                        </th>
+                                        <th class="text-right">
+                                            {{ order.total_incl_tax|currency:order.currency }}
+                                        </th>
+                                        <td></td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                        {% endblock order_lines %}
+                        {% comment %}
+                        This is the important block within this template: you will almost certainly want to
+                        override this block to provide your own form widgets that suit your order processing
+                        flow. The default contents shows a range of widgets - more than is sensible really.
+                    {% endcomment %}
+                    {% block line_actions %}
+                        <div class="card card-body bg-light">
+                            <h3>
+                                {% trans "With selected lines" %}:
+                            </h3>
+                            <div class="form-inline mb-sm-2">
+                                <div class="form-group">
+                                    <div class="form-check">
+                                        <input id="line_status_check"
+                                               class="form-check-input"
+                                               type="radio"
+                                               name="line_action"
+                                               value="change_line_statuses"/>
+                                        <label for="line_status_check" class="form-check-label">
+                                            {% trans "Change line status to" %}
+                                        </label>
+                                    </div>
+                                </div>
+                                <div class="form-group">
+                                    <label class="sr-only" for="new_status_select">
+                                        {% trans "choose new status" %}
+                                    </label>
+                                    <select id="new_status_select" name="new_status">
+                                        <option value="">
+                                            -- {% trans "choose new status" %} --
+                                        </option>
+                                        {% for status in line_statuses %}
+                                            <option>
+                                                {{ status }}
+                                            </option>
+                                        {% endfor %}
+                                    </select>
+                                </div>
+                            </div>
+                            <div class="form-inline mb-sm-2">
+                                <div class="form-group">
+                                    <div class="form-check">
+                                        <input id="shipping_event_check"
+                                               class="form-check-input"
+                                               type="radio"
+                                               name="line_action"
+                                               value="create_shipping_event"/>
+                                        <label for="shipping_event_check" class="form-check-label">
+                                            {% trans "Create shipping event" %}
+                                        </label>
+                                    </div>
+                                </div>
+                                <div class="form-group mr-1">
+                                    <label class="sr-only" for="shipping_event_type_select">
+                                        {% trans "choose event type" %}
+                                    </label>
+                                    <select id="shipping_event_type_select" name="shipping_event_type">
+                                        <option value="">
+                                            -- {% trans "choose event type" %} --
+                                        </option>
+                                        {% for event_type in shipping_event_types %}
+                                            <option value="{{ event_type.code }}">
+                                                {{ event_type.name }}
+                                            </option>
+                                        {% endfor %}
+                                    </select>
+                                </div>
+                                <div class="form-group">
+                                    <label for="reference_input">
+                                        {% trans "with reference" %}
+                                    </label>
+                                    <input id="reference_input" type="text" name="reference" value="" />
+                                </div>
+                            </div>
+                            <div class="form-inline mb-sm-2">
+                                <div class="form-group">
+                                    <div class="form-check">
+                                        <input id="payment_event_check"
+                                               class="form-check-input"
+                                               type="radio"
+                                               name="line_action"
+                                               value="create_payment_event"/>
+                                        <label for="payment_event_check" class="form-check-label">
+                                            {% trans "Create payment event" %}
+                                        </label>
+                                    </div>
+                                </div>
+                                <div class="form-group mr-1">
+                                    <label class="sr-only" for="payment_event_type_select">
+                                        {% trans "choose event type" %}
+                                    </label>
+                                    <select id="payment_event_type_select" name="payment_event_type">
+                                        <option value="">
+                                            -- {% trans "choose event type" %} --
+                                        </option>
+                                        {% for event_type in payment_event_types %}
+                                            <option value="{{ event_type.code }}">
+                                                {{ event_type.name }}
+                                            </option>
+                                        {% endfor %}
+                                    </select>
+                                </div>
+                                <div class="form-group">
+                                    <label for="amount_input">
+                                        {% trans "with amount" %}
+                                    </label>
+                                    <input id="amount_input" type="text" name="amount" value="" />
+                                </div>
+                            </div>
+                            <div class="flex-nowrap">
+                                <button type="submit" class="btn btn-primary">
+                                    {% trans "Go!" %}
+                                </button>
+                            </div>
+                        </div>
+                    {% endblock line_actions %}
+                </form>
+                <form method="post" id="order_status_form">
+                    {% csrf_token %}
+                    {% block order_actions %}
+                        <div class="card card-body bg-light">
+                            <h3>
+                                <i class="fas fa-exclamation-triangle"></i>
+                                {% trans "Change order status" %}:
+                            </h3>
+                            {% if order_status_form.has_choices %}
+                                {% include "oscar/dashboard/partials/form_fields.html" with form=order_status_form %}
+                                <input type="hidden" value="change_order_status" name="order_action" />
+                                <div class="flex-nowrap">
+                                    <button type="submit" class="btn btn-primary">
+                                        {% trans "Change status" %}
+                                    </button>
+                                </div>
+                            {% else %}
+                                {% trans "This order can't have its status changed." %}
+                            {% endif %}
+                        </div>
+                    {% endblock %}
+                </form>
+                {% block order_status_changes %}
+                    <div class="table-header">
+                        <h3>
+                            {% trans "Status Changes" %}
+                        </h3>
+                    </div>
+                    {% with status_changes=order.status_changes.all %}
+                        <table class="table table-striped table-bordered table-hover">
+                            {% if status_changes %}
+                                <thead>
+                                    <tr>
+                                        <th>
+                                            {% trans "From" %}
+                                        </th>
+                                        <th>
+                                            {% trans "To" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Date" %}
+                                        </th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                    {% for status_change in status_changes %}
+                                        <tr>
+                                            <td>
+                                                {{ status_change.old_status }}
+                                            </td>
+                                            <td>
+                                                {{ status_change.new_status }}
+                                            </td>
+                                            <td>
+                                                {{ status_change.date_created }}
+                                            </td>
+                                        </tr>
+                                    {% endfor %}
+                                </tbody>
+                            {% else %}
+                                <tbody>
+                                    <tr>
+                                        <td>
+                                            {% trans "No status changes." %}
+                                        </td>
+                                    </tr>
+                                </tbody>
+                            {% endif %}
+                        </table>
+                    {% endwith %}
+                {% endblock %}
+                {% block shipping_events %}
+                    <div class="table-header">
+                        <h3>
+                            {% trans "Shipping Events" %}
+                        </h3>
+                    </div>
+                    {% with events=order.shipping_events.all %}
+                        <table class="table table-striped table-bordered table-hover">
+                            {% if events %}
+                                <thead>
+                                    <tr>
+                                        <th>
+                                            {% trans "Date" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Event" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Lines" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Reference" %}
+                                        </th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                    {% for event in events %}
+                                        {% with line_qtys=event.line_quantities.all %}
+                                            <tr>
+                                                <td>
+                                                    {{ event.date_created }}
+                                                </td>
+                                                <td>
+                                                    {{ event.event_type.name }}
+                                                </td>
+                                                <td>
+                                                    {% for line_qty in event.line_quantities.all %}
+                                                        <a href="{% url 'dashboard:order-line-detail' number=order.number line_id=line_qty.line.id %}">
+                                                            {% blocktrans with title=line_qty.line.title event_qty=line_qty.quantity total_qty=line_qty.line.quantity %}
+                                                                {{ title }} (quantity {{ event_qty }}/{{ total_qty }})
+                                                            {% endblocktrans %}
+                                                        </a>
+                                                    {% endfor %}
+                                                </td>
+                                                <td>
+                                                    {{ event.notes|default:"-" }}
+                                                </td>
+                                            </tr>
+                                        {% endwith %}
+                                    {% endfor %}
+                                </tbody>
+                            {% else %}
+                                <tbody>
+                                    <tr>
+                                        <td>
+                                            {% trans "No shipping events." %}
+                                        </td>
+                                    </tr>
+                                </tbody>
+                            {% endif %}
+                        </table>
+                    {% endwith %}
+                {% endblock %}
+                {% block payment_events %}
+                    <div class="table-header">
+                        <h3 >{% trans "Payment Events" %}
+                        </h3>
+                    </div>
+                    {% with events=order.payment_events.all %}
+                        <table class="table table-striped table-bordered table-hover">
+                            {% if events %}
+                                <thead>
+                                    <tr>
+                                        <th>
+                                            {% trans "Date" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Event" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Amount" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Lines" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Reference" %}
+                                        </th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                    {% for event in events %}
+                                        {% with line_qtys=event.line_quantities.all %}
+                                            <tr>
+                                                <td >{{ event.date_created }}
+                                                </td>
+                                                <td >{{ event.event_type.name }}
+                                                </td>
+                                                <td >{{ event.amount|currency:order.currency }}
+                                                </td>
+                                                <td>
+                                                    {% for line_qty in event.line_quantities.all %}
+                                                        {% trans "Product:" %} {{ line_qty.line.title }} - {% trans "quantity" %} {{ line_qty.quantity }}
+                                                        </br>
+                                                    {% endfor %}
+                                                </td>
+                                                <td >{{ event.reference|default:"-" }}
+                                                </td>
+                                            </tr>
+                                        {% endwith %}
+                                    {% endfor %}
+                                </tbody>
+                            {% else %}
+                                <tbody>
+                                    <tr>
+                                        <td>
+                                            {% trans "No payment events." %}
+                                        </td>
+                                    </tr>
+                                </tbody>
+                            {% endif %}
+                        </table>
+                    {% endwith %}
+                {% endblock %}
+            </div>
+            <div class="tab-pane fade {% if active_tab == 'shipping' %}show active{% endif %}"
+                 id="shipping"
+                 role="tabpanel">
+                {% block tab_shipping %}
+                    <div class="table-header">
+                        <h3>
+                            {% trans "Shipping" %}
+                        </h3>
+                    </div>
+                    <table class="table table-striped table-bordered table-hover">
+                        <tbody>
+                            <tr>
+                                <th>
+                                    {% trans "Method name" %}
+                                </th>
+                                <td>
+                                    {{ order.shipping_method }}
+                                </td>
+                            </tr>
+                            <tr>
+                                <th>
+                                    {% trans "Method code" %}
+                                </th>
+                                <td>
+                                    {{ order.shipping_code|upper }}
+                                </td>
+                            </tr>
+                            <tr>
+                                <th>
+                                    {% trans "Charge (incl tax)" %}
+                                </th>
+                                <td>
+                                    {{ order.shipping_incl_tax|currency:order.currency }}
+                                </td>
+                            </tr>
+                            <tr>
+                                <th>
+                                    {% trans "Charge (excl tax)" %}
+                                </th>
+                                <td>
+                                    {{ order.shipping_excl_tax|currency:order.currency }}
+                                </td>
+                            </tr>
+                            <tr>
+                                <th>
+                                    {% trans "Address" %}
+                                </th>
+                                <td>
+                                    {% for field in order.shipping_address.active_address_fields %}
+                                        {{ field }}
+                                        <br/>
+                                    {% endfor %}
+                                    <a class="btn btn-secondary"
+                                       href="{% url 'dashboard:order-shipping-address' order.number %}">
+                                        {% trans "Update" %}
+                                    </a>
+                                </td>
+                            </tr>
+                            <tr>
+                                <th>
+                                    {% trans "Phone" %}
+                                </th>
+                                <td>
+                                    {{ order.shipping_address.phone_number|default:"-" }}
+                                </td>
+                            </tr>
+                            <tr>
+                                <th>
+                                    {% trans "Instructions" %}
+                                </th>
+                                <td>
+                                    {{ order.shipping_address.notes|default:"-"|linebreaks }}
+                                </td>
+                            </tr>
+                        </tbody>
+                    </table>
+                {% endblock %}
+            </div>
+            <div class="tab-pane fade {% if active_tab == 'payment' %}show active{% endif %}"
+                 id="payment"
+                 role="tabpanel">
+                {% block tab_payment %}
+                    {% if order.billing_address %}
+                        <div class="sub-header">
+                            <h3 >{% trans "Billing address" %}
+                            </h3>
+                        </div>
+                        <p>
+                            {% for field in order.billing_address.active_address_fields %}
+                                {{ field }}
+                                <br/>
+                            {% endfor %}
+                        </p>
+                    {% endif %}
+                    {% with sources=order.sources.all %}
+                        <div class="table-header">
+                            <h3 >{% trans "Payment sources" %}
+                            </h3>
+                        </div>
+                        {% if sources %}
+                            <table class="table table-striped table-bordered table-hover">
+                                <thead>
+                                    <tr>
+                                        <th>
+                                            {% trans "Source" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Allocation" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Amount debited" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Amount refunded" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Reference" %}
+                                        </th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                    {% for source in sources %}
+                                        <tr>
+                                            <td>
+                                                {{ source.source_type }}
+                                            </td>
+                                            <td>
+                                                {{ source.amount_allocated|currency:order.currency }}
+                                            </td>
+                                            <td>
+                                                {{ source.amount_debited|currency:order.currency }}
+                                            </td>
+                                            <td>
+                                                {{ source.amount_refunded|currency:order.currency }}
+                                            </td>
+                                            <td>
+                                                {{ source.reference|default:"-" }}
+                                            </td>
+                                        </tr>
+                                    {% endfor %}
+                                </tbody>
+                            </table>
                         {% else %}
-                            {{ line.title }}
+                            <table class="table table-striped table-bordered table-hover">
+                                <tr>
+                                    <td>
+                                        {% trans "No payment sources found for this order." %}
+                                    </td>
+                                </tr>
+                            </table>
                         {% endif %}
-                    </td>
-                    <td>
-                        {{ line.upc|default:"-" }}
-                    </td>
-                    <td>
-                        {{ line.status|default:"-" }}
-                    </td>
-                    <td>
-                        {% if line.partner %}
-                            <a href="{% url 'dashboard:partner-manage' pk=line.partner.id %}">
-                                {{ line.partner_name }}
-                            </a>
+                    {% endwith %}
+                    {% block payment_transactions %}
+                        {% if payment_transactions %}
+                            <div class="table-header">
+                                <h3>
+                                    {% trans "Transactions" %}
+                                </h3>
+                            </div>
+                            <table class="table table-striped table-bordered table-hover">
+                                <thead>
+                                    <tr>
+                                        <th>
+                                            {% trans "Source" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Amount" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Reference" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Status" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Date" %}
+                                        </th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                    {% for txn in payment_transactions %}
+                                        <tr>
+                                            <td>
+                                                {{ txn.source.source_type }}
+                                            </td>
+                                            <td>
+                                                {{ txn.amount|currency:order.currency }}
+                                            </td>
+                                            <td>
+                                                {{ txn.reference|default:"-" }}
+                                            </td>
+                                            <td>
+                                                {{ txn.status|default:"-" }}
+                                            </td>
+                                            <td>
+                                                {{ txn.date_created }}
+                                            </td>
+                                        </tr>
+                                    {% endfor %}
+                                </tbody>
+                            </table>
+                        {% endif %}
+                    {% endblock %}
+                {% endblock %}
+            </div>
+            <div class="tab-pane fade {% if active_tab == 'discounts' %}show active{% endif %}"
+                 id="discounts"
+                 role="tabpanel">
+                {% block tab_discounts %}
+                    {% with discounts=order.discounts.all %}
+                        <div class="table-header">
+                            <h3>
+                                {% trans "Discounts" %}
+                            </h3>
+                        </div>
+                        {% if discounts %}
+                            <table class="table table-striped table-bordered table-hover">
+                                <thead>
+                                    <tr>
+                                        <th>
+                                            {% trans "Type" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Voucher" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Offer name" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Frequency" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Message" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Amount" %}
+                                        </th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                    {% for discount in discounts %}
+                                        <tr>
+                                            <td>
+                                                {{ discount.get_category_display }}
+                                            </td>
+                                            <td>
+                                                {{ discount.voucher.code|default:"-" }}
+                                            </td>
+                                            <td>
+                                                {% if discount.offer %}
+                                                    <a href="{% url 'dashboard:offer-detail' pk=discount.offer.id %}">
+                                                        {{ discount.offer.name }}
+                                                    </a>
+                                                {% else %}
+                                                    {{ discount.offer_name }}
+                                                {% endif %}
+                                            </td>
+                                            <td>
+                                                {{ discount.frequency }}
+                                            </td>
+                                            <td>
+                                                {{ discount.message|default:"-" }}
+                                            </td>
+                                            <td>
+                                                {{ discount.amount|currency:order.currency }}
+                                            </td>
+                                        </tr>
+                                    {% endfor %}
+                                </tbody>
+                            </table>
                         {% else %}
-                            {{ line.partner_name }}
+                            <table class="table table-striped table-bordered table-hover">
+                                <tr>
+                                    <td>
+                                        {% trans "No discounts were applied to this order." %}
+                                    </td>
+                                </tr>
+                            </table>
                         {% endif %}
-                    </td>
-                    <td>
-                        {{ line.partner_sku }}
-                    </td>
-                    <td class="text-right">
-                        {{ line.line_price_before_discounts_excl_tax|currency:order.currency }}
-                    </td>
-                    <td class="text-right">
-                        {{ line.line_price_before_discounts_incl_tax|currency:order.currency }}
-                    </td>
-                    <td>
-                        <a href="{% url 'dashboard:order-line-detail' number=order.number line_id=line.id %}"
-                           class="btn btn-secondary">
-                            {% trans "View" %}
-                        </a>
-                    </td>
-                </tr>
-            {% endfor %}
-            <tr>
-                <td colspan="8"></td>
-                <th>
-                    {% trans "Discount" %}
-                </th>
-                <td class="text-right">
-                    {{ order.total_discount_excl_tax|currency:order.currency }}
-                </td>
-                <td class="text-right">
-                    {{ order.total_discount_incl_tax|currency:order.currency }}
-                </td>
-                <td></td>
-            </tr>
-            {% with discounts=order.basket_discounts %}
-            {% if discounts %}
-                <tr>
-                    <td colspan="8"></td>
-                    <th>
-                        {% trans "Basket total (excl. discounts)" %}
-                    </th>
-                    <td class="text-right">
-                        {{ order.basket_total_before_discounts_excl_tax|currency:order.currency }}
-                    </td>
-                    <td class="text-right">
-                        {{ order.basket_total_before_discounts_incl_tax|currency:order.currency }}
-                    </td>
-                    <td></td>
-                </tr>
-                {% for discount in discounts %}
-                    <tr>
-                        <td colspan="8"></td>
-                        <td>
-                            <span class="badge badge-success">{% trans "Discount" %}</span>
-                            {{ discount.offer_name }}
-                        </td>
-                        <td class="text-right"></td>
-                        <td class="text-right">- {{ discount.amount|currency:order.currency }}</td>
-                        <td></td>
-                    </tr>
-                {% endfor %}
-                <tr>
-                    <td colspan="8"></td>
-                    <th>
-                        {% trans "Basket total (inc. discounts)" %}
-                    </th>
-                    <th class="text-right">
-                        {{ order.basket_total_excl_tax|currency:order.currency }}
-                    </th>
-                    <th class="text-right">
-                        {{ order.basket_total_incl_tax|currency:order.currency }}
-                    </th>
-                    <td></td>
-                </tr>
-            {% else %}
-                <tr>
-                    <td colspan="8"></td>
-                    <th>
-                        {% trans "Basket total" %}
-                    </th>
-                    <th class="text-right">
-                        {{ order.basket_total_excl_tax|currency:order.currency }}
-                    </th>
-                    <th class="text-right">
-                        {{ order.basket_total_incl_tax|currency:order.currency }}
-                    </th>
-                    <td></td>
-                </tr>
-            {% endif %}
-        {% endwith %}
-        {% if order.has_shipping_discounts %}
-            <tr>
-                <td colspan="8"></td>
-                <td>
-                    {% trans "Shipping total (excl. discounts)" %}
-                </td>
-                <td class="text-right">
-                    {{ order.shipping_before_discounts_excl_tax|currency:order.currency }}
-                </td>
-                <td class="text-right">
-                    {{ order.shipping_before_discounts_incl_tax|currency:order.currency }}
-                </td>
-                <td></td>
-            </tr>
-            {% for discount in order.shipping_discounts %}
-                <tr>
-                    <td colspan="8"></td>
-                    <td>
-                        <span class="badge badge-success">
-                            {% trans "Discount" %}
-                        </span>
-                        {{ discount.offer_name }}
-                    </td>
-                    <td></td>
-                    <td class="text-right">
-                        - {{ discount.amount|currency:order.currency }}
-                    </td>
-                    <td></td>
-                </tr>
-            {% endfor %}
-            <tr>
-                <td colspan="8"></td>
-                <th>
-                    {% trans "Shipping total (inc. discounts)" %}
-                </th>
-                <th class="text-right">
-                    {{ order.shipping_excl_tax|currency:order.currency }}
-                </th>
-                <th class="text-right">
-                    {{ order.shipping_incl_tax|currency:order.currency }}
-                </th>
-                <td></td>
-            </tr>
-        {% else %}
-            <tr>
-                <td colspan="8"></td>
-                <th>
-                    {% trans "Shipping total" %}
-                </th>
-                <th class="text-right">
-                    {{ order.shipping_excl_tax|currency:order.currency }}
-                </th>
-                <th class="text-right">
-                    {{ order.shipping_incl_tax|currency:order.currency }}
-                </th>
-                <td></td>
-            </tr>
-        {% endif %}
-        {% with surcharges=order.surcharges.all %}
-        {% if surcharges %}
-            {% for charge in surcharges %}
-                <tr>
-                    <td colspan="8"></td>
-                    <th>
-                        {% blocktrans with name=charge.name %}Surcharge {{ name }}{% endblocktrans %}
-                        </th>
-                        <th class="text-right">
-                            {{ charge.excl_tax|currency:order.currency }}
-                        </th>
-                        <th class="text-right">
-                            {{ charge.incl_tax|currency:order.currency }}
-                        </th>
-                        <td></td>
-                    </tr>
-                {% endfor %}
-            {% endif %}
-        {% endwith %}
-        <tr>
-            <td colspan="8"></td>
-            <th>
-                {% trans "Order total" %}
-            </th>
-            <th class="text-right">
-                {{ order.total_excl_tax|currency:order.currency }}
-            </th>
-            <th class="text-right">
-                {{ order.total_incl_tax|currency:order.currency }}
-            </th>
-            <td></td>
-        </tr>
-    </tbody>
-</table>
-{% endblock order_lines %}
-{% comment %}
-This is the important block within this template: you will almost certainly want to
-override this block to provide your own form widgets that suit your order processing
-flow. The default contents shows a range of widgets - more than is sensible really.
-{% endcomment %}
-{% block line_actions %}
-<div class="card card-body bg-light">
-<h3>
-    {% trans "With selected lines" %}:
-</h3>
-<div class="form-inline mb-sm-2">
-    <div class="form-group">
-        <div class="form-check">
-            <input id="line_status_check"
-                   class="form-check-input"
-                   type="radio"
-                   name="line_action"
-                   value="change_line_statuses"/>
-            <label for="line_status_check" class="form-check-label">
-                {% trans "Change line status to" %}
-            </label>
+                    {% endwith %}
+                {% endblock %}
+            </div>
+            <div class="tab-pane fade {% if active_tab == 'notes' %}show active{% endif %}" id="notes" role="tabpanel">
+                {% block tab_notes %}
+                    <div class="table-header">
+                        <h3>
+                            {% trans "Notes" %}
+                        </h3>
+                    </div>
+                    {% with notes=order.notes.all %}
+                        <table class="table table-striped table-bordered table-hover">
+                            {% if notes %}
+                                <tr>
+                                    <th>
+                                        {% trans "Date" %}
+                                    </th>
+                                    <th>
+                                        {% trans "User" %}
+                                    </th>
+                                    <th>
+                                        {% trans "Type" %}
+                                    </th>
+                                    <th>
+                                        {% trans "Message" %}
+                                    </th>
+                                    <th>
+                                        {% trans "Admin" %}
+                                    </th>
+                                </tr>
+                                {% for note in notes %}
+                                    <tr>
+                                        <td>
+                                            {{ note.date_created }}
+                                        </td>
+                                        <td>
+                                            {{ note.user|default:"-" }}
+                                        </td>
+                                        <td>
+                                            {{ note.note_type|default:"-" }}
+                                        </td>
+                                        <td>
+                                            {{ note.message|linebreaks }}
+                                        </td>
+                                        <td>
+                                            {% if note.is_editable %}
+                                                <a href="{% url 'dashboard:order-detail-note' number=order.number note_id=note.id %}#notes"
+                                                   class="btn btn-info">
+                                                    {% trans "Edit" %}
+                                                </a>
+                                                <form method="post" class="float-left m-0">
+                                                    {% csrf_token %}
+                                                    <input type="hidden" name="order_action" value="delete_note" />
+                                                    <input type="hidden" name="note_id" value="{{ note.id }}" />
+                                                    <input type="submit"
+                                                           value="{% trans "
+                                                           Delete" %}" class="btn btn-danger"/>
+                                                </form>
+                                            {% endif %}
+                                        </td>
+                                    </tr>
+                                {% endfor %}
+                            {% else %}
+                                <tr>
+                                    <td>
+                                        {% trans "No notes available." %}
+                                    </td>
+                                </tr>
+                            {% endif %}
+                        </table>
+                    {% endwith %}
+                    <form id="order_note_form" action=".?note={{ note_id }}" method="post" class="form-stacked">
+                        {% csrf_token %}
+                        <input type="hidden" value="save_note" name="order_action" />
+                        {% include "oscar/dashboard/partials/form_fields.html" with form=note_form %}
+                        <div class="form-actions">
+                            <input type="submit" value="{% trans "Save note" %}" class="btn btn-primary" />
+                            {% trans "Notes are only editable for 5 minutes after being saved." %}
+                        </div>
+                    </form>
+                {% endblock %}
+            </div>
+            {% block extra_tabs %}{% endblock %}
         </div>
     </div>
-    <div class="form-group">
-        <label class="sr-only" for="new_status_select">
-            {% trans "choose new status" %}
-        </label>
-        <select id="new_status_select" name="new_status">
-            <option value="">
-                -- {% trans "choose new status" %} --
-            </option>
-            {% for status in line_statuses %}
-                <option>
-                    {{ status }}
-                </option>
-            {% endfor %}
-        </select>
-    </div>
-</div>
-<div class="form-inline mb-sm-2">
-    <div class="form-group">
-        <div class="form-check">
-            <input id="shipping_event_check"
-                   class="form-check-input"
-                   type="radio"
-                   name="line_action"
-                   value="create_shipping_event"/>
-            <label for="shipping_event_check" class="form-check-label">
-                {% trans "Create shipping event" %}
-            </label>
-        </div>
-    </div>
-    <div class="form-group mr-1">
-        <label class="sr-only" for="shipping_event_type_select">
-            {% trans "choose event type" %}
-        </label>
-        <select id="shipping_event_type_select" name="shipping_event_type">
-            <option value="">
-                -- {% trans "choose event type" %} --
-            </option>
-            {% for event_type in shipping_event_types %}
-                <option value="{{ event_type.code }}">
-                    {{ event_type.name }}
-                </option>
-            {% endfor %}
-        </select>
-    </div>
-    <div class="form-group">
-        <label for="reference_input">
-            {% trans "with reference" %}
-        </label>
-        <input id="reference_input" type="text" name="reference" value="" />
-    </div>
-</div>
-<div class="form-inline mb-sm-2">
-    <div class="form-group">
-        <div class="form-check">
-            <input id="payment_event_check"
-                   class="form-check-input"
-                   type="radio"
-                   name="line_action"
-                   value="create_payment_event"/>
-            <label for="payment_event_check" class="form-check-label">
-                {% trans "Create payment event" %}
-            </label>
-        </div>
-    </div>
-    <div class="form-group mr-1">
-        <label class="sr-only" for="payment_event_type_select">
-            {% trans "choose event type" %}
-        </label>
-        <select id="payment_event_type_select" name="payment_event_type">
-            <option value="">
-                -- {% trans "choose event type" %} --
-            </option>
-            {% for event_type in payment_event_types %}
-                <option value="{{ event_type.code }}">
-                    {{ event_type.name }}
-                </option>
-            {% endfor %}
-        </select>
-    </div>
-    <div class="form-group">
-        <label for="amount_input">
-            {% trans "with amount" %}
-        </label>
-        <input id="amount_input" type="text" name="amount" value="" />
-    </div>
-</div>
-<div class="flex-nowrap">
-    <button type="submit" class="btn btn-primary">
-        {% trans "Go!" %}
-    </button>
-</div>
-</div>
-{% endblock line_actions %}
-</form>
-<form method="post" id="order_status_form">
-{% csrf_token %}
-{% block order_actions %}
-<div class="card card-body bg-light">
-<h3>
-    <i class="fas fa-exclamation-triangle"></i>
-    {% trans "Change order status" %}:
-</h3>
-{% if order_status_form.has_choices %}
-    {% include "oscar/dashboard/partials/form_fields.html" with form=order_status_form %}
-    <input type="hidden" value="change_order_status" name="order_action" />
-    <div class="flex-nowrap">
-        <button type="submit" class="btn btn-primary">
-            {% trans "Change status" %}
-        </button>
-    </div>
-{% else %}
-    {% trans "This order can't have its status changed." %}
-{% endif %}
-</div>
-{% endblock %}
-</form>
-{% block order_status_changes %}
-<div class="table-header">
-<h3>
-{% trans "Status Changes" %}
-</h3>
-</div>
-{% with status_changes=order.status_changes.all %}
-<table class="table table-striped table-bordered table-hover">
-{% if status_changes %}
-<thead>
-    <tr>
-        <th>
-            {% trans "From" %}
-        </th>
-        <th>
-            {% trans "To" %}
-        </th>
-        <th>
-            {% trans "Date" %}
-        </th>
-    </tr>
-</thead>
-<tbody>
-    {% for status_change in status_changes %}
-        <tr>
-            <td>
-                {{ status_change.old_status }}
-            </td>
-            <td>
-                {{ status_change.new_status }}
-            </td>
-            <td>
-                {{ status_change.date_created }}
-            </td>
-        </tr>
-    {% endfor %}
-</tbody>
-{% else %}
-<tbody>
-    <tr>
-        <td>
-            {% trans "No status changes." %}
-        </td>
-    </tr>
-</tbody>
-{% endif %}
-</table>
-{% endwith %}
-{% endblock %}
-{% block shipping_events %}
-<div class="table-header">
-<h3>
-{% trans "Shipping Events" %}
-</h3>
-</div>
-{% with events=order.shipping_events.all %}
-<table class="table table-striped table-bordered table-hover">
-{% if events %}
-<thead>
-<tr>
-    <th>
-        {% trans "Date" %}
-    </th>
-    <th>
-        {% trans "Event" %}
-    </th>
-    <th>
-        {% trans "Lines" %}
-    </th>
-    <th>
-        {% trans "Reference" %}
-    </th>
-</tr>
-</thead>
-<tbody>
-{% for event in events %}
-    {% with line_qtys=event.line_quantities.all %}
-    <tr>
-        <td>
-            {{ event.date_created }}
-        </td>
-        <td>
-            {{ event.event_type.name }}
-        </td>
-        <td>
-            {% for line_qty in event.line_quantities.all %}
-                <a href="{% url 'dashboard:order-line-detail' number=order.number line_id=line_qty.line.id %}">
-                    {% blocktrans with title=line_qty.line.title event_qty=line_qty.quantity total_qty=line_qty.line.quantity %}
-                        {{ title }} (quantity {{ event_qty }}/{{ total_qty }})
-                    {% endblocktrans %}
-                </a>
-            {% endfor %}
-        </td>
-        <td>
-            {{ event.notes|default:"-" }}
-        </td>
-    </tr>
-{% endwith %}
-{% endfor %}
-</tbody>
-{% else %}
-<tbody>
-<tr>
-<td>
-    {% trans "No shipping events." %}
-</td>
-</tr>
-</tbody>
-{% endif %}
-</table>
-{% endwith %}
-{% endblock %}
-{% block payment_events %}
-<div class="table-header">
-<h3 >{% trans "Payment Events" %}
-</h3>
-</div>
-{% with events=order.payment_events.all %}
-<table class="table table-striped table-bordered table-hover">
-{% if events %}
-<thead>
-<tr>
-<th>
-{% trans "Date" %}
-</th>
-<th>
-{% trans "Event" %}
-</th>
-<th>
-{% trans "Amount" %}
-</th>
-<th>
-{% trans "Lines" %}
-</th>
-<th>
-{% trans "Reference" %}
-</th>
-</tr>
-</thead>
-<tbody>
-{% for event in events %}
-{% with line_qtys=event.line_quantities.all %}
-<tr>
-<td >{{ event.date_created }}
-</td>
-<td >{{ event.event_type.name }}
-</td>
-<td >{{ event.amount|currency:order.currency }}
-</td>
-<td>
-    {% for line_qty in event.line_quantities.all %}
-        {% trans "Product:" %} {{ line_qty.line.title }} - {% trans "quantity" %} {{ line_qty.quantity }}
-        </br>
-    {% endfor %}
-</td>
-<td >{{ event.reference|default:"-" }}
-</td>
-</tr>
-{% endwith %}
-{% endfor %}
-</tbody>
-{% else %}
-<tbody>
-<tr>
-<td>
-{% trans "No payment events." %}
-</td>
-</tr>
-</tbody>
-{% endif %}
-</table>
-{% endwith %}
-{% endblock %}
-</div>
-<div class="tab-pane fade {% if active_tab == 'shipping' %}show active{% endif %}" id="shipping" role="tabpanel">
-{% block tab_shipping %}
-<div class="table-header">
-<h3>
-{% trans "Shipping" %}
-</h3>
-</div>
-<table class="table table-striped table-bordered table-hover">
-<tbody>
-<tr>
-<th>
-{% trans "Method name" %}
-</th>
-<td>
-{{ order.shipping_method }}
-</td>
-</tr>
-<tr>
-<th>
-{% trans "Method code" %}
-</th>
-<td>
-{{ order.shipping_code|upper }}
-</td>
-</tr>
-<tr>
-<th>
-{% trans "Charge (incl tax)" %}
-</th>
-<td>
-{{ order.shipping_incl_tax|currency:order.currency }}
-</td>
-</tr>
-<tr>
-<th>
-{% trans "Charge (excl tax)" %}
-</th>
-<td>
-{{ order.shipping_excl_tax|currency:order.currency }}
-</td>
-</tr>
-<tr>
-<th>
-{% trans "Address" %}
-</th>
-<td>
-{% for field in order.shipping_address.active_address_fields %}
-{{ field }}
-<br/>
-{% endfor %}
-<a class="btn btn-secondary" href="{% url 'dashboard:order-shipping-address' order.number %}">
-{% trans "Update" %}
-</a>
-</td>
-</tr>
-<tr>
-<th>
-{% trans "Phone" %}
-</th>
-<td>
-{{ order.shipping_address.phone_number|default:"-" }}
-</td>
-</tr>
-<tr>
-<th>
-{% trans "Instructions" %}
-</th>
-<td>
-{{ order.shipping_address.notes|default:"-"|linebreaks }}
-</td>
-</tr>
-</tbody>
-</table>
-{% endblock %}
-</div>
-<div class="tab-pane fade {% if active_tab == 'payment' %}show active{% endif %}" id="payment" role="tabpanel">
-{% block tab_payment %}
-{% if order.billing_address %}
-<div class="sub-header">
-<h3 >{% trans "Billing address" %}
-</h3>
-</div>
-<p>
-{% for field in order.billing_address.active_address_fields %}
-{{ field }}
-<br/>
-{% endfor %}
-</p>
-{% endif %}
-{% with sources=order.sources.all %}
-<div class="table-header">
-<h3 >{% trans "Payment sources" %}
-</h3>
-</div>
-{% if sources %}
-<table class="table table-striped table-bordered table-hover">
-<thead>
-<tr>
-<th>
-{% trans "Source" %}
-</th>
-<th>
-{% trans "Allocation" %}
-</th>
-<th>
-{% trans "Amount debited" %}
-</th>
-<th>
-{% trans "Amount refunded" %}
-</th>
-<th>
-{% trans "Reference" %}
-</th>
-</tr>
-</thead>
-<tbody>
-{% for source in sources %}
-<tr>
-<td>
-{{ source.source_type }}
-</td>
-<td>
-{{ source.amount_allocated|currency:order.currency }}
-</td>
-<td>
-{{ source.amount_debited|currency:order.currency }}
-</td>
-<td>
-{{ source.amount_refunded|currency:order.currency }}
-</td>
-<td>
-{{ source.reference|default:"-" }}
-</td>
-</tr>
-{% endfor %}
-</tbody>
-</table>
-{% else %}
-<table class="table table-striped table-bordered table-hover">
-<tr>
-<td>
-{% trans "No payment sources found for this order." %}
-</td>
-</tr>
-</table>
-{% endif %}
-{% endwith %}
-{% block payment_transactions %}
-{% if payment_transactions %}
-<div class="table-header">
-<h3>
-{% trans "Transactions" %}
-</h3>
-</div>
-<table class="table table-striped table-bordered table-hover">
-<thead>
-<tr>
-<th>
-{% trans "Source" %}
-</th>
-<th>
-{% trans "Amount" %}
-</th>
-<th>
-{% trans "Reference" %}
-</th>
-<th>
-{% trans "Status" %}
-</th>
-<th>
-{% trans "Date" %}
-</th>
-</tr>
-</thead>
-<tbody>
-{% for txn in payment_transactions %}
-<tr>
-<td>
-{{ txn.source.source_type }}
-</td>
-<td>
-{{ txn.amount|currency:order.currency }}
-</td>
-<td>
-{{ txn.reference|default:"-" }}
-</td>
-<td>
-{{ txn.status|default:"-" }}
-</td>
-<td>
-{{ txn.date_created }}
-</td>
-</tr>
-{% endfor %}
-</tbody>
-</table>
-{% endif %}
-{% endblock %}
-{% endblock %}
-</div>
-<div class="tab-pane fade {% if active_tab == 'discounts' %}show active{% endif %}" id="discounts" role="tabpanel">
-{% block tab_discounts %}
-{% with discounts=order.discounts.all %}
-<div class="table-header">
-<h3>
-{% trans "Discounts" %}
-</h3>
-</div>
-{% if discounts %}
-<table class="table table-striped table-bordered table-hover">
-<thead>
-<tr>
-<th>
-{% trans "Type" %}
-</th>
-<th>
-{% trans "Voucher" %}
-</th>
-<th>
-{% trans "Offer name" %}
-</th>
-<th>
-{% trans "Frequency" %}
-</th>
-<th>
-{% trans "Message" %}
-</th>
-<th>
-{% trans "Amount" %}
-</th>
-</tr>
-</thead>
-<tbody>
-{% for discount in discounts %}
-<tr>
-<td>
-{{ discount.get_category_display }}
-</td>
-<td>
-{{ discount.voucher.code|default:"-" }}
-</td>
-<td>
-{% if discount.offer %}
-<a href="{% url 'dashboard:offer-detail' pk=discount.offer.id %}">
-{{ discount.offer.name }}
-</a>
-{% else %}
-{{ discount.offer_name }}
-{% endif %}
-</td>
-<td>
-{{ discount.frequency }}
-</td>
-<td>
-{{ discount.message|default:"-" }}
-</td>
-<td>
-{{ discount.amount|currency:order.currency }}
-</td>
-</tr>
-{% endfor %}
-</tbody>
-</table>
-{% else %}
-<table class="table table-striped table-bordered table-hover">
-<tr>
-<td>
-{% trans "No discounts were applied to this order." %}
-</td>
-</tr>
-</table>
-{% endif %}
-{% endwith %}
-{% endblock %}
-</div>
-<div class="tab-pane fade {% if active_tab == 'notes' %}show active{% endif %}" id="notes" role="tabpanel">
-{% block tab_notes %}
-<div class="table-header">
-<h3>
-{% trans "Notes" %}
-</h3>
-</div>
-{% with notes=order.notes.all %}
-<table class="table table-striped table-bordered table-hover">
-{% if notes %}
-<tr>
-<th>
-{% trans "Date" %}
-</th>
-<th>
-{% trans "User" %}
-</th>
-<th>
-{% trans "Type" %}
-</th>
-<th>
-{% trans "Message" %}
-</th>
-<th>
-{% trans "Admin" %}
-</th>
-</tr>
-{% for note in notes %}
-<tr>
-<td>
-{{ note.date_created }}
-</td>
-<td>
-{{ note.user|default:"-" }}
-</td>
-<td>
-{{ note.note_type|default:"-" }}
-</td>
-<td>
-{{ note.message|linebreaks }}
-</td>
-<td>
-{% if note.is_editable %}
-<a href="{% url 'dashboard:order-detail-note' number=order.number note_id=note.id %}#notes" class="btn btn-info">
-{% trans "Edit" %}
-</a>
-<form method="post" class="float-left m-0">
-{% csrf_token %}
-<input type="hidden" name="order_action" value="delete_note" />
-<input type="hidden" name="note_id" value="{{ note.id }}" />
-<input type="submit" value="{% trans "Delete" %}" class="btn btn-danger" />
-</form>
-{% endif %}
-</td>
-</tr>
-{% endfor %}
-{% else %}
-<tr>
-<td>
-{% trans "No notes available." %}
-</td>
-</tr>
-{% endif %}
-</table>
-{% endwith %}
-<form id="order_note_form" action=".?note={{ note_id }}" method="post" class="form-stacked">
-{% csrf_token %}
-<input type="hidden" value="save_note" name="order_action" />
-{% include "oscar/dashboard/partials/form_fields.html" with form=note_form %}
-<div class="form-actions">
-<input type="submit" value="{% trans "Save note" %}" class="btn btn-primary" />
-{% trans "Notes are only editable for 5 minutes after being saved." %}
-</div>
-</form>
-{% endblock %}
-</div>
-{% block extra_tabs %}{% endblock %}
-</div>
-</div>
 {% endblock dashboard_content %}
 {% block onbodyload %}
-{{ block.super }}
-oscar.dashboard.orders.initTabs();
-oscar.dashboard.orders.initTable();
+    {{ block.super }}
+    oscar.dashboard.orders.initTabs();
+    oscar.dashboard.orders.initTable();
 {% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/orders/order_list.html b/tests/django_oscar/oscar/dashboard/orders/order_list.html
index 42d6337..ab25f37 100644
--- a/tests/django_oscar/oscar/dashboard/orders/order_list.html
+++ b/tests/django_oscar/oscar/dashboard/orders/order_list.html
@@ -63,9 +63,7 @@
         {% include "oscar/dashboard/partials/advanced_search_modal.html" with form=form style='horizontal' %}
         {% if search_filters %}
             <div class="search-filter-list">
-                <label>
-                    Filters:
-                </label>
+                <label>Filters:</label>
                 {% for filter in search_filters %}
                     <span class="badge badge-success">{{ filter }}</span>
                 {% endfor %}
@@ -88,9 +86,7 @@
                     </h3>
                     <div class="float-right">
                         <div class="form-inline">
-                            <label>
-                                {% trans "Download selected orders as a CSV" %}
-                            </label>
+                            <label>{% trans "Download selected orders as a CSV" %}</label>
                             <button type="submit"
                                     class="btn btn-primary"
                                     name="action"
@@ -110,8 +106,12 @@
                             <th>{% trans "Status" %}</th>
                             <th>{% trans "Customer" %}</th>
                             <th>{% trans "Shipping address" %}</th>
-                            <th>{% trans "Billing address" %}</th>
-                            <th>{% trans "Date of purchase" %}</th>
+                            <th>
+                                {% trans "Billing address" %}
+                            </th>
+                            <th>
+                                {% trans "Date of purchase" %}
+                            </th>
                             <th></th>
                         </tr>
                     </thead>
diff --git a/tests/django_oscar/oscar/dashboard/partials/alert_messages.html b/tests/django_oscar/oscar/dashboard/partials/alert_messages.html
index 30c9b1d..b04e0f1 100644
--- a/tests/django_oscar/oscar/dashboard/partials/alert_messages.html
+++ b/tests/django_oscar/oscar/dashboard/partials/alert_messages.html
@@ -11,30 +11,30 @@ Use message tags to control these alerts. Available tags include:
     {% for message in messages %}
         <div class="alert {% for tag in message.tags|split %}alert-{% if tag == 'error' %}danger{% else %}{{ tag }}{% endif %} {% endfor %} alert-dismissible fade show"
              role="alert">
-        <div class="alertinner {% if 'noicon' not in message.tags %}wicon{% endif %}">
-        {% if 'noicon' not in message.tags %}
-            {# Include an icon by default #}
-            {% if 'success' in message.tags %}
-                <i class="fas fa-check-circle"></i>
-            {% elif 'info' in message.tags %}
-                <i class="fas fa-info-circle"></i>
-            {% elif 'warning' in message.tags %}
-                <i class="fas fa-exclamation-triangle"></i>
-            {% elif 'danger' in message.tags or 'error' in message.tags %}
-                <i class="fas fa-exclamation-circle"></i>
-            {% endif %}
-        {% endif %}
-        {# Allow HTML to be embedded in messages #}
-        {% if 'safe' in message.tags %}
-            {{ message|safe }}
-        {% else %}
-            {{ message }}
-        {% endif %}
-    </div>
-    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
-        <span aria-hidden="true">&times;</span>
-    </button>
-</div>
-{% endfor %}
+            <div class="alertinner {% if 'noicon' not in message.tags %}wicon{% endif %}">
+                {% if 'noicon' not in message.tags %}
+                    {# Include an icon by default #}
+                    {% if 'success' in message.tags %}
+                        <i class="fas fa-check-circle"></i>
+                    {% elif 'info' in message.tags %}
+                        <i class="fas fa-info-circle"></i>
+                    {% elif 'warning' in message.tags %}
+                        <i class="fas fa-exclamation-triangle"></i>
+                    {% elif 'danger' in message.tags or 'error' in message.tags %}
+                        <i class="fas fa-exclamation-circle"></i>
+                    {% endif %}
+                {% endif %}
+                {# Allow HTML to be embedded in messages #}
+                {% if 'safe' in message.tags %}
+                    {{ message|safe }}
+                {% else %}
+                    {{ message }}
+                {% endif %}
+            </div>
+            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
+                <span aria-hidden="true">&times;</span>
+            </button>
+        </div>
+    {% endfor %}
 {% endif %}
 </div>
diff --git a/tests/django_oscar/oscar/dashboard/partials/form_field.html b/tests/django_oscar/oscar/dashboard/partials/form_field.html
index 8add45f..042c923 100644
--- a/tests/django_oscar/oscar/dashboard/partials/form_field.html
+++ b/tests/django_oscar/oscar/dashboard/partials/form_field.html
@@ -10,51 +10,51 @@
 {% annotate_form_field field %}
 {% block control_group %}
     <div class="form-group{% if style == 'horizontal' %}row{% endif %}{% if field.errors %}error{% endif %}">
-    {% block label %}
-        {% if not nolabel and field.widget_type != 'checkbox' %}
-            <label for="{{ field.auto_id }}" class="{% if style|default:"stacked" != 'stacked' %}col-sm-4
-            {% endif %}
-            col-form-label
-            {% if field.field.required %}required{% endif %}
-            ">
-            {{ field.label|safe }}
-        </label>
-    {% endif %}
-{% endblock %}
-{% block controls %}
-    <div class="{% if style|default:"stacked" != 'stacked' %}col-sm-8{% endif %}
-    {% if field.widget_type == 'checkbox' or field.widget_type == 'radioselect' %} form-check{% endif %}">
-    {% block widget %}
-        {% if field.widget_type == 'checkbox' %}
-            {% render_field field class+="form-check-input" %}
-            <label for="{{ field.auto_id }}"
-                   class="form-check-label mt-2{% if field.field.required %}required{% endif %}">
-            {{ field.label|safe }}
-        </label>
-    {% elif field.widget_type == 'radioselect' %}
-        {% render_field field class+="form-check-input position-static controls mt-2" %}
-    {% else %}
-        {% render_field field class+="form-control" %}
-    {% endif %}
-{% endblock %}
-{% block errors %}
-    {% for error in field.errors %}
-        <span class="error-block">
-            <i class="fas fa-exclamation"></i>
-            {{ error }}
-        </span>
-    {% endfor %}
-{% endblock %}
-{% block help_text %}
-    {% if field.help_text %}
-        <small class="form-text text-muted">
-        {# We allow HTML within form help fields #}
-        {{ field.help_text|safe }}
-        </small>
-    {% endif %}
-{% endblock %}
-</div>
-{% endblock %}
+        {% block label %}
+            {% if not nolabel and field.widget_type != 'checkbox' %}
+                <label for="{{ field.auto_id }}" class="{% if style|default:"stacked" != 'stacked' %}col-sm-4
+                {% endif %}
+                col-form-label
+                {% if field.field.required %}required{% endif %}
+                ">
+                {{ field.label|safe }}
+            </label>
+        {% endif %}
+    {% endblock %}
+    {% block controls %}
+        <div class="{% if style|default:"stacked" != 'stacked' %}col-sm-8{% endif %}
+            {% if field.widget_type == 'checkbox' or field.widget_type == 'radioselect' %} form-check{% endif %}">
+            {% block widget %}
+                {% if field.widget_type == 'checkbox' %}
+                    {% render_field field class+="form-check-input" %}
+                    <label for="{{ field.auto_id }}"
+                           class="form-check-label mt-2{% if field.field.required %}required{% endif %}">
+                        {{ field.label|safe }}
+                    </label>
+                {% elif field.widget_type == 'radioselect' %}
+                    {% render_field field class+="form-check-input position-static controls mt-2" %}
+                {% else %}
+                    {% render_field field class+="form-control" %}
+                {% endif %}
+            {% endblock %}
+            {% block errors %}
+                {% for error in field.errors %}
+                    <span class="error-block">
+                        <i class="fas fa-exclamation"></i>
+                        {{ error }}
+                    </span>
+                {% endfor %}
+            {% endblock %}
+            {% block help_text %}
+                {% if field.help_text %}
+                    <small class="form-text text-muted">
+                    {# We allow HTML within form help fields #}
+                    {{ field.help_text|safe }}
+                    </small>
+                {% endif %}
+            {% endblock %}
+        </div>
+    {% endblock %}
 </div>
 {% endblock %}
 {% endif %}
diff --git a/tests/django_oscar/oscar/dashboard/partials/form_fields.html b/tests/django_oscar/oscar/dashboard/partials/form_fields.html
index 3a18506..afa6291 100644
--- a/tests/django_oscar/oscar/dashboard/partials/form_fields.html
+++ b/tests/django_oscar/oscar/dashboard/partials/form_fields.html
@@ -16,4 +16,5 @@
     {% endfor %}
 {% endif %}
 {% for field in form %}
-    {% include 'oscar/dashboard/partials/form_field.html' with field=field style=style %}{% endfor %}
+    {% include 'oscar/dashboard/partials/form_field.html' with field=field style=style %}
+{% endfor %}
diff --git a/tests/django_oscar/oscar/dashboard/partials/form_fields_inline.html b/tests/django_oscar/oscar/dashboard/partials/form_fields_inline.html
index 3653e91..26d1d83 100644
--- a/tests/django_oscar/oscar/dashboard/partials/form_fields_inline.html
+++ b/tests/django_oscar/oscar/dashboard/partials/form_fields_inline.html
@@ -5,16 +5,16 @@
         {{ field }}
     {% else %}
         <div class="form-group mr-2 {% if field.errors %}error{% endif %}">
-        {{ field.label_tag }}
-        {% render_field field class+='form-control' %}
-        {% for error in field.errors %}
-            <ul class="error-block">
-                <li>
-                    {{ error }}
-                </li>
-            </ul>
-        {% endfor %}
-        {# No help text as it wraps #}
-    </div>
-{% endif %}
+            {{ field.label_tag }}
+            {% render_field field class+='form-control' %}
+            {% for error in field.errors %}
+                <ul class="error-block">
+                    <li>
+                        {{ error }}
+                    </li>
+                </ul>
+            {% endfor %}
+            {# No help text as it wraps #}
+        </div>
+    {% endif %}
 {% endfor %}
diff --git a/tests/django_oscar/oscar/dashboard/partials/product_images.html b/tests/django_oscar/oscar/dashboard/partials/product_images.html
index 217e98f..d8a0377 100644
--- a/tests/django_oscar/oscar/dashboard/partials/product_images.html
+++ b/tests/django_oscar/oscar/dashboard/partials/product_images.html
@@ -15,23 +15,23 @@
                 </ul>
             {% endfor %}
             <a href="#" class="btn btn-info btn-handle btn-reorder {% if not form.instance.id %}disabled{% endif %}"
-            {% if not form.instance.id %}disabled{% endif %}
-            >
-            <i class="fas fa-arrows-alt"></i>
-            {% trans "Re-order" context "Change the sequence order" %}
-        </a>
-        <br>
-    {% else %}
-        {{ field.label_tag }}
-        {{ field }}
-        {% for error in field.errors %}
-            <ul class="error-block">
-                <li>
-                    {{ error }}
-                </li>
-            </ul>
-        {% endfor %}
-    {% endif %}
-{% endfor %}
-{{ form.non_field_errors }}
+                {% if not form.instance.id %}disabled{% endif %}
+                >
+                <i class="fas fa-arrows-alt"></i>
+                {% trans "Re-order" context "Change the sequence order" %}
+            </a>
+            <br>
+        {% else %}
+            {{ field.label_tag }}
+            {{ field }}
+            {% for error in field.errors %}
+                <ul class="error-block">
+                    <li>
+                        {{ error }}
+                    </li>
+                </ul>
+            {% endfor %}
+        {% endif %}
+    {% endfor %}
+    {{ form.non_field_errors }}
 </li>
diff --git a/tests/django_oscar/oscar/dashboard/partners/partner_list.html b/tests/django_oscar/oscar/dashboard/partners/partner_list.html
index 6c0fada..1b1619a 100644
--- a/tests/django_oscar/oscar/dashboard/partners/partner_list.html
+++ b/tests/django_oscar/oscar/dashboard/partners/partner_list.html
@@ -64,75 +64,78 @@
                         </td>
                         <td>
                             {% with users=partner.users.all %}
-                            {% if users %}
-                                <ul>
-                                    {% for user in users %}
-                                        <li>
-                                            <a href="{% url 'dashboard:partner-user-update' partner_pk=partner.pk user_pk=user.id %}"
-                                               title="{% trans ">
-                                                {{ user.get_full_name|default:user.email }}
-                                            </a>
-                                        </li>
-                                    {% endfor %}
-                                </ul>
-                            {% else %}
-                                {% trans 'No users associated.' %}
-                            {% endif %}
-                        {% endwith %}
-                    </td>
-                    <td>
-                        {% with addresses=partner.addresses.all %}
-                        {% if addresses %}
-                            <ul>
-                                {% for address in addresses %}
-                                    <li>
-                                        {{ address.summary }}
-                                    </li>
-                                {% endfor %}
-                            </ul>
-                        {% else %}
-                            {% trans 'No address associated.' %}
-                        {% endif %}
-                    {% endwith %}
-                </td>
-                <td>
-                    <div class="btn-toolbar">
-                        <div class="dropdown">
-                            <button class="btn btn-secondary dropdown-toggle"
-                                    type="button"
-                                    id="dropdownMenuButton"
-                                    data-toggle="dropdown"
-                                    aria-haspopup="true"
-                                    aria-expanded="false">
-                                {% trans "Actions" %}
-                            </button>
-                            <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
-                                <a class="dropdown-item" href="{% url 'dashboard:partner-manage' pk=partner.pk %}">
-                                    {% trans "Manage partner and users" %}
-                                </a>
-                                <a class="dropdown-item" href="{% url 'dashboard:partner-delete' pk=partner.pk %}">
-                                    {% trans "Delete partner" %}
-                                </a>
-                                <a class="dropdown-item"
-                                   href="{% url 'dashboard:partner-user-select' partner_pk=partner.pk %}">
-                                    {% trans "Link an existing user" %}
-                                </a>
-                                <a class="dropdown-item"
-                                   href="{% url 'dashboard:partner-user-create' partner_pk=partner.pk %}">
-                                    {% trans "Link a new user" %}
-                                </a>
+                                {% if users %}
+                                    <ul>
+                                        {% for user in users %}
+                                            <li>
+                                                <a href="{% url 'dashboard:partner-user-update' partner_pk=partner.pk user_pk=user.id %}"
+                                                   title="{% trans ">
+                                                    {{ user.get_full_name|default:user.email }}
+                                                </a>
+                                            </li>
+                                        {% endfor %}
+                                    </ul>
+                                {% else %}
+                                    {% trans 'No users associated.' %}
+                                {% endif %}
+                            {% endwith %}
+                        </td>
+                        <td>
+                            {% with addresses=partner.addresses.all %}
+                                {% if addresses %}
+                                    <ul>
+                                        {% for address in addresses %}
+                                            <li>
+                                                {{ address.summary }}
+                                            </li>
+                                        {% endfor %}
+                                    </ul>
+                                {% else %}
+                                    {% trans 'No address associated.' %}
+                                {% endif %}
+                            {% endwith %}
+                        </td>
+                        <td>
+                            <div class="btn-toolbar">
+                                <div class="dropdown">
+                                    <button class="btn btn-secondary dropdown-toggle"
+                                            type="button"
+                                            id="dropdownMenuButton"
+                                            data-toggle="dropdown"
+                                            aria-haspopup="true"
+                                            aria-expanded="false">
+                                        {% trans "Actions" %}
+                                    </button>
+                                    <div class="dropdown-menu dropdown-menu-right"
+                                         aria-labelledby="dropdownMenuButton">
+                                        <a class="dropdown-item"
+                                           href="{% url 'dashboard:partner-manage' pk=partner.pk %}">
+                                            {% trans "Manage partner and users" %}
+                                        </a>
+                                        <a class="dropdown-item"
+                                           href="{% url 'dashboard:partner-delete' pk=partner.pk %}">
+                                            {% trans "Delete partner" %}
+                                        </a>
+                                        <a class="dropdown-item"
+                                           href="{% url 'dashboard:partner-user-select' partner_pk=partner.pk %}">
+                                            {% trans "Link an existing user" %}
+                                        </a>
+                                        <a class="dropdown-item"
+                                           href="{% url 'dashboard:partner-user-create' partner_pk=partner.pk %}">
+                                            {% trans "Link a new user" %}
+                                        </a>
+                                    </div>
+                                </div>
                             </div>
-                        </div>
-                    </div>
-                </td>
-            </tr>
-        {% endfor %}
-    {% else %}
-        <tr>
-            <td>{% trans "No partners found." %}</td>
-        </tr>
-    {% endif %}
-</table>
-{% include "oscar/dashboard/partials/pagination.html" %}
-</form>
+                        </td>
+                    </tr>
+                {% endfor %}
+            {% else %}
+                <tr>
+                    <td>{% trans "No partners found." %}</td>
+                </tr>
+            {% endif %}
+        </table>
+        {% include "oscar/dashboard/partials/pagination.html" %}
+    </form>
 {% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/partners/partner_user_list.html b/tests/django_oscar/oscar/dashboard/partners/partner_user_list.html
index 8a77a5a..9627d17 100644
--- a/tests/django_oscar/oscar/dashboard/partners/partner_user_list.html
+++ b/tests/django_oscar/oscar/dashboard/partners/partner_user_list.html
@@ -83,4 +83,5 @@
     {% endif %}
     {% include "oscar/dashboard/partials/pagination.html" %}
     <h1>{% trans "Update details" %}</h1>
-    {% include 'oscar/dashboard/partials/form.html' %}{% endblock dashboard_content %}
+    {% include 'oscar/dashboard/partials/form.html' %}
+{% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/partners/partner_user_select.html b/tests/django_oscar/oscar/dashboard/partners/partner_user_select.html
index 6618872..984094c 100644
--- a/tests/django_oscar/oscar/dashboard/partners/partner_user_select.html
+++ b/tests/django_oscar/oscar/dashboard/partners/partner_user_select.html
@@ -53,50 +53,50 @@
     {% if form.is_bound %}
         {% if users %}
             {% with partner_users=partner.users.all %}
-            <table class="table table-striped table-bordered">
-                {% block users_header %}
-                    <thead>
-                        <tr>
-                            <th>{% trans 'Email' %}</th>
-                            <th>{% trans 'First name' %}</th>
-                            <th>{% trans 'Last name' %}</th>
-                            <th>&nbsp;</th>
-                        </tr>
-                    </thead>
-                {% endblock %}
-                <tbody>
-                    {% for user in users %}
-                        {% block users_row %}
+                <table class="table table-striped table-bordered">
+                    {% block users_header %}
+                        <thead>
                             <tr>
-                                <td>{{ user.email }}</td>
-                                <td>{{ user.first_name|default:"-" }}</td>
-                                <td>{{ user.last_name|default:"-" }}</td>
-                                <td>
-                                    {% if user in partner_users %}
-                                        {% blocktrans with name=partner.name %}
-                                            User is already linked to {{ name }}.
-                                        {% endblocktrans %}
-                                    {% else %}
-                                        <form action="{% url 'dashboard:partner-user-link' partner_pk=partner.id user_pk=user.id %}"
-                                              method="post">
-                                            {% csrf_token %}
-                                            <button type="submit"
-                                                    class="btn btn-primary"
-                                                    data-loading-text="{% trans 'Linking...' %}">
-                                                {% trans 'Link user' %}
-                                            </button>
-                                        </form>
-                                    {% endif %}
-                                </td>
+                                <th>{% trans 'Email' %}</th>
+                                <th>{% trans 'First name' %}</th>
+                                <th>{% trans 'Last name' %}</th>
+                                <th>&nbsp;</th>
                             </tr>
-                        {% endblock %}
-                    {% endfor %}
-                </tbody>
-            </table>
-        {% endwith %}
-        {% include "oscar/dashboard/partials/pagination.html" %}
-    {% else %}
-        {% trans "No users found." %}
+                        </thead>
+                    {% endblock %}
+                    <tbody>
+                        {% for user in users %}
+                            {% block users_row %}
+                                <tr>
+                                    <td>{{ user.email }}</td>
+                                    <td>{{ user.first_name|default:"-" }}</td>
+                                    <td>{{ user.last_name|default:"-" }}</td>
+                                    <td>
+                                        {% if user in partner_users %}
+                                            {% blocktrans with name=partner.name %}
+                                                User is already linked to {{ name }}.
+                                            {% endblocktrans %}
+                                        {% else %}
+                                            <form action="{% url 'dashboard:partner-user-link' partner_pk=partner.id user_pk=user.id %}"
+                                                  method="post">
+                                                {% csrf_token %}
+                                                <button type="submit"
+                                                        class="btn btn-primary"
+                                                        data-loading-text="{% trans 'Linking...' %}">
+                                                    {% trans 'Link user' %}
+                                                </button>
+                                            </form>
+                                        {% endif %}
+                                    </td>
+                                </tr>
+                            {% endblock %}
+                        {% endfor %}
+                    </tbody>
+                </table>
+            {% endwith %}
+            {% include "oscar/dashboard/partials/pagination.html" %}
+        {% else %}
+            {% trans "No users found." %}
+        {% endif %}
     {% endif %}
-{% endif %}
 {% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/ranges/range_list.html b/tests/django_oscar/oscar/dashboard/ranges/range_list.html
index f7d37c1..21f39cb 100644
--- a/tests/django_oscar/oscar/dashboard/ranges/range_list.html
+++ b/tests/django_oscar/oscar/dashboard/ranges/range_list.html
@@ -115,4 +115,5 @@
             </tr>
         {% endif %}
     </table>
-    {% include "oscar/dashboard/partials/pagination.html" %}{% endblock dashboard_content %}
+    {% include "oscar/dashboard/partials/pagination.html" %}
+{% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/ranges/range_product_list.html b/tests/django_oscar/oscar/dashboard/ranges/range_product_list.html
index 56475a4..e82f2f8 100644
--- a/tests/django_oscar/oscar/dashboard/ranges/range_product_list.html
+++ b/tests/django_oscar/oscar/dashboard/ranges/range_product_list.html
@@ -53,133 +53,135 @@
                 </div>
             </form>
             {% with uploads=range.file_uploads.all %}
-            {% if uploads %}
-                <div class="table-header">
-                    <h3>{% trans "Upload history" %}</h3>
-                </div>
-                <table class="table table-striped table-bordered table-hover">
-                    <thead>
-                        <tr>
-                            <th>{% trans "Filename" %}</th>
-                            <th>{% trans "New products" %}</th>
-                            <th>{% trans "Duplicate products" %}</th>
-                            <th>{% trans "Unknown products" %}</th>
-                            <th>{% trans "Date uploaded" %}</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        {% for upload in uploads %}
+                {% if uploads %}
+                    <div class="table-header">
+                        <h3>{% trans "Upload history" %}</h3>
+                    </div>
+                    <table class="table table-striped table-bordered table-hover">
+                        <thead>
                             <tr>
-                                <td>{{ upload.filepath }}</td>
-                                <td>{{ upload.num_new_skus }}</td>
-                                <td>{{ upload.num_duplicate_skus }}</td>
-                                <td>
-                                    {{ upload.num_unknown_skus }}
-                                </td>
-                                <td>
-                                    {{ upload.date_uploaded }}
-                                </td>
+                                <th>{% trans "Filename" %}</th>
+                                <th>{% trans "New products" %}</th>
+                                <th>{% trans "Duplicate products" %}</th>
+                                <th>{% trans "Unknown products" %}</th>
+                                <th>{% trans "Date uploaded" %}</th>
                             </tr>
-                        {% endfor %}
-                    </tbody>
-                </table>
-            {% endif %}
-        {% endwith %}
-        {% if products %}
-            <form method="post">
-                {% csrf_token %}
+                        </thead>
+                        <tbody>
+                            {% for upload in uploads %}
+                                <tr>
+                                    <td>{{ upload.filepath }}</td>
+                                    <td>{{ upload.num_new_skus }}</td>
+                                    <td>{{ upload.num_duplicate_skus }}</td>
+                                    <td>
+                                        {{ upload.num_unknown_skus }}
+                                    </td>
+                                    <td>
+                                        {{ upload.date_uploaded }}
+                                    </td>
+                                </tr>
+                            {% endfor %}
+                        </tbody>
+                    </table>
+                {% endif %}
+            {% endwith %}
+            {% if products %}
+                <form method="post">
+                    {% csrf_token %}
+                    <table class="table table-striped table-bordered table-hover">
+                        <caption>
+                        <h3 class="float-left">{% trans "Products in range" %}</h3>
+                        <div class="float-right">
+                            <input type="hidden" name="action" value="remove_selected_products" />
+                            <button type="submit"
+                                    class="btn btn-secondary"
+                                    data-loading-text="{% trans 'Removing...' %}">
+                                {% trans "Remove selected products" %}
+                            </button>
+                        </div>
+                        </caption>
+                        <thead>
+                            <tr>
+                                <th></th>
+                                <th>
+                                    {% trans "UPC" %}
+                                </th>
+                                <th>
+                                    {% trans "Title" context "Product title" %}
+                                </th>
+                                <th>
+                                    {% trans "Is product discountable?" %}
+                                </th>
+                                <th></th>
+                            </tr>
+                        </thead>
+                        <tbody class="product_list">
+                            {% for product in products %}
+                                <tr id="product_{{ product.pk }}">
+                                    <td>
+                                        <input type="checkbox" name="selected_product" value="{{ product.id }}" />
+                                    </td>
+                                    <td>
+                                        {{ product.upc|default:"-" }}
+                                    </td>
+                                    <td>
+                                        <a href="{% url 'dashboard:catalogue-product' pk=product.id %}">
+                                            {{ product.get_title }}
+                                        </a>
+                                    </td>
+                                    <td>
+                                        {% if product.get_is_discountable %}
+                                            {% trans "Yes" %}
+                                        {% else %}
+                                            {% trans "No" %}
+                                        {% endif %}
+                                    </td>
+                                    <td>
+                                        <a class="btn btn-danger" href="#" data-behaviours="remove">
+                                            {% trans "Remove" %}
+                                        </a>
+                                        {% if range.is_reorderable %}
+                                            <a href="#" class="btn btn-info btn-handle">
+                                                <i class="fas fa-arrows-alt"></i>
+                                                {% trans "Re-order" context "Change the sequence order" %}
+                                            </a>
+                                        {% endif %}
+                                    </td>
+                                </tr>
+                            {% endfor %}
+                        </tbody>
+                    </table>
+                    {% include "oscar/dashboard/partials/pagination.html" %}
+                </form>
+            {% else %}
                 <table class="table table-striped table-bordered table-hover">
                     <caption>
-                    <h3 class="float-left">{% trans "Products in range" %}</h3>
-                    <div class="float-right">
-                        <input type="hidden" name="action" value="remove_selected_products" />
-                        <button type="submit" class="btn btn-secondary" data-loading-text="{% trans 'Removing...' %}">
-                            {% trans "Remove selected products" %}
-                        </button>
-                    </div>
+                    {% trans "Products in Range" %}
                     </caption>
-                    <thead>
-                        <tr>
-                            <th></th>
-                            <th>
-                                {% trans "UPC" %}
-                            </th>
-                            <th>
-                                {% trans "Title" context "Product title" %}
-                            </th>
-                            <th>
-                                {% trans "Is product discountable?" %}
-                            </th>
-                            <th></th>
-                        </tr>
-                    </thead>
-                    <tbody class="product_list">
-                        {% for product in products %}
-                            <tr id="product_{{ product.pk }}">
-                                <td>
-                                    <input type="checkbox" name="selected_product" value="{{ product.id }}" />
-                                </td>
-                                <td>
-                                    {{ product.upc|default:"-" }}
-                                </td>
-                                <td>
-                                    <a href="{% url 'dashboard:catalogue-product' pk=product.id %}">
-                                        {{ product.get_title }}
-                                    </a>
-                                </td>
-                                <td>
-                                    {% if product.get_is_discountable %}
-                                        {% trans "Yes" %}
-                                    {% else %}
-                                        {% trans "No" %}
-                                    {% endif %}
-                                </td>
-                                <td>
-                                    <a class="btn btn-danger" href="#" data-behaviours="remove">
-                                        {% trans "Remove" %}
-                                    </a>
-                                    {% if range.is_reorderable %}
-                                        <a href="#" class="btn btn-info btn-handle">
-                                            <i class="fas fa-arrows-alt"></i>
-                                            {% trans "Re-order" context "Change the sequence order" %}
-                                        </a>
-                                    {% endif %}
-                                </td>
-                            </tr>
-                        {% endfor %}
-                    </tbody>
+                    <tr>
+                        <td>
+                            {% trans "No products found." %}
+                        </td>
+                    </tr>
                 </table>
-                {% include "oscar/dashboard/partials/pagination.html" %}
-            </form>
-        {% else %}
-            <table class="table table-striped table-bordered table-hover">
-                <caption>
-                {% trans "Products in Range" %}
-                </caption>
-                <tr>
-                    <td>
-                        {% trans "No products found." %}
-                    </td>
-                </tr>
-            </table>
-        {% endif %}
+            {% endif %}
+        </div>
+    {% endif %}
+    <div class="form-actions">
+        <a href="{% url 'dashboard:range-update' pk=range.id %}" class="btn btn-primary">
+            {% trans "Edit range" %}
+        </a>
+        {% trans "or" %}
+        <a href="{% url 'dashboard:range-list' %}" class="">
+            {% trans "return to range list" %}
+        </a>
     </div>
-{% endif %}
-<div class="form-actions">
-    <a href="{% url 'dashboard:range-update' pk=range.id %}" class="btn btn-primary">
-        {% trans "Edit range" %}
-    </a>
-    {% trans "or" %}
-    <a href="{% url 'dashboard:range-list' %}" class="">
-        {% trans "return to range list" %}
-    </a>
-</div>
 {% endblock dashboard_content %}
 {% block onbodyload %}
-{{ block.super }}
-oscar.dashboard.ranges.init();
-oscar.dashboard.reordering.init({
-wrapper: '.product_list',
-submit_url: '{% url 'dashboard:range-reorder' pk=range.id %}'
-});
+    {{ block.super }}
+    oscar.dashboard.ranges.init();
+    oscar.dashboard.reordering.init({
+    wrapper: '.product_list',
+    submit_url: '{% url 'dashboard:range-reorder' pk=range.id %}'
+    });
 {% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/reports/partials/offer_report.html b/tests/django_oscar/oscar/dashboard/reports/partials/offer_report.html
index bc68849..b694cad 100644
--- a/tests/django_oscar/oscar/dashboard/reports/partials/offer_report.html
+++ b/tests/django_oscar/oscar/dashboard/reports/partials/offer_report.html
@@ -24,4 +24,5 @@
             </tr>
         {% endif %}
     </table>
-    {% include "oscar/dashboard/partials/pagination.html" %}{% endblock %}
+    {% include "oscar/dashboard/partials/pagination.html" %}
+{% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/reports/partials/open_basket_report.html b/tests/django_oscar/oscar/dashboard/reports/partials/open_basket_report.html
index 6a8447e..0a34649 100644
--- a/tests/django_oscar/oscar/dashboard/reports/partials/open_basket_report.html
+++ b/tests/django_oscar/oscar/dashboard/reports/partials/open_basket_report.html
@@ -40,4 +40,5 @@
         </tr>
     {% endfor %}
 </table>
-{% include "oscar/dashboard/partials/pagination.html" %}{% endblock %}
+{% include "oscar/dashboard/partials/pagination.html" %}
+{% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/reports/partials/order_report.html b/tests/django_oscar/oscar/dashboard/reports/partials/order_report.html
index c50aade..30ddefc 100644
--- a/tests/django_oscar/oscar/dashboard/reports/partials/order_report.html
+++ b/tests/django_oscar/oscar/dashboard/reports/partials/order_report.html
@@ -44,4 +44,5 @@
             </tr>
         {% endif %}
     </table>
-    {% include "oscar/dashboard/partials/pagination.html" %}{% endblock %}
+    {% include "oscar/dashboard/partials/pagination.html" %}
+{% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/reports/partials/product_report.html b/tests/django_oscar/oscar/dashboard/reports/partials/product_report.html
index bd8b02f..5a9c957 100644
--- a/tests/django_oscar/oscar/dashboard/reports/partials/product_report.html
+++ b/tests/django_oscar/oscar/dashboard/reports/partials/product_report.html
@@ -22,4 +22,5 @@
             </tr>
         {% endfor %}
     </table>
-    {% include "oscar/dashboard/partials/pagination.html" %}{% endblock %}
+    {% include "oscar/dashboard/partials/pagination.html" %}
+{% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/reports/partials/submitted_basket_report.html b/tests/django_oscar/oscar/dashboard/reports/partials/submitted_basket_report.html
index f506bc6..3d316ec 100644
--- a/tests/django_oscar/oscar/dashboard/reports/partials/submitted_basket_report.html
+++ b/tests/django_oscar/oscar/dashboard/reports/partials/submitted_basket_report.html
@@ -38,4 +38,5 @@
             </tr>
         {% endfor %}
     </table>
-    {% include "oscar/dashboard/partials/pagination.html" %}{% endblock %}
+    {% include "oscar/dashboard/partials/pagination.html" %}
+{% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/reports/partials/user_report.html b/tests/django_oscar/oscar/dashboard/reports/partials/user_report.html
index cce756f..14a8ece 100644
--- a/tests/django_oscar/oscar/dashboard/reports/partials/user_report.html
+++ b/tests/django_oscar/oscar/dashboard/reports/partials/user_report.html
@@ -54,4 +54,5 @@
             </tr>
         {% endfor %}
     </table>
-    {% include "oscar/dashboard/partials/pagination.html" %}{% endblock %}
+    {% include "oscar/dashboard/partials/pagination.html" %}
+{% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/reports/partials/voucher_report.html b/tests/django_oscar/oscar/dashboard/reports/partials/voucher_report.html
index aaa0671..fef63a1 100644
--- a/tests/django_oscar/oscar/dashboard/reports/partials/voucher_report.html
+++ b/tests/django_oscar/oscar/dashboard/reports/partials/voucher_report.html
@@ -28,4 +28,5 @@
             </tr>
         {% endif %}
     </table>
-    {% include "oscar/dashboard/partials/pagination.html" %}{% endblock %}
+    {% include "oscar/dashboard/partials/pagination.html" %}
+{% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/shipping/weight_based_detail.html b/tests/django_oscar/oscar/dashboard/shipping/weight_based_detail.html
index 9ac63bc..e5b27c3 100644
--- a/tests/django_oscar/oscar/dashboard/shipping/weight_based_detail.html
+++ b/tests/django_oscar/oscar/dashboard/shipping/weight_based_detail.html
@@ -36,80 +36,82 @@
                     <td>{{ method.description|safe|default:"-" }}</td>
                 </tr>
                 {% with countries=method.countries.all %}
-                {% if countries %}
-                    <tr>
-                        <th>{% trans "Applies to countries" %}</th>
-                        <td>{{ countries|join:", " }}</td>
-                    </tr>
-                {% endif %}
-            {% endwith %}
-            <tr>
-                <th>{% trans "Default product weight (kg)" %}</th>
-                <td>{{ method.default_weight }}</td>
-            </tr>
-        </tbody>
-    </table>
-    <p>
-        <a id="edit_method" href="{% url 'dashboard:shipping-method-edit' pk=method.pk %}" class="btn btn-primary">
-            {% trans 'Edit shipping method' %}
-        </a>
-        <a id="delete_method" href="{% url 'dashboard:shipping-method-delete' pk=method.pk %}" class="btn btn-danger">
-            {% trans 'Delete shipping method' %}
-        </a>
-    </p>
-    <h2>{% trans "Weight bands" %}</h2>
-    {% if method.bands.all.count %}
-        <table class="table table-bordered">
-            <thead>
+                    {% if countries %}
+                        <tr>
+                            <th>{% trans "Applies to countries" %}</th>
+                            <td>{{ countries|join:", " }}</td>
+                        </tr>
+                    {% endif %}
+                {% endwith %}
                 <tr>
-                    <th>
-                        {% trans "Weight range (kg)" %}
-                    </th>
-                    <th>
-                        {% trans "Charge" %}
-                    </th>
-                    <th></th>
+                    <th>{% trans "Default product weight (kg)" %}</th>
+                    <td>{{ method.default_weight }}</td>
                 </tr>
-            </thead>
-            <tbody>
-                {% for band in method.bands.all %}
-                    <tr>
-                        <td>
-                            {{ band.weight_from|floatformat:3 }} - {{ band.weight_to|floatformat:3 }}
-                        </td>
-                        <td>
-                            {{ band.charge|currency }}
-                        </td>
-                        <td>
-                            <a id="edit_band_{{ band.id }}"
-                               href="{% url 'dashboard:shipping-method-band-edit' method_pk=band.method.pk pk=band.pk %}"
-                               class="btn btn-primary">
-                                {% trans "Edit" %}
-                            </a>
-                            <a id="delete_band_{{ band.id }}"
-                               href="{% url 'dashboard:shipping-method-band-delete' method_pk=band.method.pk pk=band.pk %}"
-                               class="btn btn-danger">
-                                {% trans "Delete" %}
-                            </a>
-                        </td>
-                    </tr>
-                {% endfor %}
             </tbody>
         </table>
-    {% else %}
         <p>
-            {% trans "No weight bands have been added yet." %}
+            <a id="edit_method" href="{% url 'dashboard:shipping-method-edit' pk=method.pk %}" class="btn btn-primary">
+                {% trans 'Edit shipping method' %}
+            </a>
+            <a id="delete_method"
+               href="{% url 'dashboard:shipping-method-delete' pk=method.pk %}"
+               class="btn btn-danger">
+                {% trans 'Delete shipping method' %}
+            </a>
         </p>
-    {% endif %}
-    <h2>
-        {% trans "Add a new weight band" %}
-    </h2>
-    <form method="post">
-        {% csrf_token %}
-        {% include "oscar/dashboard/partials/form_fields.html" with form=form %}
-        <button type="submit" class="btn btn-primary" data-loading-text="{% trans 'Adding...' %}">
-            {% trans 'Add weight band' %}
-        </button>
-    </form>
-</div>
+        <h2>{% trans "Weight bands" %}</h2>
+        {% if method.bands.all.count %}
+            <table class="table table-bordered">
+                <thead>
+                    <tr>
+                        <th>
+                            {% trans "Weight range (kg)" %}
+                        </th>
+                        <th>
+                            {% trans "Charge" %}
+                        </th>
+                        <th></th>
+                    </tr>
+                </thead>
+                <tbody>
+                    {% for band in method.bands.all %}
+                        <tr>
+                            <td>
+                                {{ band.weight_from|floatformat:3 }} - {{ band.weight_to|floatformat:3 }}
+                            </td>
+                            <td>
+                                {{ band.charge|currency }}
+                            </td>
+                            <td>
+                                <a id="edit_band_{{ band.id }}"
+                                   href="{% url 'dashboard:shipping-method-band-edit' method_pk=band.method.pk pk=band.pk %}"
+                                   class="btn btn-primary">
+                                    {% trans "Edit" %}
+                                </a>
+                                <a id="delete_band_{{ band.id }}"
+                                   href="{% url 'dashboard:shipping-method-band-delete' method_pk=band.method.pk pk=band.pk %}"
+                                   class="btn btn-danger">
+                                    {% trans "Delete" %}
+                                </a>
+                            </td>
+                        </tr>
+                    {% endfor %}
+                </tbody>
+            </table>
+        {% else %}
+            <p>
+                {% trans "No weight bands have been added yet." %}
+            </p>
+        {% endif %}
+        <h2>
+            {% trans "Add a new weight band" %}
+        </h2>
+        <form method="post">
+            {% csrf_token %}
+            {% include "oscar/dashboard/partials/form_fields.html" with form=form %}
+            <button type="submit" class="btn btn-primary" data-loading-text="{% trans 'Adding...' %}">
+                {% trans 'Add weight band' %}
+            </button>
+        </form>
+    </div>
 {% endblock %}
diff --git a/tests/django_oscar/oscar/dashboard/table.html b/tests/django_oscar/oscar/dashboard/table.html
index bfa4d08..a4a850e 100644
--- a/tests/django_oscar/oscar/dashboard/table.html
+++ b/tests/django_oscar/oscar/dashboard/table.html
@@ -29,5 +29,6 @@
 {% endblock table.thead %}
 {% block pagination %}
     {% with page_obj=table.page paginator=table.paginator %}
-    {% include "oscar/dashboard/partials/pagination.html" %}{% endwith %}
+        {% include "oscar/dashboard/partials/pagination.html" %}
+    {% endwith %}
 {% endblock pagination %}
diff --git a/tests/django_oscar/oscar/dashboard/users/alerts/update.html b/tests/django_oscar/oscar/dashboard/users/alerts/update.html
index ffdafbc..9fadf3d 100644
--- a/tests/django_oscar/oscar/dashboard/users/alerts/update.html
+++ b/tests/django_oscar/oscar/dashboard/users/alerts/update.html
@@ -53,4 +53,5 @@
             </form>
         </div>
     </div>
-    {% include 'oscar/dashboard/users/alerts/partials/alert.html' %}{% endblock dashboard_content %}
+    {% include 'oscar/dashboard/users/alerts/partials/alert.html' %}
+{% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/users/detail.html b/tests/django_oscar/oscar/dashboard/users/detail.html
index 1285e40..f718a91 100644
--- a/tests/django_oscar/oscar/dashboard/users/detail.html
+++ b/tests/django_oscar/oscar/dashboard/users/detail.html
@@ -71,240 +71,240 @@
                     </tr>
                     {% if customer.userrecord %}
                         {% with record=customer.userrecord %}
-                        <tr>
-                            <th>
-                                {% trans "Products viewed" %}
-                            </th>
-                            <td>
-                                {{ record.num_product_views|default:0 }}
-                            </td>
-                        </tr>
-                        <tr>
-                            <th>
-                                {% trans "Number of orders" %}
-                            </th>
-                            <td>
-                                {{ record.num_orders|default:0 }}
-                            </td>
-                        </tr>
-                        <tr>
-                            <th>
-                                {% trans "Number of ordered items" %}
-                            </th>
-                            <td>
-                                {{ record.num_order_items|default:0 }}
-                            </td>
-                        </tr>
-                        <tr>
-                            <th>
-                                {% trans "Total spent" %}
-                            </th>
-                            <td>
-                                {{ record.total_spent|default:0|currency }}
-                            </td>
-                        </tr>
-                    {% endwith %}
-                {% endif %}
-                <tr>
-                    <th>
-                        {% trans "Reviews written" %}
-                    </th>
-                    <td>
-                        {{ customer.reviews.count }}
-                    </td>
-                </tr>
-                {% if customer.email %}
-                    <tr>
-                        <th>
-                            {% trans "Actions" %}
-                        </th>
-                        <td>
-                            <form id="password_reset_form"
-                                  action="{% url 'dashboard:user-password-reset' pk=customer.id %}"
-                                  method="post">
-                                {% csrf_token %}
-                                <button type="submit"
-                                        class="btn btn-primary"
-                                        data-loading-text="{% trans 'Sending...' %}">
-                                    {% trans 'Send password reset email' %}
-                                </button>
-                            </form>
-                        </td>
-                    </tr>
-                {% endif %}
-            </table>
-        </div>
-    {% endblock %}
-</div>
-<div class="row">
-    {% block user_additional_info %}
-        <div class="tabbable dashboard col-md-12">
-            {% block tab_nav %}
-                <ul class="nav nav-tabs mb-0" role="tablist">
-                    <li class="nav-item">
-                        <a class="nav-link active" href="#user_orders" data-toggle="tab">
-                            {% trans "Orders" %}
-                        </a>
-                    </li>
-                    <li class="nav-item">
-                        <a class="nav-link" href="#user_addresses" data-toggle="tab">
-                            {% trans "Addresses" %}
-                        </a>
-                    </li>
-                    <li class="nav-item">
-                        <a class="nav-link" href="#user_reviews" data-toggle="tab">
-                            {% trans "Reviews" %}
-                        </a>
-                    </li>
-                </ul>
-            {% endblock %}
-            <div class="tab-content">
-                {% block user_orders %}
-                    <div id="user_orders" class="tab-pane fade show active" role="tabpanel">
-                        <table class="table table-striped table-bordered table-hover">
-                            <caption>
-                            {% trans "Orders" %}
-                            </caption>
-                            {% with orders=customer.orders.all %}
-                            {% if orders %}
-                                <tr>
-                                    <th>
-                                        {% trans "Order Number" %}
-                                    </th>
-                                    <th>
-                                        {% trans "Num items" %}
-                                    </th>
-                                    <th>
-                                        {% trans "Total value" %}
-                                    </th>
-                                    <th>
-                                        {% trans "Date placed" %}
-                                    </th>
-                                    <th>
-                                        {% trans "Status" %}
-                                    </th>
-                                    <th></th>
-                                </tr>
-                                {% for order in orders %}
-                                    <tr>
-                                        <td>
-                                            <a href="{% url 'dashboard:order-detail' order.number %}">
-                                                {{ order.number }}
-                                            </a>
-                                        </td>
-                                        <td>
-                                            {{ order.num_items }}
-                                        </td>
-                                        <td>
-                                            {{ order.basket_total_incl_tax|currency }}
-                                        </td>
-                                        <td>
-                                            {{ order.date_placed|date }}
-                                        </td>
-                                        <td>
-                                            {{ order.status|default:"-" }}
-                                        </td>
-                                        <td>
-                                            <a href="{% url 'dashboard:order-detail' number=order.number %}"
-                                               class="btn btn-info">
-                                                {% trans "View" %}
-                                            </a>
-                                        </td>
-                                    </tr>
-                                {% endfor %}
-                            {% else %}
-                                <tr>
-                                    <td>
-                                        {% trans "This customer has not placed any orders yet." %}
-                                    </td>
-                                </tr>
-                            {% endif %}
-                        {% endwith %}
-                    </table>
-                </div>
-            {% endblock %}
-            {% block user_addresses %}
-                <div id="user_addresses" class="tab-pane fade" role="tabpanel">
-                    <h2>
-                        {% trans "Addresses" %}
-                    </h2>
-                    <div class="row">
-                        {% for address in customer.addresses.all %}
-                            <div class="col-md-3">
-                                <div class="card card-body bg-info">
-                                    {% for field in address.active_address_fields %}
-                                        {{ field }}
-                                        <br/>
-                                    {% endfor %}
-                                </div>
-                            </div>
-                            {% if forloop.counter|divisibleby:4 %}
-                            </div>
-                            <div class="row">
-                            {% endif %}
-                            {% empty %}
-                            <p>
-                                {% trans "This customer has not saved any addresses." %}
-                            </p>
-                        {% endfor %}
-                    </div>
-                </div>
-            {% endblock %}
-            {% block user_reviews %}
-                <div id="user_reviews" class="tab-pane fade" role="tabpanel">
-                    <table class="table table-striped table-bordered table-hover">
-                        <caption>
-                        {% trans "Reviews" %}
-                        </caption>
-                        {% if customer.reviews.count %}
                             <tr>
                                 <th>
-                                    {% trans "Product ID" %}
+                                    {% trans "Products viewed" %}
                                 </th>
-                                <th>
-                                    {% trans "Score" %}
-                                </th>
-                                <th>
-                                    {% trans "Title" context "Product review title" %}
-                                </th>
-                                <th>
-                                    {% trans "Body" %}
-                                </th>
-                                <th>
-                                    {% trans "Date created" %}
-                                </th>
-                            </tr>
-                            {% for review in customer.reviews.all %}
-                                <tr>
-                                    <td>
-                                        {{ review.product_id }}
-                                    </td>
-                                    <td>
-                                        {{ review.score }}
-                                    </td>
-                                    <td>
-                                        {{ review.title }}
-                                    </td>
-                                    <td>
-                                        {{ review.body }}
-                                    </td>
-                                    <td>
-                                        {{ review.date_created }}
-                                    </td>
-                                </tr>
-                            {% endfor %}
-                        {% else %}
-                            <tr>
                                 <td>
-                                    {% trans "This customer has not written any reviews yet." %}
+                                    {{ record.num_product_views|default:0 }}
                                 </td>
                             </tr>
-                        {% endif %}
-                    </table>
-                </div>
-            {% endblock %}
-        </div>
+                            <tr>
+                                <th>
+                                    {% trans "Number of orders" %}
+                                </th>
+                                <td>
+                                    {{ record.num_orders|default:0 }}
+                                </td>
+                            </tr>
+                            <tr>
+                                <th>
+                                    {% trans "Number of ordered items" %}
+                                </th>
+                                <td>
+                                    {{ record.num_order_items|default:0 }}
+                                </td>
+                            </tr>
+                            <tr>
+                                <th>
+                                    {% trans "Total spent" %}
+                                </th>
+                                <td>
+                                    {{ record.total_spent|default:0|currency }}
+                                </td>
+                            </tr>
+                        {% endwith %}
+                    {% endif %}
+                    <tr>
+                        <th>
+                            {% trans "Reviews written" %}
+                        </th>
+                        <td>
+                            {{ customer.reviews.count }}
+                        </td>
+                    </tr>
+                    {% if customer.email %}
+                        <tr>
+                            <th>
+                                {% trans "Actions" %}
+                            </th>
+                            <td>
+                                <form id="password_reset_form"
+                                      action="{% url 'dashboard:user-password-reset' pk=customer.id %}"
+                                      method="post">
+                                    {% csrf_token %}
+                                    <button type="submit"
+                                            class="btn btn-primary"
+                                            data-loading-text="{% trans 'Sending...' %}">
+                                        {% trans 'Send password reset email' %}
+                                    </button>
+                                </form>
+                            </td>
+                        </tr>
+                    {% endif %}
+                </table>
+            </div>
+        {% endblock %}
     </div>
-</div>
-{% endblock %}
+    <div class="row">
+        {% block user_additional_info %}
+            <div class="tabbable dashboard col-md-12">
+                {% block tab_nav %}
+                    <ul class="nav nav-tabs mb-0" role="tablist">
+                        <li class="nav-item">
+                            <a class="nav-link active" href="#user_orders" data-toggle="tab">
+                                {% trans "Orders" %}
+                            </a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#user_addresses" data-toggle="tab">
+                                {% trans "Addresses" %}
+                            </a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#user_reviews" data-toggle="tab">
+                                {% trans "Reviews" %}
+                            </a>
+                        </li>
+                    </ul>
+                {% endblock %}
+                <div class="tab-content">
+                    {% block user_orders %}
+                        <div id="user_orders" class="tab-pane fade show active" role="tabpanel">
+                            <table class="table table-striped table-bordered table-hover">
+                                <caption>
+                                {% trans "Orders" %}
+                                </caption>
+                                {% with orders=customer.orders.all %}
+                                    {% if orders %}
+                                        <tr>
+                                            <th>
+                                                {% trans "Order Number" %}
+                                            </th>
+                                            <th>
+                                                {% trans "Num items" %}
+                                            </th>
+                                            <th>
+                                                {% trans "Total value" %}
+                                            </th>
+                                            <th>
+                                                {% trans "Date placed" %}
+                                            </th>
+                                            <th>
+                                                {% trans "Status" %}
+                                            </th>
+                                            <th></th>
+                                        </tr>
+                                        {% for order in orders %}
+                                            <tr>
+                                                <td>
+                                                    <a href="{% url 'dashboard:order-detail' order.number %}">
+                                                        {{ order.number }}
+                                                    </a>
+                                                </td>
+                                                <td>
+                                                    {{ order.num_items }}
+                                                </td>
+                                                <td>
+                                                    {{ order.basket_total_incl_tax|currency }}
+                                                </td>
+                                                <td>
+                                                    {{ order.date_placed|date }}
+                                                </td>
+                                                <td>
+                                                    {{ order.status|default:"-" }}
+                                                </td>
+                                                <td>
+                                                    <a href="{% url 'dashboard:order-detail' number=order.number %}"
+                                                       class="btn btn-info">
+                                                        {% trans "View" %}
+                                                    </a>
+                                                </td>
+                                            </tr>
+                                        {% endfor %}
+                                    {% else %}
+                                        <tr>
+                                            <td>
+                                                {% trans "This customer has not placed any orders yet." %}
+                                            </td>
+                                        </tr>
+                                    {% endif %}
+                                {% endwith %}
+                            </table>
+                        </div>
+                    {% endblock %}
+                    {% block user_addresses %}
+                        <div id="user_addresses" class="tab-pane fade" role="tabpanel">
+                            <h2>
+                                {% trans "Addresses" %}
+                            </h2>
+                            <div class="row">
+                                {% for address in customer.addresses.all %}
+                                    <div class="col-md-3">
+                                        <div class="card card-body bg-info">
+                                            {% for field in address.active_address_fields %}
+                                                {{ field }}
+                                                <br/>
+                                            {% endfor %}
+                                        </div>
+                                    </div>
+                                    {% if forloop.counter|divisibleby:4 %}
+                                    </div>
+                                    <div class="row">
+                                    {% endif %}
+                                    {% empty %}
+                                    <p>
+                                        {% trans "This customer has not saved any addresses." %}
+                                    </p>
+                                {% endfor %}
+                            </div>
+                        </div>
+                    {% endblock %}
+                    {% block user_reviews %}
+                        <div id="user_reviews" class="tab-pane fade" role="tabpanel">
+                            <table class="table table-striped table-bordered table-hover">
+                                <caption>
+                                {% trans "Reviews" %}
+                                </caption>
+                                {% if customer.reviews.count %}
+                                    <tr>
+                                        <th>
+                                            {% trans "Product ID" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Score" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Title" context "Product review title" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Body" %}
+                                        </th>
+                                        <th>
+                                            {% trans "Date created" %}
+                                        </th>
+                                    </tr>
+                                    {% for review in customer.reviews.all %}
+                                        <tr>
+                                            <td>
+                                                {{ review.product_id }}
+                                            </td>
+                                            <td>
+                                                {{ review.score }}
+                                            </td>
+                                            <td>
+                                                {{ review.title }}
+                                            </td>
+                                            <td>
+                                                {{ review.body }}
+                                            </td>
+                                            <td>
+                                                {{ review.date_created }}
+                                            </td>
+                                        </tr>
+                                    {% endfor %}
+                                {% else %}
+                                    <tr>
+                                        <td>
+                                            {% trans "This customer has not written any reviews yet." %}
+                                        </td>
+                                    </tr>
+                                {% endif %}
+                            </table>
+                        </div>
+                    {% endblock %}
+                </div>
+            </div>
+        </div>
+    {% endblock %}
 {% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/users/table.html b/tests/django_oscar/oscar/dashboard/users/table.html
index 90c71dc..8a61e03 100644
--- a/tests/django_oscar/oscar/dashboard/users/table.html
+++ b/tests/django_oscar/oscar/dashboard/users/table.html
@@ -6,9 +6,7 @@
         <div class="form-inline">
             <i class="fas fa-sync-alt mr-1"></i>
             <span class="mr-2">{% trans "Bulk Actions" %}</span>
-            <label class="mr-3">
-                {% trans "With selected customers:" %}
-            </label>
+            <label class="mr-3">{% trans "With selected customers:" %}</label>
             <div class="form-check mr-2">
                 <input id="make_active_check" class="form-check-input" type="radio" name="action" value="make_active"/>
                 <label class="form-check-label" for="make_active_check">
diff --git a/tests/django_oscar/oscar/dashboard/vouchers/voucher_delete.html b/tests/django_oscar/oscar/dashboard/vouchers/voucher_delete.html
index 9a5a3a9..0527322 100644
--- a/tests/django_oscar/oscar/dashboard/vouchers/voucher_delete.html
+++ b/tests/django_oscar/oscar/dashboard/vouchers/voucher_delete.html
@@ -64,9 +64,9 @@
                 </button>
                 {% trans "or" %}
                 <a href="{% if not voucher.voucher_set %}{% url 'dashboard:voucher-list' %}{% else %}{% url 'dashboard:voucher-set-detail' pk=voucher.voucher_set.pk %}{% endif %}">
-                {% trans "cancel" %}
-            </a>
-        </div>
-    </form>
-</div>
+                    {% trans "cancel" %}
+                </a>
+            </div>
+        </form>
+    </div>
 {% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/vouchers/voucher_detail.html b/tests/django_oscar/oscar/dashboard/vouchers/voucher_detail.html
index 3e8447e..b1f85dd 100644
--- a/tests/django_oscar/oscar/dashboard/vouchers/voucher_detail.html
+++ b/tests/django_oscar/oscar/dashboard/vouchers/voucher_detail.html
@@ -79,9 +79,7 @@
                         <td>
                             {% for restriction in offer.availability_restrictions %}
                                 {% if not restriction.is_satisfied %}
-                                    <label class="badge badge-danger">
-                                        {{ restriction.description }}
-                                    </label>
+                                    <label class="badge badge-danger">{{ restriction.description }}</label>
                                 {% else %}
                                     {{ restriction.description }}
                                     <br/>
@@ -164,49 +162,49 @@
             <tbody>
                 {% for discount in discounts %}
                     {% with order=discount.order %}
-                    <tr>
-                        <td>
-                            <a href="{% url "dashboard:order-detail" number=order.number %}">
-                                {{ order.number }}
-                            </a>
-                        </td>
-                        <td>
-                            {{ order.total_incl_tax|currency:order.currency }}
-                        </td>
-                        <td>
-                            {{ discount.amount|currency:order.currency }}
-                        </td>
-                        <td>
-                            {{ order.date_placed }}
-                        </td>
-                    </tr>
-                {% endwith %}
-            {% endfor %}
-        </tbody>
-    {% endif %}
-</table>
-<div class="form-actions">
-    {% if not voucher.voucher_set %}
-        <a class="btn btn-primary" href="{% url 'dashboard:voucher-update' pk=voucher.id %}">
-            {% trans "Edit" %}
-        </a>
-        {% trans "or" %}
-    {% else %}
-        <a class="btn btn-primary" href="{% url 'dashboard:voucher-set-update' pk=voucher.voucher_set.pk %}">
-            {% trans "Edit set" %}
-        </a>
-        {% trans "or" %}
-    {% endif %}
-    <a class="btn btn-danger" href="{% url 'dashboard:voucher-delete' pk=voucher.id %}">
-        {% if not voucher.voucher_set %}
-            {% trans "Delete" %}
-        {% else %}
-            {% trans "Delete from set" %}
+                        <tr>
+                            <td>
+                                <a href="{% url "dashboard:order-detail" number=order.number %}">
+                                    {{ order.number }}
+                                </a>
+                            </td>
+                            <td>
+                                {{ order.total_incl_tax|currency:order.currency }}
+                            </td>
+                            <td>
+                                {{ discount.amount|currency:order.currency }}
+                            </td>
+                            <td>
+                                {{ order.date_placed }}
+                            </td>
+                        </tr>
+                    {% endwith %}
+                {% endfor %}
+            </tbody>
         {% endif %}
-    </a>
-    {% trans "or" %}
-    <a href="{% if not voucher.voucher_set %}{% url 'dashboard:voucher-list' %}{% else %}{% url 'dashboard:voucher-set-detail' pk=voucher.voucher_set.pk %}{% endif %}">
-    {% trans "cancel" %}
-</a>
-</div>
+    </table>
+    <div class="form-actions">
+        {% if not voucher.voucher_set %}
+            <a class="btn btn-primary" href="{% url 'dashboard:voucher-update' pk=voucher.id %}">
+                {% trans "Edit" %}
+            </a>
+            {% trans "or" %}
+        {% else %}
+            <a class="btn btn-primary" href="{% url 'dashboard:voucher-set-update' pk=voucher.voucher_set.pk %}">
+                {% trans "Edit set" %}
+            </a>
+            {% trans "or" %}
+        {% endif %}
+        <a class="btn btn-danger" href="{% url 'dashboard:voucher-delete' pk=voucher.id %}">
+            {% if not voucher.voucher_set %}
+                {% trans "Delete" %}
+            {% else %}
+                {% trans "Delete from set" %}
+            {% endif %}
+        </a>
+        {% trans "or" %}
+        <a href="{% if not voucher.voucher_set %}{% url 'dashboard:voucher-list' %}{% else %}{% url 'dashboard:voucher-set-detail' pk=voucher.voucher_set.pk %}{% endif %}">
+            {% trans "cancel" %}
+        </a>
+    </div>
 {% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/dashboard/vouchers/voucher_list.html b/tests/django_oscar/oscar/dashboard/vouchers/voucher_list.html
index 81a4c9a..becba6c 100644
--- a/tests/django_oscar/oscar/dashboard/vouchers/voucher_list.html
+++ b/tests/django_oscar/oscar/dashboard/vouchers/voucher_list.html
@@ -52,168 +52,167 @@
                             {{ field }}
                         {% else %}
                             <div class="form-group mr-2{% if field.errors %}error{% endif %}">
-                            {{ field.label_tag }}
-                            {% render_field field class+='form-control' %}
-                            {% for error in field.errors %}
-                                <ul class="error-block">
-                                    <li>
-                                        {{ error }}
-                                    </li>
-                                </ul>
-                            {% endfor %}
-                            {# No help text as it wraps #}
-                        </div>
+                                {{ field.label_tag }}
+                                {% render_field field class+='form-control' %}
+                                {% for error in field.errors %}
+                                    <ul class="error-block">
+                                        <li>
+                                            {{ error }}
+                                        </li>
+                                    </ul>
+                                {% endfor %}
+                                {# No help text as it wraps #}
+                            </div>
+                        {% endif %}
+                    {% else %}
+                        <input type="hidden" name="{{ field.name }}" value="{{ field.value|default_if_none:'' }}">
                     {% endif %}
-                {% else %}
-                    <input type="hidden" name="{{ field.name }}" value="{{ field.value|default_if_none:'' }}">
-                {% endif %}
-            {% endfor %}
-            <button type="submit" class="btn btn-primary mr-2" data-loading-text="{% trans 'Searching...' %}">
-                {% trans "Search" %}
-            </button>
-            <a data-toggle="modal" data-target="#SearchModal" href="#" class="mr-2">
-                {% trans "Advanced Search" %}
-            </a>
-            <a href="{% url 'dashboard:voucher-list' %}" class="btn btn-secondary">
-                {% trans "Reset" %}
-            </a>
-        </form>
-        {# Search modal, if there are form errors the form is automatically openend #}
-        {% include "oscar/dashboard/partials/advanced_search_modal.html" with form=advanced_form style='horizontal' %}
-        {% if search_filters %}
-            <div class="search-filter-list">
-                <label>
-                    Filters:
-                </label>
-                {% for filter in search_filters %}
-                    <span class="badge badge-success">{{ filter }}</span>
                 {% endfor %}
-            </div>
-        {% endif %}
-    </div>
-{% endblock page_head %}
-{% block voucher_table %}
-    <table class="table table-striped table-bordered table-hover">
-        <caption>
-        <i class="fas fa-money-bill"></i>
-        {% if search_filters %}
-            {% trans "Voucher Search Results" %}
-        {% else %}
-            {% trans "All Vouchers" %}
-        {% endif %}
-        </caption>
-        {% if vouchers %}
-            {% block table_head %}
-                <tr>
-                    <th>{% trans "Name" %}</th>
-                    <th>{% trans "Code" %}</th>
-                    <th>{% trans "Status" %}</th>
-                    <th>{% trans "Num offers" %}</th>
-                    <th>{% anchor 'num_basket_additions' _("Num baskets") %}</th>
-                    <th>{% anchor 'num_orders' _("Num orders") %}</th>
-                    <th>{% anchor 'date_created' _("Date created") %}</th>
-                    {% if form.is_bound and form.cleaned_data.in_set is not False %}
-                        <th>{% trans "Set" %}</th>
-                    {% endif %}
-                    <th></th>
-                </tr>
-            {% endblock table_head %}
-            {% for voucher in vouchers %}
-                {% block table_row %}
+                <button type="submit" class="btn btn-primary mr-2" data-loading-text="{% trans 'Searching...' %}">
+                    {% trans "Search" %}
+                </button>
+                <a data-toggle="modal" data-target="#SearchModal" href="#" class="mr-2">
+                    {% trans "Advanced Search" %}
+                </a>
+                <a href="{% url 'dashboard:voucher-list' %}" class="btn btn-secondary">
+                    {% trans "Reset" %}
+                </a>
+            </form>
+            {# Search modal, if there are form errors the form is automatically openend #}
+            {% include "oscar/dashboard/partials/advanced_search_modal.html" with form=advanced_form style='horizontal' %}
+            {% if search_filters %}
+                <div class="search-filter-list">
+                    <label>Filters:</label>
+                    {% for filter in search_filters %}
+                        <span class="badge badge-success">{{ filter }}</span>
+                    {% endfor %}
+                </div>
+            {% endif %}
+        </div>
+    {% endblock page_head %}
+    {% block voucher_table %}
+        <table class="table table-striped table-bordered table-hover">
+            <caption>
+            <i class="fas fa-money-bill"></i>
+            {% if search_filters %}
+                {% trans "Voucher Search Results" %}
+            {% else %}
+                {% trans "All Vouchers" %}
+            {% endif %}
+            </caption>
+            {% if vouchers %}
+                {% block table_head %}
                     <tr>
-                        <td>
-                            <a href="{% url 'dashboard:voucher-stats' voucher.id %}">
-                                {{ voucher.name }}
-                            </a>
-                        </td>
-                        <td>
-                            <span class="badge badge-secondary">{{ voucher.code }}</span>
-                        </td>
-                        <td>
-                            {% if voucher.is_active %}
-                                <span class="badge badge-success">{% trans "Active" %}</span>
-                            {% else %}
-                                <span class="badge badge-secondary">{% trans "Inactive" %}</span>
-                            {% endif %}
-                        </td>
-                        <td>
-                            {{ voucher.offers.count }}
-                        </td>
-                        <td>
-                            {{ voucher.num_basket_additions }}
-                        </td>
-                        <td>
-                            {{ voucher.num_orders }}
-                        </td>
-                        <td>
-                            {{ voucher.date_created }}
-                        </td>
+                        <th>{% trans "Name" %}</th>
+                        <th>{% trans "Code" %}</th>
+                        <th>{% trans "Status" %}</th>
+                        <th>{% trans "Num offers" %}</th>
+                        <th>{% anchor 'num_basket_additions' _("Num baskets") %}</th>
+                        <th>{% anchor 'num_orders' _("Num orders") %}</th>
+                        <th>{% anchor 'date_created' _("Date created") %}</th>
                         {% if form.is_bound and form.cleaned_data.in_set is not False %}
+                            <th>{% trans "Set" %}</th>
+                        {% endif %}
+                        <th></th>
+                    </tr>
+                {% endblock table_head %}
+                {% for voucher in vouchers %}
+                    {% block table_row %}
+                        <tr>
                             <td>
-                                {% if voucher.voucher_set.pk %}
-                                    <a href="{% url 'dashboard:voucher-set-detail' pk=voucher.voucher_set.pk %}">
-                                        {{ voucher.voucher_set.name }}
-                                    </a>
+                                <a href="{% url 'dashboard:voucher-stats' voucher.id %}">
+                                    {{ voucher.name }}
+                                </a>
+                            </td>
+                            <td>
+                                <span class="badge badge-secondary">{{ voucher.code }}</span>
+                            </td>
+                            <td>
+                                {% if voucher.is_active %}
+                                    <span class="badge badge-success">{% trans "Active" %}</span>
                                 {% else %}
-                                    -
+                                    <span class="badge badge-secondary">{% trans "Inactive" %}</span>
                                 {% endif %}
                             </td>
-                        {% endif %}
-                        <td>
-                            {% block row_actions %}
-                                <div class="btn-toolbar">
-                                    <div class="dropdown">
-                                        <button class="btn btn-secondary dropdown-toggle"
-                                                type="button"
-                                                id="dropdownMenuButton"
-                                                data-toggle="dropdown"
-                                                aria-haspopup="true"
-                                                aria-expanded="false">
-                                            {% trans "Actions" %}
-                                        </button>
-                                        <div class="dropdown-menu dropdown-menu-right"
-                                             aria-labelledby="dropdownMenuButton">
-                                            <a class="dropdown-item"
-                                               href="{% url 'dashboard:voucher-stats' pk=voucher.id %}">
-                                                {% trans "Stats" %}
-                                            </a>
-                                            {% if not voucher.voucher_set %}
+                            <td>
+                                {{ voucher.offers.count }}
+                            </td>
+                            <td>
+                                {{ voucher.num_basket_additions }}
+                            </td>
+                            <td>
+                                {{ voucher.num_orders }}
+                            </td>
+                            <td>
+                                {{ voucher.date_created }}
+                            </td>
+                            {% if form.is_bound and form.cleaned_data.in_set is not False %}
+                                <td>
+                                    {% if voucher.voucher_set.pk %}
+                                        <a href="{% url 'dashboard:voucher-set-detail' pk=voucher.voucher_set.pk %}">
+                                            {{ voucher.voucher_set.name }}
+                                        </a>
+                                    {% else %}
+                                        -
+                                    {% endif %}
+                                </td>
+                            {% endif %}
+                            <td>
+                                {% block row_actions %}
+                                    <div class="btn-toolbar">
+                                        <div class="dropdown">
+                                            <button class="btn btn-secondary dropdown-toggle"
+                                                    type="button"
+                                                    id="dropdownMenuButton"
+                                                    data-toggle="dropdown"
+                                                    aria-haspopup="true"
+                                                    aria-expanded="false">
+                                                {% trans "Actions" %}
+                                            </button>
+                                            <div class="dropdown-menu dropdown-menu-right"
+                                                 aria-labelledby="dropdownMenuButton">
                                                 <a class="dropdown-item"
-                                                   href="{% url 'dashboard:voucher-update' pk=voucher.id %}">
-                                                    {% trans "Edit" %}
+                                                   href="{% url 'dashboard:voucher-stats' pk=voucher.id %}">
+                                                    {% trans "Stats" %}
                                                 </a>
-                                            {% else %}
-                                                <a class="dropdown-item"
-                                                   href="{% url 'dashboard:voucher-set-update' pk=voucher.voucher_set.pk %}">
-                                                    {% trans "Edit set" %}
-                                                </a>
-                                            {% endif %}
-                                            <a class="dropdown-item"
-                                               href="{% url 'dashboard:voucher-delete' pk=voucher.id %}">
                                                 {% if not voucher.voucher_set %}
-                                                    {% trans "Delete" %}
+                                                    <a class="dropdown-item"
+                                                       href="{% url 'dashboard:voucher-update' pk=voucher.id %}">
+                                                        {% trans "Edit" %}
+                                                    </a>
                                                 {% else %}
-                                                    {% trans "Delete from set" %}
+                                                    <a class="dropdown-item"
+                                                       href="{% url 'dashboard:voucher-set-update' pk=voucher.voucher_set.pk %}">
+                                                        {% trans "Edit set" %}
+                                                    </a>
                                                 {% endif %}
-                                            </a>
+                                                <a class="dropdown-item"
+                                                   href="{% url 'dashboard:voucher-delete' pk=voucher.id %}">
+                                                    {% if not voucher.voucher_set %}
+                                                        {% trans "Delete" %}
+                                                    {% else %}
+                                                        {% trans "Delete from set" %}
+                                                    {% endif %}
+                                                </a>
+                                            </div>
                                         </div>
                                     </div>
-                                </div>
-                            {% endblock row_actions %}
-                        </td>
-                    </tr>
-                {% endblock table_row %}
-            {% endfor %}
-        {% else %}
-            <tr>
-                <td>
-                    {% trans "No vouchers found." %}
-                </td>
-            </tr>
-        {% endif %}
-    </table>
-{% endblock voucher_table %}
-{% include "oscar/dashboard/partials/pagination.html" %}{% endblock dashboard_content %}
+                                {% endblock row_actions %}
+                            </td>
+                        </tr>
+                    {% endblock table_row %}
+                {% endfor %}
+            {% else %}
+                <tr>
+                    <td>
+                        {% trans "No vouchers found." %}
+                    </td>
+                </tr>
+            {% endif %}
+        </table>
+    {% endblock voucher_table %}
+    {% include "oscar/dashboard/partials/pagination.html" %}
+{% endblock dashboard_content %}
 {% block onbodyload %}
     {{ block.super }}
     {% if advanced_form.errors %}$('#SearchModal').modal('show');{% endif %}
diff --git a/tests/django_oscar/oscar/dashboard/vouchers/voucher_set_detail.html b/tests/django_oscar/oscar/dashboard/vouchers/voucher_set_detail.html
index fd6a571..c61e90e 100644
--- a/tests/django_oscar/oscar/dashboard/vouchers/voucher_set_detail.html
+++ b/tests/django_oscar/oscar/dashboard/vouchers/voucher_set_detail.html
@@ -53,9 +53,7 @@
         </form>
         {% if search_filters %}
             <div class="search-filter-list">
-                <label>
-                    Filters:
-                </label>
+                <label>Filters:</label>
                 {% for filter in search_filters %}
                     <span class="badge badge-success">{{ filter }}</span>
                 {% endfor %}
@@ -113,7 +111,9 @@
             {% endfor %}
         {% else %}
             <tr>
-                <td>{% trans "No vouchers found." %}</td>
+                <td>
+                    {% trans "No vouchers found." %}
+                </td>
             </tr>
         {% endif %}
     </table>
@@ -186,9 +186,7 @@
                         <td>
                             {% for restriction in offer.availability_restrictions %}
                                 {% if not restriction.is_satisfied %}
-                                    <label class="badge badge-danger">
-                                        {{ restriction.description }}
-                                    </label>
+                                    <label class="badge badge-danger">{{ restriction.description }}</label>
                                 {% else %}
                                     {{ restriction.description }}
                                     <br/>
diff --git a/tests/django_oscar/oscar/dashboard/vouchers/voucher_set_list.html b/tests/django_oscar/oscar/dashboard/vouchers/voucher_set_list.html
index 2aba0e3..53ceaa9 100644
--- a/tests/django_oscar/oscar/dashboard/vouchers/voucher_set_list.html
+++ b/tests/django_oscar/oscar/dashboard/vouchers/voucher_set_list.html
@@ -110,4 +110,5 @@
             </tr>
         {% endif %}
     </table>
-    {% include "oscar/partials/pagination.html" %}{% endblock dashboard_content %}
+    {% include "oscar/partials/pagination.html" %}
+{% endblock dashboard_content %}
diff --git a/tests/django_oscar/oscar/layout.html b/tests/django_oscar/oscar/layout.html
index bb821b5..2b50f45 100644
--- a/tests/django_oscar/oscar/layout.html
+++ b/tests/django_oscar/oscar/layout.html
@@ -13,48 +13,51 @@
                 {% include "oscar/partials/brand.html" %}
                 {# Mini-basket wrapped in a block so some templates can now display it #}
                 {% block mini_basket %}
-                    {% include "oscar/partials/mini_basket.html" %}{% endblock %}
-                </div>
+                    {% include "oscar/partials/mini_basket.html" %}
+                {% endblock %}
             </div>
-            {% block navigation %}
-                {% include "oscar/partials/nav_primary.html" %}{% endblock %}
-            </header>
-            {# Main content of page - other layout templates may override this block #}
-            {% block content_wrapper %}
-                <div class="container page">
-                    <div class="page_inner">
-                        {% block breadcrumbs %}{% endblock %}
-                        {% block header %}
-                            <div class="page-header">
-                                <h1>{% block headertext %}{% endblock %}</h1>
-                            </div>
-                        {% endblock %}
-                        {% include "oscar/partials/alert_messages.html" %}
-                        {% block subnavigation %}{% endblock %}
-                        <div class="content">
-                            {% block subheader %}{% endblock subheader %}
-                                {# Div exists for AJAX updates to entire content section #}
-                                <div id="content_inner">
-                                    {% block content %}{% endblock %}
-                                </div>
-                            </div>
-                        </div>
+        </div>
+        {% block navigation %}
+            {% include "oscar/partials/nav_primary.html" %}
+        {% endblock %}
+    </header>
+    {# Main content of page - other layout templates may override this block #}
+    {% block content_wrapper %}
+        <div class="container page">
+            <div class="page_inner">
+                {% block breadcrumbs %}{% endblock %}
+                {% block header %}
+                    <div class="page-header">
+                        <h1>{% block headertext %}{% endblock %}</h1>
                     </div>
                 {% endblock %}
-                {% include "oscar/partials/footer.html" %}{% endblock %}
-                {# Local scripts #}
-                {% block scripts %}
-                    {{ block.super }}
-                    <!-- Twitter Bootstrap -->
-                    <script src="{% static "oscar/js/bootstrap4/bootstrap.bundle.min.js" %}"></script>
-                    <!-- Oscar -->
-                    <script src="{% static "oscar/js/oscar/ui.js" %}"></script>
-                {% endblock %}
-                {% block extrascripts %}
-                    {% include "oscar/partials/extrascripts.html" %}
-                    {{ block.super }}
-                {% endblock %}
-                {% block onbodyload %}
-                    {{ block.super }}
-                    oscar.init();
-                {% endblock %}
+                {% include "oscar/partials/alert_messages.html" %}
+                {% block subnavigation %}{% endblock %}
+                <div class="content">
+                    {% block subheader %}{% endblock subheader %}
+                    {# Div exists for AJAX updates to entire content section #}
+                    <div id="content_inner">
+                        {% block content %}{% endblock %}
+                    </div>
+                </div>
+            </div>
+        </div>
+    {% endblock %}
+    {% include "oscar/partials/footer.html" %}
+{% endblock %}
+{# Local scripts #}
+{% block scripts %}
+    {{ block.super }}
+    <!-- Twitter Bootstrap -->
+    <script src="{% static "oscar/js/bootstrap4/bootstrap.bundle.min.js" %}"></script>
+    <!-- Oscar -->
+    <script src="{% static "oscar/js/oscar/ui.js" %}"></script>
+{% endblock %}
+{% block extrascripts %}
+    {% include "oscar/partials/extrascripts.html" %}
+    {{ block.super }}
+{% endblock %}
+{% block onbodyload %}
+    {{ block.super }}
+    oscar.init();
+{% endblock %}
diff --git a/tests/django_oscar/oscar/layout_2_col.html b/tests/django_oscar/oscar/layout_2_col.html
index c96a6bc..5548eeb 100644
--- a/tests/django_oscar/oscar/layout_2_col.html
+++ b/tests/django_oscar/oscar/layout_2_col.html
@@ -5,27 +5,27 @@ main content area to split it into a sidebar and a content block
 {% endcomment %}
 {% block content_wrapper %}
 <div class="{% block content_wrapper_classes %}container page{% endblock %}">
-<div class="page_inner">
-    {% block breadcrumbs %}{% endblock %}
-    <div class="row">
-        <aside class="sidebar col-sm-4 col-md-3">
-            {% block column_left %}{% endblock %}
-            {% block column_left_extra %}{% endblock %}
-        </aside>
-        <div class="col-sm-8 col-md-9">
-            {% block header %}
-                <div class="page-header">
-                    <h1>{% block headertext %}{% endblock %}</h1>
-                </div>
-            {% endblock %}
-            {% include "oscar/partials/alert_messages.html" %}
-            {% block pre_content %}{% endblock %}
-            {% block content %}{% endblock %}
+    <div class="page_inner">
+        {% block breadcrumbs %}{% endblock %}
+        <div class="row">
+            <aside class="sidebar col-sm-4 col-md-3">
+                {% block column_left %}{% endblock %}
+                {% block column_left_extra %}{% endblock %}
+            </aside>
+            <div class="col-sm-8 col-md-9">
+                {% block header %}
+                    <div class="page-header">
+                        <h1>{% block headertext %}{% endblock %}</h1>
+                    </div>
+                {% endblock %}
+                {% include "oscar/partials/alert_messages.html" %}
+                {% block pre_content %}{% endblock %}
+                {% block content %}{% endblock %}
+            </div>
         </div>
+        <!-- /row -->
     </div>
-    <!-- /row -->
-</div>
-<!-- /page_inner -->
+    <!-- /page_inner -->
 </div>
 <!-- /container -->
 {% endblock %}
diff --git a/tests/django_oscar/oscar/order/partials/basket_totals.html b/tests/django_oscar/oscar/order/partials/basket_totals.html
index c0fd6ea..887f32f 100644
--- a/tests/django_oscar/oscar/order/partials/basket_totals.html
+++ b/tests/django_oscar/oscar/order/partials/basket_totals.html
@@ -8,15 +8,69 @@
             </th>
         </tr>
         {% with discounts=order.basket_discounts %}
-        {% block discount_totals %}
-            {% if discounts %}
+            {% block discount_totals %}
+                {% if discounts %}
+                    <tr>
+                        <td>{% trans "Basket total (before discounts)" %}</td>
+                        <td class="text-right">
+                            {{ order.basket_total_before_discounts_incl_tax|currency:order.currency }}
+                        </td>
+                    </tr>
+                    {% for discount in discounts %}
+                        <tr>
+                            <td>
+                                <span class="badge badge-success">{% trans "Discount" %}</span>
+                                {{ discount.offer }}
+                            </td>
+                            <td class="text-right">- {{ discount.amount|currency:order.currency }}</td>
+                        </tr>
+                    {% endfor %}
+                {% endif %}
+            {% endblock discount_totals %}
+            {% block basket_total %}
+                {% if discounts %}
+                    <tr>
+                        <th class="total">{% trans "Basket total (after discounts)" %}</th>
+                        <th class="total text-right">
+                            {{ order.basket_total_incl_tax|currency:order.currency }}
+                        </th>
+                    </tr>
+                {% else %}
+                    <tr class="basket-items">
+                        <th class="total">{% trans "Basket total" %}</th>
+                        <th class="total text-right">
+                            {% if show_tax_separately %}
+                                {{ order.basket_total_excl_tax|currency:order.currency }}
+                            {% else %}
+                                {{ order.basket_total_incl_tax|currency:order.currency }}
+                            {% endif %}
+                        </th>
+                    </tr>
+                {% endif %}
+            {% endblock basket_total %}
+        {% endwith %}
+        {% block shipping_total %}
+            <tr>
+                <th>&nbsp;</th>
+                <td></td>
+            </tr>
+            <tr>
+                <th colspan="2">
+                    <h3>{% trans "Shipping" %}</h3>
+                </th>
+            </tr>
+            <tr>
+                <td>{% trans "Shipping method" %}</td>
+                <td class="text-right">{{ order.shipping_method }}</td>
+            </tr>
+            {% if order.has_shipping_discounts %}
                 <tr>
-                    <td>{% trans "Basket total (before discounts)" %}</td>
+                    <td>{% trans "Shipping charge (before discounts)" %}</td>
                     <td class="text-right">
-                        {{ order.basket_total_before_discounts_incl_tax|currency:order.currency }}
+                        {{ order.shipping_before_discounts_incl_tax|currency:order.currency }}
                     </td>
                 </tr>
-                {% for discount in discounts %}
+                {% for discount in order.shipping_discounts %}
                     <tr>
                         <td>
                             <span class="badge badge-success">{% trans "Discount" %}</span>
@@ -25,166 +79,112 @@
                         <td class="text-right">- {{ discount.amount|currency:order.currency }}</td>
                     </tr>
                 {% endfor %}
-            {% endif %}
-        {% endblock discount_totals %}
-        {% block basket_total %}
-            {% if discounts %}
                 <tr>
-                    <th class="total">{% trans "Basket total (after discounts)" %}</th>
+                    <th class="total">{% trans "Shipping charge (after discounts)" %}</th>
                     <th class="total text-right">
-                        {{ order.basket_total_incl_tax|currency:order.currency }}
+                        {{ order.shipping_incl_tax|currency:order.currency }}
                     </th>
                 </tr>
             {% else %}
-                <tr class="basket-items">
-                    <th class="total">{% trans "Basket total" %}</th>
+                <tr>
+                    <th class="total">{% trans "Shipping charge" %}</th>
                     <th class="total text-right">
                         {% if show_tax_separately %}
-                            {{ order.basket_total_excl_tax|currency:order.currency }}
+                            {{ order.shipping_excl_tax|currency:order.currency }}
                         {% else %}
-                            {{ order.basket_total_incl_tax|currency:order.currency }}
+                            {{ order.shipping_incl_tax|currency:order.currency }}
                         {% endif %}
                     </th>
                 </tr>
             {% endif %}
-        {% endblock basket_total %}
-    {% endwith %}
-    {% block shipping_total %}
-        <tr>
-            <th>&nbsp;</th>
-            <td></td>
-        </tr>
-        <tr>
-            <th colspan="2">
-                <h3>{% trans "Shipping" %}</h3>
-            </th>
-        </tr>
-        <tr>
-            <td>{% trans "Shipping method" %}</td>
-            <td class="text-right">{{ order.shipping_method }}</td>
-        </tr>
-        {% if order.has_shipping_discounts %}
-            <tr>
-                <td>{% trans "Shipping charge (before discounts)" %}</td>
-                <td class="text-right">
-                    {{ order.shipping_before_discounts_incl_tax|currency:order.currency }}
-                </td>
-            </tr>
-            {% for discount in order.shipping_discounts %}
-                <tr>
-                    <td>
-                        <span class="badge badge-success">{% trans "Discount" %}</span>
-                        {{ discount.offer }}
-                    </td>
-                    <td class="text-right">- {{ discount.amount|currency:order.currency }}</td>
-                </tr>
-            {% endfor %}
-            <tr>
-                <th class="total">{% trans "Shipping charge (after discounts)" %}</th>
-                <th class="total text-right">
-                    {{ order.shipping_incl_tax|currency:order.currency }}
-                </th>
-            </tr>
-        {% else %}
-            <tr>
-                <th class="total">{% trans "Shipping charge" %}</th>
-                <th class="total text-right">
-                    {% if show_tax_separately %}
-                        {{ order.shipping_excl_tax|currency:order.currency }}
-                    {% else %}
-                        {{ order.shipping_incl_tax|currency:order.currency }}
-                    {% endif %}
-                </th>
-            </tr>
-        {% endif %}
-    {% endblock shipping_total %}
-    {% block surcharges %}
-        {% with surcharges=order.surcharges.all %}
-        {% if surcharges %}
-            <tr>
-                <th>&nbsp;</th>
-                <td></td>
-            </tr>
+        {% endblock shipping_total %}
+        {% block surcharges %}
+            {% with surcharges=order.surcharges.all %}
+                {% if surcharges %}
+                    <tr>
+                        <th>&nbsp;</th>
+                        <td></td>
+                    </tr>
+                    <tr>
+                        <th colspan="2">
+                            <h3>{% trans "Surcharges" %}</h3>
+                        </th>
+                    </tr>
+                    {% for charge in surcharges %}
+                        <tr>
+                            <th class="total">{{ charge.name }}</th>
+                            <th class="total align-right">
+                                {% if show_tax_separately %}
+                                    {{ charge.excl_tax|currency:order.currency }}
+                                {% else %}
+                                    {{ charge.incl_tax|currency:order.currency }}
+                                {% endif %}
+                            </th>
+                        </tr>
+                    {% endfor %}
+                {% endif %}
+            {% endwith %}
+        {% endblock %}
+        {% if show_tax_separately %}
             <tr>
                 <th colspan="2">
-                    <h3>{% trans "Surcharges" %}</h3>
+                    &nbsp;
                 </th>
             </tr>
-            {% for charge in surcharges %}
-                <tr>
-                    <th class="total">{{ charge.name }}</th>
-                    <th class="total align-right">
-                        {% if show_tax_separately %}
-                            {{ charge.excl_tax|currency:order.currency }}
-                        {% else %}
-                            {{ charge.incl_tax|currency:order.currency }}
-                        {% endif %}
-                    </th>
-                </tr>
-            {% endfor %}
-        {% endif %}
-    {% endwith %}
-{% endblock %}
-{% if show_tax_separately %}
-    <tr>
-        <th colspan="2">
-            &nbsp;
-        </th>
-    </tr>
-    <tr>
-        <th class="total">
-            {% trans "Order tax" %}
-        </th>
-        <th class="total text-right">
-            {{ order.total_tax|currency:order.currency }}
-        </th>
-    </tr>
-{% endif %}
-{% block post_order_action_totals %}
-    {% with actions=order.post_order_actions %}
-    {% if actions %}
-        <tr>
-            <th colspan="2">
-                &nbsp;
-            </th>
-        </tr>
-        <tr>
-            <th colspan="2">
-                <h3>
-                    {% trans "Post order actions" %}
-                </h3>
-            </th>
-        </tr>
-        {% for action in order.post_order_actions %}
             <tr>
-                <td class="total" colspan="2">
-                    <p>
-                        {{ action.message }}
-                    </p>
+                <th class="total">
+                    {% trans "Order tax" %}
+                </th>
+                <th class="total text-right">
+                    {{ order.total_tax|currency:order.currency }}
+                </th>
+            </tr>
+        {% endif %}
+        {% block post_order_action_totals %}
+            {% with actions=order.post_order_actions %}
+                {% if actions %}
+                    <tr>
+                        <th colspan="2">
+                            &nbsp;
+                        </th>
+                    </tr>
+                    <tr>
+                        <th colspan="2">
+                            <h3>
+                                {% trans "Post order actions" %}
+                            </h3>
+                        </th>
+                    </tr>
+                    {% for action in order.post_order_actions %}
+                        <tr>
+                            <td class="total" colspan="2">
+                                <p>
+                                    {{ action.message }}
+                                </p>
+                            </td>
+                        </tr>
+                    {% endfor %}
+                {% endif %}
+            {% endwith %}
+        {% endblock post_order_action_totals %}
+        {% block order_total %}
+            <tr>
+                <th colspan="2">
+                    &nbsp;
+                </th>
+            </tr>
+            <tr>
+                <td class="total">
+                    <h3>
+                        {% trans "Order total" %}
+                    </h3>
+                </td>
+                <td class="total text-right">
+                    <h3 class="price_color">
+                        {{ order.total_incl_tax|currency:order.currency }}
+                    </h3>
                 </td>
             </tr>
-        {% endfor %}
-    {% endif %}
-{% endwith %}
-{% endblock post_order_action_totals %}
-{% block order_total %}
-<tr>
-    <th colspan="2">
-        &nbsp;
-    </th>
-</tr>
-<tr>
-    <td class="total">
-        <h3>
-            {% trans "Order total" %}
-        </h3>
-    </td>
-    <td class="total text-right">
-        <h3 class="price_color">
-            {{ order.total_incl_tax|currency:order.currency }}
-        </h3>
-    </td>
-</tr>
-{% endblock order_total %}
-</table>
+        {% endblock order_total %}
+    </table>
 </div>
diff --git a/tests/django_oscar/oscar/partials/alert_messages.html b/tests/django_oscar/oscar/partials/alert_messages.html
index b62dc70..6fde948 100644
--- a/tests/django_oscar/oscar/partials/alert_messages.html
+++ b/tests/django_oscar/oscar/partials/alert_messages.html
@@ -10,30 +10,30 @@ Use message tags to control these alerts. Available tags include:
 {% if messages %}
     {% for message in messages %}
         <div class="alert alert-dismissible {% for tag in message.tags|split %}alert-{% if tag == 'error' %}danger{% else %}{{ tag }}{% endif %} {% endfor %} fade show">
-        <a class="close" data-dismiss="alert" href="#">
-            &times;
-        </a>
-        <div class="alertinner {% if 'noicon' not in message.tags %}wicon{% endif %}">
-        {% if 'noicon' not in message.tags %}
-            {# Include an icon by default #}
-            {% if 'success' in message.tags %}
-                <i class="fas fa-check-circle"></i>
-            {% elif 'info' in message.tags %}
-                <i class="fas fa-info-circle"></i>
-            {% elif 'warning' in message.tags %}
-                <i class="fas fa-exclamation-triangle"></i>
-            {% elif 'danger' in message.tags or 'error' in message.tags %}
-                <i class="fas fa-exclamation-circle"></i>
-            {% endif %}
-        {% endif %}
-        {# Allow HTML to be embedded in messages #}
-        {% if 'safe' in message.tags %}
-            {{ message|safe }}
-        {% else %}
-            {{ message }}
-        {% endif %}
-    </div>
-</div>
-{% endfor %}
+            <a class="close" data-dismiss="alert" href="#">
+                &times;
+            </a>
+            <div class="alertinner {% if 'noicon' not in message.tags %}wicon{% endif %}">
+                {% if 'noicon' not in message.tags %}
+                    {# Include an icon by default #}
+                    {% if 'success' in message.tags %}
+                        <i class="fas fa-check-circle"></i>
+                    {% elif 'info' in message.tags %}
+                        <i class="fas fa-info-circle"></i>
+                    {% elif 'warning' in message.tags %}
+                        <i class="fas fa-exclamation-triangle"></i>
+                    {% elif 'danger' in message.tags or 'error' in message.tags %}
+                        <i class="fas fa-exclamation-circle"></i>
+                    {% endif %}
+                {% endif %}
+                {# Allow HTML to be embedded in messages #}
+                {% if 'safe' in message.tags %}
+                    {{ message|safe }}
+                {% else %}
+                    {{ message }}
+                {% endif %}
+            </div>
+        </div>
+    {% endfor %}
 {% endif %}
 </div>
diff --git a/tests/django_oscar/oscar/partials/form.html b/tests/django_oscar/oscar/partials/form.html
index 366c724..2ce1ea5 100644
--- a/tests/django_oscar/oscar/partials/form.html
+++ b/tests/django_oscar/oscar/partials/form.html
@@ -10,15 +10,15 @@
     {% endif %}
     {% include 'oscar/partials/form_fields.html' %}
     <div class="form-group{% if style == 'horizontal' %}row{% endif %}">
-    <div class="{% if style == 'horizontal' %}offset-sm-4 col-sm-8{% endif %}">
-    <button class="btn btn-lg btn-primary" type="submit" data-loading-text="{% trans 'Saving...' %}">
-        {% trans "Save" %}
-    </button>
-    {% trans "or" %}
-    <a href="#" onclick="window.history.go(-1);return false" >
-        {% trans "cancel" %}
-    </a>
-    .
-</div>
-</div>
+        <div class="{% if style == 'horizontal' %}offset-sm-4 col-sm-8{% endif %}">
+            <button class="btn btn-lg btn-primary" type="submit" data-loading-text="{% trans 'Saving...' %}">
+                {% trans "Save" %}
+            </button>
+            {% trans "or" %}
+            <a href="#" onclick="window.history.go(-1);return false" >
+                {% trans "cancel" %}
+            </a>
+            .
+        </div>
+    </div>
 </form>
diff --git a/tests/django_oscar/oscar/partials/form_field.html b/tests/django_oscar/oscar/partials/form_field.html
index 6b3a253..114242e 100644
--- a/tests/django_oscar/oscar/partials/form_field.html
+++ b/tests/django_oscar/oscar/partials/form_field.html
@@ -10,53 +10,53 @@
 {% annotate_form_field field %}
 {% block control_group %}
     <div class="form-group{% if style == "horizontal" %}row{% endif %}
-    ">
-    {% block label %}
-        {% if not nolabel and field.widget_type != 'checkbox' %}
-            <label for="{{ field.auto_id }}" class="{% if style|default:"stacked" != 'stacked' %}col-sm-4
-            {% endif %}
-            col-form-label
-            {% if field.field.required %}required{% endif %}
-            ">
-            {{ field.label|safe }}
-        </label>
-    {% endif %}
-{% endblock %}
-{% block controls %}
-    <div class="{% if style|default:"stacked" != 'stacked' %}col-sm-7
-    {% endif %}
-    {% if field.widget_type == 'checkbox' %}
-        form-check{% endif %}
         ">
-        {% block widget %}
-            {% if field.widget_type == 'checkbox' %}
-                <label for="{{ field.auto_id }}"
-                       class="col-form-label {% if field.field.required %}required{% endif %}">
-                {% render_field field %}
+        {% block label %}
+            {% if not nolabel and field.widget_type != 'checkbox' %}
+                <label for="{{ field.auto_id }}" class="{% if style|default:"stacked" != 'stacked' %}col-sm-4
+                {% endif %}
+                col-form-label
+                {% if field.field.required %}required{% endif %}
+                ">
                 {{ field.label|safe }}
             </label>
-        {% else %}
-            {% render_field field class+="form-control" %}
         {% endif %}
     {% endblock %}
-    {% block errors %}
-        {% for error in field.errors %}
-            <span class="error-block">
-                <i class="fas fa-exclamation"></i>
-                {{ error }}
-            </span>
-        {% endfor %}
-    {% endblock %}
-    {% block help_text %}
-        {% if field.help_text %}
-            <small class="form-text text-muted">
-            {# We allow HTML within form help fields #}
-            {{ field.help_text|safe }}
-            </small>
+    {% block controls %}
+        <div class="{% if style|default:"stacked" != 'stacked' %}col-sm-7
         {% endif %}
+        {% if field.widget_type == 'checkbox' %}
+            form-check{% endif %}
+            ">
+            {% block widget %}
+                {% if field.widget_type == 'checkbox' %}
+                    <label for="{{ field.auto_id }}"
+                           class="col-form-label {% if field.field.required %}required{% endif %}">
+                        {% render_field field %}
+                        {{ field.label|safe }}
+                    </label>
+                {% else %}
+                    {% render_field field class+="form-control" %}
+                {% endif %}
+            {% endblock %}
+            {% block errors %}
+                {% for error in field.errors %}
+                    <span class="error-block">
+                        <i class="fas fa-exclamation"></i>
+                        {{ error }}
+                    </span>
+                {% endfor %}
+            {% endblock %}
+            {% block help_text %}
+                {% if field.help_text %}
+                    <small class="form-text text-muted">
+                    {# We allow HTML within form help fields #}
+                    {{ field.help_text|safe }}
+                    </small>
+                {% endif %}
+            {% endblock %}
+        </div>
     {% endblock %}
 </div>
 {% endblock %}
-</div>
-{% endblock %}
 {% endif %}
diff --git a/tests/django_oscar/oscar/partials/form_fields.html b/tests/django_oscar/oscar/partials/form_fields.html
index 8e43ea0..5f3efbf 100644
--- a/tests/django_oscar/oscar/partials/form_fields.html
+++ b/tests/django_oscar/oscar/partials/form_fields.html
@@ -14,4 +14,5 @@
     {% endfor %}
 {% endif %}
 {% for field in form %}
-    {% include 'oscar/partials/form_field.html' with field=field style=style %}{% endfor %}
+    {% include 'oscar/partials/form_field.html' with field=field style=style %}
+{% endfor %}
diff --git a/tests/django_oscar/oscar/partials/form_fields_inline.html b/tests/django_oscar/oscar/partials/form_fields_inline.html
index 796f02a..679f495 100644
--- a/tests/django_oscar/oscar/partials/form_fields_inline.html
+++ b/tests/django_oscar/oscar/partials/form_fields_inline.html
@@ -5,16 +5,16 @@
         {{ field }}
     {% else %}
         <span class="form-group {% if field.errors %}error{% endif %}">
-        <span class="mr-sm-1">{{ field.label_tag }}</span>
-        {% render_field field class+="form-control mr-sm-2" %}
-        {% for error in field.errors %}
-            <ul class="error-block">
-                <li>
-                    {{ error }}
-                </li>
-            </ul>
-        {% endfor %}
-        {# No help text as it wraps #}
-    </span>
-{% endif %}
+            <span class="mr-sm-1">{{ field.label_tag }}</span>
+            {% render_field field class+="form-control mr-sm-2" %}
+            {% for error in field.errors %}
+                <ul class="error-block">
+                    <li>
+                        {{ error }}
+                    </li>
+                </ul>
+            {% endfor %}
+            {# No help text as it wraps #}
+        </span>
+    {% endif %}
 {% endfor %}
diff --git a/tests/django_oscar/oscar/partials/nav_primary.html b/tests/django_oscar/oscar/partials/nav_primary.html
index 16bcc97..bc8146a 100644
--- a/tests/django_oscar/oscar/partials/nav_primary.html
+++ b/tests/django_oscar/oscar/partials/nav_primary.html
@@ -2,78 +2,79 @@
 {% load category_tags %}
 {% load i18n %}
 <nav class="{% block nav_classes %}navbar navbar-expand-lg navbar-dark bg-dark{% endblock %}">
-{% block navbar_toggler %}
-    <button class="navbar-toggler"
-            type="button"
-            data-toggle="collapse"
-            data-target="#navbarSupportedContent"
-            aria-controls="navbarSupportedContent"
-            aria-expanded="false"
-            aria-label="Toggle navigation">
-        <span class="navbar-toggler-icon"></span>
-    </button>
-{% endblock %}
-{% block navbar_basket %}
-    <a class="btn btn-secondary float-right btn-cart ml-auto d-inline-block d-md-none"
-       href="{% url 'basket:summary' %}">
-        <i class="fas fa-shopping-cart"></i>
-        {% trans "Basket" %}
-        {% if not request.basket.is_empty %}
-            {% if request.basket.is_tax_known %}
-                {% blocktrans with total=request.basket.total_incl_tax|currency:request.basket.currency %}
-                    Total: {{ total }}
-                {% endblocktrans %}
-            {% else %}
-                {% blocktrans with total=request.basket.total_excl_tax|currency:request.basket.currency %}
-                    Total: {{ total }}
-                {% endblocktrans %}
+    {% block navbar_toggler %}
+        <button class="navbar-toggler"
+                type="button"
+                data-toggle="collapse"
+                data-target="#navbarSupportedContent"
+                aria-controls="navbarSupportedContent"
+                aria-expanded="false"
+                aria-label="Toggle navigation">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+    {% endblock %}
+    {% block navbar_basket %}
+        <a class="btn btn-secondary float-right btn-cart ml-auto d-inline-block d-md-none"
+           href="{% url 'basket:summary' %}">
+            <i class="fas fa-shopping-cart"></i>
+            {% trans "Basket" %}
+            {% if not request.basket.is_empty %}
+                {% if request.basket.is_tax_known %}
+                    {% blocktrans with total=request.basket.total_incl_tax|currency:request.basket.currency %}
+                        Total: {{ total }}
+                    {% endblocktrans %}
+                {% else %}
+                    {% blocktrans with total=request.basket.total_excl_tax|currency:request.basket.currency %}
+                        Total: {{ total }}
+                    {% endblocktrans %}
+                {% endif %}
             {% endif %}
-        {% endif %}
-    </a>
-{% endblock %}
-{% block navbar_collapse %}
-    <div class="collapse navbar-collapse" id="navbarSupportedContent">
-        {% block nav %}
-            <ul class="navbar-nav mr-auto">
-                {% block nav_items %}
-                    <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle"
-                           href="#"
-                           id="navbarDropdown"
-                           role="button"
-                           data-toggle="dropdown"
-                           aria-haspopup="true"
-                           aria-expanded="false">
-                            {% block browse_store_text %}
-                                {% trans "Browse store" %}
-                            {% endblock %}
-                        </a>
-                        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
-                            {% category_tree depth=1 as tree_categories %}
-                            <a class="dropdown-item" href="{% url 'catalogue:index' %}">
-                                {% trans "All products" %}
+        </a>
+    {% endblock %}
+    {% block navbar_collapse %}
+        <div class="collapse navbar-collapse" id="navbarSupportedContent">
+            {% block nav %}
+                <ul class="navbar-nav mr-auto">
+                    {% block nav_items %}
+                        <li class="nav-item dropdown">
+                            <a class="nav-link dropdown-toggle"
+                               href="#"
+                               id="navbarDropdown"
+                               role="button"
+                               data-toggle="dropdown"
+                               aria-haspopup="true"
+                               aria-expanded="false">
+                                {% block browse_store_text %}
+                                    {% trans "Browse store" %}
+                                {% endblock %}
                             </a>
-                            {% if tree_categories %}
-                                <div class="dropdown-divider"></div>
-                                {% for tree_category in tree_categories %}
-                                    <a class="dropdown-item" href="{{ tree_category.get_absolute_url }}">
-                                        {{ tree_category.name }}
-                                    </a>
-                                {% endfor %}
-                            {% endif %}
-                            <div class="dropdown-divider"></div>
-                            {% block nav_dropdown_extra_items %}
-                                <a class="dropdown-item" href="{% url 'offer:list' %}">
-                                    {% trans "Offers" %}
+                            <div class="dropdown-menu" aria-labelledby="navbarDropdown">
+                                {% category_tree depth=1 as tree_categories %}
+                                <a class="dropdown-item" href="{% url 'catalogue:index' %}">
+                                    {% trans "All products" %}
                                 </a>
-                            {% endblock %}
-                        </div>
-                    </li>
-                {% endblock %}
-            </ul>
-        {% endblock %}
-        {% block nav_extra %}
-            {% include "oscar/partials/search.html" %}{% endblock %}
+                                {% if tree_categories %}
+                                    <div class="dropdown-divider"></div>
+                                    {% for tree_category in tree_categories %}
+                                        <a class="dropdown-item" href="{{ tree_category.get_absolute_url }}">
+                                            {{ tree_category.name }}
+                                        </a>
+                                    {% endfor %}
+                                {% endif %}
+                                <div class="dropdown-divider"></div>
+                                {% block nav_dropdown_extra_items %}
+                                    <a class="dropdown-item" href="{% url 'offer:list' %}">
+                                        {% trans "Offers" %}
+                                    </a>
+                                {% endblock %}
+                            </div>
+                        </li>
+                    {% endblock %}
+                </ul>
+            {% endblock %}
+            {% block nav_extra %}
+                {% include "oscar/partials/search.html" %}
+            {% endblock %}
         </div>
     {% endblock %}
 </nav>
diff --git a/tests/django_oscar/oscar/search/results.html b/tests/django_oscar/oscar/search/results.html
index 9a0bd7e..dc5efd0 100644
--- a/tests/django_oscar/oscar/search/results.html
+++ b/tests/django_oscar/oscar/search/results.html
@@ -24,82 +24,83 @@
         <dl>
             {% for field, data in facet_data.items %}
                 {% if data.results %}
-                    {% include 'oscar/search/partials/facet.html' with name=data.name items=data.results %}{% endif %}
-                {% endfor %}
-            </dl>
-        {% endif %}
-    {% endblock %}
-    {% block headertext %}
-        {% blocktrans with q=query %}
-            Products matching "{{ q }}"
-        {% endblocktrans %}
-    {% endblock %}
-    {% block content %}
-        <form method="get">
-            {# Render other search params as hidden inputs #}
-            {% for value in selected_facets %}
-                <input type="hidden" name="selected_facets" value="{{ value }}" />
+                    {% include 'oscar/search/partials/facet.html' with name=data.name items=data.results %}
+                {% endif %}
             {% endfor %}
-            <input type="hidden" name="q" value="{{ search_form.q.value }}" />
-            {% if paginator.count %}
-                {% if paginator.num_pages > 1 %}
-                    {% blocktrans with start=page.start_index end=page.end_index num_results=paginator.count %}
-                        Found
-                        <strong>{{ num_results }}</strong>
-                        results, showing
-                        <strong>{{ start }}</strong>
-                        to
-                        <strong>{{ end }}</strong>
-                        .
-                    {% endblocktrans %}
-                {% else %}
-                    {% blocktrans count num_results=paginator.count %}
-                        Found
-                        <strong>{{ num_results }}</strong>
-                        result.
-                        {% plural %}
-                        Found
-                        <strong>{{ num_results }}</strong>
-                        results.
+        </dl>
+    {% endif %}
+{% endblock %}
+{% block headertext %}
+    {% blocktrans with q=query %}
+        Products matching "{{ q }}"
+    {% endblocktrans %}
+{% endblock %}
+{% block content %}
+    <form method="get">
+        {# Render other search params as hidden inputs #}
+        {% for value in selected_facets %}
+            <input type="hidden" name="selected_facets" value="{{ value }}" />
+        {% endfor %}
+        <input type="hidden" name="q" value="{{ search_form.q.value }}" />
+        {% if paginator.count %}
+            {% if paginator.num_pages > 1 %}
+                {% blocktrans with start=page.start_index end=page.end_index num_results=paginator.count %}
+                    Found
+                    <strong>{{ num_results }}</strong>
+                    results, showing
+                    <strong>{{ start }}</strong>
+                    to
+                    <strong>{{ end }}</strong>
+                    .
+                {% endblocktrans %}
+            {% else %}
+                {% blocktrans count num_results=paginator.count %}
+                    Found
+                    <strong>{{ num_results }}</strong>
+                    result.
+                    {% plural %}
+                    Found
+                    <strong>{{ num_results }}</strong>
+                    results.
+                {% endblocktrans %}
+            {% endif %}
+            <div class="float-right">
+                {% include "oscar/partials/form_field.html" with field=search_form.sort_by %}
+            </div>
+        {% else %}
+            <p>
+                {% trans "Found
+                <strong>0</strong>
+                results." %}
+                {% if suggestion %}
+                    {% url 'search:search' as search_url %}
+                    {% blocktrans %}
+                        Did you mean
+                        <a href="{{ search_url }}?q={{ suggestion }}">
+                            "{{ suggestion }}"
+                        </a>
+                        ?
                     {% endblocktrans %}
                 {% endif %}
-                <div class="float-right">
-                    {% include "oscar/partials/form_field.html" with field=search_form.sort_by %}
-                </div>
-            {% else %}
-                <p>
-                    {% trans "Found
-                    <strong>0</strong>
-                    results." %}
-                    {% if suggestion %}
-                        {% url 'search:search' as search_url %}
-                        {% blocktrans %}
-                            Did you mean
-                            <a href="{{ search_url }}?q={{ suggestion }}">
-                                "{{ suggestion }}"
-                            </a>
-                            ?
-                        {% endblocktrans %}
-                    {% endif %}
-                </p>
-            {% endif %}
-        </form>
-        {% if page.object_list %}
-            <section>
-                <div>
-                    <ol class="row list-unstyled ml-0 pl-0">
-                        {% for result in page.object_list %}
-                            <li class="col-sm-4 col-md-3 col-lg-3">
-                                {% render_product result.object %}
-                            </li>
-                        {% endfor %}
-                    </ol>
-                    {% include "oscar/partials/pagination.html" with page_obj=page %}
-                </div>
-            </section>
+            </p>
         {% endif %}
-    {% endblock %}
-    {% block onbodyload %}
-        {{ block.super }}
-        oscar.search.init();
-    {% endblock %}
+    </form>
+    {% if page.object_list %}
+        <section>
+            <div>
+                <ol class="row list-unstyled ml-0 pl-0">
+                    {% for result in page.object_list %}
+                        <li class="col-sm-4 col-md-3 col-lg-3">
+                            {% render_product result.object %}
+                        </li>
+                    {% endfor %}
+                </ol>
+                {% include "oscar/partials/pagination.html" with page_obj=page %}
+            </div>
+        </section>
+    {% endif %}
+{% endblock %}
+{% block onbodyload %}
+    {{ block.super }}
+    oscar.search.init();
+{% endblock %}
diff --git a/tests/django_rest/admin.html b/tests/django_rest/admin.html
index 295f4fa..0a450d5 100644
--- a/tests/django_rest/admin.html
+++ b/tests/django_rest/admin.html
@@ -15,9 +15,7 @@
             {% block style %}
                 {% block bootstrap_theme %}
                     <link rel="stylesheet" type="text/css" href="{% static "rest_framework/css/bootstrap.min.css" %}"/>
-                    <link rel="stylesheet"
-                          type="text/css"
-                          href="{% static "/>
+                    <link rel="stylesheet" type="text/css" href="{% static "/>
                 {% endblock %}
                 <link rel="stylesheet" type="text/css" href="{% static "rest_framework/css/prettify.css" %}"/>
                 <link rel="stylesheet" type="text/css" href="{% static "rest_framework/css/default.css" %}"/>
@@ -26,235 +24,160 @@
     </head>
     {% block body %}
         <body class="{% block bodyclass %}{% endblock %}">
-        <div class="wrapper">
-            {% block navbar %}
-                <div class="navbar navbar-static-top {% block bootstrap_navbar_variant %}navbar-inverse{% endblock %}">
+            <div class="wrapper">
+                {% block navbar %}
+                    <div class="navbar navbar-static-top {% block bootstrap_navbar_variant %}navbar-inverse{% endblock %}">
+                        <div class="container">
+                            <span>
+                                {% block branding %}
+                                    <a class='navbar-brand'
+                                       rel="nofollow"
+                                       href='https://www.django-rest-framework.org/'>
+                                        Django REST framework
+                                    </a>
+                                {% endblock %}
+                            </span>
+                            <ul class="nav navbar-nav pull-right">
+                                {% block userlinks %}
+                                    {% if user.is_authenticated %}
+                                        {% optional_logout request user %}
+                                    {% else %}
+                                        {% optional_login request %}
+                                    {% endif %}
+                                {% endblock %}
+                            </ul>
+                        </div>
+                    </div>
+                {% endblock %}
                 <div class="container">
-                    <span>
-                        {% block branding %}
-                            <a class='navbar-brand' rel="nofollow" href='https://www.django-rest-framework.org/'>
-                                Django REST framework
-                            </a>
-                        {% endblock %}
-                    </span>
-                    <ul class="nav navbar-nav pull-right">
-                        {% block userlinks %}
-                            {% if user.is_authenticated %}
-                                {% optional_logout request user %}
-                            {% else %}
-                                {% optional_login request %}
-                            {% endif %}
-                        {% endblock %}
-                    </ul>
-                </div>
-            </div>
-        {% endblock %}
-        <div class="container">
-            {% block breadcrumbs %}
-                <ul class="breadcrumb">
-                    {% for breadcrumb_name, breadcrumb_url in breadcrumblist %}
-                        {% if forloop.last %}
-                            <li class="active">
-                                <a href="{{ breadcrumb_url }}">{{ breadcrumb_name }}</a>
-                            </li>
-                        {% else %}
-                            <li>
-                                <a href="{{ breadcrumb_url }}">{{ breadcrumb_name }}</a>
-                            </li>
+                    {% block breadcrumbs %}
+                        <ul class="breadcrumb">
+                            {% for breadcrumb_name, breadcrumb_url in breadcrumblist %}
+                                {% if forloop.last %}
+                                    <li class="active">
+                                        <a href="{{ breadcrumb_url }}">{{ breadcrumb_name }}</a>
+                                    </li>
+                                {% else %}
+                                    <li>
+                                        <a href="{{ breadcrumb_url }}">{{ breadcrumb_name }}</a>
+                                    </li>
+                                {% endif %}
+                            {% endfor %}
+                        </ul>
+                    {% endblock %}
+                    <!-- Content -->
+                    <div id="content">
+                        {% if 'GET' in allowed_methods %}
+                            <form id="get-form" class="pull-right">
+                                <fieldset>
+                                    <div class="btn-group format-selection">
+                                        <button class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
+                                            Format
+                                            <span class="caret"></span>
+                                        </button>
+                                        <ul class="dropdown-menu">
+                                            {% for format in available_formats %}
+                                                <li>
+                                                    <a class="format-option"
+                                                       href='{% add_query_param request api_settings.URL_FORMAT_OVERRIDE format %}'
+                                                       rel="nofollow">
+                                                        {{ format }}
+                                                    </a>
+                                                </li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </fieldset>
+                            </form>
                         {% endif %}
-                    {% endfor %}
-                </ul>
-            {% endblock %}
-            <!-- Content -->
-            <div id="content">
-                {% if 'GET' in allowed_methods %}
-                    <form id="get-form" class="pull-right">
-                        <fieldset>
-                            <div class="btn-group format-selection">
-                                <button class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
-                                    Format
+                        {% if post_form %}
+                            <button type="button"
+                                    class="button-form btn btn-primary"
+                                    data-toggle="modal"
+                                    data-target="#createModal">
+                                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
+                                Create
+                            </button>
+                        {% endif %}
+                        {% if put_form %}
+                            <button type="button"
+                                    class="button-form btn btn-primary"
+                                    data-toggle="modal"
+                                    data-target="#editModal">
+                                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
+                                Edit
+                            </button>
+                        {% endif %}
+                        {% if delete_form %}
+                            <form class="button-form" action="{{ request.get_full_path }}" data-method="DELETE">
+                                <button class="btn btn-danger">
+                                    <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
+                                    Delete
+                                </button>
+                            </form>
+                        {% endif %}
+                        {% if extra_actions %}
+                            <div class="dropdown" style="float: right; margin-right: 10px">
+                                <button class="btn btn-default"
+                                        id="extra-actions-menu"
+                                        data-toggle="dropdown"
+                                        aria-haspopup="true"
+                                        aria-expanded="true">
+                                    {% trans "Extra Actions" %}
                                     <span class="caret"></span>
                                 </button>
-                                <ul class="dropdown-menu">
-                                    {% for format in available_formats %}
+                                <ul class="dropdown-menu" aria-labelledby="extra-actions-menu">
+                                    {% for action_name, url in extra_actions|items %}
                                         <li>
-                                            <a class="format-option"
-                                               href='{% add_query_param request api_settings.URL_FORMAT_OVERRIDE format %}'
-                                               rel="nofollow">
-                                                {{ format }}
-                                            </a>
+                                            <a href="{{ url }}">{{ action_name }}</a>
                                         </li>
                                     {% endfor %}
                                 </ul>
                             </div>
-                        </fieldset>
-                    </form>
-                {% endif %}
-                {% if post_form %}
-                    <button type="button"
-                            class="button-form btn btn-primary"
-                            data-toggle="modal"
-                            data-target="#createModal">
-                        <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
-                        Create
-                    </button>
-                {% endif %}
-                {% if put_form %}
-                    <button type="button"
-                            class="button-form btn btn-primary"
-                            data-toggle="modal"
-                            data-target="#editModal">
-                        <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
-                        Edit
-                    </button>
-                {% endif %}
-                {% if delete_form %}
-                    <form class="button-form" action="{{ request.get_full_path }}" data-method="DELETE">
-                        <button class="btn btn-danger">
-                            <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
-                            Delete
-                        </button>
-                    </form>
-                {% endif %}
-                {% if extra_actions %}
-                    <div class="dropdown" style="float: right; margin-right: 10px">
-                        <button class="btn btn-default"
-                                id="extra-actions-menu"
-                                data-toggle="dropdown"
-                                aria-haspopup="true"
-                                aria-expanded="true">
-                            {% trans "Extra Actions" %}
-                            <span class="caret"></span>
-                        </button>
-                        <ul class="dropdown-menu" aria-labelledby="extra-actions-menu">
-                            {% for action_name, url in extra_actions|items %}
-                                <li>
-                                    <a href="{{ url }}">{{ action_name }}</a>
-                                </li>
-                            {% endfor %}
-                        </ul>
-                    </div>
-                {% endif %}
-                {% if filter_form %}
-                    <button style="float: right; margin-right: 10px"
-                            data-toggle="modal"
-                            data-target="#filtersModal"
-                            class="btn btn-default">
-                        <span class="glyphicon glyphicon-wrench" aria-hidden="true"></span>
-                        {% trans "Filters" %}
-                    </button>
-                {% endif %}
-                <div class="content-main">
-                    <div class="page-header">
-                        <h1>{{ name }}</h1>
-                    </div>
-                    <div style="float:left">
-                        {% block description %}{{ description }}{% endblock %}
-                    </div>
-                    {% if paginator %}
-                        <nav style="float: right">
-                            {% get_pagination_html paginator %}
-                        </nav>
-                    {% endif %}
-                    <div class="request-info" style="clear: both" >
-                        {% if style == 'list' %}
-                            {% include "rest_framework/admin/list.html" %}
-                        {% else %}
-                            {% include "rest_framework/admin/detail.html" %}{% endif %}
-                        </div>
-                        {% if paginator %}
-                            <nav style="float: right">
-                                {% get_pagination_html paginator %}
-                            </nav>
                         {% endif %}
+                        {% if filter_form %}
+                            <button style="float: right; margin-right: 10px"
+                                    data-toggle="modal"
+                                    data-target="#filtersModal"
+                                    class="btn btn-default">
+                                <span class="glyphicon glyphicon-wrench" aria-hidden="true"></span>
+                                {% trans "Filters" %}
+                            </button>
+                        {% endif %}
+                        <div class="content-main">
+                            <div class="page-header">
+                                <h1>{{ name }}</h1>
+                            </div>
+                            <div style="float:left">
+                                {% block description %}{{ description }}{% endblock %}
+                            </div>
+                            {% if paginator %}
+                                <nav style="float: right">
+                                    {% get_pagination_html paginator %}
+                                </nav>
+                            {% endif %}
+                            <div class="request-info" style="clear: both" >
+                                {% if style == 'list' %}
+                                    {% include "rest_framework/admin/list.html" %}
+                                {% else %}
+                                    {% include "rest_framework/admin/detail.html" %}
+                                {% endif %}
+                            </div>
+                            {% if paginator %}
+                                <nav style="float: right">
+                                    {% get_pagination_html paginator %}
+                                </nav>
+                            {% endif %}
+                        </div>
                     </div>
+                    <!-- END Content -->
                 </div>
-                <!-- END Content -->
+                <!-- /.container -->
             </div>
-            <!-- /.container -->
-        </div>
-        <!-- ./wrapper -->
-        <!-- Create Modal -->
-        <div class="modal fade"
-             id="createModal"
-             tabindex="-1"
-             role="dialog"
-             aria-labelledby="myModalLabel"
-             aria-hidden="true">
-            <div class="modal-dialog">
-                <div class="modal-content">
-                    <div class="modal-header">
-                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                            <span aria-hidden="true">&times;</span>
-                        </button>
-                        <h4 class="modal-title" id="myModalLabel">
-                            Create
-                        </h4>
-                    </div>
-                    <form action="{{ request.get_full_path }}"
-                          method="POST"
-                          enctype="multipart/form-data"
-                          class="form-horizontal">
-                        <div class="modal-body">
-                            <fieldset>
-                                {% csrf_token %}
-                                {{ post_form }}
-                            </fieldset>
-                        </div>
-                        <div class="modal-footer">
-                            <button type="button" class="btn btn-default" data-dismiss="modal">
-                                Close
-                            </button>
-                            <button type="submit" class="btn btn-primary">
-                                Save
-                            </button>
-                        </div>
-                    </form>
-                </div>
-            </div>
-        </div>
-        <!-- Edit Modal -->
-        <div class="modal fade"
-             id="editModal"
-             tabindex="-1"
-             role="dialog"
-             aria-labelledby="myModalLabel"
-             aria-hidden="true">
-            <div class="modal-dialog">
-                <div class="modal-content">
-                    <div class="modal-header">
-                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                            <span aria-hidden="true">&times;</span>
-                        </button>
-                        <h4 class="modal-title" id="myModalLabel">
-                            Edit
-                        </h4>
-                    </div>
-                    <form action="{{ request.get_full_path }}"
-                          data-method="PUT"
-                          enctype="multipart/form-data"
-                          class="form-horizontal">
-                        <div class="modal-body">
-                            <fieldset>
-                                {{ put_form }}
-                            </fieldset>
-                        </div>
-                        <div class="modal-footer">
-                            <button type="button" class="btn btn-default" data-dismiss="modal">
-                                Close
-                            </button>
-                            <button type="submit" class="btn btn-primary">
-                                Save
-                            </button>
-                        </div>
-                    </form>
-                </div>
-            </div>
-        </div>
-        {% if error_form %}
-            <!-- Errors Modal -->
-            <div class="modal"
-                 id="errorModal"
+            <!-- ./wrapper -->
+            <!-- Create Modal -->
+            <div class="modal fade"
+                 id="createModal"
                  tabindex="-1"
                  role="dialog"
                  aria-labelledby="myModalLabel"
@@ -266,16 +189,17 @@
                                 <span aria-hidden="true">&times;</span>
                             </button>
                             <h4 class="modal-title" id="myModalLabel">
-                                {{ error_title }}
+                                Create
                             </h4>
                         </div>
                         <form action="{{ request.get_full_path }}"
-                              data-method="{{ request.method }}"
+                              method="POST"
                               enctype="multipart/form-data"
                               class="form-horizontal">
                             <div class="modal-body">
                                 <fieldset>
-                                    {{ error_form }}
+                                    {% csrf_token %}
+                                    {{ post_form }}
                                 </fieldset>
                             </div>
                             <div class="modal-footer">
@@ -290,27 +214,104 @@
                     </div>
                 </div>
             </div>
-        {% endif %}
-        {% if filter_form %}{{ filter_form }}{% endif %}
-        {% block script %}
-            <script>
+            <!-- Edit Modal -->
+            <div class="modal fade"
+                 id="editModal"
+                 tabindex="-1"
+                 role="dialog"
+                 aria-labelledby="myModalLabel"
+                 aria-hidden="true">
+                <div class="modal-dialog">
+                    <div class="modal-content">
+                        <div class="modal-header">
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">&times;</span>
+                            </button>
+                            <h4 class="modal-title" id="myModalLabel">
+                                Edit
+                            </h4>
+                        </div>
+                        <form action="{{ request.get_full_path }}"
+                              data-method="PUT"
+                              enctype="multipart/form-data"
+                              class="form-horizontal">
+                            <div class="modal-body">
+                                <fieldset>
+                                    {{ put_form }}
+                                </fieldset>
+                            </div>
+                            <div class="modal-footer">
+                                <button type="button" class="btn btn-default" data-dismiss="modal">
+                                    Close
+                                </button>
+                                <button type="submit" class="btn btn-primary">
+                                    Save
+                                </button>
+                            </div>
+                        </form>
+                    </div>
+                </div>
+            </div>
+            {% if error_form %}
+                <!-- Errors Modal -->
+                <div class="modal"
+                     id="errorModal"
+                     tabindex="-1"
+                     role="dialog"
+                     aria-labelledby="myModalLabel"
+                     aria-hidden="true">
+                    <div class="modal-dialog">
+                        <div class="modal-content">
+                            <div class="modal-header">
+                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                    <span aria-hidden="true">&times;</span>
+                                </button>
+                                <h4 class="modal-title" id="myModalLabel">
+                                    {{ error_title }}
+                                </h4>
+                            </div>
+                            <form action="{{ request.get_full_path }}"
+                                  data-method="{{ request.method }}"
+                                  enctype="multipart/form-data"
+                                  class="form-horizontal">
+                                <div class="modal-body">
+                                    <fieldset>
+                                        {{ error_form }}
+                                    </fieldset>
+                                </div>
+                                <div class="modal-footer">
+                                    <button type="button" class="btn btn-default" data-dismiss="modal">
+                                        Close
+                                    </button>
+                                    <button type="submit" class="btn btn-primary">
+                                        Save
+                                    </button>
+                                </div>
+                            </form>
+                        </div>
+                    </div>
+                </div>
+            {% endif %}
+            {% if filter_form %}{{ filter_form }}{% endif %}
+            {% block script %}
+                <script>
           window.drf = {
             csrfHeaderName: "{{ csrf_header_name|default:'X-CSRFToken' }}",
             csrfToken: "{{ csrf_token }}"
           };
-            </script>
-            <script src="{% static "rest_framework/js/jquery-3.5.1.min.js" %}"></script>
-            <script src="{% static "rest_framework/js/ajax-form.js" %}"></script>
-            <script src="{% static "rest_framework/js/csrf.js" %}"></script>
-            <script src="{% static "rest_framework/js/bootstrap.min.js" %}"></script>
-            <script src="{% static "rest_framework/js/prettify-min.js" %}"></script>
-            <script src="{% static "rest_framework/js/default.js" %}"></script>
-            <script>
+                </script>
+                <script src="{% static "rest_framework/js/jquery-3.5.1.min.js" %}"></script>
+                <script src="{% static "rest_framework/js/ajax-form.js" %}"></script>
+                <script src="{% static "rest_framework/js/csrf.js" %}"></script>
+                <script src="{% static "rest_framework/js/bootstrap.min.js" %}"></script>
+                <script src="{% static "rest_framework/js/prettify-min.js" %}"></script>
+                <script src="{% static "rest_framework/js/default.js" %}"></script>
+                <script>
           $(document).ready(function() {
             $('form').ajaxForm();
           });
-            </script>
-        {% endblock %}
-    </body>
-{% endblock %}
+                </script>
+            {% endblock %}
+        </body>
+    {% endblock %}
 </html>
diff --git a/tests/django_rest/base.html b/tests/django_rest/base.html
index 07c119c..9101dcb 100644
--- a/tests/django_rest/base.html
+++ b/tests/django_rest/base.html
@@ -18,9 +18,7 @@
             {% block style %}
                 {% block bootstrap_theme %}
                     <link rel="stylesheet" type="text/css" href="{% static "rest_framework/css/bootstrap.min.css" %}"/>
-                    <link rel="stylesheet"
-                          type="text/css"
-                          href="{% static "/>
+                    <link rel="stylesheet" type="text/css" href="{% static "/>
                 {% endblock %}
                 <link rel="stylesheet" type="text/css" href="{% static "rest_framework/css/prettify.css" %}"/>
                 <link rel="stylesheet" type="text/css" href="{% static "rest_framework/css/default.css" %}"/>
@@ -34,339 +32,352 @@
     </head>
     {% block body %}
         <body class="{% block bodyclass %}{% endblock %}">
-        <div class="wrapper">
-            {% block navbar %}
-                <div class="navbar navbar-static-top {% block bootstrap_navbar_variant %}navbar-inverse{% endblock %}"
-                     role="navigation"
-                     aria-label="{% trans ">
+            <div class="wrapper">
+                {% block navbar %}
+                    <div class="navbar navbar-static-top {% block bootstrap_navbar_variant %}navbar-inverse{% endblock %}"
+                         role="navigation"
+                         aria-label="{% trans ">
+                        <div class="container">
+                            <span>
+                                {% block branding %}
+                                    <a class='navbar-brand'
+                                       rel="nofollow"
+                                       href='https://www.django-rest-framework.org/'>
+                                        Django REST framework
+                                    </a>
+                                {% endblock %}
+                            </span>
+                            <ul class="nav navbar-nav pull-right">
+                                {% block userlinks %}
+                                    {% if user.is_authenticated %}
+                                        {% optional_logout request user %}
+                                    {% else %}
+                                        {% optional_login request %}
+                                    {% endif %}
+                                {% endblock %}
+                            </ul>
+                        </div>
+                    </div>
+                {% endblock %}
                 <div class="container">
-                    <span>
-                        {% block branding %}
-                            <a class='navbar-brand' rel="nofollow" href='https://www.django-rest-framework.org/'>
-                                Django REST framework
-                            </a>
-                        {% endblock %}
-                    </span>
-                    <ul class="nav navbar-nav pull-right">
-                        {% block userlinks %}
-                            {% if user.is_authenticated %}
-                                {% optional_logout request user %}
-                            {% else %}
-                                {% optional_login request %}
-                            {% endif %}
-                        {% endblock %}
-                    </ul>
-                </div>
-            </div>
-        {% endblock %}
-        <div class="container">
-            {% block breadcrumbs %}
-                <ul class="breadcrumb">
-                    {% for breadcrumb_name, breadcrumb_url in breadcrumblist %}
-                        {% if forloop.last %}
-                            <li class="active">
-                                <a href="{{ breadcrumb_url }}">{{ breadcrumb_name }}</a>
-                            </li>
-                        {% else %}
-                            <li>
-                                <a href="{{ breadcrumb_url }}">{{ breadcrumb_name }}</a>
-                            </li>
-                        {% endif %}
-                        {% empty %}
-                        {% block breadcrumbs_empty %}
-                            &nbsp;
-                        {% endblock breadcrumbs_empty %}
-                    {% endfor %}
-                </ul>
-            {% endblock %}
-            <!-- Content -->
-            <div id="content" role="main" aria-label="{% trans "content" %}">
-                {% block content %}
-                    <div class="region" aria-label="{% trans "request form" %}">
-                        {% block request_forms %}
-                            {% if 'GET' in allowed_methods %}
-                                <form id="get-form" class="pull-right">
-                                    <fieldset>
-                                        {% if api_settings.URL_FORMAT_OVERRIDE %}
-                                            <div class="btn-group format-selection">
-                                                <a class="btn btn-primary js-tooltip"
-                                                   href="{{ request.get_full_path }}"
-                                                   rel="nofollow"
-                                                   title="Make a GET request on the {{ name }} resource">
-                                                    GET
+                    {% block breadcrumbs %}
+                        <ul class="breadcrumb">
+                            {% for breadcrumb_name, breadcrumb_url in breadcrumblist %}
+                                {% if forloop.last %}
+                                    <li class="active">
+                                        <a href="{{ breadcrumb_url }}">{{ breadcrumb_name }}</a>
+                                    </li>
+                                {% else %}
+                                    <li>
+                                        <a href="{{ breadcrumb_url }}">{{ breadcrumb_name }}</a>
+                                    </li>
+                                {% endif %}
+                                {% empty %}
+                                {% block breadcrumbs_empty %}
+                                    &nbsp;
+                                {% endblock breadcrumbs_empty %}
+                            {% endfor %}
+                        </ul>
+                    {% endblock %}
+                    <!-- Content -->
+                    <div id="content" role="main" aria-label="{% trans "content" %}">
+                        {% block content %}
+                            <div class="region" aria-label="{% trans "request form" %}">
+                                {% block request_forms %}
+                                    {% if 'GET' in allowed_methods %}
+                                        <form id="get-form" class="pull-right">
+                                            <fieldset>
+                                                {% if api_settings.URL_FORMAT_OVERRIDE %}
+                                                    <div class="btn-group format-selection">
+                                                        <a class="btn btn-primary js-tooltip"
+                                                           href="{{ request.get_full_path }}"
+                                                           rel="nofollow"
+                                                           title="Make a GET request on the {{ name }} resource">
+                                                            GET
+                                                        </a>
+                                                        <button class="btn btn-primary dropdown-toggle js-tooltip"
+                                                                data-toggle="dropdown"
+                                                                title="Specify a format for the GET request">
+                                                            <span class="caret"></span>
+                                                        </button>
+                                                        <ul class="dropdown-menu">
+                                                            {% for format in available_formats %}
+                                                                <li>
+                                                                    <a class="js-tooltip format-option"
+                                                                       href="{% add_query_param request api_settings.URL_FORMAT_OVERRIDE format %}"
+                                                                       rel="nofollow"
+                                                                       title="Make a GET request on the {{ name }} resource with the format set to `{{ format }}`">
+                                                                        {{ format }}
+                                                                    </a>
+                                                                </li>
+                                                            {% endfor %}
+                                                        </ul>
+                                                    </div>
+                                                {% else %}
+                                                    <a class="btn btn-primary js-tooltip"
+                                                       href="{{ request.get_full_path }}"
+                                                       rel="nofollow"
+                                                       title="Make a GET request on the {{ name }} resource">
+                                                        GET
+                                                    </a>
+                                                {% endif %}
+                                            </fieldset>
+                                        </form>
+                                    {% endif %}
+                                    {% if options_form %}
+                                        <form class="button-form"
+                                              action="{{ request.get_full_path }}"
+                                              data-method="OPTIONS">
+                                            <button class="btn btn-primary js-tooltip"
+                                                    title="Make an OPTIONS request on the {{ name }} resource">
+                                                OPTIONS
+                                            </button>
+                                        </form>
+                                    {% endif %}
+                                    {% if delete_form %}
+                                        <button class="btn btn-danger button-form js-tooltip"
+                                                title="Make a DELETE request on the {{ name }} resource"
+                                                data-toggle="modal"
+                                                data-target="#deleteModal">
+                                            DELETE
+                                        </button>
+                                        <!-- Delete Modal -->
+                                        <div class="modal fade"
+                                             id="deleteModal"
+                                             tabindex="-1"
+                                             role="dialog"
+                                             aria-labelledby="myModalLabel"
+                                             aria-hidden="true">
+                                            <div class="modal-dialog">
+                                                <div class="modal-content">
+                                                    <div class="modal-body">
+                                                        <h4 class="text-center">Are you sure you want to delete this {{ name }}?</h4>
+                                                    </div>
+                                                    <div class="modal-footer">
+                                                        <button type="button"
+                                                                class="btn btn-default"
+                                                                data-dismiss="modal">
+                                                            Cancel
+                                                        </button>
+                                                        <form class="button-form"
+                                                              action="{{ request.get_full_path }}"
+                                                              data-method="DELETE">
+                                                            <button class="btn btn-danger">Delete</button>
+                                                        </form>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    {% endif %}
+                                    {% if extra_actions %}
+                                        <div class="dropdown" style="float: right; margin-right: 10px">
+                                            <button class="btn btn-default"
+                                                    id="extra-actions-menu"
+                                                    data-toggle="dropdown"
+                                                    aria-haspopup="true"
+                                                    aria-expanded="true">
+                                                {% trans "Extra Actions" %}
+                                                <span class="caret"></span>
+                                            </button>
+                                            <ul class="dropdown-menu" aria-labelledby="extra-actions-menu">
+                                                {% for action_name, url in extra_actions|items %}
+                                                    <li>
+                                                        <a href="{{ url }}">{{ action_name }}</a>
+                                                    </li>
+                                                {% endfor %}
+                                            </ul>
+                                        </div>
+                                    {% endif %}
+                                    {% if filter_form %}
+                                        <button style="float: right; margin-right: 10px"
+                                                data-toggle="modal"
+                                                data-target="#filtersModal"
+                                                class="btn btn-default">
+                                            <span class="glyphicon glyphicon-wrench" aria-hidden="true"></span>
+                                            {% trans "Filters" %}
+                                        </button>
+                                    {% endif %}
+                                {% endblock request_forms %}
+                            </div>
+                            <div class="content-main" role="main" aria-label="{% trans "main content" %}">
+                                <div class="page-header">
+                                    <h1>{{ name }}</h1>
+                                </div>
+                                <div style="float:left">
+                                    {% block description %}{{ description }}{% endblock %}
+                                </div>
+                                {% if paginator %}
+                                    <nav style="float: right">
+                                        {% get_pagination_html paginator %}
+                                    </nav>
+                                {% endif %}
+                                <div class="request-info" style="clear: both" aria-label="{% trans "request info" %}">
+                                    <pre class="prettyprint">
+                                    <b>{{ request.method }}</b> {{ request.get_full_path }}</pre>
+                                </div>
+                                <div class="response-info" aria-label="{% trans "response info" %}">
+                                    <pre class="prettyprint"><span class="meta nocode"><b>HTTP {{ response.status_code }} {{ response.status_text }}</b>{% for key, val in response_headers|items %}
+<b>{{ key }}:</b> <span class="lit">{{ val|break_long_headers|urlize }}</span>{% endfor %}
+
+</span>{{ content|urlize }}
+                                </pre>
+                            </div>
+                        </div>
+                        {% if display_edit_forms %}
+                            {% if post_form or raw_data_post_form %}
+                                <div
+                                    {% if post_form %}class="tabbable"{% endif %}
+                                    >
+                                    {% if post_form %}
+                                        <ul class="nav nav-tabs form-switcher">
+                                            <li>
+                                                <a name='html-tab' href="#post-object-form" data-toggle="tab">
+                                                    HTML form
                                                 </a>
-                                                <button class="btn btn-primary dropdown-toggle js-tooltip"
-                                                        data-toggle="dropdown"
-                                                        title="Specify a format for the GET request">
-                                                    <span class="caret"></span>
-                                                </button>
-                                                <ul class="dropdown-menu">
-                                                    {% for format in available_formats %}
-                                                        <li>
-                                                            <a class="js-tooltip format-option"
-                                                               href="{% add_query_param request api_settings.URL_FORMAT_OVERRIDE format %}"
-                                                               rel="nofollow"
-                                                               title="Make a GET request on the {{ name }} resource with the format set to `{{ format }}`">
-                                                                {{ format }}
-                                                            </a>
-                                                        </li>
-                                                    {% endfor %}
-                                                </ul>
+                                            </li>
+                                            <li>
+                                                <a name='raw-tab' href="#post-generic-content-form" data-toggle="tab">
+                                                    Raw data
+                                                </a>
+                                            </li>
+                                        </ul>
+                                    {% endif %}
+                                    <div class="well tab-content">
+                                        {% if post_form %}
+                                            <div class="tab-pane" id="post-object-form">
+                                                {% with form=post_form %}
+                                                    <form action="{{ request.get_full_path }}"
+                                                          method="POST"
+                                                          enctype="multipart/form-data"
+                                                          class="form-horizontal">
+                                                        <fieldset>
+                                                            {% csrf_token %}
+                                                            {{ post_form }}
+                                                            <div class="form-actions">
+                                                                <button class="btn btn-primary js-tooltip"
+                                                                        title="Make a POST request on the {{ name }} resource">
+                                                                    POST
+                                                                </button>
+                                                            </div>
+                                                        </fieldset>
+                                                    </form>
+                                                {% endwith %}
                                             </div>
-                                        {% else %}
-                                            <a class="btn btn-primary js-tooltip"
-                                               href="{{ request.get_full_path }}"
-                                               rel="nofollow"
-                                               title="Make a GET request on the {{ name }} resource">
-                                                GET
-                                            </a>
                                         {% endif %}
-                                    </fieldset>
-                                </form>
-                            {% endif %}
-                            {% if options_form %}
-                                <form class="button-form" action="{{ request.get_full_path }}" data-method="OPTIONS">
-                                    <button class="btn btn-primary js-tooltip"
-                                            title="Make an OPTIONS request on the {{ name }} resource">
-                                        OPTIONS
-                                    </button>
-                                </form>
-                            {% endif %}
-                            {% if delete_form %}
-                                <button class="btn btn-danger button-form js-tooltip"
-                                        title="Make a DELETE request on the {{ name }} resource"
-                                        data-toggle="modal"
-                                        data-target="#deleteModal">
-                                    DELETE
-                                </button>
-                                <!-- Delete Modal -->
-                                <div class="modal fade"
-                                     id="deleteModal"
-                                     tabindex="-1"
-                                     role="dialog"
-                                     aria-labelledby="myModalLabel"
-                                     aria-hidden="true">
-                                    <div class="modal-dialog">
-                                        <div class="modal-content">
-                                            <div class="modal-body">
-                                                <h4 class="text-center">Are you sure you want to delete this {{ name }}?</h4>
-                                            </div>
-                                            <div class="modal-footer">
-                                                <button type="button" class="btn btn-default" data-dismiss="modal">
-                                                    Cancel
-                                                </button>
-                                                <form class="button-form"
-                                                      action="{{ request.get_full_path }}"
-                                                      data-method="DELETE">
-                                                    <button class="btn btn-danger">Delete</button>
+                                        <div {% if post_form %}class="tab-pane"{% endif %}
+                                            id="post-generic-content-form">
+                                            {% with form=raw_data_post_form %}
+                                                <form action="{{ request.get_full_path }}"
+                                                      method="POST"
+                                                      class="form-horizontal">
+                                                    <fieldset>
+                                                        {% include "rest_framework/raw_data_form.html" %}
+                                                        <div class="form-actions">
+                                                            <button class="btn btn-primary js-tooltip"
+                                                                    title="Make a POST request on the {{ name }} resource">
+                                                                POST
+                                                            </button>
+                                                        </div>
+                                                    </fieldset>
                                                 </form>
-                                            </div>
+                                            {% endwith %}
                                         </div>
                                     </div>
                                 </div>
                             {% endif %}
-                            {% if extra_actions %}
-                                <div class="dropdown" style="float: right; margin-right: 10px">
-                                    <button class="btn btn-default"
-                                            id="extra-actions-menu"
-                                            data-toggle="dropdown"
-                                            aria-haspopup="true"
-                                            aria-expanded="true">
-                                        {% trans "Extra Actions" %}
-                                        <span class="caret"></span>
-                                    </button>
-                                    <ul class="dropdown-menu" aria-labelledby="extra-actions-menu">
-                                        {% for action_name, url in extra_actions|items %}
+                            {% if put_form or raw_data_put_form or raw_data_patch_form %}
+                                <div {% if put_form %}class="tabbable"{% endif %}>
+                                    {% if put_form %}
+                                        <ul class="nav nav-tabs form-switcher">
                                             <li>
-                                                <a href="{{ url }}">{{ action_name }}</a>
+                                                <a name='html-tab' href="#put-object-form" data-toggle="tab">
+                                                    HTML form
+                                                </a>
                                             </li>
-                                        {% endfor %}
-                                    </ul>
-                                </div>
-                            {% endif %}
-                            {% if filter_form %}
-                                <button style="float: right; margin-right: 10px"
-                                        data-toggle="modal"
-                                        data-target="#filtersModal"
-                                        class="btn btn-default">
-                                    <span class="glyphicon glyphicon-wrench" aria-hidden="true"></span>
-                                    {% trans "Filters" %}
-                                </button>
-                            {% endif %}
-                        {% endblock request_forms %}
-                    </div>
-                    <div class="content-main" role="main" aria-label="{% trans "main content" %}">
-                        <div class="page-header">
-                            <h1>{{ name }}</h1>
-                        </div>
-                        <div style="float:left">
-                            {% block description %}{{ description }}{% endblock %}
-                        </div>
-                        {% if paginator %}
-                            <nav style="float: right">
-                                {% get_pagination_html paginator %}
-                            </nav>
-                        {% endif %}
-                        <div class="request-info" style="clear: both" aria-label="{% trans "request info" %}">
-                            <pre class="prettyprint">
-                            <b>{{ request.method }}</b> {{ request.get_full_path }}</pre>
-                        </div>
-                        <div class="response-info" aria-label="{% trans "response info" %}">
-                            <pre class="prettyprint"><span class="meta nocode"><b>HTTP {{ response.status_code }} {{ response.status_text }}</b>{% for key, val in response_headers|items %}
-<b>{{ key }}:</b> <span class="lit">{{ val|break_long_headers|urlize }}</span>{% endfor %}
-
-</span>{{ content|urlize }}
-                        </pre>
-                    </div>
-                </div>
-                {% if display_edit_forms %}
-                    {% if post_form or raw_data_post_form %}
-                        <div {% if post_form %}class="tabbable"{% endif %}
-                        >
-                        {% if post_form %}
-                            <ul class="nav nav-tabs form-switcher">
-                                <li>
-                                    <a name='html-tab' href="#post-object-form" data-toggle="tab">
-                                        HTML form
-                                    </a>
-                                </li>
-                                <li>
-                                    <a name='raw-tab' href="#post-generic-content-form" data-toggle="tab">
-                                        Raw data
-                                    </a>
-                                </li>
-                            </ul>
-                        {% endif %}
-                        <div class="well tab-content">
-                            {% if post_form %}
-                                <div class="tab-pane" id="post-object-form">
-                                    {% with form=post_form %}
-                                    <form action="{{ request.get_full_path }}"
-                                          method="POST"
-                                          enctype="multipart/form-data"
-                                          class="form-horizontal">
-                                        <fieldset>
-                                            {% csrf_token %}
-                                            {{ post_form }}
-                                            <div class="form-actions">
-                                                <button class="btn btn-primary js-tooltip"
-                                                        title="Make a POST request on the {{ name }} resource">
-                                                    POST
-                                                </button>
+                                            <li>
+                                                <a name='raw-tab' href="#put-generic-content-form" data-toggle="tab">
+                                                    Raw data
+                                                </a>
+                                            </li>
+                                        </ul>
+                                    {% endif %}
+                                    <div class="well tab-content">
+                                        {% if put_form %}
+                                            <div class="tab-pane" id="put-object-form">
+                                                <form action="{{ request.get_full_path }}"
+                                                      data-method="PUT"
+                                                      enctype="multipart/form-data"
+                                                      class="form-horizontal">
+                                                    <fieldset>
+                                                        {{ put_form }}
+                                                        <div class="form-actions">
+                                                            <button class="btn btn-primary js-tooltip"
+                                                                    title="Make a PUT request on the {{ name }} resource">
+                                                                PUT
+                                                            </button>
+                                                        </div>
+                                                    </fieldset>
+                                                </form>
                                             </div>
-                                        </fieldset>
-                                    </form>
-                                {% endwith %}
-                            </div>
-                        {% endif %}
-                        <div {% if post_form %}class="tab-pane"{% endif %} id="post-generic-content-form">
-                        {% with form=raw_data_post_form %}
-                        <form action="{{ request.get_full_path }}" method="POST" class="form-horizontal">
-                            <fieldset>
-                                {% include "rest_framework/raw_data_form.html" %}
-                                <div class="form-actions">
-                                    <button class="btn btn-primary js-tooltip"
-                                            title="Make a POST request on the {{ name }} resource">
-                                        POST
-                                    </button>
+                                        {% endif %}
+                                        <div {% if put_form %}class="tab-pane"
+                                             {% endif %} id="put-generic-content-form">
+                                            {% with form=raw_data_put_or_patch_form %}
+                                                <form action="{{ request.get_full_path }}"
+                                                      data-method="PUT"
+                                                      class="form-horizontal">
+                                                    <fieldset>
+                                                        {% include "rest_framework/raw_data_form.html" %}
+                                                        <div class="form-actions">
+                                                            {% if raw_data_put_form %}
+                                                                <button class="btn btn-primary js-tooltip"
+                                                                        title="Make a PUT request on the {{ name }} resource">
+                                                                    PUT
+                                                                </button>
+                                                            {% endif %}
+                                                            {% if raw_data_patch_form %}
+                                                                <button data-method="PATCH"
+                                                                        class="btn btn-primary js-tooltip"
+                                                                        title="Make a PATCH request on the {{ name }} resource">
+                                                                    PATCH
+                                                                </button>
+                                                            {% endif %}
+                                                        </div>
+                                                    </fieldset>
+                                                </form>
+                                            {% endwith %}
+                                        </div>
+                                    </div>
                                 </div>
-                            </fieldset>
-                        </form>
-                    {% endwith %}
+                            {% endif %}
+                        {% endif %}
+                    {% endblock content %}
                 </div>
+                <!-- /.content -->
             </div>
+            <!-- /.container -->
         </div>
-    {% endif %}
-    {% if put_form or raw_data_put_form or raw_data_patch_form %}
-        <div {% if put_form %}class="tabbable"{% endif %}>
-        {% if put_form %}
-            <ul class="nav nav-tabs form-switcher">
-                <li>
-                    <a name='html-tab' href="#put-object-form" data-toggle="tab">
-                        HTML form
-                    </a>
-                </li>
-                <li>
-                    <a name='raw-tab' href="#put-generic-content-form" data-toggle="tab">
-                        Raw data
-                    </a>
-                </li>
-            </ul>
-        {% endif %}
-        <div class="well tab-content">
-            {% if put_form %}
-                <div class="tab-pane" id="put-object-form">
-                    <form action="{{ request.get_full_path }}"
-                          data-method="PUT"
-                          enctype="multipart/form-data"
-                          class="form-horizontal">
-                        <fieldset>
-                            {{ put_form }}
-                            <div class="form-actions">
-                                <button class="btn btn-primary js-tooltip"
-                                        title="Make a PUT request on the {{ name }} resource">
-                                    PUT
-                                </button>
-                            </div>
-                        </fieldset>
-                    </form>
-                </div>
-            {% endif %}
-            <div {% if put_form %}class="tab-pane"{% endif %} id="put-generic-content-form">
-            {% with form=raw_data_put_or_patch_form %}
-            <form action="{{ request.get_full_path }}" data-method="PUT" class="form-horizontal">
-                <fieldset>
-                    {% include "rest_framework/raw_data_form.html" %}
-                    <div class="form-actions">
-                        {% if raw_data_put_form %}
-                            <button class="btn btn-primary js-tooltip"
-                                    title="Make a PUT request on the {{ name }} resource">
-                                PUT
-                            </button>
-                        {% endif %}
-                        {% if raw_data_patch_form %}
-                            <button data-method="PATCH"
-                                    class="btn btn-primary js-tooltip"
-                                    title="Make a PATCH request on the {{ name }} resource">
-                                PATCH
-                            </button>
-                        {% endif %}
-                    </div>
-                </fieldset>
-            </form>
-        {% endwith %}
-    </div>
-</div>
-</div>
-{% endif %}
-{% endif %}
-{% endblock content %}
-</div>
-<!-- /.content -->
-</div>
-<!-- /.container -->
-</div>
-<!-- ./wrapper -->
-{% if filter_form %}{{ filter_form }}{% endif %}
-{% block script %}
-<script>
+        <!-- ./wrapper -->
+        {% if filter_form %}{{ filter_form }}{% endif %}
+        {% block script %}
+            <script>
         window.drf = {
           csrfHeaderName: "{{ csrf_header_name|default:'X-CSRFToken' }}",
           csrfToken: "{% if request %}{{ csrf_token }}{% endif %}"
         };
-</script>
-<script src="{% static "rest_framework/js/jquery-3.5.1.min.js" %}"></script>
-<script src="{% static "rest_framework/js/ajax-form.js" %}"></script>
-<script src="{% static "rest_framework/js/csrf.js" %}"></script>
-<script src="{% static "rest_framework/js/bootstrap.min.js" %}"></script>
-<script src="{% static "rest_framework/js/prettify-min.js" %}"></script>
-<script src="{% static "rest_framework/js/default.js" %}"></script>
-<script>
+            </script>
+            <script src="{% static "rest_framework/js/jquery-3.5.1.min.js" %}"></script>
+            <script src="{% static "rest_framework/js/ajax-form.js" %}"></script>
+            <script src="{% static "rest_framework/js/csrf.js" %}"></script>
+            <script src="{% static "rest_framework/js/bootstrap.min.js" %}"></script>
+            <script src="{% static "rest_framework/js/prettify-min.js" %}"></script>
+            <script src="{% static "rest_framework/js/default.js" %}"></script>
+            <script>
         $(document).ready(function() {
           $('form').ajaxForm();
         });
-</script>
-{% endblock %}
-</body>
+            </script>
+        {% endblock %}
+    </body>
 {% endblock %}
 </html>
diff --git a/tests/django_rest/docs/document.html b/tests/django_rest/docs/document.html
index 048e9d2..bb7e0b0 100644
--- a/tests/django_rest/docs/document.html
+++ b/tests/django_rest/docs/document.html
@@ -10,22 +10,25 @@
     </div>
     <div class="col-md-6 intro-code">
         {% for html in lang_intro_htmls %}
-            {% include html %}{% endfor %}
-        </div>
+            {% include html %}
+        {% endfor %}
     </div>
-    {% if document|data %}
-        {% for section_key, section in document|data|items %}
-            {% if section_key %}
-                <h2 id="{{ section_key }}" class="coredocs-section-title">
-                    {{ section_key }}
-                    <a href="#{{ section_key }}">
-                        <i class="fa fa-link" aria-hidden="true"></i>
-                    </a>
-                </h2>
-            {% endif %}
-            {% for link_key, link in section|schema_links|items %}
-                {% include "rest_framework/docs/link.html" %}{% endfor %}
-            {% endfor %}
-            {% for link_key, link in document.links|items %}
-                {% include "rest_framework/docs/link.html" %}{% endfor %}
-            {% endif %}
+</div>
+{% if document|data %}
+    {% for section_key, section in document|data|items %}
+        {% if section_key %}
+            <h2 id="{{ section_key }}" class="coredocs-section-title">
+                {{ section_key }}
+                <a href="#{{ section_key }}">
+                    <i class="fa fa-link" aria-hidden="true"></i>
+                </a>
+            </h2>
+        {% endif %}
+        {% for link_key, link in section|schema_links|items %}
+            {% include "rest_framework/docs/link.html" %}
+        {% endfor %}
+    {% endfor %}
+    {% for link_key, link in document.links|items %}
+        {% include "rest_framework/docs/link.html" %}
+    {% endfor %}
+{% endif %}
diff --git a/tests/django_rest/docs/link.html b/tests/django_rest/docs/link.html
index e962b94..dabf079 100644
--- a/tests/django_rest/docs/link.html
+++ b/tests/django_rest/docs/link.html
@@ -188,7 +188,8 @@
     </div>
     <div class="col-md-6 code-samples">
         {% for html in lang_htmls %}
-            {% include html %}{% endfor %}
-        </div>
+            {% include html %}
+        {% endfor %}
     </div>
-    {% include "rest_framework/docs/interact.html" with link=link %}
+</div>
+{% include "rest_framework/docs/interact.html" with link=link %}
diff --git a/tests/django_rest/docs/sidebar.html b/tests/django_rest/docs/sidebar.html
index b51bc2e..acc673b 100644
--- a/tests/django_rest/docs/sidebar.html
+++ b/tests/django_rest/docs/sidebar.html
@@ -19,71 +19,74 @@
                             <span class="arrow"></span>
                         </a>
                         <ul class="sub-menu {% if section_key %}collapse{% endif %}" id="{{ section_key }}-dropdown">
-                        {% for link_key, link in section|schema_links|items %}
-                            <li>
-                                <a href="#{{ section_key }}-{{ link_key|slugify }}">
-                                    {{ link.title|default:link_key }}
-                                </a>
-                            </li>
-                        {% endfor %}
-                    </ul>
-                </li>
-            {% endfor %}
-        {% endif %}
-    </ul>
-    <ul class="menu-list menu-list-bottom">
-        <li data-toggle="collapse" data-target="#auth-control" class="collapsed">
-            <a>
-                <i class="fa fa-user fa-lg"></i>
-                Authentication
-            </a>
-            <span id="selected-authentication">
-                {% if user.is_authenticated %}
-                    session
-                {% else %}
-                    none
-                {% endif %}
-            </span>
-        </li>
-        <ul class="sub-menu collapse out" id="auth-control">
-            <li
-                {% if not user.is_authenticated %}class="active"{% endif %}
-                >
-                <a data-auth="none" href="#">none</a>
-            </li>
-            <li>
-                <a data-auth="token" data-toggle="modal" data-target="#auth_token_modal" href="#">
-                    token
-                </a>
-            </li>
-            <li>
-                <a data-auth="basic" data-toggle="modal" data-target="#auth_basic_modal" href="#">
-                    basic
-                </a>
-            </li>
-            <li
-                {% if user.is_authenticated %}class="active"{% endif %}>
-                <a data-auth="session" data-toggle="modal" data-target="#auth_session_modal" href="#">
-                    session
-                </a>
-            </li>
+                            {% for link_key, link in section|schema_links|items %}
+                                <li>
+                                    <a href="#{{ section_key }}-{{ link_key|slugify }}">
+                                        {{ link.title|default:link_key }}
+                                    </a>
+                                </li>
+                            {% endfor %}
+                        </ul>
+                    </li>
+                {% endfor %}
+            {% endif %}
         </ul>
-        <li data-toggle="collapse" data-target="#language-control" class="collapsed">
-            <a>
-                <i class="fa fa-code fa-lg"></i>
-                Source Code
-            </a>
-            <span id="selected-language">{{ langs | first }}</span>
-        </li>
-        <ul class="sub-menu collapse out" id="language-control">
-            {% for lang in langs %}
-                <li{% if loop.first %}class="active"{% endif %}>
-                <a href="#" data-language="{{ lang }}">
-                    {{ lang }}
+        <ul class="menu-list menu-list-bottom">
+            <li data-toggle="collapse" data-target="#auth-control" class="collapsed">
+                <a>
+                    <i class="fa fa-user fa-lg"></i>
+                    Authentication
                 </a>
+                <span id="selected-authentication">
+                    {% if user.is_authenticated %}
+                        session
+                    {% else %}
+                        none
+                    {% endif %}
+                </span>
             </li>
-        {% endfor %}
-    </ul>
-</ul>
-</div>
+            <ul class="sub-menu collapse out" id="auth-control">
+                <li
+                    {% if not user.is_authenticated %}class="active"{% endif %}
+                    >
+                    <a data-auth="none" href="#">none</a>
+                </li>
+                <li>
+                    <a data-auth="token" data-toggle="modal" data-target="#auth_token_modal" href="#">
+                        token
+                    </a>
+                </li>
+                <li>
+                    <a data-auth="basic" data-toggle="modal" data-target="#auth_basic_modal" href="#">
+                        basic
+                    </a>
+                </li>
+                <li
+                    {% if user.is_authenticated %}class="active"{% endif %}
+                    >
+                    <a data-auth="session" data-toggle="modal" data-target="#auth_session_modal" href="#">
+                        session
+                    </a>
+                </li>
+            </ul>
+            <li data-toggle="collapse" data-target="#language-control" class="collapsed">
+                <a>
+                    <i class="fa fa-code fa-lg"></i>
+                    Source Code
+                </a>
+                <span id="selected-language">{{ langs | first }}</span>
+            </li>
+            <ul class="sub-menu collapse out" id="language-control">
+                {% for lang in langs %}
+                    <li
+                        {% if loop.first %}class="active"{% endif %}
+                        >
+                        <a href="#" data-language="{{ lang }}">
+                            {{ lang }}
+                        </a>
+                    </li>
+                {% endfor %}
+            </ul>
+        </ul>
+    </div>
 </div>
diff --git a/tests/django_rest/horizontal/checkbox.html b/tests/django_rest/horizontal/checkbox.html
index a612393..edb4770 100644
--- a/tests/django_rest/horizontal/checkbox.html
+++ b/tests/django_rest/horizontal/checkbox.html
@@ -1,18 +1,18 @@
 <div class="form-group horizontal-checkbox {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
-    {{ field.label }}
-</label>
-{% endif %}
-<div class="col-sm-10">
-<input type="checkbox" name="{{ field.name }}" value="true"
-{% if field.value %}checked{% endif %}
->
-{% if field.errors %}
-    {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-{% endif %}
-{% if field.help_text %}
-    <span class="help-block">{{ field.help_text|safe }}</span>
-{% endif %}
-</div>
+    {% if field.label %}
+        <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <div class="col-sm-10">
+        <input type="checkbox" name="{{ field.name }}" value="true"
+        {% if field.value %}checked{% endif %}
+        >
+        {% if field.errors %}
+            {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+        {% endif %}
+        {% if field.help_text %}
+            <span class="help-block">{{ field.help_text|safe }}</span>
+        {% endif %}
+    </div>
 </div>
diff --git a/tests/django_rest/horizontal/checkbox_multiple.html b/tests/django_rest/horizontal/checkbox_multiple.html
index 84ff98d..1c5eb26 100644
--- a/tests/django_rest/horizontal/checkbox_multiple.html
+++ b/tests/django_rest/horizontal/checkbox_multiple.html
@@ -2,25 +2,13 @@
 <div class="form-group">
     {% if field.label %}
         <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
-        {{ field.label }}
-    </label>
-{% endif %}
-<div class="col-sm-10">
-    {% if style.inline %}
-        {% for key, text in field.choices|items %}
-            <label class="checkbox-inline">
-                <input type="checkbox" name="{{ field.name }}" value="{{ key }}"
-                {% if key|as_string in field.value|as_list_of_strings %}
-                    checked
-                {% endif %}
-                >
-                {{ text }}
-            </label>
-        {% endfor %}
-    {% else %}
-        {% for key, text in field.choices|items %}
-            <div class="checkbox">
-                <label>
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <div class="col-sm-10">
+        {% if style.inline %}
+            {% for key, text in field.choices|items %}
+                <label class="checkbox-inline">
                     <input type="checkbox" name="{{ field.name }}" value="{{ key }}"
                     {% if key|as_string in field.value|as_list_of_strings %}
                         checked
@@ -28,14 +16,26 @@
                     >
                     {{ text }}
                 </label>
-            </div>
-        {% endfor %}
-    {% endif %}
-    {% if field.errors %}
-        {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-    {% endif %}
-    {% if field.help_text %}
-        <span class="help-block">{{ field.help_text|safe }}</span>
-    {% endif %}
-</div>
+            {% endfor %}
+        {% else %}
+            {% for key, text in field.choices|items %}
+                <div class="checkbox">
+                    <label>
+                        <input type="checkbox" name="{{ field.name }}" value="{{ key }}"
+                        {% if key|as_string in field.value|as_list_of_strings %}
+                            checked
+                        {% endif %}
+                        >
+                        {{ text }}
+                    </label>
+                </div>
+            {% endfor %}
+        {% endif %}
+        {% if field.errors %}
+            {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+        {% endif %}
+        {% if field.help_text %}
+            <span class="help-block">{{ field.help_text|safe }}</span>
+        {% endif %}
+    </div>
 </div>
diff --git a/tests/django_rest/horizontal/dict_field.html b/tests/django_rest/horizontal/dict_field.html
index 2a79d8f..437350c 100644
--- a/tests/django_rest/horizontal/dict_field.html
+++ b/tests/django_rest/horizontal/dict_field.html
@@ -1,12 +1,12 @@
 <div class="form-group">
     {% if field.label %}
         <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
-        {{ field.label }}
-    </label>
-{% endif %}
-<div class="col-sm-10">
-    <p class="form-control-static">
-        Dictionaries are not currently supported in HTML input.
-    </p>
-</div>
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <div class="col-sm-10">
+        <p class="form-control-static">
+            Dictionaries are not currently supported in HTML input.
+        </p>
+    </div>
 </div>
diff --git a/tests/django_rest/horizontal/fieldset.html b/tests/django_rest/horizontal/fieldset.html
index f845107..069b5b6 100644
--- a/tests/django_rest/horizontal/fieldset.html
+++ b/tests/django_rest/horizontal/fieldset.html
@@ -4,13 +4,13 @@
         <div class="form-group" style="border-bottom: 1px solid #e5e5e5">
             <legend class="control-label col-sm-2 {% if style.hide_label %}sr-only{% endif %}"
                     style="border-bottom: 0">
-            {{ field.label }}
-        </legend>
-    </div>
-{% endif %}
-{% for nested_field in field %}
-    {% if not nested_field.read_only %}
-        {% render_field nested_field style=style %}
+                {{ field.label }}
+            </legend>
+        </div>
     {% endif %}
-{% endfor %}
+    {% for nested_field in field %}
+        {% if not nested_field.read_only %}
+            {% render_field nested_field style=style %}
+        {% endif %}
+    {% endfor %}
 </fieldset>
diff --git a/tests/django_rest/horizontal/input.html b/tests/django_rest/horizontal/input.html
index c5f0185..eb5d5bf 100644
--- a/tests/django_rest/horizontal/input.html
+++ b/tests/django_rest/horizontal/input.html
@@ -1,21 +1,21 @@
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
-    {{ field.label }}
-</label>
-{% endif %}
-<div class="col-sm-10">
-<input name="{{ field.name }}"
-{% if style.input_type != "file" %}class="form-control"{% endif %}
-type="{{ style.input_type }}"
-{% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
-{% if field.value is not None %}value="{{ field.value }}"{% endif %}
-{% if style.autofocus and style.input_type != "hidden" %}autofocus{% endif %}>
-{% if field.errors %}
-    {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-{% endif %}
-{% if field.help_text %}
-    <span class="help-block">{{ field.help_text|safe }}</span>
-{% endif %}
-</div>
+    {% if field.label %}
+        <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <div class="col-sm-10">
+        <input name="{{ field.name }}"
+        {% if style.input_type != "file" %}class="form-control"{% endif %}
+        type="{{ style.input_type }}"
+        {% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
+        {% if field.value is not None %}value="{{ field.value }}"{% endif %}
+        {% if style.autofocus and style.input_type != "hidden" %}autofocus{% endif %}>
+        {% if field.errors %}
+            {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+        {% endif %}
+        {% if field.help_text %}
+            <span class="help-block">{{ field.help_text|safe }}</span>
+        {% endif %}
+    </div>
 </div>
diff --git a/tests/django_rest/horizontal/list_field.html b/tests/django_rest/horizontal/list_field.html
index a2e8c7b..f49a5cf 100644
--- a/tests/django_rest/horizontal/list_field.html
+++ b/tests/django_rest/horizontal/list_field.html
@@ -1,12 +1,12 @@
 <div class="form-group">
     {% if field.label %}
         <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
-        {{ field.label }}
-    </label>
-{% endif %}
-<div class="col-sm-10">
-    <p class="form-control-static">
-        Lists are not currently supported in HTML input.
-    </p>
-</div>
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <div class="col-sm-10">
+        <p class="form-control-static">
+            Lists are not currently supported in HTML input.
+        </p>
+    </div>
 </div>
diff --git a/tests/django_rest/horizontal/list_fieldset.html b/tests/django_rest/horizontal/list_fieldset.html
index b4b8806..9ffbb5a 100644
--- a/tests/django_rest/horizontal/list_fieldset.html
+++ b/tests/django_rest/horizontal/list_fieldset.html
@@ -4,11 +4,11 @@
         <div class="form-group" style="border-bottom: 1px solid #e5e5e5">
             <legend class="control-label col-sm-2 {% if style.hide_label %}sr-only{% endif %}"
                     style="border-bottom: 0">
-            {{ field.label }}
-        </legend>
-    </div>
-{% endif %}
-<p>
-    Lists are not currently supported in HTML input.
-</p>
+                {{ field.label }}
+            </legend>
+        </div>
+    {% endif %}
+    <p>
+        Lists are not currently supported in HTML input.
+    </p>
 </fieldset>
diff --git a/tests/django_rest/horizontal/radio.html b/tests/django_rest/horizontal/radio.html
index 614926d..5b2b1a3 100644
--- a/tests/django_rest/horizontal/radio.html
+++ b/tests/django_rest/horizontal/radio.html
@@ -4,57 +4,57 @@
 <div class="form-group">
     {% if field.label %}
         <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
-        {{ field.label }}
-    </label>
-{% endif %}
-<div class="col-sm-10">
-    {% if style.inline %}
-        {% if field.allow_null or field.allow_blank %}
-            <label class="radio-inline">
-                <input type="radio" name="{{ field.name }}" value=""
-                {% if not field.value %}checked{% endif %}
-                />
-                {{ none_choice }}
-            </label>
-        {% endif %}
-        {% for key, text in field.choices|items %}
-            <label class="radio-inline">
-                <input type="radio" name="{{ field.name }}" value="{{ key }}"
-                {% if key|as_string == field.value|as_string %}
-                    checked
-                {% endif %}
-                />
-                {{ text }}
-            </label>
-        {% endfor %}
-    {% else %}
-        {% if field.allow_null or field.allow_blank %}
-            <div class="radio">
-                <label>
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <div class="col-sm-10">
+        {% if style.inline %}
+            {% if field.allow_null or field.allow_blank %}
+                <label class="radio-inline">
                     <input type="radio" name="{{ field.name }}" value=""
                     {% if not field.value %}checked{% endif %}
                     />
                     {{ none_choice }}
                 </label>
-            </div>
-        {% endif %}
-        {% for key, text in field.choices|items %}
-            <div class="radio">
-                <label>
+            {% endif %}
+            {% for key, text in field.choices|items %}
+                <label class="radio-inline">
                     <input type="radio" name="{{ field.name }}" value="{{ key }}"
                     {% if key|as_string == field.value|as_string %}
-                        checked{% endif %}
+                        checked
+                    {% endif %}
+                    />
+                    {{ text }}
+                </label>
+            {% endfor %}
+        {% else %}
+            {% if field.allow_null or field.allow_blank %}
+                <div class="radio">
+                    <label>
+                        <input type="radio" name="{{ field.name }}" value=""
+                        {% if not field.value %}checked{% endif %}
                         />
-                        {{ text }}
+                        {{ none_choice }}
                     </label>
                 </div>
-            {% endfor %}
-        {% endif %}
-        {% if field.errors %}
-            {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-        {% endif %}
-        {% if field.help_text %}
-            <span class="help-block">{{ field.help_text|safe }}</span>
-        {% endif %}
+            {% endif %}
+            {% for key, text in field.choices|items %}
+                <div class="radio">
+                    <label>
+                        <input type="radio" name="{{ field.name }}" value="{{ key }}"
+                        {% if key|as_string == field.value|as_string %}
+                            checked{% endif %}
+                            />
+                            {{ text }}
+                        </label>
+                    </div>
+                {% endfor %}
+            {% endif %}
+            {% if field.errors %}
+                {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+            {% endif %}
+            {% if field.help_text %}
+                <span class="help-block">{{ field.help_text|safe }}</span>
+            {% endif %}
+        </div>
     </div>
-</div>
diff --git a/tests/django_rest/horizontal/select.html b/tests/django_rest/horizontal/select.html
index 35ca394..30a7615 100644
--- a/tests/django_rest/horizontal/select.html
+++ b/tests/django_rest/horizontal/select.html
@@ -2,40 +2,40 @@
 <div class="form-group">
     {% if field.label %}
         <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
-        {{ field.label }}
-    </label>
-{% endif %}
-<div class="col-sm-10">
-    <select class="form-control" name="{{ field.name }}">
-        {% if field.allow_null or field.allow_blank %}
-            <option value=""
-                {% if not field.value %}selected{% endif %}
-                >
-                --------
-            </option>
-        {% endif %}
-        {% for select in field.iter_options %}
-            {% if select.start_option_group %}
-                <optgroup label="{{ select.label }}">
-                {% elif select.end_option_group %}
-                </optgroup>
-            {% else %}
-                <option value="{{ select.value }}"
-                    {% if select.value|as_string == field.value|as_string %}
-                        selected
-                    {% endif %}
-                    {% if select.disabled %}disabled{% endif %}
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <div class="col-sm-10">
+        <select class="form-control" name="{{ field.name }}">
+            {% if field.allow_null or field.allow_blank %}
+                <option value=""
+                    {% if not field.value %}selected{% endif %}
                     >
-                    {{ select.display_text }}
+                    --------
                 </option>
             {% endif %}
-        {% endfor %}
-    </select>
-    {% if field.errors %}
-        {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-    {% endif %}
-    {% if field.help_text %}
-        <span class="help-block">{{ field.help_text|safe }}</span>
-    {% endif %}
-</div>
+            {% for select in field.iter_options %}
+                {% if select.start_option_group %}
+                    <optgroup label="{{ select.label }}">
+                    {% elif select.end_option_group %}
+                    </optgroup>
+                {% else %}
+                    <option value="{{ select.value }}"
+                        {% if select.value|as_string == field.value|as_string %}
+                            selected
+                        {% endif %}
+                        {% if select.disabled %}disabled{% endif %}
+                        >
+                        {{ select.display_text }}
+                    </option>
+                {% endif %}
+            {% endfor %}
+        </select>
+        {% if field.errors %}
+            {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+        {% endif %}
+        {% if field.help_text %}
+            <span class="help-block">{{ field.help_text|safe }}</span>
+        {% endif %}
+    </div>
 </div>
diff --git a/tests/django_rest/horizontal/select_multiple.html b/tests/django_rest/horizontal/select_multiple.html
index 58bd017..441f910 100644
--- a/tests/django_rest/horizontal/select_multiple.html
+++ b/tests/django_rest/horizontal/select_multiple.html
@@ -4,37 +4,37 @@
 <div class="form-group">
     {% if field.label %}
         <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
-        {{ field.label }}
-    </label>
-{% endif %}
-<div class="col-sm-10">
-    <select multiple {{ field.choices|yesno:",disabled" }} class="form-control" name="{{ field.name }}">
-        {% for select in field.iter_options %}
-            {% if select.start_option_group %}
-                <optgroup label="{{ select.label }}">
-                {% elif select.end_option_group %}
-                </optgroup>
-            {% else %}
-                <option value="{{ select.value }}"
-                    {% if select.value|as_string in field.value|as_list_of_strings %}
-                        selected
-                    {% endif %}
-                    {% if select.disabled %}disabled{% endif %}
-                    >
-                    {{ select.display_text }}
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <div class="col-sm-10">
+        <select multiple {{ field.choices|yesno:",disabled" }} class="form-control" name="{{ field.name }}">
+            {% for select in field.iter_options %}
+                {% if select.start_option_group %}
+                    <optgroup label="{{ select.label }}">
+                    {% elif select.end_option_group %}
+                    </optgroup>
+                {% else %}
+                    <option value="{{ select.value }}"
+                        {% if select.value|as_string in field.value|as_list_of_strings %}
+                            selected
+                        {% endif %}
+                        {% if select.disabled %}disabled{% endif %}
+                        >
+                        {{ select.display_text }}
+                    </option>
+                {% endif %}
+                {% empty %}
+                <option>
+                    {{ no_items }}
                 </option>
-            {% endif %}
-            {% empty %}
-            <option>
-                {{ no_items }}
-            </option>
-        {% endfor %}
-    </select>
-    {% if field.errors %}
-        {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-    {% endif %}
-    {% if field.help_text %}
-        <span class="help-block">{{ field.help_text|safe }}</span>
-    {% endif %}
-</div>
+            {% endfor %}
+        </select>
+        {% if field.errors %}
+            {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+        {% endif %}
+        {% if field.help_text %}
+            <span class="help-block">{{ field.help_text|safe }}</span>
+        {% endif %}
+    </div>
 </div>
diff --git a/tests/django_rest/horizontal/textarea.html b/tests/django_rest/horizontal/textarea.html
index ec56c49..6fa3d8d 100644
--- a/tests/django_rest/horizontal/textarea.html
+++ b/tests/django_rest/horizontal/textarea.html
@@ -1,21 +1,21 @@
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
-    {{ field.label }}
-</label>
-{% endif %}
-<div class="col-sm-10">
-<textarea name="{{ field.name }}" class="form-control"
-{% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
-{% if style.rows %}rows="{{ style.rows }}"{% endif %}
->
-{% if field.value %}{{ field.value }}{% endif %}
-</textarea>
-{% if field.errors %}
-    {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-{% endif %}
-{% if field.help_text %}
-    <span class="help-block">{{ field.help_text|safe }}</span>
-{% endif %}
-</div>
+    {% if field.label %}
+        <label class="col-sm-2 control-label {% if style.hide_label %}sr-only{% endif %}">
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <div class="col-sm-10">
+        <textarea name="{{ field.name }}" class="form-control"
+            {% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
+            {% if style.rows %}rows="{{ style.rows }}"{% endif %}
+            >
+            {% if field.value %}{{ field.value }}{% endif %}
+        </textarea>
+        {% if field.errors %}
+            {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+        {% endif %}
+        {% if field.help_text %}
+            <span class="help-block">{{ field.help_text|safe }}</span>
+        {% endif %}
+    </div>
 </div>
diff --git a/tests/django_rest/inline/checkbox.html b/tests/django_rest/inline/checkbox.html
index 5bd809f..af7505e 100644
--- a/tests/django_rest/inline/checkbox.html
+++ b/tests/django_rest/inline/checkbox.html
@@ -1,10 +1,10 @@
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-<div class="checkbox">
-    <label>
-        <input type="checkbox" name="{{ field.name }}" value="true"
-        {% if field.value %}checked{% endif %}
-        >
-        {% if field.label %}{{ field.label }}{% endif %}
-    </label>
-</div>
+    <div class="checkbox">
+        <label>
+            <input type="checkbox" name="{{ field.name }}" value="true"
+            {% if field.value %}checked{% endif %}
+            >
+            {% if field.label %}{{ field.label }}{% endif %}
+        </label>
+    </div>
 </div>
diff --git a/tests/django_rest/inline/checkbox_multiple.html b/tests/django_rest/inline/checkbox_multiple.html
index 4e4bcef..b0be227 100644
--- a/tests/django_rest/inline/checkbox_multiple.html
+++ b/tests/django_rest/inline/checkbox_multiple.html
@@ -1,20 +1,16 @@
 {% load rest_framework %}
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label class="sr-only">
-        {{ field.label }}
-    </label>
-{% endif %}
-{% for key, text in field.choices|items %}
-    <div class="checkbox">
-        <label>
-            <input type="checkbox" name="{{ field.name }}" value="{{ key }}"
-            {% if key|as_string in field.value|as_list_of_strings %}
-                checked
-            {% endif %}
-            >
-            {{ text }}
-        </label>
-    </div>
-{% endfor %}
+    {% if field.label %}<label class="sr-only">{{ field.label }}</label>{% endif %}
+    {% for key, text in field.choices|items %}
+        <div class="checkbox">
+            <label>
+                <input type="checkbox" name="{{ field.name }}" value="{{ key }}"
+                {% if key|as_string in field.value|as_list_of_strings %}
+                    checked
+                {% endif %}
+                >
+                {{ text }}
+            </label>
+        </div>
+    {% endfor %}
 </div>
diff --git a/tests/django_rest/inline/dict_field.html b/tests/django_rest/inline/dict_field.html
index a9dd2b1..4531b0f 100644
--- a/tests/django_rest/inline/dict_field.html
+++ b/tests/django_rest/inline/dict_field.html
@@ -1,9 +1,5 @@
 <div class="form-group">
-    {% if field.label %}
-        <label class="sr-only">
-            {{ field.label }}
-        </label>
-    {% endif %}
+    {% if field.label %}<label class="sr-only">{{ field.label }}</label>{% endif %}
     <p class="form-control-static">
         Dictionaries are not currently supported in HTML input.
     </p>
diff --git a/tests/django_rest/inline/input.html b/tests/django_rest/inline/input.html
index 1068bc9..46ad6e6 100644
--- a/tests/django_rest/inline/input.html
+++ b/tests/django_rest/inline/input.html
@@ -1,16 +1,12 @@
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label class="sr-only">
-        {{ field.label }}
-    </label>
-{% endif %}
-<input name="{{ field.name }}"
-{% if style.input_type != "file" %}class="form-control"{% endif %}
-type="{{ style.input_type }}"
-{% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
-{% if field.value is not None %}value="{{ field.value }}"{% endif %}
-{% if style.autofocus and style.input_type != "hidden" %}
-    autofocus
-{% endif %}
->
+    {% if field.label %}<label class="sr-only">{{ field.label }}</label>{% endif %}
+    <input name="{{ field.name }}"
+    {% if style.input_type != "file" %}class="form-control"{% endif %}
+    type="{{ style.input_type }}"
+    {% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
+    {% if field.value is not None %}value="{{ field.value }}"{% endif %}
+    {% if style.autofocus and style.input_type != "hidden" %}
+        autofocus
+    {% endif %}
+    >
 </div>
diff --git a/tests/django_rest/inline/list_field.html b/tests/django_rest/inline/list_field.html
index 9cdb6b5..584c2e5 100644
--- a/tests/django_rest/inline/list_field.html
+++ b/tests/django_rest/inline/list_field.html
@@ -1,9 +1,5 @@
 <div class="form-group">
-    {% if field.label %}
-        <label class="sr-only">
-            {{ field.label }}
-        </label>
-    {% endif %}
+    {% if field.label %}<label class="sr-only">{{ field.label }}</label>{% endif %}
     <p class="form-control-static">
         Lists are not currently supported in HTML input.
     </p>
diff --git a/tests/django_rest/inline/radio.html b/tests/django_rest/inline/radio.html
index 97718d5..d712257 100644
--- a/tests/django_rest/inline/radio.html
+++ b/tests/django_rest/inline/radio.html
@@ -2,31 +2,27 @@
 {% load rest_framework %}
 {% trans "None" as none_choice %}
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label class="sr-only">
-        {{ field.label }}
-    </label>
-{% endif %}
-{% if field.allow_null or field.allow_blank %}
-    <div class="radio">
-        <label>
-            <input type="radio" name="{{ field.name }}" value=""
-            {% if not field.value %}checked{% endif %}
-            >
-            {{ none_choice }}
-        </label>
-    </div>
-{% endif %}
-{% for key, text in field.choices|items %}
-    <div class="radio">
-        <label>
-            <input type="radio" name="{{ field.name }}" value="{{ key }}"
-            {% if key|as_string == field.value|as_string %}
-                checked
-            {% endif %}
-            >
-            {{ text }}
-        </label>
-    </div>
-{% endfor %}
+    {% if field.label %}<label class="sr-only">{{ field.label }}</label>{% endif %}
+    {% if field.allow_null or field.allow_blank %}
+        <div class="radio">
+            <label>
+                <input type="radio" name="{{ field.name }}" value=""
+                {% if not field.value %}checked{% endif %}
+                >
+                {{ none_choice }}
+            </label>
+        </div>
+    {% endif %}
+    {% for key, text in field.choices|items %}
+        <div class="radio">
+            <label>
+                <input type="radio" name="{{ field.name }}" value="{{ key }}"
+                {% if key|as_string == field.value|as_string %}
+                    checked
+                {% endif %}
+                >
+                {{ text }}
+            </label>
+        </div>
+    {% endfor %}
 </div>
diff --git a/tests/django_rest/inline/select.html b/tests/django_rest/inline/select.html
index 2b42ae8..543a6c1 100644
--- a/tests/django_rest/inline/select.html
+++ b/tests/django_rest/inline/select.html
@@ -1,33 +1,29 @@
 {% load rest_framework %}
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label class="sr-only">
-        {{ field.label }}
-    </label>
-{% endif %}
-<select class="form-control" name="{{ field.name }}">
-    {% if field.allow_null or field.allow_blank %}
-        <option value=""
-            {% if not field.value %}selected{% endif %}
-            >
-            --------
-        </option>
-    {% endif %}
-    {% for select in field.iter_options %}
-        {% if select.start_option_group %}
-            <optgroup label="{{ select.label }}">
-            {% elif select.end_option_group %}
-            </optgroup>
-        {% else %}
-            <option value="{{ select.value }}"
-                {% if select.value|as_string == field.value|as_string %}
-                    selected
-                {% endif %}
-                {% if select.disabled %}disabled{% endif %}
+    {% if field.label %}<label class="sr-only">{{ field.label }}</label>{% endif %}
+    <select class="form-control" name="{{ field.name }}">
+        {% if field.allow_null or field.allow_blank %}
+            <option value=""
+                {% if not field.value %}selected{% endif %}
                 >
-                {{ select.display_text }}
+                --------
             </option>
         {% endif %}
-    {% endfor %}
-</select>
+        {% for select in field.iter_options %}
+            {% if select.start_option_group %}
+                <optgroup label="{{ select.label }}">
+                {% elif select.end_option_group %}
+                </optgroup>
+            {% else %}
+                <option value="{{ select.value }}"
+                    {% if select.value|as_string == field.value|as_string %}
+                        selected
+                    {% endif %}
+                    {% if select.disabled %}disabled{% endif %}
+                    >
+                    {{ select.display_text }}
+                </option>
+            {% endif %}
+        {% endfor %}
+    </select>
 </div>
diff --git a/tests/django_rest/inline/select_multiple.html b/tests/django_rest/inline/select_multiple.html
index 62bd975..e357345 100644
--- a/tests/django_rest/inline/select_multiple.html
+++ b/tests/django_rest/inline/select_multiple.html
@@ -2,31 +2,27 @@
 {% load rest_framework %}
 {% trans "No items to select." as no_items %}
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label class="sr-only">
-        {{ field.label }}
-    </label>
-{% endif %}
-<select multiple {{ field.choices|yesno:",disabled" }} class="form-control" name="{{ field.name }}">
-    {% for select in field.iter_options %}
-        {% if select.start_option_group %}
-            <optgroup label="{{ select.label }}">
-            {% elif select.end_option_group %}
-            </optgroup>
-        {% else %}
-            <option value="{{ select.value }}"
-                {% if select.value|as_string in field.value|as_list_of_strings %}
-                    selected
-                {% endif %}
-                {% if select.disabled %}disabled{% endif %}
-                >
-                {{ select.display_text }}
+    {% if field.label %}<label class="sr-only">{{ field.label }}</label>{% endif %}
+    <select multiple {{ field.choices|yesno:",disabled" }} class="form-control" name="{{ field.name }}">
+        {% for select in field.iter_options %}
+            {% if select.start_option_group %}
+                <optgroup label="{{ select.label }}">
+                {% elif select.end_option_group %}
+                </optgroup>
+            {% else %}
+                <option value="{{ select.value }}"
+                    {% if select.value|as_string in field.value|as_list_of_strings %}
+                        selected
+                    {% endif %}
+                    {% if select.disabled %}disabled{% endif %}
+                    >
+                    {{ select.display_text }}
+                </option>
+            {% endif %}
+            {% empty %}
+            <option>
+                {{ no_items }}
             </option>
-        {% endif %}
-        {% empty %}
-        <option>
-            {{ no_items }}
-        </option>
-    {% endfor %}
-</select>
+        {% endfor %}
+    </select>
 </div>
diff --git a/tests/django_rest/inline/textarea.html b/tests/django_rest/inline/textarea.html
index c491b26..5fe1286 100644
--- a/tests/django_rest/inline/textarea.html
+++ b/tests/django_rest/inline/textarea.html
@@ -1,11 +1,7 @@
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label class="sr-only">
-        {{ field.label }}
-    </label>
-{% endif %}
-<input name="{{ field.name }}" type="text" class="form-control"
-{% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
-{% if field.value %}value="{{ field.value }}"{% endif %}
->
+    {% if field.label %}<label class="sr-only">{{ field.label }}</label>{% endif %}
+    <input name="{{ field.name }}" type="text" class="form-control"
+    {% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
+    {% if field.value %}value="{{ field.value }}"{% endif %}
+    >
 </div>
diff --git a/tests/django_rest/login_base.html b/tests/django_rest/login_base.html
index f47f089..4844e95 100644
--- a/tests/django_rest/login_base.html
+++ b/tests/django_rest/login_base.html
@@ -20,64 +20,60 @@
                                 <input type="hidden" name="next" value="{{ next }}" />
                                 <div id="div_id_username"
                                      class="clearfix control-group {% if form.username.errors %}error{% endif %}">
-                                <div class="form-group">
-                                    <label for="id_username">
-                                        {{ form.username.label }}:
-                                    </label>
-                                    <input type="text" name="username" maxlength="100" autocapitalize="off" autocorrect="off" class="form-control textinput textInput" id="id_username" required autofocus
-                                    {% if form.username.value %}value="{{ form.username.value }}"{% endif %}
-                                    >
-                                    {% if form.username.errors %}
-                                        <p class="text-error">
-                                            {{ form.username.errors|striptags }}
-                                        </p>
-                                    {% endif %}
+                                    <div class="form-group">
+                                        <label for="id_username">{{ form.username.label }}:</label>
+                                        <input type="text" name="username" maxlength="100" autocapitalize="off" autocorrect="off" class="form-control textinput textInput" id="id_username" required autofocus
+                                        {% if form.username.value %}value="{{ form.username.value }}"{% endif %}
+                                        >
+                                        {% if form.username.errors %}
+                                            <p class="text-error">
+                                                {{ form.username.errors|striptags }}
+                                            </p>
+                                        {% endif %}
+                                    </div>
                                 </div>
-                            </div>
-                            <div id="div_id_password"
-                                 class="clearfix control-group {% if form.password.errors %}error{% endif %}">
-                            <div class="form-group">
-                                <label for="id_password">
-                                    {{ form.password.label }}:
-                                </label>
-                                <input type="password"
-                                       name="password"
-                                       maxlength="100"
-                                       autocapitalize="off"
-                                       autocorrect="off"
-                                       class="form-control textinput textInput"
-                                       id="id_password"
-                                       required>
-                                {% if form.password.errors %}
-                                    <p class="text-error">
-                                        {{ form.password.errors|striptags }}
-                                    </p>
+                                <div id="div_id_password"
+                                     class="clearfix control-group {% if form.password.errors %}error{% endif %}">
+                                    <div class="form-group">
+                                        <label for="id_password">{{ form.password.label }}:</label>
+                                        <input type="password"
+                                               name="password"
+                                               maxlength="100"
+                                               autocapitalize="off"
+                                               autocorrect="off"
+                                               class="form-control textinput textInput"
+                                               id="id_password"
+                                               required>
+                                        {% if form.password.errors %}
+                                            <p class="text-error">
+                                                {{ form.password.errors|striptags }}
+                                            </p>
+                                        {% endif %}
+                                    </div>
+                                </div>
+                                {% if form.non_field_errors %}
+                                    {% for error in form.non_field_errors %}
+                                        <div class="well well-small text-error" style="border: none">
+                                            {{ error }}
+                                        </div>
+                                    {% endfor %}
                                 {% endif %}
-                            </div>
-                        </div>
-                        {% if form.non_field_errors %}
-                            {% for error in form.non_field_errors %}
-                                <div class="well well-small text-error" style="border: none">
-                                    {{ error }}
+                                <div class="form-actions-no-box">
+                                    <input type="submit"
+                                           name="submit"
+                                           value="Log in"
+                                           class="btn btn-primary form-control"
+                                           id="submit-id-submit">
                                 </div>
-                            {% endfor %}
-                        {% endif %}
-                        <div class="form-actions-no-box">
-                            <input type="submit"
-                                   name="submit"
-                                   value="Log in"
-                                   class="btn btn-primary form-control"
-                                   id="submit-id-submit">
+                            </form>
                         </div>
-                    </form>
+                    </div>
+                    <!-- /.row-fluid -->
                 </div>
+                <!--/.well-->
             </div>
             <!-- /.row-fluid -->
         </div>
-        <!--/.well-->
-    </div>
-    <!-- /.row-fluid -->
-</div>
-<!-- /.container-fluid -->
-</body>
+        <!-- /.container-fluid -->
+    </body>
 {% endblock %}
diff --git a/tests/django_rest/vertical/checkbox.html b/tests/django_rest/vertical/checkbox.html
index d0f9f67..4e70b14 100644
--- a/tests/django_rest/vertical/checkbox.html
+++ b/tests/django_rest/vertical/checkbox.html
@@ -1,16 +1,16 @@
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-<div class="checkbox">
-    <label>
-        <input type="checkbox" name="{{ field.name }}" value="true"
-        {% if field.value %}checked{% endif %}
-        >
-        {% if field.label %}{{ field.label }}{% endif %}
-    </label>
-</div>
-{% if field.errors %}
-    {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-{% endif %}
-{% if field.help_text %}
-    <span class="help-block">{{ field.help_text|safe }}</span>
-{% endif %}
+    <div class="checkbox">
+        <label>
+            <input type="checkbox" name="{{ field.name }}" value="true"
+            {% if field.value %}checked{% endif %}
+            >
+            {% if field.label %}{{ field.label }}{% endif %}
+        </label>
+    </div>
+    {% if field.errors %}
+        {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+    {% endif %}
+    {% if field.help_text %}
+        <span class="help-block">{{ field.help_text|safe }}</span>
+    {% endif %}
 </div>
diff --git a/tests/django_rest/vertical/checkbox_multiple.html b/tests/django_rest/vertical/checkbox_multiple.html
index 127a14b..107e957 100644
--- a/tests/django_rest/vertical/checkbox_multiple.html
+++ b/tests/django_rest/vertical/checkbox_multiple.html
@@ -1,43 +1,43 @@
 {% load rest_framework %}
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label
-        {% if style.hide_label %}class="sr-only"{% endif %}
-        >
-        {{ field.label }}
-    </label>
-{% endif %}
-{% if style.inline %}
-    <div>
-        {% for key, text in field.choices|items %}
-            <label class="checkbox-inline">
-                <input type="checkbox" name="{{ field.name }}" value="{{ key }}"
-                {% if key|as_string in field.value|as_list_of_strings %}
-                    checked
-                {% endif %}
-                >
-                {{ text }}
-            </label>
-        {% endfor %}
-    </div>
-{% else %}
-    {% for key, text in field.choices|items %}
-        <div class="checkbox">
-            <label>
-                <input type="checkbox" name="{{ field.name }}" value="{{ key }}"
-                {% if key|as_string in field.value|as_list_of_strings %}
-                    checked
-                {% endif %}
-                >
-                {{ text }}
-            </label>
+    {% if field.label %}
+        <label
+            {% if style.hide_label %}class="sr-only"{% endif %}
+            >
+            {{ field.label }}
+        </label>
+    {% endif %}
+    {% if style.inline %}
+        <div>
+            {% for key, text in field.choices|items %}
+                <label class="checkbox-inline">
+                    <input type="checkbox" name="{{ field.name }}" value="{{ key }}"
+                    {% if key|as_string in field.value|as_list_of_strings %}
+                        checked
+                    {% endif %}
+                    >
+                    {{ text }}
+                </label>
+            {% endfor %}
         </div>
-    {% endfor %}
-{% endif %}
-{% if field.errors %}
-    {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-{% endif %}
-{% if field.help_text %}
-    <span class="help-block">{{ field.help_text|safe }}</span>
-{% endif %}
+    {% else %}
+        {% for key, text in field.choices|items %}
+            <div class="checkbox">
+                <label>
+                    <input type="checkbox" name="{{ field.name }}" value="{{ key }}"
+                    {% if key|as_string in field.value|as_list_of_strings %}
+                        checked
+                    {% endif %}
+                    >
+                    {{ text }}
+                </label>
+            </div>
+        {% endfor %}
+    {% endif %}
+    {% if field.errors %}
+        {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+    {% endif %}
+    {% if field.help_text %}
+        <span class="help-block">{{ field.help_text|safe }}</span>
+    {% endif %}
 </div>
diff --git a/tests/django_rest/vertical/input.html b/tests/django_rest/vertical/input.html
index 39c50f3..9e9b2ba 100644
--- a/tests/django_rest/vertical/input.html
+++ b/tests/django_rest/vertical/input.html
@@ -1,21 +1,21 @@
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label
-        {% if style.hide_label %}class="sr-only"{% endif %}
-        >
-        {{ field.label }}
-    </label>
-{% endif %}
-<input name="{{ field.name }}"
-{% if style.input_type != "file" %}class="form-control"{% endif %}
-type="{{ style.input_type }}"
-{% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
-{% if field.value is not None %}value="{{ field.value }}"{% endif %}
-{% if style.autofocus and style.input_type != "hidden" %}autofocus{% endif %}>
-{% if field.errors %}
-    {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-{% endif %}
-{% if field.help_text %}
-    <span class="help-block">{{ field.help_text|safe }}</span>
-{% endif %}
+    {% if field.label %}
+        <label
+            {% if style.hide_label %}class="sr-only"{% endif %}
+            >
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <input name="{{ field.name }}"
+    {% if style.input_type != "file" %}class="form-control"{% endif %}
+    type="{{ style.input_type }}"
+    {% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
+    {% if field.value is not None %}value="{{ field.value }}"{% endif %}
+    {% if style.autofocus and style.input_type != "hidden" %}autofocus{% endif %}>
+    {% if field.errors %}
+        {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+    {% endif %}
+    {% if field.help_text %}
+        <span class="help-block">{{ field.help_text|safe }}</span>
+    {% endif %}
 </div>
diff --git a/tests/django_rest/vertical/radio.html b/tests/django_rest/vertical/radio.html
index 045a6f5..09355af 100644
--- a/tests/django_rest/vertical/radio.html
+++ b/tests/django_rest/vertical/radio.html
@@ -2,61 +2,58 @@
 {% load rest_framework %}
 {% trans "None" as none_choice %}
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label
-        {% if style.hide_label %}class="sr-only"{% endif %}
-        >
-        {{ field.label }}
-    </label>
-{% endif %}
-{% if style.inline %}
-    <div>
+    {% if field.label %}
+        <label
+            {% if style.hide_label %}class="sr-only"{% endif %}
+            >
+            {{ field.label }}
+        </label>
+    {% endif %}
+    {% if style.inline %}
+        <div>
+            {% if field.allow_null or field.allow_blank %}
+                <label class="radio-inline">
+                    <input type="radio" name="{{ field.name }}" value=""
+                    {% if not field.value %}checked{% endif %}
+                    />
+                    {{ none_choice }}
+                </label>
+            {% endif %}
+            {% for key, text in field.choices|items %}
+                <label class="radio-inline">
+                    <input type="radio" name="{{ field.name }}" value="{{ key }}"
+                    {% if key|as_string == field.value|as_string %}
+                        checked
+                    {% endif %}
+                    >
+                    {{ text }}
+                </label>
+            {% endfor %}
+        </div>
+    {% else %}
         {% if field.allow_null or field.allow_blank %}
-            <label class="radio-inline">
-                <input type="radio" name="{{ field.name }}" value=""
-                {% if not field.value %}checked{% endif %}
-                />
-                {{ none_choice }}
-            </label>
+            <div class="radio">
+                <label>
+                    <input type="radio" name="{{ field.name }}" value=""
+                    {% if not field.value %}checked{% endif %}
+                    />
+                    {{ none_choice }}
+                </label>
+            </div>
         {% endif %}
         {% for key, text in field.choices|items %}
-            <label class="radio-inline">
-                <input type="radio" name="{{ field.name }}" value="{{ key }}"
-                {% if key|as_string == field.value|as_string %}
-                    checked
-                {% endif %}
-                >
-                {{ text }}
-            </label>
+            <div class="radio">
+                <label>
+                    <input type="radio" name="{{ field.name }}" value="{{ key }}" checked>
+                    {{ text }}
+                </label>
+            </div>
         {% endfor %}
-    </div>
-{% else %}
-    {% if field.allow_null or field.allow_blank %}
-        <div class="radio">
-            <label>
-                <input type="radio" name="{{ field.name }}" value=""
-                {% if not field.value %}checked{% endif %}
-                />
-                {{ none_choice }}
-            </label>
-        </div>
     {% endif %}
-    {% for key, text in field.choices|items %}
-        <div class="radio">
-            <label>
-                <input type="radio"
-                       name="{{ field.name }}"
-                       value="{{ key }}"
-                       checked>
-                {{ text }}
-            </label>
-        </div>
-    {% endfor %}
-{% endif %}
-{% if field.errors %}
-    {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-{% endif %}
-{% if field.help_text %}
-    <span class="help-block">{{ field.help_text|safe }}</span>
-{% endif %}
+    {% if field.errors %}
+        {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+    {% endif %}
+    {% if field.help_text %}
+        <span class="help-block">{{ field.help_text|safe }}</span>
+    {% endif %}
 </div>
diff --git a/tests/django_rest/vertical/select.html b/tests/django_rest/vertical/select.html
index 80cccb5..99e3883 100644
--- a/tests/django_rest/vertical/select.html
+++ b/tests/django_rest/vertical/select.html
@@ -1,41 +1,41 @@
 {% load rest_framework %}
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label
-        {% if style.hide_label %}class="sr-only"{% endif %}
-        >
-        {{ field.label }}
-    </label>
-{% endif %}
-<select class="form-control" name="{{ field.name }}">
-    {% if field.allow_null or field.allow_blank %}
-        <option value=""
-            {% if not field.value %}selected{% endif %}
+    {% if field.label %}
+        <label
+            {% if style.hide_label %}class="sr-only"{% endif %}
             >
-            --------
-        </option>
+            {{ field.label }}
+        </label>
     {% endif %}
-    {% for select in field.iter_options %}
-        {% if select.start_option_group %}
-            <optgroup label="{{ select.label }}">
-            {% elif select.end_option_group %}
-            </optgroup>
-        {% else %}
-            <option value="{{ select.value }}"
-                {% if select.value|as_string == field.value|as_string %}
-                    selected
-                {% endif %}
-                {% if select.disabled %}disabled{% endif %}
+    <select class="form-control" name="{{ field.name }}">
+        {% if field.allow_null or field.allow_blank %}
+            <option value=""
+                {% if not field.value %}selected{% endif %}
                 >
-                {{ select.display_text }}
+                --------
             </option>
         {% endif %}
-    {% endfor %}
-</select>
-{% if field.errors %}
-    {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-{% endif %}
-{% if field.help_text %}
-    <span class="help-block">{{ field.help_text|safe }}</span>
-{% endif %}
+        {% for select in field.iter_options %}
+            {% if select.start_option_group %}
+                <optgroup label="{{ select.label }}">
+                {% elif select.end_option_group %}
+                </optgroup>
+            {% else %}
+                <option value="{{ select.value }}"
+                    {% if select.value|as_string == field.value|as_string %}
+                        selected
+                    {% endif %}
+                    {% if select.disabled %}disabled{% endif %}
+                    >
+                    {{ select.display_text }}
+                </option>
+            {% endif %}
+        {% endfor %}
+    </select>
+    {% if field.errors %}
+        {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+    {% endif %}
+    {% if field.help_text %}
+        <span class="help-block">{{ field.help_text|safe }}</span>
+    {% endif %}
 </div>
diff --git a/tests/django_rest/vertical/select_multiple.html b/tests/django_rest/vertical/select_multiple.html
index c055f56..93dae46 100644
--- a/tests/django_rest/vertical/select_multiple.html
+++ b/tests/django_rest/vertical/select_multiple.html
@@ -2,39 +2,39 @@
 {% load rest_framework %}
 {% trans "No items to select." as no_items %}
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label
-        {% if style.hide_label %}class="sr-only"{% endif %}
-        >
-        {{ field.label }}
-    </label>
-{% endif %}
-<select multiple {{ field.choices|yesno:",disabled" }} class="form-control" name="{{ field.name }}">
-    {% for select in field.iter_options %}
-        {% if select.start_option_group %}
-            <optgroup label="{{ select.label }}">
-            {% elif select.end_option_group %}
-            </optgroup>
-        {% else %}
-            <option value="{{ select.value }}"
-                {% if select.value|as_string in field.value|as_list_of_strings %}
-                    selected
-                {% endif %}
-                {% if select.disabled %}disabled{% endif %}
-                >
-                {{ select.display_text }}
+    {% if field.label %}
+        <label
+            {% if style.hide_label %}class="sr-only"{% endif %}
+            >
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <select multiple {{ field.choices|yesno:",disabled" }} class="form-control" name="{{ field.name }}">
+        {% for select in field.iter_options %}
+            {% if select.start_option_group %}
+                <optgroup label="{{ select.label }}">
+                {% elif select.end_option_group %}
+                </optgroup>
+            {% else %}
+                <option value="{{ select.value }}"
+                    {% if select.value|as_string in field.value|as_list_of_strings %}
+                        selected
+                    {% endif %}
+                    {% if select.disabled %}disabled{% endif %}
+                    >
+                    {{ select.display_text }}
+                </option>
+            {% endif %}
+            {% empty %}
+            <option>
+                {{ no_items }}
             </option>
-        {% endif %}
-        {% empty %}
-        <option>
-            {{ no_items }}
-        </option>
-    {% endfor %}
-</select>
-{% if field.errors %}
-    {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-{% endif %}
-{% if field.help_text %}
-    <span class="help-block">{{ field.help_text|safe }}</span>
-{% endif %}
+        {% endfor %}
+    </select>
+    {% if field.errors %}
+        {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+    {% endif %}
+    {% if field.help_text %}
+        <span class="help-block">{{ field.help_text|safe }}</span>
+    {% endif %}
 </div>
diff --git a/tests/django_rest/vertical/textarea.html b/tests/django_rest/vertical/textarea.html
index 0b6e6b1..dd47eef 100644
--- a/tests/django_rest/vertical/textarea.html
+++ b/tests/django_rest/vertical/textarea.html
@@ -1,21 +1,21 @@
 <div class="form-group {% if field.errors %}has-error{% endif %}">
-{% if field.label %}
-    <label
-        {% if style.hide_label %}class="sr-only"{% endif %}
+    {% if field.label %}
+        <label
+            {% if style.hide_label %}class="sr-only"{% endif %}
+            >
+            {{ field.label }}
+        </label>
+    {% endif %}
+    <textarea name="{{ field.name }}" class="form-control"
+        {% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
+        {% if style.rows %}rows="{{ style.rows }}"{% endif %}
         >
-        {{ field.label }}
-    </label>
-{% endif %}
-<textarea name="{{ field.name }}" class="form-control"
-{% if style.placeholder %}placeholder="{{ style.placeholder }}"{% endif %}
-{% if style.rows %}rows="{{ style.rows }}"{% endif %}
->
-{% if field.value %}{{ field.value }}{% endif %}
-</textarea>
-{% if field.errors %}
-    {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
-{% endif %}
-{% if field.help_text %}
-    <span class="help-block">{{ field.help_text|safe }}</span>
-{% endif %}
+        {% if field.value %}{{ field.value }}{% endif %}
+    </textarea>
+    {% if field.errors %}
+        {% for error in field.errors %}<span class="help-block">{{ error }}</span>{% endfor %}
+    {% endif %}
+    {% if field.help_text %}
+        <span class="help-block">{{ field.help_text|safe }}</span>
+    {% endif %}
 </div>
diff --git a/tests/flask_admin/bootstrap2/admin/layout.html b/tests/flask_admin/bootstrap2/admin/layout.html
index dfb9128..a6ffa86 100644
--- a/tests/flask_admin/bootstrap2/admin/layout.html
+++ b/tests/flask_admin/bootstrap2/admin/layout.html
@@ -8,24 +8,24 @@
     <i class="fa fa-{{ icon_value }}"></i>
 {% elif icon_type == 'image' %}
     <img src="{{ url_for('static', filename=icon_value) }}" alt="menu image">
-    {% elif icon_type == 'image-url' %}
-        <img src="item.icon_value" alt="menu image">
-        {% endif %}
-    {% endif %}
-    {%- endmacro %}
-    {% macro menu(menu_root=None) %}
-    {% if menu_root is none %}
-        {% set menu_root = admin_view.admin.menu() %}
-    {% endif %}
-    {%- for item in menu_root %}
-    {%- if item.is_category() - %}
-    {% set children = item.get_children() %}
-    {%- if children %}
-    {% set class_name = item.get_class_name() or '' %}
-    {%- if item.is_active(admin_view) %}
-    <li class="active dropdown{% if class_name %}{{ class_name }}{% endif %}">
+{% elif icon_type == 'image-url' %}
+    <img src="item.icon_value" alt="menu image">
+{% endif %}
+{% endif %}
+{%- endmacro %}
+{% macro menu(menu_root=None) %}
+{% if menu_root is none %}
+{% set menu_root = admin_view.admin.menu() %}
+{% endif %}
+{%- for item in menu_root %}
+{%- if item.is_category() - %}
+{% set children = item.get_children() %}
+{%- if children %}
+{% set class_name = item.get_class_name() or '' %}
+{%- if item.is_active(admin_view) %}
+<li class="active dropdown{% if class_name %}{{ class_name }}{% endif %}">
 {% else - %}
-    <li class="dropdown{% if class_name %}{{ class_name }}{% endif %}">
+<li class="dropdown{% if class_name %}{{ class_name }}{% endif %}">
     {%- endif %}
     <a class="dropdown-toggle" data-toggle="dropdown" href="javascript:void(0)">
         {% if item.class_name %}<i class="{{ item.class_name }}"></i>{% endif %}
@@ -42,34 +42,35 @@
         {% set class_name = child.get_class_name() %}
         {%- if child.is_active(admin_view) %}
         <li class="active{% if class_name %}{{ class_name }}{% endif %}">
-    {% else %}
-        <li
-            {% if class_name %}class="{{ class_name }}"{% endif %}
-            >
+        {% else %}
+            <li
+                {% if class_name %}class="{{ class_name }}"{% endif %}
+                >
+                {%- endif %}
+                <a href="{{ child.get_url() }}"
+                    {% if child.target %}target="{{ child.target }}"{% endif %}
+                    >
+                    {{ menu_icon(child) }}{{ child.name }}
+                </a>
+            </li>
             {%- endif %}
-            <a href="{{ child.get_url() }}"
-                {% if child.target %}target="{{ child.target }}"{% endif %}>
-                {{ menu_icon(child) }}{{ child.name }}
-            </a>
-        </li>
-        {%- endif %}
-        {%- endfor %}
-    </ul>
-</li>
+            {%- endfor %}
+        </ul>
+    </li>
 {% endif %}
 {%- else %}
 {%- if item.is_accessible() and item.is_visible() - %}
 {% set class_name = item.get_class_name() %}
 {%- if item.is_active(admin_view) %}
 <li class="active{% if class_name %}{{ class_name }}{% endif %}">
-{%- else %}
-<li{% if class_name %}class="{{ class_name }}"{% endif %}>
-{%- endif %}
-<a href="{{ item.get_url() }}"{% if item.target %}target="{{ item.target }}"{% endif %}>
-{{ menu_icon(item) }}{{ item.name }}
-</a>
-</li>
-{%- endif - %}
+    {%- else %}
+    <li{% if class_name %}class="{{ class_name }}"{% endif %}>
+        {%- endif %}
+        <a href="{{ item.get_url() }}"{% if item.target %}target="{{ item.target }}"{% endif %}>
+            {{ menu_icon(item) }}{{ item.name }}
+        </a>
+    </li>
+    {%- endif - %}
 {% endif - %}
 {% endfor %}
 {% endmacro %}
@@ -79,7 +80,7 @@
 {% set class_name = item.get_class_name() %}
 {% if item.is_accessible() and item.is_visible() %}
 <li{% if class_name %}class="{{ class_name }}"{% endif %}>
-<a href="{{ item.get_url() }}">{{ menu_icon(item) }}{{ item.name }}</a>
+    <a href="{{ item.get_url() }}">{{ menu_icon(item) }}{{ item.name }}</a>
 </li>
 {% endif %}
 {% endfor %}
@@ -89,15 +90,15 @@
 {% if messages %}
 {% for category, m in messages %}
 {% if category %}
-<div class="alert alert-{{ category }}">
-{% else %}
-<div class="alert">
-{% endif %}
-<a href="javascript:void(0)" class="close" data-dismiss="alert">
-x
-</a>
-{{ m }}
-</div>
+    <div class="alert alert-{{ category }}">
+    {% else %}
+        <div class="alert">
+        {% endif %}
+        <a href="javascript:void(0)" class="close" data-dismiss="alert">
+            x
+        </a>
+        {{ m }}
+    </div>
 {% endfor %}
 {% endif %}
 {% endwith %}
diff --git a/tests/flask_admin/bootstrap3/admin/base.html b/tests/flask_admin/bootstrap3/admin/base.html
index ff272eb..fa14137 100644
--- a/tests/flask_admin/bootstrap3/admin/base.html
+++ b/tests/flask_admin/bootstrap3/admin/base.html
@@ -20,8 +20,8 @@
             <link href="{{ admin_static.url(filename='bootstrap/bootstrap3/swatch/{swatch}/bootstrap.min.css'.format(swatch=config.get('FLASK_ADMIN_SWATCH', 'default')), v='3.3.5') }}"
                   rel="stylesheet">
             {% if config.get('FLASK_ADMIN_SWATCH', 'default') == 'default' %}
-            <link href="{{ admin_static.url(filename='bootstrap/bootstrap3/css/bootstrap-theme.min.css', v='3.3.5') }}"
-                  rel="stylesheet">
+                <link href="{{ admin_static.url(filename='bootstrap/bootstrap3/css/bootstrap-theme.min.css', v='3.3.5') }}"
+                      rel="stylesheet">
             {% endif %}
             <link href="{{ admin_static.url(filename='admin/css/bootstrap3/admin.css', v='1.1.1') }}" rel="stylesheet">
             <link href="{{ admin_static.url(filename='admin/css/bootstrap3/submenu.css') }}" rel="stylesheet">
diff --git a/tests/flask_admin/bootstrap3/admin/layout.html b/tests/flask_admin/bootstrap3/admin/layout.html
index c4b5e45..39be374 100644
--- a/tests/flask_admin/bootstrap3/admin/layout.html
+++ b/tests/flask_admin/bootstrap3/admin/layout.html
@@ -8,24 +8,24 @@
     <i class="fa {{ icon_value }}"></i>
 {% elif icon_type == 'image' %}
     <img src="{{ url_for('static', filename=icon_value) }}" alt="menu image">
-    {% elif icon_type == 'image-url' %}
-        <img src="{{ icon_value }}" alt="menu image">
-        {% endif %}
-    {% endif %}
-    {%- endmacro %}
-    {% macro menu(menu_root=None) %}
-    {% if menu_root is none %}
-        {% set menu_root = admin_view.admin.menu() %}
-    {% endif %}
-    {%- for item in menu_root %}
-    {%- if item.is_category() - %}
-    {% set children = item.get_children() %}
-    {%- if children %}
-    {% set class_name = item.get_class_name() or '' %}
-    {%- if item.is_active(admin_view) %}
-    <li class="active dropdown{% if class_name %}{{ class_name }}{% endif %}">
+{% elif icon_type == 'image-url' %}
+    <img src="{{ icon_value }}" alt="menu image">
+{% endif %}
+{% endif %}
+{%- endmacro %}
+{% macro menu(menu_root=None) %}
+{% if menu_root is none %}
+{% set menu_root = admin_view.admin.menu() %}
+{% endif %}
+{%- for item in menu_root %}
+{%- if item.is_category() - %}
+{% set children = item.get_children() %}
+{%- if children %}
+{% set class_name = item.get_class_name() or '' %}
+{%- if item.is_active(admin_view) %}
+<li class="active dropdown{% if class_name %}{{ class_name }}{% endif %}">
 {% else - %}
-    <li class="dropdown{% if class_name %}{{ class_name }}{% endif %}">
+<li class="dropdown{% if class_name %}{{ class_name }}{% endif %}">
     {%- endif %}
     <a class="dropdown-toggle" data-toggle="dropdown" href="javascript:void(0)">
         {% if item.class_name %}<span class="{{ item.class_name }}"></span>{% endif %}
@@ -44,34 +44,35 @@
         {% set class_name = child.get_class_name() %}
         {%- if child.is_active(admin_view) %}
         <li class="active{% if class_name %}{{ class_name }}{% endif %}">
-    {% else %}
-        <li
-            {% if class_name %}class="{{ class_name }}"{% endif %}
-            >
+        {% else %}
+            <li
+                {% if class_name %}class="{{ class_name }}"{% endif %}
+                >
+                {%- endif %}
+                <a href="{{ child.get_url() }}"
+                    {% if child.target %}target="{{ child.target }}"{% endif %}
+                    >
+                    {{ menu_icon(child) }}{{ child.name }}
+                </a>
+            </li>
             {%- endif %}
-            <a href="{{ child.get_url() }}"
-                {% if child.target %}target="{{ child.target }}"{% endif %}>
-                {{ menu_icon(child) }}{{ child.name }}
-            </a>
-        </li>
-        {%- endif %}
-        {%- endfor %}
-    </ul>
-</li>
+            {%- endfor %}
+        </ul>
+    </li>
 {% endif %}
 {%- else %}
 {%- if item.is_accessible() and item.is_visible() - %}
 {% set class_name = item.get_class_name() %}
 {%- if item.is_active(admin_view) %}
 <li class="active{% if class_name %}{{ class_name }}{% endif %}">
-{%- else %}
-<li{% if class_name %}class="{{ class_name }}"{% endif %}>
-{%- endif %}
-<a href="{{ item.get_url() }}"{% if item.target %}target="{{ item.target }}"{% endif %}>
-{{ menu_icon(item) }}{{ item.name }}
-</a>
-</li>
-{%- endif - %}
+    {%- else %}
+    <li{% if class_name %}class="{{ class_name }}"{% endif %}>
+        {%- endif %}
+        <a href="{{ item.get_url() }}"{% if item.target %}target="{{ item.target }}"{% endif %}>
+            {{ menu_icon(item) }}{{ item.name }}
+        </a>
+    </li>
+    {%- endif - %}
 {% endif - %}
 {% endfor %}
 {% endmacro %}
@@ -81,7 +82,7 @@
 {% set class_name = item.get_class_name() %}
 {% if item.is_accessible() and item.is_visible() %}
 <li{% if class_name %}class="{{ class_name }}"{% endif %}>
-<a href="{{ item.get_url() }}">{{ menu_icon(item) }}{{ item.name }}</a>
+    <a href="{{ item.get_url() }}">{{ menu_icon(item) }}{{ item.name }}</a>
 </li>
 {% endif %}
 {% endfor %}
@@ -91,17 +92,17 @@
 {% if messages %}
 {% for category, m in messages %}
 {% if category %}
-{# alert-error changed to alert-danger in bootstrap 3, mapping is for backwards compatibility #}
-{% set mapping = {'message': 'info', 'error': 'danger'} %}
-<div class="alert alert-{{ mapping.get(category, category) }} alert-dismissable">
-{% else %}
-<div class="alert alert-dismissable">
-{% endif %}
-<button type="button" class="close" data-dismiss="alert" aria-hidden="true">
-&times;
-</button>
-{{ m }}
-</div>
+    {# alert-error changed to alert-danger in bootstrap 3, mapping is for backwards compatibility #}
+    {% set mapping = {'message': 'info', 'error': 'danger'} %}
+    <div class="alert alert-{{ mapping.get(category, category) }} alert-dismissable">
+    {% else %}
+        <div class="alert alert-dismissable">
+        {% endif %}
+        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
+            &times;
+        </button>
+        {{ m }}
+    </div>
 {% endfor %}
 {% endif %}
 {% endwith %}
diff --git a/tests/flask_admin/bootstrap4/admin/base.html b/tests/flask_admin/bootstrap4/admin/base.html
index 157f3d2..5a70097 100644
--- a/tests/flask_admin/bootstrap4/admin/base.html
+++ b/tests/flask_admin/bootstrap4/admin/base.html
@@ -43,57 +43,57 @@
     <body>
         {% block page_body %}
             <div class="container{% if config.get('FLASK_ADMIN_FLUID_LAYOUT', False) %}-fluid{% endif %}">
-            <nav class="navbar navbar-expand-lg navbar-dark bg-dark mb-2" role="navigation">
-                <!-- Brand and toggle get grouped for better mobile display -->
-                <button class="navbar-toggler"
-                        type="button"
-                        data-toggle="collapse"
-                        data-target="#admin-navbar-collapse"
-                        aria-controls="admin-navbar-collapse"
-                        aria-expanded="false"
-                        aria-label="Toggle navigation">
-                    <span class="navbar-toggler-icon"></span>
-                </button>
-                <!-- navbar content -->
-                <div class="collapse navbar-collapse" id="admin-navbar-collapse">
-                    {% block brand %}
-                        <a class="navbar-brand" href="{{ admin_view.admin.url }}">
-                            {{ admin_view.admin.name }}
-                        </a>
-                    {% endblock %}
-                    {% block main_menu %}
-                        <ul class="navbar-nav mr-auto">
-                            {{ layout.menu() }}
-                        </ul>
-                    {% endblock %}
-                    {% block menu_links %}
-                        <ul class="nav navbar-nav navbar-right">
-                            {{ layout.menu_links() }}
-                        </ul>
-                    {% endblock %}
-                    {% block access_control %}{% endblock %}
-                </div>
-            </nav>
-            {% block messages %}{{ layout.messages() }}{% endblock %}
-            {# store the jinja2 context for form_rules rendering logic #}
-            {% set render_ctx = h.resolve_ctx() %}
-            {% block body %}{% endblock %}</div>{% endblock %}
-            {% block tail_js %}
-                <script src="{{ admin_static.url(filename='vendor/jquery.min.js', v='2.1.4') }}" type="text/javascript"></script>
-                <script src="{{ admin_static.url(filename='bootstrap/bootstrap4/js/popper.min.js') }}" type="text/javascript"></script>
-                <script src="{{ admin_static.url(filename='bootstrap/bootstrap4/js/bootstrap.min.js', v='4.2.1') }}" type="text/javascript"></script>
-                <script src="{{ admin_static.url(filename='vendor/moment.min.js', v='2.9.0') }}" type="text/javascript"></script>
-                <script src="{{ admin_static.url(filename='vendor/bootstrap4/util.js', v='4.3.1') }}" type="text/javascript"></script>
-                <script src="{{ admin_static.url(filename='vendor/bootstrap4/dropdown.js', v='4.3.1') }}" type="text/javascript"></script>
-                <script src="{{ admin_static.url(filename='vendor/select2/select2.min.js', v='4.2.1') }}" type="text/javascript"></script>
-                <script src="{{ admin_static.url(filename='vendor/multi-level-dropdowns-bootstrap/bootstrap4-dropdown-ml-hack.js') }}" type="text/javascript"></script>
-                <script src="{{ admin_static.url(filename='admin/js/helpers.js', v='1.0.0') }}" type="text/javascript"></script>
-                {% if admin_view.extra_js %}
-                    {% for js_url in admin_view.extra_js %}
-                        <script src="{{ js_url }}" type="text/javascript"></script>
-                    {% endfor %}
-                {% endif %}
-            {% endblock %}
-            {% block tail %}{% endblock %}
-        </body>
-    </html>
+                <nav class="navbar navbar-expand-lg navbar-dark bg-dark mb-2" role="navigation">
+                    <!-- Brand and toggle get grouped for better mobile display -->
+                    <button class="navbar-toggler"
+                            type="button"
+                            data-toggle="collapse"
+                            data-target="#admin-navbar-collapse"
+                            aria-controls="admin-navbar-collapse"
+                            aria-expanded="false"
+                            aria-label="Toggle navigation">
+                        <span class="navbar-toggler-icon"></span>
+                    </button>
+                    <!-- navbar content -->
+                    <div class="collapse navbar-collapse" id="admin-navbar-collapse">
+                        {% block brand %}
+                            <a class="navbar-brand" href="{{ admin_view.admin.url }}">
+                                {{ admin_view.admin.name }}
+                            </a>
+                        {% endblock %}
+                        {% block main_menu %}
+                            <ul class="navbar-nav mr-auto">
+                                {{ layout.menu() }}
+                            </ul>
+                        {% endblock %}
+                        {% block menu_links %}
+                            <ul class="nav navbar-nav navbar-right">
+                                {{ layout.menu_links() }}
+                            </ul>
+                        {% endblock %}
+                        {% block access_control %}{% endblock %}
+                    </div>
+                </nav>
+                {% block messages %}{{ layout.messages() }}{% endblock %}
+                {# store the jinja2 context for form_rules rendering logic #}
+                {% set render_ctx = h.resolve_ctx() %}
+                {% block body %}{% endblock %}</div>{% endblock %}
+                {% block tail_js %}
+                    <script src="{{ admin_static.url(filename='vendor/jquery.min.js', v='2.1.4') }}" type="text/javascript"></script>
+                    <script src="{{ admin_static.url(filename='bootstrap/bootstrap4/js/popper.min.js') }}" type="text/javascript"></script>
+                    <script src="{{ admin_static.url(filename='bootstrap/bootstrap4/js/bootstrap.min.js', v='4.2.1') }}" type="text/javascript"></script>
+                    <script src="{{ admin_static.url(filename='vendor/moment.min.js', v='2.9.0') }}" type="text/javascript"></script>
+                    <script src="{{ admin_static.url(filename='vendor/bootstrap4/util.js', v='4.3.1') }}" type="text/javascript"></script>
+                    <script src="{{ admin_static.url(filename='vendor/bootstrap4/dropdown.js', v='4.3.1') }}" type="text/javascript"></script>
+                    <script src="{{ admin_static.url(filename='vendor/select2/select2.min.js', v='4.2.1') }}" type="text/javascript"></script>
+                    <script src="{{ admin_static.url(filename='vendor/multi-level-dropdowns-bootstrap/bootstrap4-dropdown-ml-hack.js') }}" type="text/javascript"></script>
+                    <script src="{{ admin_static.url(filename='admin/js/helpers.js', v='1.0.0') }}" type="text/javascript"></script>
+                    {% if admin_view.extra_js %}
+                        {% for js_url in admin_view.extra_js %}
+                            <script src="{{ js_url }}" type="text/javascript"></script>
+                        {% endfor %}
+                    {% endif %}
+                {% endblock %}
+                {% block tail %}{% endblock %}
+            </body>
+        </html>
diff --git a/tests/flask_admin/bootstrap4/admin/layout.html b/tests/flask_admin/bootstrap4/admin/layout.html
index b91b988..3cd497b 100644
--- a/tests/flask_admin/bootstrap4/admin/layout.html
+++ b/tests/flask_admin/bootstrap4/admin/layout.html
@@ -8,76 +8,76 @@
     <i class="fa {{ icon_value }}"></i>
 {% elif icon_type == 'image' %}
     <img src="{{ url_for('static', filename=icon_value) }}" alt="menu image">
-    {% elif icon_type == 'image-url' %}
-        <img src="{{ icon_value }}" alt="menu image">
-        {% endif %}
-    {% endif %}
-    {%- endmacro %}
-    {% macro menu(menu_root=None) %}
-    {% set is_main_nav = menu_root == None %}
-    {% if menu_root is none %}
-        {% set menu_root = admin_view.admin.menu() %}
-    {% endif %}
-    {%- for item in menu_root %}
-    {%- if item.is_category() - %}
-    {% set children = item.get_children() %}
-    {%- if children %}
-    {% set class_name = item.get_class_name() or '' %}
-    {%- if item.is_active(admin_view) %}
-    <li class="active dropdown{% if class_name %}{{ class_name }}{% endif %}">
+{% elif icon_type == 'image-url' %}
+    <img src="{{ icon_value }}" alt="menu image">
+{% endif %}
+{% endif %}
+{%- endmacro %}
+{% macro menu(menu_root=None) %}
+{% set is_main_nav = menu_root == None %}
+{% if menu_root is none %}
+{% set menu_root = admin_view.admin.menu() %}
+{% endif %}
+{%- for item in menu_root %}
+{%- if item.is_category() - %}
+{% set children = item.get_children() %}
+{%- if children %}
+{% set class_name = item.get_class_name() or '' %}
+{%- if item.is_active(admin_view) %}
+<li class="active dropdown{% if class_name %}{{ class_name }}{% endif %}">
 {% else - %}
-    <li class="dropdown{% if class_name %}{{ class_name }}{% endif %}">
+<li class="dropdown{% if class_name %}{{ class_name }}{% endif %}">
     {%- endif %}
     <a class="dropdown-toggle {% if is_main_nav %}nav-link{% else %}dropdown-item{% endif %}"
        data-toggle="dropdown"
        href="javascript:void(0)">
-    {% if item.class_name %}<span class="{{ item.class_name }}"></span>{% endif %}
-    {{ menu_icon(item) }}{{ item.name }}
-    {%- if 'dropdown-submenu' in class_name - %}
-    <i class="glyphicon glyphicon-chevron-right small"></i>
-    {%- else - %}
-    <i class="glyphicon glyphicon-chevron-down small"></i>
-    {%- endif - %}
-</a>
-<ul class="dropdown-menu">
-    {%- for child in children - %}
-    {%- if child.is_category() - %}
-    {{ menu(menu_root=[child]) }}
-{% else %}
-    {% set class_name = child.get_class_name() %}
-    <li
-        {% if class_name %}class="{{ class_name }}"{% endif %}
-        >
-        {%- if child.is_active(admin_view) %}
-        <a class="dropdown-item active"
-           href="{{ child.get_url() }}"
-           {% if child.target %}target="{{ child.target }}">
-        {{ menu_icon(child) }}{{ child.name }}
+        {% if item.class_name %}<span class="{{ item.class_name }}"></span>{% endif %}
+        {{ menu_icon(item) }}{{ item.name }}
+        {%- if 'dropdown-submenu' in class_name - %}
+        <i class="glyphicon glyphicon-chevron-right small"></i>
+        {%- else - %}
+        <i class="glyphicon glyphicon-chevron-down small"></i>
+        {%- endif - %}
     </a>
-{% else %}
-    <a class="dropdown-item" href="{{ child.get_url() }}"{% if child.target %}target="{{ child.target }}"{% endif %}>
-    {{ menu_icon(child) }}{{ child.name }}
-</a>
-{%- endif %}
-</li>
-{%- endif %}
-{%- endfor %}
-</ul>
-</li>
+    <ul class="dropdown-menu">
+        {%- for child in children - %}
+        {%- if child.is_category() - %}
+        {{ menu(menu_root=[child]) }}
+    {% else %}
+        {% set class_name = child.get_class_name() %}
+        <li
+            {% if class_name %}class="{{ class_name }}"{% endif %}
+            >
+            {%- if child.is_active(admin_view) %}
+            <a class="dropdown-item active" href="{{ child.get_url() }}"
+                {% if child.target %}
+                    target="{{ child.target }}">
+                    {{ menu_icon(child) }}{{ child.name }}
+                </a>
+            {% else %}
+                <a class="dropdown-item" href="{{ child.get_url() }}" {% if child.target %}target="{{ child.target }}">
+                    {{ menu_icon(child) }}{{ child.name }}
+                </a>
+                {%- endif %}
+            </li>
+            {%- endif %}
+            {%- endfor %}
+        </ul>
+    </li>
 {% endif %}
 {%- else %}
 {%- if item.is_accessible() and item.is_visible() - %}
 {% set class_name = item.get_class_name() %}
 {%- if item.is_active(admin_view) %}
 <li class="active{% if class_name %}{{ class_name }}{% endif %}">
-{%- else %}
-<li{% if class_name %}class="{{ class_name }}"{% endif %}>
-{%- endif %}
-<a class="nav-link" href="{{ item.get_url() }}"{% if item.target %}target="{{ item.target }}"{% endif %}>
-{{ menu_icon(item) }}{{ item.name }}
-</a>
-</li>
-{%- endif - %}
+    {%- else %}
+    <li{% if class_name %}class="{{ class_name }}"{% endif %}>
+        {%- endif %}
+        <a class="nav-link" href="{{ item.get_url() }}" {% if item.target %}target="{{ item.target }}">
+            {{ menu_icon(item) }}{{ item.name }}
+        </a>
+    </li>
+    {%- endif - %}
 {% endif - %}
 {% endfor %}
 {% endmacro %}
@@ -86,10 +86,10 @@
 {% for item in links %}
 {% set class_name = item.get_class_name() %}
 {% if item.is_accessible() and item.is_visible() %}
-<li{% if class_name %} class="{{ class_name }}"{% endif %}>
-<a class="nav-link" href="{{ item.get_url() }}">
-{{ menu_icon(item) }}{{ item.name }}
-</a>
+<li{% if class_name %}class="{{ class_name }}"{% endif %}>
+    <a class="nav-link" href="{{ item.get_url() }}">
+        {{ menu_icon(item) }}{{ item.name }}
+    </a>
 </li>
 {% endif %}
 {% endfor %}
@@ -99,17 +99,17 @@
 {% if messages %}
 {% for category, m in messages %}
 {% if category %}
-{# alert-error changed to alert-danger in bootstrap 3, mapping is for backwards compatibility #}
-{% set mapping = {'message': 'info', 'error': 'danger'} %}
-<div class="alert alert-{{ mapping.get(category, category) }} alert-dismissable">
-{% else %}
-<div class="alert alert-dismissable">
-{% endif %}
-<button type="button" class="close" data-dismiss="alert" aria-hidden="true">
-&times;
-</button>
-{{ m }}
-</div>
+    {# alert-error changed to alert-danger in bootstrap 3, mapping is for backwards compatibility #}
+    {% set mapping = {'message': 'info', 'error': 'danger'} %}
+    <div class="alert alert-{{ mapping.get(category, category) }} alert-dismissable">
+    {% else %}
+        <div class="alert alert-dismissable">
+        {% endif %}
+        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
+            &times;
+        </button>
+        {{ m }}
+    </div>
 {% endfor %}
 {% endif %}
 {% endwith %}
diff --git a/tests/flask_admin/bootstrap4/admin/model/details.html b/tests/flask_admin/bootstrap4/admin/model/details.html
index 2e416f9..6fff554 100644
--- a/tests/flask_admin/bootstrap4/admin/model/details.html
+++ b/tests/flask_admin/bootstrap4/admin/model/details.html
@@ -31,9 +31,7 @@
     {% endblock %}
     {% block details_search %}
         <div class="form-inline fa_filter_container col-lg-6">
-            <label for="fa_filter">
-                {{ _gettext('Filter') }}
-            </label>
+            <label for="fa_filter">{{ _gettext('Filter') }}</label>
             <input id="fa_filter" type="text" class="ml-3 form-control">
         </div>
     {% endblock %}
diff --git a/tests/flask_admin/bootstrap4/admin/model/modals/details.html b/tests/flask_admin/bootstrap4/admin/model/modals/details.html
index 4d816a1..ec37abf 100755
--- a/tests/flask_admin/bootstrap4/admin/model/modals/details.html
+++ b/tests/flask_admin/bootstrap4/admin/model/modals/details.html
@@ -12,9 +12,7 @@
     <div class="modal-body">
         {% block details_search %}
             <div class="form-inline fa_filter_container col-lg-6">
-                <label for="fa_filter">
-                    {{ _gettext('Filter') }}
-                </label>
+                <label for="fa_filter">{{ _gettext('Filter') }}</label>
                 <input id="fa_filter" type="text" class="ml-3 form-control">
             </div>
         {% endblock %}
diff --git a/tests/jinja_adminlte/calendar.html b/tests/jinja_adminlte/calendar.html
index 526c4f4..9a854aa 100644
--- a/tests/jinja_adminlte/calendar.html
+++ b/tests/jinja_adminlte/calendar.html
@@ -2,178 +2,178 @@
 {% block title %}Blank Page {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- fullCalendar -->
-        <link rel="stylesheet" href="/static/assets/plugins/fullcalendar/main.min.css">
-        <link rel="stylesheet" href="/static/assets/plugins/fullcalendar-daygrid/main.min.css">
-        <link rel="stylesheet" href="/static/assets/plugins/fullcalendar-timegrid/main.min.css">
-        <link rel="stylesheet" href="/static/assets/plugins/fullcalendar-bootstrap/main.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>Calendar</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    Calendar
-                                </li>
-                            </ol>
-                        </div>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- fullCalendar -->
+    <link rel="stylesheet" href="/static/assets/plugins/fullcalendar/main.min.css">
+    <link rel="stylesheet" href="/static/assets/plugins/fullcalendar-daygrid/main.min.css">
+    <link rel="stylesheet" href="/static/assets/plugins/fullcalendar-timegrid/main.min.css">
+    <link rel="stylesheet" href="/static/assets/plugins/fullcalendar-bootstrap/main.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>Calendar</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                Calendar
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-md-3">
-                            <div class="sticky-top mb-3">
-                                <div class="card">
-                                    <div class="card-header">
-                                        <h4 class="card-title">Draggable Events</h4>
-                                    </div>
-                                    <div class="card-body">
-                                        <!-- the events -->
-                                        <div id="external-events">
-                                            <div class="external-event bg-success">
-                                                Lunch
-                                            </div>
-                                            <div class="external-event bg-warning">
-                                                Go home
-                                            </div>
-                                            <div class="external-event bg-info">
-                                                Do homework
-                                            </div>
-                                            <div class="external-event bg-primary">
-                                                Work on UI design
-                                            </div>
-                                            <div class="external-event bg-danger">
-                                                Sleep tight
-                                            </div>
-                                            <div class="checkbox">
-                                                <label for="drop-remove">
-                                                    <input type="checkbox" id="drop-remove">
-                                                    remove after drop
-                                                </label>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <!-- /.card-body -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-md-3">
+                        <div class="sticky-top mb-3">
+                            <div class="card">
+                                <div class="card-header">
+                                    <h4 class="card-title">Draggable Events</h4>
                                 </div>
-                                <!-- /.card -->
-                                <div class="card">
-                                    <div class="card-header">
-                                        <h3 class="card-title">Create Event</h3>
-                                    </div>
-                                    <div class="card-body">
-                                        <div class="btn-group" style="width: 100%; margin-bottom: 10px;">
-                                            <ul class="fc-color-picker" id="color-chooser">
-                                                <li>
-                                                    <a class="text-primary" href="#">
-                                                        <i class="fas fa-square"></i>
-                                                    </a>
-                                                </li>
-                                                <li>
-                                                    <a class="text-warning" href="#">
-                                                        <i class="fas fa-square"></i>
-                                                    </a>
-                                                </li>
-                                                <li>
-                                                    <a class="text-success" href="#">
-                                                        <i class="fas fa-square"></i>
-                                                    </a>
-                                                </li>
-                                                <li>
-                                                    <a class="text-danger" href="#">
-                                                        <i class="fas fa-square"></i>
-                                                    </a>
-                                                </li>
-                                                <li>
-                                                    <a class="text-muted" href="#">
-                                                        <i class="fas fa-square"></i>
-                                                    </a>
-                                                </li>
-                                            </ul>
+                                <div class="card-body">
+                                    <!-- the events -->
+                                    <div id="external-events">
+                                        <div class="external-event bg-success">
+                                            Lunch
                                         </div>
-                                        <!-- /btn-group -->
-                                        <div class="input-group">
-                                            <input id="new-event"
-                                                   type="text"
-                                                   class="form-control"
-                                                   placeholder="Event Title">
-                                            <div class="input-group-append">
-                                                <button id="add-new-event" type="button" class="btn btn-primary">
-                                                    Add
-                                                </button>
-                                            </div>
-                                            <!-- /btn-group -->
+                                        <div class="external-event bg-warning">
+                                            Go home
+                                        </div>
+                                        <div class="external-event bg-info">
+                                            Do homework
+                                        </div>
+                                        <div class="external-event bg-primary">
+                                            Work on UI design
+                                        </div>
+                                        <div class="external-event bg-danger">
+                                            Sleep tight
+                                        </div>
+                                        <div class="checkbox">
+                                            <label for="drop-remove">
+                                                <input type="checkbox" id="drop-remove">
+                                                remove after drop
+                                            </label>
                                         </div>
-                                        <!-- /input-group -->
                                     </div>
                                 </div>
-                            </div>
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-9">
-                            <div class="card card-primary">
-                                <div class="card-body p-0">
-                                    <!-- THE CALENDAR -->
-                                    <div id="calendar"></div>
-                                </div>
                                 <!-- /.card-body -->
                             </div>
                             <!-- /.card -->
+                            <div class="card">
+                                <div class="card-header">
+                                    <h3 class="card-title">Create Event</h3>
+                                </div>
+                                <div class="card-body">
+                                    <div class="btn-group" style="width: 100%; margin-bottom: 10px;">
+                                        <ul class="fc-color-picker" id="color-chooser">
+                                            <li>
+                                                <a class="text-primary" href="#">
+                                                    <i class="fas fa-square"></i>
+                                                </a>
+                                            </li>
+                                            <li>
+                                                <a class="text-warning" href="#">
+                                                    <i class="fas fa-square"></i>
+                                                </a>
+                                            </li>
+                                            <li>
+                                                <a class="text-success" href="#">
+                                                    <i class="fas fa-square"></i>
+                                                </a>
+                                            </li>
+                                            <li>
+                                                <a class="text-danger" href="#">
+                                                    <i class="fas fa-square"></i>
+                                                </a>
+                                            </li>
+                                            <li>
+                                                <a class="text-muted" href="#">
+                                                    <i class="fas fa-square"></i>
+                                                </a>
+                                            </li>
+                                        </ul>
+                                    </div>
+                                    <!-- /btn-group -->
+                                    <div class="input-group">
+                                        <input id="new-event"
+                                               type="text"
+                                               class="form-control"
+                                               placeholder="Event Title">
+                                        <div class="input-group-append">
+                                            <button id="add-new-event" type="button" class="btn btn-primary">
+                                                Add
+                                            </button>
+                                        </div>
+                                        <!-- /btn-group -->
+                                    </div>
+                                    <!-- /input-group -->
+                                </div>
+                            </div>
                         </div>
-                        <!-- /.col -->
                     </div>
-                    <!-- /.row -->
+                    <!-- /.col -->
+                    <div class="col-md-9">
+                        <div class="card card-primary">
+                            <div class="card-body p-0">
+                                <!-- THE CALENDAR -->
+                                <div id="calendar"></div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- /.content -->
-        </div>
-        <!-- /.content-wrapper -->
-    {% endblock content %}
-    <!-- Specific Page JS goes HERE -->
-    {% block javascripts %}
-        <!-- jQuery -->
-        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-        <!-- Bootstrap -->
-        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-        <!-- jQuery UI -->
-        <script src="/static/assets/plugins/jquery-ui/jquery-ui.min.js"></script>
-        <!-- AdminLTE App -->
-        <script src="/static/assets/js/adminlte.min.js"></script>
-        <!-- AdminLTE for demo purposes -->
-        <script src="/static/assets/js/demo.js"></script>
-        <!-- fullCalendar 2.2.5 -->
-        <script src="/static/assets/plugins/moment/moment.min.js"></script>
-        <script src="/static/assets/plugins/fullcalendar/main.min.js"></script>
-        <script src="/static/assets/plugins/fullcalendar-daygrid/main.min.js"></script>
-        <script src="/static/assets/plugins/fullcalendar-timegrid/main.min.js"></script>
-        <script src="/static/assets/plugins/fullcalendar-interaction/main.min.js"></script>
-        <script src="/static/assets/plugins/fullcalendar-bootstrap/main.min.js"></script>
-        <!-- Page specific script -->
-        <script>
+                <!-- /.row -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- jQuery UI -->
+    <script src="/static/assets/plugins/jquery-ui/jquery-ui.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+    <!-- fullCalendar 2.2.5 -->
+    <script src="/static/assets/plugins/moment/moment.min.js"></script>
+    <script src="/static/assets/plugins/fullcalendar/main.min.js"></script>
+    <script src="/static/assets/plugins/fullcalendar-daygrid/main.min.js"></script>
+    <script src="/static/assets/plugins/fullcalendar-timegrid/main.min.js"></script>
+    <script src="/static/assets/plugins/fullcalendar-interaction/main.min.js"></script>
+    <script src="/static/assets/plugins/fullcalendar-bootstrap/main.min.js"></script>
+    <!-- Page specific script -->
+    <script>
     $(function () {
 
       /* initialize the external events
@@ -341,5 +341,5 @@
         $('#new-event').val('')
       })
     })
-        </script>
-    {% endblock javascripts %}
+    </script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/examples-contacts.html b/tests/jinja_adminlte/examples-contacts.html
index 762934c..b7f932a 100644
--- a/tests/jinja_adminlte/examples-contacts.html
+++ b/tests/jinja_adminlte/examples-contacts.html
@@ -82,491 +82,491 @@
                                             <img src="/static/assets/img/user1-128x128.jpg"
                                                  alt="user-avatar"
                                                  class="img-circle img-fluid">
-                                            </div>
                                         </div>
                                     </div>
-                                    <div class="card-footer">
-                                        <div class="text-right">
-                                            <a href="#" class="btn btn-sm bg-teal">
-                                                <i class="fas fa-comments"></i>
-                                            </a>
-                                            <a href="#" class="btn btn-sm btn-primary">
-                                                <i class="fas fa-user"></i>
-                                                View Profile
-                                            </a>
-                                        </div>
+                                </div>
+                                <div class="card-footer">
+                                    <div class="text-right">
+                                        <a href="#" class="btn btn-sm bg-teal">
+                                            <i class="fas fa-comments"></i>
+                                        </a>
+                                        <a href="#" class="btn btn-sm btn-primary">
+                                            <i class="fas fa-user"></i>
+                                            View Profile
+                                        </a>
                                     </div>
                                 </div>
                             </div>
-                            <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
-                                <div class="card bg-light">
-                                    <div class="card-header text-muted border-bottom-0">
-                                        Digital Strategist
-                                    </div>
-                                    <div class="card-body pt-0">
-                                        <div class="row">
-                                            <div class="col-7">
-                                                <h2 class="lead">
-                                                    <b>
-                                                    Nicole Pearson
-                                                    </b>
-                                                </h2>
-                                                <p class="text-muted text-sm">
-                                                    <b>
-                                                    About:
-                                                    </b>
-                                                    Web Designer / UX / Graphic Artist / Coffee Lover
-                                                </p>
-                                                <ul class="ml-4 mb-0 fa-ul text-muted">
-                                                    <li class="small">
-                                                        <span class="fa-li">
-                                                            <i class="fas fa-lg fa-building"></i>
-                                                        </span>
-                                                        Address: Demo Street 123, Demo City 04312, NJ
-                                                    </li>
-                                                    <li class="small">
-                                                        <span class="fa-li">
-                                                            <i class="fas fa-lg fa-phone"></i>
-                                                        </span>
-                                                        Phone #: + 800 - 12 12 23 52
-                                                    </li>
-                                                </ul>
-                                            </div>
-                                            <div class="col-5 text-center">
-                                                <img src="/static/assets/img/user2-160x160.jpg"
-                                                     alt="user-avatar"
-                                                     class="img-circle img-fluid">
-                                                </div>
-                                            </div>
+                        </div>
+                        <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
+                            <div class="card bg-light">
+                                <div class="card-header text-muted border-bottom-0">
+                                    Digital Strategist
+                                </div>
+                                <div class="card-body pt-0">
+                                    <div class="row">
+                                        <div class="col-7">
+                                            <h2 class="lead">
+                                                <b>
+                                                Nicole Pearson
+                                                </b>
+                                            </h2>
+                                            <p class="text-muted text-sm">
+                                                <b>
+                                                About:
+                                                </b>
+                                                Web Designer / UX / Graphic Artist / Coffee Lover
+                                            </p>
+                                            <ul class="ml-4 mb-0 fa-ul text-muted">
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-building"></i>
+                                                    </span>
+                                                    Address: Demo Street 123, Demo City 04312, NJ
+                                                </li>
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-phone"></i>
+                                                    </span>
+                                                    Phone #: + 800 - 12 12 23 52
+                                                </li>
+                                            </ul>
                                         </div>
-                                        <div class="card-footer">
-                                            <div class="text-right">
-                                                <a href="#" class="btn btn-sm bg-teal">
-                                                    <i class="fas fa-comments"></i>
-                                                </a>
-                                                <a href="#" class="btn btn-sm btn-primary">
-                                                    <i class="fas fa-user"></i>
-                                                    View Profile
-                                                </a>
-                                            </div>
+                                        <div class="col-5 text-center">
+                                            <img src="/static/assets/img/user2-160x160.jpg"
+                                                 alt="user-avatar"
+                                                 class="img-circle img-fluid">
                                         </div>
                                     </div>
                                 </div>
-                                <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
-                                    <div class="card bg-light">
-                                        <div class="card-header text-muted border-bottom-0">
-                                            Digital Strategist
+                                <div class="card-footer">
+                                    <div class="text-right">
+                                        <a href="#" class="btn btn-sm bg-teal">
+                                            <i class="fas fa-comments"></i>
+                                        </a>
+                                        <a href="#" class="btn btn-sm btn-primary">
+                                            <i class="fas fa-user"></i>
+                                            View Profile
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
+                            <div class="card bg-light">
+                                <div class="card-header text-muted border-bottom-0">
+                                    Digital Strategist
+                                </div>
+                                <div class="card-body pt-0">
+                                    <div class="row">
+                                        <div class="col-7">
+                                            <h2 class="lead">
+                                                <b>
+                                                Nicole Pearson
+                                                </b>
+                                            </h2>
+                                            <p class="text-muted text-sm">
+                                                <b>
+                                                About:
+                                                </b>
+                                                Web Designer / UX / Graphic Artist / Coffee Lover
+                                            </p>
+                                            <ul class="ml-4 mb-0 fa-ul text-muted">
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-building"></i>
+                                                    </span>
+                                                    Address: Demo Street 123, Demo City 04312, NJ
+                                                </li>
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-phone"></i>
+                                                    </span>
+                                                    Phone #: + 800 - 12 12 23 52
+                                                </li>
+                                            </ul>
                                         </div>
-                                        <div class="card-body pt-0">
-                                            <div class="row">
-                                                <div class="col-7">
-                                                    <h2 class="lead">
-                                                        <b>
-                                                        Nicole Pearson
-                                                        </b>
-                                                    </h2>
-                                                    <p class="text-muted text-sm">
-                                                        <b>
-                                                        About:
-                                                        </b>
-                                                        Web Designer / UX / Graphic Artist / Coffee Lover
-                                                    </p>
-                                                    <ul class="ml-4 mb-0 fa-ul text-muted">
-                                                        <li class="small">
-                                                            <span class="fa-li">
-                                                                <i class="fas fa-lg fa-building"></i>
-                                                            </span>
-                                                            Address: Demo Street 123, Demo City 04312, NJ
-                                                        </li>
-                                                        <li class="small">
-                                                            <span class="fa-li">
-                                                                <i class="fas fa-lg fa-phone"></i>
-                                                            </span>
-                                                            Phone #: + 800 - 12 12 23 52
-                                                        </li>
-                                                    </ul>
-                                                </div>
-                                                <div class="col-5 text-center">
-                                                    <img src="/static/assets/img/user1-128x128.jpg"
-                                                         alt="user-avatar"
-                                                         class="img-circle img-fluid">
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <div class="card-footer">
-                                                <div class="text-right">
-                                                    <a href="#" class="btn btn-sm bg-teal">
-                                                        <i class="fas fa-comments"></i>
-                                                    </a>
-                                                    <a href="#" class="btn btn-sm btn-primary">
-                                                        <i class="fas fa-user"></i>
-                                                        View Profile
-                                                    </a>
-                                                </div>
-                                            </div>
+                                        <div class="col-5 text-center">
+                                            <img src="/static/assets/img/user1-128x128.jpg"
+                                                 alt="user-avatar"
+                                                 class="img-circle img-fluid">
                                         </div>
                                     </div>
-                                    <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
-                                        <div class="card bg-light">
-                                            <div class="card-header text-muted border-bottom-0">
-                                                Digital Strategist
-                                            </div>
-                                            <div class="card-body pt-0">
-                                                <div class="row">
-                                                    <div class="col-7">
-                                                        <h2 class="lead">
-                                                            <b>
-                                                            Nicole Pearson
-                                                            </b>
-                                                        </h2>
-                                                        <p class="text-muted text-sm">
-                                                            <b>
-                                                            About:
-                                                            </b>
-                                                            Web Designer / UX / Graphic Artist / Coffee Lover
-                                                        </p>
-                                                        <ul class="ml-4 mb-0 fa-ul text-muted">
-                                                            <li class="small">
-                                                                <span class="fa-li">
-                                                                    <i class="fas fa-lg fa-building"></i>
-                                                                </span>
-                                                                Address: Demo Street 123, Demo City 04312, NJ
-                                                            </li>
-                                                            <li class="small">
-                                                                <span class="fa-li">
-                                                                    <i class="fas fa-lg fa-phone"></i>
-                                                                </span>
-                                                                Phone #: + 800 - 12 12 23 52
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                    <div class="col-5 text-center">
-                                                        <img src="/static/assets/img/user2-160x160.jpg"
-                                                             alt="user-avatar"
-                                                             class="img-circle img-fluid">
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                                <div class="card-footer">
-                                                    <div class="text-right">
-                                                        <a href="#" class="btn btn-sm bg-teal">
-                                                            <i class="fas fa-comments"></i>
-                                                        </a>
-                                                        <a href="#" class="btn btn-sm btn-primary">
-                                                            <i class="fas fa-user"></i>
-                                                            View Profile
-                                                        </a>
-                                                    </div>
-                                                </div>
-                                            </div>
+                                </div>
+                                <div class="card-footer">
+                                    <div class="text-right">
+                                        <a href="#" class="btn btn-sm bg-teal">
+                                            <i class="fas fa-comments"></i>
+                                        </a>
+                                        <a href="#" class="btn btn-sm btn-primary">
+                                            <i class="fas fa-user"></i>
+                                            View Profile
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
+                            <div class="card bg-light">
+                                <div class="card-header text-muted border-bottom-0">
+                                    Digital Strategist
+                                </div>
+                                <div class="card-body pt-0">
+                                    <div class="row">
+                                        <div class="col-7">
+                                            <h2 class="lead">
+                                                <b>
+                                                Nicole Pearson
+                                                </b>
+                                            </h2>
+                                            <p class="text-muted text-sm">
+                                                <b>
+                                                About:
+                                                </b>
+                                                Web Designer / UX / Graphic Artist / Coffee Lover
+                                            </p>
+                                            <ul class="ml-4 mb-0 fa-ul text-muted">
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-building"></i>
+                                                    </span>
+                                                    Address: Demo Street 123, Demo City 04312, NJ
+                                                </li>
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-phone"></i>
+                                                    </span>
+                                                    Phone #: + 800 - 12 12 23 52
+                                                </li>
+                                            </ul>
                                         </div>
-                                        <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
-                                            <div class="card bg-light">
-                                                <div class="card-header text-muted border-bottom-0">
-                                                    Digital Strategist
-                                                </div>
-                                                <div class="card-body pt-0">
-                                                    <div class="row">
-                                                        <div class="col-7">
-                                                            <h2 class="lead">
-                                                                <b>
-                                                                Nicole Pearson
-                                                                </b>
-                                                            </h2>
-                                                            <p class="text-muted text-sm">
-                                                                <b>
-                                                                About:
-                                                                </b>
-                                                                Web Designer / UX / Graphic Artist / Coffee Lover
-                                                            </p>
-                                                            <ul class="ml-4 mb-0 fa-ul text-muted">
-                                                                <li class="small">
-                                                                    <span class="fa-li">
-                                                                        <i class="fas fa-lg fa-phone"></i>
-                                                                    </span>
-                                                                    Phone #: + 800 - 12 12 23 52
-                                                                </li>
-                                                            </ul>
-                                                        </div>
-                                                        <div class="col-5 text-center">
-                                                            <img src="/static/assets/img/user1-128x128.jpg"
-                                                                 alt="user-avatar"
-                                                                 class="img-circle img-fluid">
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <div class="card-footer">
-                                                        <div class="text-right">
-                                                            <a href="#" class="btn btn-sm bg-teal">
-                                                                <i class="fas fa-comments"></i>
-                                                            </a>
-                                                            <a href="#" class="btn btn-sm btn-primary">
-                                                                <i class="fas fa-user"></i>
-                                                                View Profile
-                                                            </a>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
-                                                <div class="card bg-light">
-                                                    <div class="card-header text-muted border-bottom-0">
-                                                        Digital Strategist
-                                                    </div>
-                                                    <div class="card-body pt-0">
-                                                        <div class="row">
-                                                            <div class="col-7">
-                                                                <h2 class="lead">
-                                                                    <b>
-                                                                    Nicole Pearson
-                                                                    </b>
-                                                                </h2>
-                                                                <p class="text-muted text-sm">
-                                                                    <b>
-                                                                    About:
-                                                                    </b>
-                                                                    Web Designer / UX / Graphic Artist / Coffee Lover
-                                                                </p>
-                                                                <ul class="ml-4 mb-0 fa-ul text-muted">
-                                                                    <li class="small">
-                                                                        <span class="fa-li">
-                                                                            <i class="fas fa-lg fa-building"></i>
-                                                                        </span>
-                                                                        Address: Demo Street 123, Demo City 04312, NJ
-                                                                    </li>
-                                                                    <li class="small">
-                                                                        <span class="fa-li">
-                                                                            <i class="fas fa-lg fa-phone"></i>
-                                                                        </span>
-                                                                        Phone #: + 800 - 12 12 23 52
-                                                                    </li>
-                                                                </ul>
-                                                            </div>
-                                                            <div class="col-5 text-center">
-                                                                <img src="/static/assets/img/user1-128x128.jpg"
-                                                                     alt="user-avatar"
-                                                                     class="img-circle img-fluid">
-                                                                </div>
-                                                            </div>
-                                                        </div>
-                                                        <div class="card-footer">
-                                                            <div class="text-right">
-                                                                <a href="#" class="btn btn-sm bg-teal">
-                                                                    <i class="fas fa-comments"></i>
-                                                                </a>
-                                                                <a href="#" class="btn btn-sm btn-primary">
-                                                                    <i class="fas fa-user"></i>
-                                                                    View Profile
-                                                                </a>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                                <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
-                                                    <div class="card bg-light">
-                                                        <div class="card-header text-muted border-bottom-0">
-                                                            Digital Strategist
-                                                        </div>
-                                                        <div class="card-body pt-0">
-                                                            <div class="row">
-                                                                <div class="col-7">
-                                                                    <h2 class="lead">
-                                                                        <b>
-                                                                        Nicole Pearson
-                                                                        </b>
-                                                                    </h2>
-                                                                    <p class="text-muted text-sm">
-                                                                        <b>
-                                                                        About:
-                                                                        </b>
-                                                                        Web Designer / UX / Graphic Artist / Coffee Lover
-                                                                    </p>
-                                                                    <ul class="ml-4 mb-0 fa-ul text-muted">
-                                                                        <li class="small">
-                                                                            <span class="fa-li">
-                                                                                <i class="fas fa-lg fa-building"></i>
-                                                                            </span>
-                                                                            Address: Demo Street 123, Demo City 04312, NJ
-                                                                        </li>
-                                                                    </ul>
-                                                                </div>
-                                                                <div class="col-5 text-center">
-                                                                    <img src="/static/assets/img/user1-128x128.jpg"
-                                                                         alt="user-avatar"
-                                                                         class="img-circle img-fluid">
-                                                                    </div>
-                                                                </div>
-                                                            </div>
-                                                            <div class="card-footer">
-                                                                <div class="text-right">
-                                                                    <a href="#" class="btn btn-sm bg-teal">
-                                                                        <i class="fas fa-comments"></i>
-                                                                    </a>
-                                                                    <a href="#" class="btn btn-sm btn-primary">
-                                                                        <i class="fas fa-user"></i>
-                                                                        View Profile
-                                                                    </a>
-                                                                </div>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
-                                                        <div class="card bg-light">
-                                                            <div class="card-header text-muted border-bottom-0">
-                                                                Digital Strategist
-                                                            </div>
-                                                            <div class="card-body pt-0">
-                                                                <div class="row">
-                                                                    <div class="col-7">
-                                                                        <h2 class="lead">
-                                                                            <b>
-                                                                            Nicole Pearson
-                                                                            </b>
-                                                                        </h2>
-                                                                        <p class="text-muted text-sm">
-                                                                            <b>
-                                                                            About:
-                                                                            </b>
-                                                                            Web Designer / UX / Graphic Artist / Coffee Lover
-                                                                        </p>
-                                                                        <ul class="ml-4 mb-0 fa-ul text-muted">
-                                                                            <li class="small">
-                                                                                <span class="fa-li">
-                                                                                    <i class="fas fa-lg fa-building"></i>
-                                                                                </span>
-                                                                                Address: Demo Street 123, Demo City 04312, NJ
-                                                                            </li>
-                                                                            <li class="small">
-                                                                                <span class="fa-li">
-                                                                                    <i class="fas fa-lg fa-phone"></i>
-                                                                                </span>
-                                                                                Phone #: + 800 - 12 12 23 52
-                                                                            </li>
-                                                                        </ul>
-                                                                    </div>
-                                                                    <div class="col-5 text-center">
-                                                                        <img src="/static/assets/img/user1-128x128.jpg"
-                                                                             alt="user-avatar"
-                                                                             class="img-circle img-fluid">
-                                                                        </div>
-                                                                    </div>
-                                                                </div>
-                                                                <div class="card-footer">
-                                                                    <div class="text-right">
-                                                                        <a href="#" class="btn btn-sm bg-teal">
-                                                                            <i class="fas fa-comments"></i>
-                                                                        </a>
-                                                                        <a href="#" class="btn btn-sm btn-primary">
-                                                                            <i class="fas fa-user"></i>
-                                                                            View Profile
-                                                                        </a>
-                                                                    </div>
-                                                                </div>
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
-                                                            <div class="card bg-light">
-                                                                <div class="card-header text-muted border-bottom-0">
-                                                                    Digital Strategist
-                                                                </div>
-                                                                <div class="card-body pt-0">
-                                                                    <div class="row">
-                                                                        <div class="col-7">
-                                                                            <h2 class="lead">
-                                                                                <b>
-                                                                                Nicole Pearson
-                                                                                </b>
-                                                                            </h2>
-                                                                            <p class="text-muted text-sm">
-                                                                                <b>
-                                                                                About:
-                                                                                </b>
-                                                                                Web Designer / UX / Graphic Artist / Coffee Lover
-                                                                            </p>
-                                                                            <ul class="ml-4 mb-0 fa-ul text-muted">
-                                                                                <li class="small">
-                                                                                    <span class="fa-li">
-                                                                                        <i class="fas fa-lg fa-building"></i>
-                                                                                    </span>
-                                                                                    Address: Demo Street 123, Demo City 04312, NJ
-                                                                                </li>
-                                                                                <li class="small">
-                                                                                    <span class="fa-li">
-                                                                                        <i class="fas fa-lg fa-phone"></i>
-                                                                                    </span>
-                                                                                    Phone #: + 800 - 12 12 23 52
-                                                                                </li>
-                                                                            </ul>
-                                                                        </div>
-                                                                        <div class="col-5 text-center">
-                                                                            <img src="/static/assets/img/user2-160x160.jpg"
-                                                                                 alt="user-avatar"
-                                                                                 class="img-circle img-fluid">
-                                                                            </div>
-                                                                        </div>
-                                                                    </div>
-                                                                    <div class="card-footer">
-                                                                        <div class="text-right">
-                                                                            <a href="#" class="btn btn-sm bg-teal">
-                                                                                <i class="fas fa-comments"></i>
-                                                                            </a>
-                                                                            <a href="#" class="btn btn-sm btn-primary">
-                                                                                <i class="fas fa-user"></i>
-                                                                                View Profile
-                                                                            </a>
-                                                                        </div>
-                                                                    </div>
-                                                                </div>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <!-- /.card-body -->
-                                                    <div class="card-footer">
-                                                        <nav aria-label="Contacts Page Navigation">
-                                                            <ul class="pagination justify-content-center m-0">
-                                                                <li class="page-item active">
-                                                                    <a class="page-link" href="#">1</a>
-                                                                </li>
-                                                                <li class="page-item">
-                                                                    <a class="page-link" href="#">2</a>
-                                                                </li>
-                                                                <li class="page-item">
-                                                                    <a class="page-link" href="#">3</a>
-                                                                </li>
-                                                                <li class="page-item">
-                                                                    <a class="page-link" href="#">4</a>
-                                                                </li>
-                                                                <li class="page-item">
-                                                                    <a class="page-link" href="#">5</a>
-                                                                </li>
-                                                                <li class="page-item">
-                                                                    <a class="page-link" href="#">6</a>
-                                                                </li>
-                                                                <li class="page-item">
-                                                                    <a class="page-link" href="#">7</a>
-                                                                </li>
-                                                                <li class="page-item">
-                                                                    <a class="page-link" href="#">8</a>
-                                                                </li>
-                                                            </ul>
-                                                        </nav>
-                                                    </div>
-                                                    <!-- /.card-footer -->
-                                                </div>
-                                                <!-- /.card -->
-                                            </section>
-                                            <!-- /.content -->
+                                        <div class="col-5 text-center">
+                                            <img src="/static/assets/img/user2-160x160.jpg"
+                                                 alt="user-avatar"
+                                                 class="img-circle img-fluid">
                                         </div>
-                                        <!-- /.content-wrapper -->
-                                    {% endblock content %}
-                                    <!-- Specific Page JS goes HERE -->
-                                    {% block javascripts %}
-                                        <!-- jQuery -->
-                                        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                                        <!-- Bootstrap 4 -->
-                                        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                                        <!-- AdminLTE App -->
-                                        <script src="/static/assets/js/adminlte.min.js"></script>
-                                        <!-- AdminLTE for demo purposes -->
-                                        <script src="/static/assets/js/demo.js"></script>
-                                    {% endblock javascripts %}
+                                    </div>
+                                </div>
+                                <div class="card-footer">
+                                    <div class="text-right">
+                                        <a href="#" class="btn btn-sm bg-teal">
+                                            <i class="fas fa-comments"></i>
+                                        </a>
+                                        <a href="#" class="btn btn-sm btn-primary">
+                                            <i class="fas fa-user"></i>
+                                            View Profile
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
+                            <div class="card bg-light">
+                                <div class="card-header text-muted border-bottom-0">
+                                    Digital Strategist
+                                </div>
+                                <div class="card-body pt-0">
+                                    <div class="row">
+                                        <div class="col-7">
+                                            <h2 class="lead">
+                                                <b>
+                                                Nicole Pearson
+                                                </b>
+                                            </h2>
+                                            <p class="text-muted text-sm">
+                                                <b>
+                                                About:
+                                                </b>
+                                                Web Designer / UX / Graphic Artist / Coffee Lover
+                                            </p>
+                                            <ul class="ml-4 mb-0 fa-ul text-muted">
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-phone"></i>
+                                                    </span>
+                                                    Phone #: + 800 - 12 12 23 52
+                                                </li>
+                                            </ul>
+                                        </div>
+                                        <div class="col-5 text-center">
+                                            <img src="/static/assets/img/user1-128x128.jpg"
+                                                 alt="user-avatar"
+                                                 class="img-circle img-fluid">
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="card-footer">
+                                    <div class="text-right">
+                                        <a href="#" class="btn btn-sm bg-teal">
+                                            <i class="fas fa-comments"></i>
+                                        </a>
+                                        <a href="#" class="btn btn-sm btn-primary">
+                                            <i class="fas fa-user"></i>
+                                            View Profile
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
+                            <div class="card bg-light">
+                                <div class="card-header text-muted border-bottom-0">
+                                    Digital Strategist
+                                </div>
+                                <div class="card-body pt-0">
+                                    <div class="row">
+                                        <div class="col-7">
+                                            <h2 class="lead">
+                                                <b>
+                                                Nicole Pearson
+                                                </b>
+                                            </h2>
+                                            <p class="text-muted text-sm">
+                                                <b>
+                                                About:
+                                                </b>
+                                                Web Designer / UX / Graphic Artist / Coffee Lover
+                                            </p>
+                                            <ul class="ml-4 mb-0 fa-ul text-muted">
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-building"></i>
+                                                    </span>
+                                                    Address: Demo Street 123, Demo City 04312, NJ
+                                                </li>
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-phone"></i>
+                                                    </span>
+                                                    Phone #: + 800 - 12 12 23 52
+                                                </li>
+                                            </ul>
+                                        </div>
+                                        <div class="col-5 text-center">
+                                            <img src="/static/assets/img/user1-128x128.jpg"
+                                                 alt="user-avatar"
+                                                 class="img-circle img-fluid">
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="card-footer">
+                                    <div class="text-right">
+                                        <a href="#" class="btn btn-sm bg-teal">
+                                            <i class="fas fa-comments"></i>
+                                        </a>
+                                        <a href="#" class="btn btn-sm btn-primary">
+                                            <i class="fas fa-user"></i>
+                                            View Profile
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
+                            <div class="card bg-light">
+                                <div class="card-header text-muted border-bottom-0">
+                                    Digital Strategist
+                                </div>
+                                <div class="card-body pt-0">
+                                    <div class="row">
+                                        <div class="col-7">
+                                            <h2 class="lead">
+                                                <b>
+                                                Nicole Pearson
+                                                </b>
+                                            </h2>
+                                            <p class="text-muted text-sm">
+                                                <b>
+                                                About:
+                                                </b>
+                                                Web Designer / UX / Graphic Artist / Coffee Lover
+                                            </p>
+                                            <ul class="ml-4 mb-0 fa-ul text-muted">
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-building"></i>
+                                                    </span>
+                                                    Address: Demo Street 123, Demo City 04312, NJ
+                                                </li>
+                                            </ul>
+                                        </div>
+                                        <div class="col-5 text-center">
+                                            <img src="/static/assets/img/user1-128x128.jpg"
+                                                 alt="user-avatar"
+                                                 class="img-circle img-fluid">
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="card-footer">
+                                    <div class="text-right">
+                                        <a href="#" class="btn btn-sm bg-teal">
+                                            <i class="fas fa-comments"></i>
+                                        </a>
+                                        <a href="#" class="btn btn-sm btn-primary">
+                                            <i class="fas fa-user"></i>
+                                            View Profile
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
+                            <div class="card bg-light">
+                                <div class="card-header text-muted border-bottom-0">
+                                    Digital Strategist
+                                </div>
+                                <div class="card-body pt-0">
+                                    <div class="row">
+                                        <div class="col-7">
+                                            <h2 class="lead">
+                                                <b>
+                                                Nicole Pearson
+                                                </b>
+                                            </h2>
+                                            <p class="text-muted text-sm">
+                                                <b>
+                                                About:
+                                                </b>
+                                                Web Designer / UX / Graphic Artist / Coffee Lover
+                                            </p>
+                                            <ul class="ml-4 mb-0 fa-ul text-muted">
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-building"></i>
+                                                    </span>
+                                                    Address: Demo Street 123, Demo City 04312, NJ
+                                                </li>
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-phone"></i>
+                                                    </span>
+                                                    Phone #: + 800 - 12 12 23 52
+                                                </li>
+                                            </ul>
+                                        </div>
+                                        <div class="col-5 text-center">
+                                            <img src="/static/assets/img/user1-128x128.jpg"
+                                                 alt="user-avatar"
+                                                 class="img-circle img-fluid">
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="card-footer">
+                                    <div class="text-right">
+                                        <a href="#" class="btn btn-sm bg-teal">
+                                            <i class="fas fa-comments"></i>
+                                        </a>
+                                        <a href="#" class="btn btn-sm btn-primary">
+                                            <i class="fas fa-user"></i>
+                                            View Profile
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
+                            <div class="card bg-light">
+                                <div class="card-header text-muted border-bottom-0">
+                                    Digital Strategist
+                                </div>
+                                <div class="card-body pt-0">
+                                    <div class="row">
+                                        <div class="col-7">
+                                            <h2 class="lead">
+                                                <b>
+                                                Nicole Pearson
+                                                </b>
+                                            </h2>
+                                            <p class="text-muted text-sm">
+                                                <b>
+                                                About:
+                                                </b>
+                                                Web Designer / UX / Graphic Artist / Coffee Lover
+                                            </p>
+                                            <ul class="ml-4 mb-0 fa-ul text-muted">
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-building"></i>
+                                                    </span>
+                                                    Address: Demo Street 123, Demo City 04312, NJ
+                                                </li>
+                                                <li class="small">
+                                                    <span class="fa-li">
+                                                        <i class="fas fa-lg fa-phone"></i>
+                                                    </span>
+                                                    Phone #: + 800 - 12 12 23 52
+                                                </li>
+                                            </ul>
+                                        </div>
+                                        <div class="col-5 text-center">
+                                            <img src="/static/assets/img/user2-160x160.jpg"
+                                                 alt="user-avatar"
+                                                 class="img-circle img-fluid">
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="card-footer">
+                                    <div class="text-right">
+                                        <a href="#" class="btn btn-sm bg-teal">
+                                            <i class="fas fa-comments"></i>
+                                        </a>
+                                        <a href="#" class="btn btn-sm btn-primary">
+                                            <i class="fas fa-user"></i>
+                                            View Profile
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <!-- /.card-body -->
+                <div class="card-footer">
+                    <nav aria-label="Contacts Page Navigation">
+                        <ul class="pagination justify-content-center m-0">
+                            <li class="page-item active">
+                                <a class="page-link" href="#">1</a>
+                            </li>
+                            <li class="page-item">
+                                <a class="page-link" href="#">2</a>
+                            </li>
+                            <li class="page-item">
+                                <a class="page-link" href="#">3</a>
+                            </li>
+                            <li class="page-item">
+                                <a class="page-link" href="#">4</a>
+                            </li>
+                            <li class="page-item">
+                                <a class="page-link" href="#">5</a>
+                            </li>
+                            <li class="page-item">
+                                <a class="page-link" href="#">6</a>
+                            </li>
+                            <li class="page-item">
+                                <a class="page-link" href="#">7</a>
+                            </li>
+                            <li class="page-item">
+                                <a class="page-link" href="#">8</a>
+                            </li>
+                        </ul>
+                    </nav>
+                </div>
+                <!-- /.card-footer -->
+            </div>
+            <!-- /.card -->
+        </section>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/examples-e-commerce.html b/tests/jinja_adminlte/examples-e-commerce.html
index a9923c9..93ff4fa 100644
--- a/tests/jinja_adminlte/examples-e-commerce.html
+++ b/tests/jinja_adminlte/examples-e-commerce.html
@@ -49,227 +49,203 @@
                             </h3>
                             <div class="col-12">
                                 <img src="/static/assets/img/prod-1.jpg" class="product-image" alt="Product Image">
-                                </div>
-                                <div class="col-12 product-image-thumbs">
-                                    <div class="product-image-thumb active">
-                                        <img src="/static/assets/img/prod-1.jpg" alt="Product Image">
-                                        </div>
-                                        <div class="product-image-thumb" >
-                                            <img src="/static/assets/img/prod-2.jpg" alt="Product Image">
-                                            </div>
-                                            <div class="product-image-thumb" >
-                                                <img src="/static/assets/img/prod-3.jpg" alt="Product Image">
-                                                </div>
-                                                <div class="product-image-thumb" >
-                                                    <img src="/static/assets/img/prod-4.jpg" alt="Product Image">
-                                                    </div>
-                                                    <div class="product-image-thumb" >
-                                                        <img src="/static/assets/img/prod-5.jpg" alt="Product Image">
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                                <div class="col-12 col-sm-6">
-                                                    <h3 class="my-3">LOWA Men’s Renegade GTX Mid Hiking Boots Review</h3>
-                                                    <p>
-                                                        Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terr.
-                                                    </p>
-                                                    <hr>
-                                                    <h4>Available Colors</h4>
-                                                    <div class="btn-group btn-group-toggle" data-toggle="buttons">
-                                                        <label class="btn btn-default text-center active">
-                                                            <input type="radio"
-                                                                   name="color_option"
-                                                                   id="color_option_a1"
-                                                                   autocomplete="off"
-                                                                   checked>
-                                                            Green
-                                                            <br>
-                                                            <i class="fas fa-circle fa-2x text-green"></i>
-                                                        </label>
-                                                        <label class="btn btn-default text-center">
-                                                            <input type="radio"
-                                                                   name="color_option"
-                                                                   id="color_option_a2"
-                                                                   autocomplete="off">
-                                                            Blue
-                                                            <br>
-                                                            <i class="fas fa-circle fa-2x text-blue"></i>
-                                                        </label>
-                                                        <label class="btn btn-default text-center">
-                                                            <input type="radio"
-                                                                   name="color_option"
-                                                                   id="color_option_a3"
-                                                                   autocomplete="off">
-                                                            Purple
-                                                            <br>
-                                                            <i class="fas fa-circle fa-2x text-purple"></i>
-                                                        </label>
-                                                        <label class="btn btn-default text-center">
-                                                            <input type="radio"
-                                                                   name="color_option"
-                                                                   id="color_option_a4"
-                                                                   autocomplete="off">
-                                                            Red
-                                                            <br>
-                                                            <i class="fas fa-circle fa-2x text-red"></i>
-                                                        </label>
-                                                        <label class="btn btn-default text-center">
-                                                            <input type="radio"
-                                                                   name="color_option"
-                                                                   id="color_option_a5"
-                                                                   autocomplete="off">
-                                                            Orange
-                                                            <br>
-                                                            <i class="fas fa-circle fa-2x text-orange"></i>
-                                                        </label>
-                                                    </div>
-                                                    <h4 class="mt-3">
-                                                        Size
-                                                        <small>
-                                                        Please select one
-                                                        </small>
-                                                    </h4>
-                                                    <div class="btn-group btn-group-toggle" data-toggle="buttons">
-                                                        <label class="btn btn-default text-center">
-                                                            <input type="radio"
-                                                                   name="color_option"
-                                                                   id="color_option_b1"
-                                                                   autocomplete="off">
-                                                            <span class="text-xl">S</span>
-                                                            <br>
-                                                            Small
-                                                        </label>
-                                                        <label class="btn btn-default text-center">
-                                                            <input type="radio"
-                                                                   name="color_option"
-                                                                   id="color_option_b2"
-                                                                   autocomplete="off">
-                                                            <span class="text-xl">M</span>
-                                                            <br>
-                                                            Medium
-                                                        </label>
-                                                        <label class="btn btn-default text-center">
-                                                            <input type="radio"
-                                                                   name="color_option"
-                                                                   id="color_option_b3"
-                                                                   autocomplete="off">
-                                                            <span class="text-xl">L</span>
-                                                            <br>
-                                                            Large
-                                                        </label>
-                                                        <label class="btn btn-default text-center">
-                                                            <input type="radio"
-                                                                   name="color_option"
-                                                                   id="color_option_b4"
-                                                                   autocomplete="off">
-                                                            <span class="text-xl">XL</span>
-                                                            <br>
-                                                            Xtra-Large
-                                                        </label>
-                                                    </div>
-                                                    <div class="bg-gray py-2 px-3 mt-4">
-                                                        <h2 class="mb-0">$80.00</h2>
-                                                        <h4 class="mt-0">
-                                                            <small>
-                                                            Ex Tax: $80.00
-                                                            </small>
-                                                        </h4>
-                                                    </div>
-                                                    <div class="mt-4">
-                                                        <div class="btn btn-primary btn-lg btn-flat">
-                                                            <i class="fas fa-cart-plus fa-lg mr-2"></i>
-                                                            Add to Cart
-                                                        </div>
-                                                        <div class="btn btn-default btn-lg btn-flat">
-                                                            <i class="fas fa-heart fa-lg mr-2"></i>
-                                                            Add to Wishlist
-                                                        </div>
-                                                    </div>
-                                                    <div class="mt-4 product-share">
-                                                        <a href="#" class="text-gray">
-                                                            <i class="fab fa-facebook-square fa-2x"></i>
-                                                        </a>
-                                                        <a href="#" class="text-gray">
-                                                            <i class="fab fa-twitter-square fa-2x"></i>
-                                                        </a>
-                                                        <a href="#" class="text-gray">
-                                                            <i class="fas fa-envelope-square fa-2x"></i>
-                                                        </a>
-                                                        <a href="#" class="text-gray">
-                                                            <i class="fas fa-rss-square fa-2x"></i>
-                                                        </a>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <div class="row mt-4">
-                                                <nav class="w-100">
-                                                    <div class="nav nav-tabs" id="product-tab" role="tablist">
-                                                        <a class="nav-item nav-link active"
-                                                           id="product-desc-tab"
-                                                           data-toggle="tab"
-                                                           href="#product-desc"
-                                                           role="tab"
-                                                           aria-controls="product-desc"
-                                                           aria-selected="true">
-                                                            Description
-                                                        </a>
-                                                        <a class="nav-item nav-link"
-                                                           id="product-comments-tab"
-                                                           data-toggle="tab"
-                                                           href="#product-comments"
-                                                           role="tab"
-                                                           aria-controls="product-comments"
-                                                           aria-selected="false">
-                                                            Comments
-                                                        </a>
-                                                        <a class="nav-item nav-link"
-                                                           id="product-rating-tab"
-                                                           data-toggle="tab"
-                                                           href="#product-rating"
-                                                           role="tab"
-                                                           aria-controls="product-rating"
-                                                           aria-selected="false">
-                                                            Rating
-                                                        </a>
-                                                    </div>
-                                                </nav>
-                                                <div class="tab-content p-3" id="nav-tabContent">
-                                                    <div class="tab-pane fade show active"
-                                                         id="product-desc"
-                                                         role="tabpanel"
-                                                         aria-labelledby="product-desc-tab">
-                                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vitae condimentum erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed posuere, purus at efficitur hendrerit, augue elit lacinia arcu, a eleifend sem elit et nunc. Sed rutrum vestibulum est, sit amet cursus dolor fermentum vel. Suspendisse mi nibh, congue et ante et, commodo mattis lacus. Duis varius finibus purus sed venenatis. Vivamus varius metus quam, id dapibus velit mattis eu. Praesent et semper risus. Vestibulum erat erat, condimentum at elit at, bibendum placerat orci. Nullam gravida velit mauris, in pellentesque urna pellentesque viverra. Nullam non pellentesque justo, et ultricies neque. Praesent vel metus rutrum, tempus erat a, rutrum ante. Quisque interdum efficitur nunc vitae consectetur. Suspendisse venenatis, tortor non convallis interdum, urna mi molestie eros, vel tempor justo lacus ac justo. Fusce id enim a erat fringilla sollicitudin ultrices vel metus.
-                                                    </div>
-                                                    <div class="tab-pane fade"
-                                                         id="product-comments"
-                                                         role="tabpanel"
-                                                         aria-labelledby="product-comments-tab">
-                                                        Vivamus rhoncus nisl sed venenatis luctus. Sed condimentum risus ut tortor feugiat laoreet. Suspendisse potenti. Donec et finibus sem, ut commodo lectus. Cras eget neque dignissim, placerat orci interdum, venenatis odio. Nulla turpis elit, consequat eu eros ac, consectetur fringilla urna. Duis gravida ex pulvinar mauris ornare, eget porttitor enim vulputate. Mauris hendrerit, massa nec aliquam cursus, ex elit euismod lorem, vehicula rhoncus nisl dui sit amet eros. Nulla turpis lorem, dignissim a sapien eget, ultrices venenatis dolor. Curabitur vel turpis at magna elementum hendrerit vel id dui. Curabitur a ex ullamcorper, ornare velit vel, tincidunt ipsum.
-                                                    </div>
-                                                    <div class="tab-pane fade"
-                                                         id="product-rating"
-                                                         role="tabpanel"
-                                                         aria-labelledby="product-rating-tab">
-                                                        Cras ut ipsum ornare, aliquam ipsum non, posuere elit. In hac habitasse platea dictumst. Aenean elementum leo augue, id fermentum risus efficitur vel. Nulla iaculis malesuada scelerisque. Praesent vel ipsum felis. Ut molestie, purus aliquam placerat sollicitudin, mi ligula euismod neque, non bibendum nibh neque et erat. Etiam dignissim aliquam ligula, aliquet feugiat nibh rhoncus ut. Aliquam efficitur lacinia lacinia. Morbi ac molestie lectus, vitae hendrerit nisl. Nullam metus odio, malesuada in vehicula at, consectetur nec justo. Quisque suscipit odio velit, at accumsan urna vestibulum a. Proin dictum, urna ut varius consectetur, sapien justo porta lectus, at mollis nisi orci et nulla. Donec pellentesque tortor vel nisl commodo ullamcorper. Donec varius massa at semper posuere. Integer finibus orci vitae vehicula placerat.
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <!-- /.card-body -->
-                                    </div>
-                                    <!-- /.card -->
-                                </section>
-                                <!-- /.content -->
                             </div>
-                        {% endblock content %}
-                        <!-- Specific Page JS goes HERE -->
-                        {% block javascripts %}
-                            <!-- jQuery -->
-                            <script src="/static/assets/plugins//jquery/jquery.min.js"></script>
-                            <!-- Bootstrap 4 -->
-                            <script src="/static/assets/plugins//bootstrap/js/bootstrap.bundle.min.js"></script>
-                            <!-- AdminLTE App -->
-                            <script src="/static/assets/js/adminlte.min.js"></script>
-                            <!-- AdminLTE for demo purposes -->
-                            <script src="/static/assets/js/demo.js"></script>
-                        {% endblock javascripts %}
+                            <div class="col-12 product-image-thumbs">
+                                <div class="product-image-thumb active">
+                                    <img src="/static/assets/img/prod-1.jpg" alt="Product Image">
+                                </div>
+                                <div class="product-image-thumb" >
+                                    <img src="/static/assets/img/prod-2.jpg" alt="Product Image">
+                                </div>
+                                <div class="product-image-thumb" >
+                                    <img src="/static/assets/img/prod-3.jpg" alt="Product Image">
+                                </div>
+                                <div class="product-image-thumb" >
+                                    <img src="/static/assets/img/prod-4.jpg" alt="Product Image">
+                                </div>
+                                <div class="product-image-thumb" >
+                                    <img src="/static/assets/img/prod-5.jpg" alt="Product Image">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-12 col-sm-6">
+                            <h3 class="my-3">LOWA Men’s Renegade GTX Mid Hiking Boots Review</h3>
+                            <p>
+                                Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terr.
+                            </p>
+                            <hr>
+                            <h4>Available Colors</h4>
+                            <div class="btn-group btn-group-toggle" data-toggle="buttons">
+                                <label class="btn btn-default text-center active">
+                                    <input type="radio"
+                                           name="color_option"
+                                           id="color_option_a1"
+                                           autocomplete="off"
+                                           checked>
+                                    Green
+                                    <br>
+                                    <i class="fas fa-circle fa-2x text-green"></i>
+                                </label>
+                                <label class="btn btn-default text-center">
+                                    <input type="radio" name="color_option" id="color_option_a2" autocomplete="off">
+                                    Blue
+                                    <br>
+                                    <i class="fas fa-circle fa-2x text-blue"></i>
+                                </label>
+                                <label class="btn btn-default text-center">
+                                    <input type="radio" name="color_option" id="color_option_a3" autocomplete="off">
+                                    Purple
+                                    <br>
+                                    <i class="fas fa-circle fa-2x text-purple"></i>
+                                </label>
+                                <label class="btn btn-default text-center">
+                                    <input type="radio" name="color_option" id="color_option_a4" autocomplete="off">
+                                    Red
+                                    <br>
+                                    <i class="fas fa-circle fa-2x text-red"></i>
+                                </label>
+                                <label class="btn btn-default text-center">
+                                    <input type="radio" name="color_option" id="color_option_a5" autocomplete="off">
+                                    Orange
+                                    <br>
+                                    <i class="fas fa-circle fa-2x text-orange"></i>
+                                </label>
+                            </div>
+                            <h4 class="mt-3">
+                                Size
+                                <small>
+                                Please select one
+                                </small>
+                            </h4>
+                            <div class="btn-group btn-group-toggle" data-toggle="buttons">
+                                <label class="btn btn-default text-center">
+                                    <input type="radio" name="color_option" id="color_option_b1" autocomplete="off">
+                                    <span class="text-xl">S</span>
+                                    <br>
+                                    Small
+                                </label>
+                                <label class="btn btn-default text-center">
+                                    <input type="radio" name="color_option" id="color_option_b2" autocomplete="off">
+                                    <span class="text-xl">M</span>
+                                    <br>
+                                    Medium
+                                </label>
+                                <label class="btn btn-default text-center">
+                                    <input type="radio" name="color_option" id="color_option_b3" autocomplete="off">
+                                    <span class="text-xl">L</span>
+                                    <br>
+                                    Large
+                                </label>
+                                <label class="btn btn-default text-center">
+                                    <input type="radio" name="color_option" id="color_option_b4" autocomplete="off">
+                                    <span class="text-xl">XL</span>
+                                    <br>
+                                    Xtra-Large
+                                </label>
+                            </div>
+                            <div class="bg-gray py-2 px-3 mt-4">
+                                <h2 class="mb-0">$80.00</h2>
+                                <h4 class="mt-0">
+                                    <small>
+                                    Ex Tax: $80.00
+                                    </small>
+                                </h4>
+                            </div>
+                            <div class="mt-4">
+                                <div class="btn btn-primary btn-lg btn-flat">
+                                    <i class="fas fa-cart-plus fa-lg mr-2"></i>
+                                    Add to Cart
+                                </div>
+                                <div class="btn btn-default btn-lg btn-flat">
+                                    <i class="fas fa-heart fa-lg mr-2"></i>
+                                    Add to Wishlist
+                                </div>
+                            </div>
+                            <div class="mt-4 product-share">
+                                <a href="#" class="text-gray">
+                                    <i class="fab fa-facebook-square fa-2x"></i>
+                                </a>
+                                <a href="#" class="text-gray">
+                                    <i class="fab fa-twitter-square fa-2x"></i>
+                                </a>
+                                <a href="#" class="text-gray">
+                                    <i class="fas fa-envelope-square fa-2x"></i>
+                                </a>
+                                <a href="#" class="text-gray">
+                                    <i class="fas fa-rss-square fa-2x"></i>
+                                </a>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="row mt-4">
+                        <nav class="w-100">
+                            <div class="nav nav-tabs" id="product-tab" role="tablist">
+                                <a class="nav-item nav-link active"
+                                   id="product-desc-tab"
+                                   data-toggle="tab"
+                                   href="#product-desc"
+                                   role="tab"
+                                   aria-controls="product-desc"
+                                   aria-selected="true">
+                                    Description
+                                </a>
+                                <a class="nav-item nav-link"
+                                   id="product-comments-tab"
+                                   data-toggle="tab"
+                                   href="#product-comments"
+                                   role="tab"
+                                   aria-controls="product-comments"
+                                   aria-selected="false">
+                                    Comments
+                                </a>
+                                <a class="nav-item nav-link"
+                                   id="product-rating-tab"
+                                   data-toggle="tab"
+                                   href="#product-rating"
+                                   role="tab"
+                                   aria-controls="product-rating"
+                                   aria-selected="false">
+                                    Rating
+                                </a>
+                            </div>
+                        </nav>
+                        <div class="tab-content p-3" id="nav-tabContent">
+                            <div class="tab-pane fade show active"
+                                 id="product-desc"
+                                 role="tabpanel"
+                                 aria-labelledby="product-desc-tab">
+                                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vitae condimentum erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed posuere, purus at efficitur hendrerit, augue elit lacinia arcu, a eleifend sem elit et nunc. Sed rutrum vestibulum est, sit amet cursus dolor fermentum vel. Suspendisse mi nibh, congue et ante et, commodo mattis lacus. Duis varius finibus purus sed venenatis. Vivamus varius metus quam, id dapibus velit mattis eu. Praesent et semper risus. Vestibulum erat erat, condimentum at elit at, bibendum placerat orci. Nullam gravida velit mauris, in pellentesque urna pellentesque viverra. Nullam non pellentesque justo, et ultricies neque. Praesent vel metus rutrum, tempus erat a, rutrum ante. Quisque interdum efficitur nunc vitae consectetur. Suspendisse venenatis, tortor non convallis interdum, urna mi molestie eros, vel tempor justo lacus ac justo. Fusce id enim a erat fringilla sollicitudin ultrices vel metus.
+                            </div>
+                            <div class="tab-pane fade"
+                                 id="product-comments"
+                                 role="tabpanel"
+                                 aria-labelledby="product-comments-tab">
+                                Vivamus rhoncus nisl sed venenatis luctus. Sed condimentum risus ut tortor feugiat laoreet. Suspendisse potenti. Donec et finibus sem, ut commodo lectus. Cras eget neque dignissim, placerat orci interdum, venenatis odio. Nulla turpis elit, consequat eu eros ac, consectetur fringilla urna. Duis gravida ex pulvinar mauris ornare, eget porttitor enim vulputate. Mauris hendrerit, massa nec aliquam cursus, ex elit euismod lorem, vehicula rhoncus nisl dui sit amet eros. Nulla turpis lorem, dignissim a sapien eget, ultrices venenatis dolor. Curabitur vel turpis at magna elementum hendrerit vel id dui. Curabitur a ex ullamcorper, ornare velit vel, tincidunt ipsum.
+                            </div>
+                            <div class="tab-pane fade"
+                                 id="product-rating"
+                                 role="tabpanel"
+                                 aria-labelledby="product-rating-tab">
+                                Cras ut ipsum ornare, aliquam ipsum non, posuere elit. In hac habitasse platea dictumst. Aenean elementum leo augue, id fermentum risus efficitur vel. Nulla iaculis malesuada scelerisque. Praesent vel ipsum felis. Ut molestie, purus aliquam placerat sollicitudin, mi ligula euismod neque, non bibendum nibh neque et erat. Etiam dignissim aliquam ligula, aliquet feugiat nibh rhoncus ut. Aliquam efficitur lacinia lacinia. Morbi ac molestie lectus, vitae hendrerit nisl. Nullam metus odio, malesuada in vehicula at, consectetur nec justo. Quisque suscipit odio velit, at accumsan urna vestibulum a. Proin dictum, urna ut varius consectetur, sapien justo porta lectus, at mollis nisi orci et nulla. Donec pellentesque tortor vel nisl commodo ullamcorper. Donec varius massa at semper posuere. Integer finibus orci vitae vehicula placerat.
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <!-- /.card-body -->
+            </div>
+            <!-- /.card -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins//jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins//bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/examples-invoice-print.html b/tests/jinja_adminlte/examples-invoice-print.html
index b8f51d0..9d6953b 100644
--- a/tests/jinja_adminlte/examples-invoice-print.html
+++ b/tests/jinja_adminlte/examples-invoice-print.html
@@ -176,63 +176,63 @@
                             Payment Methods:
                         </p>
                         <img src="/static/assets/img/credit/visa.png" alt="Visa">
-                            <img src="/static/assets/img/credit/mastercard.png" alt="Mastercard">
-                                <img src="/static/assets/img/credit/american-express.png" alt="American Express">
-                                    <img src="/static/assets/img/credit/paypal2.png" alt="Paypal">
-                                        <p class="text-muted well well-sm shadow-none" style="margin-top: 10px;">
-                                            Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles, weebly ning heekya handango imeem plugg dopplr
-                                            jibjab, movity jajah plickers sifteo edmodo ifttt zimbra.
-                                        </p>
-                                    </div>
-                                    <!-- /.col -->
-                                    <div class="col-6">
-                                        <p class="lead">
-                                            Amount Due 2/22/2014
-                                        </p>
-                                        <div class="table-responsive">
-                                            <table class="table">
-                                                <tr>
-                                                    <th style="width:50%">Subtotal:</th>
-                                                    <td>
-                                                        $250.30
-                                                    </td>
-                                                </tr>
-                                                <tr>
-                                                    <th>
-                                                        Tax (9.3%)
-                                                    </th>
-                                                    <td>
-                                                        $10.34
-                                                    </td>
-                                                </tr>
-                                                <tr>
-                                                    <th>
-                                                        Shipping:
-                                                    </th>
-                                                    <td>
-                                                        $5.80
-                                                    </td>
-                                                </tr>
-                                                <tr>
-                                                    <th>
-                                                        Total:
-                                                    </th>
-                                                    <td>
-                                                        $265.24
-                                                    </td>
-                                                </tr>
-                                            </table>
-                                        </div>
-                                    </div>
-                                    <!-- /.col -->
-                                </div>
-                                <!-- /.row -->
-                            </section>
-                            <!-- /.content -->
+                        <img src="/static/assets/img/credit/mastercard.png" alt="Mastercard">
+                        <img src="/static/assets/img/credit/american-express.png" alt="American Express">
+                        <img src="/static/assets/img/credit/paypal2.png" alt="Paypal">
+                        <p class="text-muted well well-sm shadow-none" style="margin-top: 10px;">
+                            Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles, weebly ning heekya handango imeem plugg dopplr
+                            jibjab, movity jajah plickers sifteo edmodo ifttt zimbra.
+                        </p>
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-6">
+                        <p class="lead">
+                            Amount Due 2/22/2014
+                        </p>
+                        <div class="table-responsive">
+                            <table class="table">
+                                <tr>
+                                    <th style="width:50%">Subtotal:</th>
+                                    <td>
+                                        $250.30
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <th>
+                                        Tax (9.3%)
+                                    </th>
+                                    <td>
+                                        $10.34
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <th>
+                                        Shipping:
+                                    </th>
+                                    <td>
+                                        $5.80
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <th>
+                                        Total:
+                                    </th>
+                                    <td>
+                                        $265.24
+                                    </td>
+                                </tr>
+                            </table>
                         </div>
-                        <!-- ./wrapper -->
-                        <script>
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+            </section>
+            <!-- /.content -->
+        </div>
+        <!-- ./wrapper -->
+        <script>
   window.addEventListener("load", window.print());
-                        </script>
-                    </body>
-                </html>
+        </script>
+    </body>
+</html>
diff --git a/tests/jinja_adminlte/examples-invoice.html b/tests/jinja_adminlte/examples-invoice.html
index df31e82..406f2e8 100644
--- a/tests/jinja_adminlte/examples-invoice.html
+++ b/tests/jinja_adminlte/examples-invoice.html
@@ -211,103 +211,101 @@
                                         Payment Methods:
                                     </p>
                                     <img src="/static/assets/img/credit/visa.png" alt="Visa">
-                                        <img src="/static/assets/img/credit/mastercard.png" alt="Mastercard">
-                                            <img src="/static/assets/img/credit/american-express.png"
-                                                 alt="American Express">
-                                                <img src="/static/assets/img/credit/paypal2.png" alt="Paypal">
-                                                    <p class="text-muted well well-sm shadow-none"
-                                                       style="margin-top: 10px;">
-                                                        Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles, weebly ning heekya handango imeem
-                                                        plugg
-                                                        dopplr jibjab, movity jajah plickers sifteo edmodo ifttt zimbra.
-                                                    </p>
-                                                </div>
-                                                <!-- /.col -->
-                                                <div class="col-6">
-                                                    <p class="lead">
-                                                        Amount Due 2/22/2014
-                                                    </p>
-                                                    <div class="table-responsive">
-                                                        <table class="table">
-                                                            <tr>
-                                                                <th style="width:50%">Subtotal:</th>
-                                                                <td>
-                                                                    $250.30
-                                                                </td>
-                                                            </tr>
-                                                            <tr>
-                                                                <th>
-                                                                    Tax (9.3%)
-                                                                </th>
-                                                                <td>
-                                                                    $10.34
-                                                                </td>
-                                                            </tr>
-                                                            <tr>
-                                                                <th>
-                                                                    Shipping:
-                                                                </th>
-                                                                <td>
-                                                                    $5.80
-                                                                </td>
-                                                            </tr>
-                                                            <tr>
-                                                                <th>
-                                                                    Total:
-                                                                </th>
-                                                                <td>
-                                                                    $265.24
-                                                                </td>
-                                                            </tr>
-                                                        </table>
-                                                    </div>
-                                                </div>
-                                                <!-- /.col -->
-                                            </div>
-                                            <!-- /.row -->
-                                            <!-- this row will not appear when printing -->
-                                            <div class="row no-print">
-                                                <div class="col-12">
-                                                    <a href="invoice-print.html"
-                                                       rel="noopener"
-                                                       target="_blank"
-                                                       class="btn btn-default">
-                                                        <i class="fas fa-print"></i>
-                                                        Print
-                                                    </a>
-                                                    <button type="button" class="btn btn-success float-right">
-                                                        <i class="far fa-credit-card"></i>
-                                                        Submit
-                                                        Payment
-                                                    </button>
-                                                    <button type="button"
-                                                            class="btn btn-primary float-right"
-                                                            style="margin-right: 5px;">
-                                                        <i class="fas fa-download"></i>
-                                                        Generate PDF
-                                                    </button>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <!-- /.invoice -->
-                                    </div>
-                                    <!-- /.col -->
+                                    <img src="/static/assets/img/credit/mastercard.png" alt="Mastercard">
+                                    <img src="/static/assets/img/credit/american-express.png" alt="American Express">
+                                    <img src="/static/assets/img/credit/paypal2.png" alt="Paypal">
+                                    <p class="text-muted well well-sm shadow-none" style="margin-top: 10px;">
+                                        Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles, weebly ning heekya handango imeem
+                                        plugg
+                                        dopplr jibjab, movity jajah plickers sifteo edmodo ifttt zimbra.
+                                    </p>
                                 </div>
-                                <!-- /.row -->
+                                <!-- /.col -->
+                                <div class="col-6">
+                                    <p class="lead">
+                                        Amount Due 2/22/2014
+                                    </p>
+                                    <div class="table-responsive">
+                                        <table class="table">
+                                            <tr>
+                                                <th style="width:50%">Subtotal:</th>
+                                                <td>
+                                                    $250.30
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <th>
+                                                    Tax (9.3%)
+                                                </th>
+                                                <td>
+                                                    $10.34
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <th>
+                                                    Shipping:
+                                                </th>
+                                                <td>
+                                                    $5.80
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <th>
+                                                    Total:
+                                                </th>
+                                                <td>
+                                                    $265.24
+                                                </td>
+                                            </tr>
+                                        </table>
+                                    </div>
+                                </div>
+                                <!-- /.col -->
                             </div>
-                            <!-- /.container-fluid -->
-                        </section>
-                        <!-- /.content -->
+                            <!-- /.row -->
+                            <!-- this row will not appear when printing -->
+                            <div class="row no-print">
+                                <div class="col-12">
+                                    <a href="invoice-print.html"
+                                       rel="noopener"
+                                       target="_blank"
+                                       class="btn btn-default">
+                                        <i class="fas fa-print"></i>
+                                        Print
+                                    </a>
+                                    <button type="button" class="btn btn-success float-right">
+                                        <i class="far fa-credit-card"></i>
+                                        Submit
+                                        Payment
+                                    </button>
+                                    <button type="button"
+                                            class="btn btn-primary float-right"
+                                            style="margin-right: 5px;">
+                                        <i class="fas fa-download"></i>
+                                        Generate PDF
+                                    </button>
+                                </div>
+                            </div>
+                        </div>
+                        <!-- /.invoice -->
                     </div>
-                {% endblock content %}
-                <!-- Specific Page JS goes HERE -->
-                {% block javascripts %}
-                    <!-- jQuery -->
-                    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                    <!-- Bootstrap 4 -->
-                    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                    <!-- AdminLTE App -->
-                    <script src="/static/assets/js/adminlte.min.js"></script>
-                    <!-- AdminLTE for demo purposes -->
-                    <script src="/static/assets/js/demo.js"></script>
-                {% endblock javascripts %}
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/examples-lockscreen.html b/tests/jinja_adminlte/examples-lockscreen.html
index 6d99ed0..8e6883b 100644
--- a/tests/jinja_adminlte/examples-lockscreen.html
+++ b/tests/jinja_adminlte/examples-lockscreen.html
@@ -33,45 +33,45 @@
             <!-- lockscreen image -->
             <div class="lockscreen-image">
                 <img src="/static/assets/img/user1-128x128.jpg" alt="User Image">
-                </div>
-                <!-- /.lockscreen-image -->
-                <!-- lockscreen credentials (contains the form) -->
-                <form class="lockscreen-credentials">
-                    <div class="input-group">
-                        <input type="password" class="form-control" placeholder="password">
-                        <div class="input-group-append">
-                            <button type="button" class="btn">
-                                <i class="fas fa-arrow-right text-muted"></i>
-                            </button>
-                        </div>
+            </div>
+            <!-- /.lockscreen-image -->
+            <!-- lockscreen credentials (contains the form) -->
+            <form class="lockscreen-credentials">
+                <div class="input-group">
+                    <input type="password" class="form-control" placeholder="password">
+                    <div class="input-group-append">
+                        <button type="button" class="btn">
+                            <i class="fas fa-arrow-right text-muted"></i>
+                        </button>
                     </div>
-                </form>
-                <!-- /.lockscreen credentials -->
-            </div>
-            <!-- /.lockscreen-item -->
-            <div class="help-block text-center">
-                Enter your password to retrieve your session
-            </div>
-            <div class="text-center">
-                <a href="login.html">Or sign in as a different user</a>
-            </div>
-            <div class="lockscreen-footer text-center">
-                Copyright &copy; 2014-2020
-                <b>
-                <a href="https://adminlte.io" class="text-black">
-                    AdminLTE.io
-                </a>
-                </b>
-                <br>
-                All rights reserved
-            </div>
+                </div>
+            </form>
+            <!-- /.lockscreen credentials -->
         </div>
-        <!-- /.center -->
-    {% endblock content %}
-    <!-- Specific Page JS goes HERE -->
-    {% block javascripts %}
-        <!-- jQuery -->
-        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-        <!-- Bootstrap 4 -->
-        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-    {% endblock javascripts %}
+        <!-- /.lockscreen-item -->
+        <div class="help-block text-center">
+            Enter your password to retrieve your session
+        </div>
+        <div class="text-center">
+            <a href="login.html">Or sign in as a different user</a>
+        </div>
+        <div class="lockscreen-footer text-center">
+            Copyright &copy; 2014-2020
+            <b>
+            <a href="https://adminlte.io" class="text-black">
+                AdminLTE.io
+            </a>
+            </b>
+            <br>
+            All rights reserved
+        </div>
+    </div>
+    <!-- /.center -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/examples-login.html b/tests/jinja_adminlte/examples-login.html
index e0ff5cf..1b90176 100644
--- a/tests/jinja_adminlte/examples-login.html
+++ b/tests/jinja_adminlte/examples-login.html
@@ -53,9 +53,7 @@
                         <div class="col-8">
                             <div class="icheck-primary">
                                 <input type="checkbox" id="remember">
-                                <label for="remember">
-                                    Remember Me
-                                </label>
+                                <label for="remember">Remember Me</label>
                             </div>
                         </div>
                         <!-- /.col -->
diff --git a/tests/jinja_adminlte/examples-profile.html b/tests/jinja_adminlte/examples-profile.html
index 90d000d..dd97159 100644
--- a/tests/jinja_adminlte/examples-profile.html
+++ b/tests/jinja_adminlte/examples-profile.html
@@ -50,517 +50,499 @@
                                     <img class="profile-user-img img-fluid img-circle"
                                          src="/static/assets/img/user4-128x128.jpg"
                                          alt="User profile picture">
-                                    </div>
-                                    <h3 class="profile-username text-center">
-                                        Nina Mcintire
-                                    </h3>
-                                    <p class="text-muted text-center">
-                                        Software Engineer
-                                    </p>
-                                    <ul class="list-group list-group-unbordered mb-3">
-                                        <li class="list-group-item">
-                                            <b>
-                                            Followers
-                                            </b>
-                                            <a class="float-right">1,322</a>
-                                        </li>
-                                        <li class="list-group-item">
-                                            <b>
-                                            Following
-                                            </b>
-                                            <a class="float-right">543</a>
-                                        </li>
-                                        <li class="list-group-item">
-                                            <b>
-                                            Friends
-                                            </b>
-                                            <a class="float-right">13,287</a>
-                                        </li>
-                                    </ul>
-                                    <a href="#" class="btn btn-primary btn-block">
+                                </div>
+                                <h3 class="profile-username text-center">
+                                    Nina Mcintire
+                                </h3>
+                                <p class="text-muted text-center">
+                                    Software Engineer
+                                </p>
+                                <ul class="list-group list-group-unbordered mb-3">
+                                    <li class="list-group-item">
                                         <b>
-                                        Follow
+                                        Followers
                                         </b>
-                                    </a>
-                                </div>
-                                <!-- /.card-body -->
+                                        <a class="float-right">1,322</a>
+                                    </li>
+                                    <li class="list-group-item">
+                                        <b>
+                                        Following
+                                        </b>
+                                        <a class="float-right">543</a>
+                                    </li>
+                                    <li class="list-group-item">
+                                        <b>
+                                        Friends
+                                        </b>
+                                        <a class="float-right">13,287</a>
+                                    </li>
+                                </ul>
+                                <a href="#" class="btn btn-primary btn-block">
+                                    <b>
+                                    Follow
+                                    </b>
+                                </a>
                             </div>
-                            <!-- /.card -->
-                            <!-- About Me Box -->
-                            <div class="card card-primary">
-                                <div class="card-header">
-                                    <h3 class="card-title">About Me</h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <strong>
-                                    <i class="fas fa-book mr-1"></i>
-                                    Education
-                                    </strong>
-                                    <p class="text-muted">
-                                        B.S. in Computer Science from the University of Tennessee at Knoxville
-                                    </p>
-                                    <hr>
-                                    <strong>
-                                    <i class="fas fa-map-marker-alt mr-1"></i>
-                                    Location
-                                    </strong>
-                                    <p class="text-muted">
-                                        Malibu, California
-                                    </p>
-                                    <hr>
-                                    <strong>
-                                    <i class="fas fa-pencil-alt mr-1"></i>
-                                    Skills
-                                    </strong>
-                                    <p class="text-muted">
-                                        <span class="tag tag-danger">UI Design</span>
-                                        <span class="tag tag-success">Coding</span>
-                                        <span class="tag tag-info">Javascript</span>
-                                        <span class="tag tag-warning">PHP</span>
-                                        <span class="tag tag-primary">Node.js</span>
-                                    </p>
-                                    <hr>
-                                    <strong>
-                                    <i class="far fa-file-alt mr-1"></i>
-                                    Notes
-                                    </strong>
-                                    <p class="text-muted">
-                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam fermentum enim neque.
-                                    </p>
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
+                            <!-- /.card-body -->
                         </div>
-                        <!-- /.col -->
-                        <div class="col-md-9">
-                            <div class="card">
-                                <div class="card-header p-2">
-                                    <ul class="nav nav-pills">
-                                        <li class="nav-item">
-                                            <a class="nav-link active" href="#activity" data-toggle="tab">
-                                                Activity
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link" href="#timeline" data-toggle="tab">
-                                                Timeline
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link" href="#settings" data-toggle="tab">
-                                                Settings
-                                            </a>
-                                        </li>
-                                    </ul>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <div class="tab-content">
-                                        <div class="active tab-pane" id="activity">
-                                            <!-- Post -->
-                                            <div class="post">
-                                                <div class="user-block">
-                                                    <img class="img-circle img-bordered-sm"
-                                                         src="/static/assets/img/user1-128x128.jpg"
-                                                         alt="user image">
-                                                        <span class="username">
-                                                            <a href="#">
-                                                                Jonathan Burke Jr.
-                                                            </a>
-                                                            <a href="#" class="float-right btn-tool">
-                                                                <i class="fas fa-times"></i>
-                                                            </a>
-                                                        </span>
-                                                        <span class="description">
-                                                            Shared publicly - 7:30 PM today
-                                                        </span>
+                        <!-- /.card -->
+                        <!-- About Me Box -->
+                        <div class="card card-primary">
+                            <div class="card-header">
+                                <h3 class="card-title">About Me</h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <strong>
+                                <i class="fas fa-book mr-1"></i>
+                                Education
+                                </strong>
+                                <p class="text-muted">
+                                    B.S. in Computer Science from the University of Tennessee at Knoxville
+                                </p>
+                                <hr>
+                                <strong>
+                                <i class="fas fa-map-marker-alt mr-1"></i>
+                                Location
+                                </strong>
+                                <p class="text-muted">
+                                    Malibu, California
+                                </p>
+                                <hr>
+                                <strong>
+                                <i class="fas fa-pencil-alt mr-1"></i>
+                                Skills
+                                </strong>
+                                <p class="text-muted">
+                                    <span class="tag tag-danger">UI Design</span>
+                                    <span class="tag tag-success">Coding</span>
+                                    <span class="tag tag-info">Javascript</span>
+                                    <span class="tag tag-warning">PHP</span>
+                                    <span class="tag tag-primary">Node.js</span>
+                                </p>
+                                <hr>
+                                <strong>
+                                <i class="far fa-file-alt mr-1"></i>
+                                Notes
+                                </strong>
+                                <p class="text-muted">
+                                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam fermentum enim neque.
+                                </p>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-9">
+                        <div class="card">
+                            <div class="card-header p-2">
+                                <ul class="nav nav-pills">
+                                    <li class="nav-item">
+                                        <a class="nav-link active" href="#activity" data-toggle="tab">
+                                            Activity
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link" href="#timeline" data-toggle="tab">
+                                            Timeline
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link" href="#settings" data-toggle="tab">
+                                            Settings
+                                        </a>
+                                    </li>
+                                </ul>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <div class="tab-content">
+                                    <div class="active tab-pane" id="activity">
+                                        <!-- Post -->
+                                        <div class="post">
+                                            <div class="user-block">
+                                                <img class="img-circle img-bordered-sm"
+                                                     src="/static/assets/img/user1-128x128.jpg"
+                                                     alt="user image">
+                                                <span class="username">
+                                                    <a href="#">
+                                                        Jonathan Burke Jr.
+                                                    </a>
+                                                    <a href="#" class="float-right btn-tool">
+                                                        <i class="fas fa-times"></i>
+                                                    </a>
+                                                </span>
+                                                <span class="description">
+                                                    Shared publicly - 7:30 PM today
+                                                </span>
+                                            </div>
+                                            <!-- /.user-block -->
+                                            <p>
+                                                Lorem ipsum represents a long-held tradition for designers,
+                                                typographers and the like. Some people hate it and argue for
+                                                its demise, but others ignore the hate as they create awesome
+                                                tools to help create filler text for everyone from bacon lovers
+                                                to Charlie Sheen fans.
+                                            </p>
+                                            <p>
+                                                <a href="#" class="link-black text-sm mr-2">
+                                                    <i class="fas fa-share mr-1"></i>
+                                                    Share
+                                                </a>
+                                                <a href="#" class="link-black text-sm">
+                                                    <i class="far fa-thumbs-up mr-1"></i>
+                                                    Like
+                                                </a>
+                                                <span class="float-right">
+                                                    <a href="#" class="link-black text-sm">
+                                                        <i class="far fa-comments mr-1"></i>
+                                                        Comments (5)
+                                                    </a>
+                                                </span>
+                                            </p>
+                                            <input class="form-control form-control-sm"
+                                                   type="text"
+                                                   placeholder="Type a comment">
+                                        </div>
+                                        <!-- /.post -->
+                                        <!-- Post -->
+                                        <div class="post clearfix">
+                                            <div class="user-block">
+                                                <img class="img-circle img-bordered-sm"
+                                                     src="/static/assets/img/user7-128x128.jpg"
+                                                     alt="User Image">
+                                                <span class="username">
+                                                    <a href="#">
+                                                        Sarah Ross
+                                                    </a>
+                                                    <a href="#" class="float-right btn-tool">
+                                                        <i class="fas fa-times"></i>
+                                                    </a>
+                                                </span>
+                                                <span class="description">
+                                                    Sent you a message - 3 days ago
+                                                </span>
+                                            </div>
+                                            <!-- /.user-block -->
+                                            <p>
+                                                Lorem ipsum represents a long-held tradition for designers,
+                                                typographers and the like. Some people hate it and argue for
+                                                its demise, but others ignore the hate as they create awesome
+                                                tools to help create filler text for everyone from bacon lovers
+                                                to Charlie Sheen fans.
+                                            </p>
+                                            <form class="form-horizontal">
+                                                <div class="input-group input-group-sm mb-0">
+                                                    <input class="form-control form-control-sm" placeholder="Response">
+                                                    <div class="input-group-append">
+                                                        <button type="submit" class="btn btn-danger">
+                                                            Send
+                                                        </button>
                                                     </div>
-                                                    <!-- /.user-block -->
-                                                    <p>
-                                                        Lorem ipsum represents a long-held tradition for designers,
-                                                        typographers and the like. Some people hate it and argue for
-                                                        its demise, but others ignore the hate as they create awesome
-                                                        tools to help create filler text for everyone from bacon lovers
-                                                        to Charlie Sheen fans.
-                                                    </p>
-                                                    <p>
-                                                        <a href="#" class="link-black text-sm mr-2">
-                                                            <i class="fas fa-share mr-1"></i>
-                                                            Share
-                                                        </a>
-                                                        <a href="#" class="link-black text-sm">
-                                                            <i class="far fa-thumbs-up mr-1"></i>
-                                                            Like
-                                                        </a>
-                                                        <span class="float-right">
-                                                            <a href="#" class="link-black text-sm">
-                                                                <i class="far fa-comments mr-1"></i>
-                                                                Comments (5)
-                                                            </a>
-                                                        </span>
-                                                    </p>
-                                                    <input class="form-control form-control-sm"
-                                                           type="text"
-                                                           placeholder="Type a comment">
                                                 </div>
-                                                <!-- /.post -->
-                                                <!-- Post -->
-                                                <div class="post clearfix">
-                                                    <div class="user-block">
-                                                        <img class="img-circle img-bordered-sm"
-                                                             src="/static/assets/img/user7-128x128.jpg"
-                                                             alt="User Image">
-                                                            <span class="username">
-                                                                <a href="#">
-                                                                    Sarah Ross
-                                                                </a>
-                                                                <a href="#" class="float-right btn-tool">
-                                                                    <i class="fas fa-times"></i>
-                                                                </a>
-                                                            </span>
-                                                            <span class="description">
-                                                                Sent you a message - 3 days ago
-                                                            </span>
+                                            </form>
+                                        </div>
+                                        <!-- /.post -->
+                                        <!-- Post -->
+                                        <div class="post">
+                                            <div class="user-block">
+                                                <img class="img-circle img-bordered-sm"
+                                                     src="/static/assets/img/user6-128x128.jpg"
+                                                     alt="User Image">
+                                                <span class="username">
+                                                    <a href="#">
+                                                        Adam Jones
+                                                    </a>
+                                                    <a href="#" class="float-right btn-tool">
+                                                        <i class="fas fa-times"></i>
+                                                    </a>
+                                                </span>
+                                                <span class="description">
+                                                    Posted 5 photos - 5 days ago
+                                                </span>
+                                            </div>
+                                            <!-- /.user-block -->
+                                            <div class="row mb-3">
+                                                <div class="col-sm-6">
+                                                    <img class="img-fluid"
+                                                         src="/static/assets/img/photo1.png"
+                                                         alt="Photo">
+                                                </div>
+                                                <!-- /.col -->
+                                                <div class="col-sm-6">
+                                                    <div class="row">
+                                                        <div class="col-sm-6">
+                                                            <img class="img-fluid mb-3"
+                                                                 src="/static/assets/img/photo2.png"
+                                                                 alt="Photo">
+                                                            <img class="img-fluid"
+                                                                 src="/static/assets/img/photo3.jpg"
+                                                                 alt="Photo">
                                                         </div>
-                                                        <!-- /.user-block -->
-                                                        <p>
-                                                            Lorem ipsum represents a long-held tradition for designers,
-                                                            typographers and the like. Some people hate it and argue for
-                                                            its demise, but others ignore the hate as they create awesome
-                                                            tools to help create filler text for everyone from bacon lovers
-                                                            to Charlie Sheen fans.
-                                                        </p>
-                                                        <form class="form-horizontal">
-                                                            <div class="input-group input-group-sm mb-0">
-                                                                <input class="form-control form-control-sm"
-                                                                       placeholder="Response">
-                                                                <div class="input-group-append">
-                                                                    <button type="submit" class="btn btn-danger">
-                                                                        Send
-                                                                    </button>
-                                                                </div>
-                                                            </div>
-                                                        </form>
+                                                        <!-- /.col -->
+                                                        <div class="col-sm-6">
+                                                            <img class="img-fluid mb-3"
+                                                                 src="/static/assets/img/photo4.jpg"
+                                                                 alt="Photo">
+                                                            <img class="img-fluid"
+                                                                 src="/static/assets/img/photo1.png"
+                                                                 alt="Photo">
+                                                        </div>
+                                                        <!-- /.col -->
                                                     </div>
-                                                    <!-- /.post -->
-                                                    <!-- Post -->
-                                                    <div class="post">
-                                                        <div class="user-block">
-                                                            <img class="img-circle img-bordered-sm"
-                                                                 src="/static/assets/img/user6-128x128.jpg"
-                                                                 alt="User Image">
-                                                                <span class="username">
-                                                                    <a href="#">
-                                                                        Adam Jones
-                                                                    </a>
-                                                                    <a href="#" class="float-right btn-tool">
-                                                                        <i class="fas fa-times"></i>
-                                                                    </a>
-                                                                </span>
-                                                                <span class="description">
-                                                                    Posted 5 photos - 5 days ago
-                                                                </span>
-                                                            </div>
-                                                            <!-- /.user-block -->
-                                                            <div class="row mb-3">
-                                                                <div class="col-sm-6">
-                                                                    <img class="img-fluid"
-                                                                         src="/static/assets/img/photo1.png"
-                                                                         alt="Photo">
-                                                                    </div>
-                                                                    <!-- /.col -->
-                                                                    <div class="col-sm-6">
-                                                                        <div class="row">
-                                                                            <div class="col-sm-6">
-                                                                                <img class="img-fluid mb-3"
-                                                                                     src="/static/assets/img/photo2.png"
-                                                                                     alt="Photo">
-                                                                                    <img class="img-fluid"
-                                                                                         src="/static/assets/img/photo3.jpg"
-                                                                                         alt="Photo">
-                                                                                    </div>
-                                                                                    <!-- /.col -->
-                                                                                    <div class="col-sm-6">
-                                                                                        <img class="img-fluid mb-3"
-                                                                                             src="/static/assets/img/photo4.jpg"
-                                                                                             alt="Photo">
-                                                                                            <img class="img-fluid"
-                                                                                                 src="/static/assets/img/photo1.png"
-                                                                                                 alt="Photo">
-                                                                                            </div>
-                                                                                            <!-- /.col -->
-                                                                                        </div>
-                                                                                        <!-- /.row -->
-                                                                                    </div>
-                                                                                    <!-- /.col -->
-                                                                                </div>
-                                                                                <!-- /.row -->
-                                                                                <p>
-                                                                                    <a href="#"
-                                                                                       class="link-black text-sm mr-2">
-                                                                                        <i class="fas fa-share mr-1"></i>
-                                                                                        Share
-                                                                                    </a>
-                                                                                    <a href="#"
-                                                                                       class="link-black text-sm">
-                                                                                        <i class="far fa-thumbs-up mr-1"></i>
-                                                                                        Like
-                                                                                    </a>
-                                                                                    <span class="float-right">
-                                                                                        <a href="#"
-                                                                                           class="link-black text-sm">
-                                                                                            <i class="far fa-comments mr-1"></i>
-                                                                                            Comments (5)
-                                                                                        </a>
-                                                                                    </span>
-                                                                                </p>
-                                                                                <input class="form-control form-control-sm"
-                                                                                       type="text"
-                                                                                       placeholder="Type a comment">
-                                                                            </div>
-                                                                            <!-- /.post -->
-                                                                        </div>
-                                                                        <!-- /.tab-pane -->
-                                                                        <div class="tab-pane" id="timeline">
-                                                                            <!-- The timeline -->
-                                                                            <div class="timeline timeline-inverse">
-                                                                                <!-- timeline time label -->
-                                                                                <div class="time-label">
-                                                                                    <span class="bg-danger">
-                                                                                        10 Feb. 2014
-                                                                                    </span>
-                                                                                </div>
-                                                                                <!-- /.timeline-label -->
-                                                                                <!-- timeline item -->
-                                                                                <div>
-                                                                                    <i class="fas fa-envelope bg-primary"></i>
-                                                                                    <div class="timeline-item">
-                                                                                        <span class="time">
-                                                                                            <i class="far fa-clock"></i>
-                                                                                            12:05
-                                                                                        </span>
-                                                                                        <h3 class="timeline-header">
-                                                                                            <a href="#">
-                                                                                                Support Team
-                                                                                            </a>
-                                                                                            sent you an email
-                                                                                        </h3>
-                                                                                        <div class="timeline-body">
-                                                                                            Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles,
-                                                                                            weebly ning heekya handango imeem plugg dopplr jibjab, movity
-                                                                                            jajah plickers sifteo edmodo ifttt zimbra. Babblely odeo kaboodle
-                                                                                            quora plaxo ideeli hulu weebly balihoo...
-                                                                                        </div>
-                                                                                        <div class="timeline-footer">
-                                                                                            <a href="#"
-                                                                                               class="btn btn-primary btn-sm">
-                                                                                                Read more
-                                                                                            </a>
-                                                                                            <a href="#"
-                                                                                               class="btn btn-danger btn-sm">
-                                                                                                Delete
-                                                                                            </a>
-                                                                                        </div>
-                                                                                    </div>
-                                                                                </div>
-                                                                                <!-- END timeline item -->
-                                                                                <!-- timeline item -->
-                                                                                <div>
-                                                                                    <i class="fas fa-user bg-info"></i>
-                                                                                    <div class="timeline-item">
-                                                                                        <span class="time">
-                                                                                            <i class="far fa-clock"></i>
-                                                                                            5 mins ago
-                                                                                        </span>
-                                                                                        <h3 class="timeline-header border-0">
-                                                                                            <a href="#">
-                                                                                                Sarah Young
-                                                                                            </a>
-                                                                                            accepted your friend request
-                                                                                        </h3>
-                                                                                    </div>
-                                                                                </div>
-                                                                                <!-- END timeline item -->
-                                                                                <!-- timeline item -->
-                                                                                <div>
-                                                                                    <i class="fas fa-comments bg-warning"></i>
-                                                                                    <div class="timeline-item">
-                                                                                        <span class="time">
-                                                                                            <i class="far fa-clock"></i>
-                                                                                            27 mins ago
-                                                                                        </span>
-                                                                                        <h3 class="timeline-header">
-                                                                                            <a href="#">
-                                                                                                Jay White
-                                                                                            </a>
-                                                                                            commented on your post
-                                                                                        </h3>
-                                                                                        <div class="timeline-body">
-                                                                                            Take me to your leader!
-                                                                                            Switzerland is small and neutral!
-                                                                                            We are more like Germany, ambitious and misunderstood!
-                                                                                        </div>
-                                                                                        <div class="timeline-footer">
-                                                                                            <a href="#"
-                                                                                               class="btn btn-warning btn-flat btn-sm">
-                                                                                                View comment
-                                                                                            </a>
-                                                                                        </div>
-                                                                                    </div>
-                                                                                </div>
-                                                                                <!-- END timeline item -->
-                                                                                <!-- timeline time label -->
-                                                                                <div class="time-label">
-                                                                                    <span class="bg-success">
-                                                                                        3 Jan. 2014
-                                                                                    </span>
-                                                                                </div>
-                                                                                <!-- /.timeline-label -->
-                                                                                <!-- timeline item -->
-                                                                                <div>
-                                                                                    <i class="fas fa-camera bg-purple"></i>
-                                                                                    <div class="timeline-item">
-                                                                                        <span class="time">
-                                                                                            <i class="far fa-clock"></i>
-                                                                                            2 days ago
-                                                                                        </span>
-                                                                                        <h3 class="timeline-header">
-                                                                                            <a href="#">
-                                                                                                Mina Lee
-                                                                                            </a>
-                                                                                            uploaded new photos
-                                                                                        </h3>
-                                                                                        <div class="timeline-body">
-                                                                                            <img src="https://placehold.it/150x100"
-                                                                                                 alt="...">
-                                                                                                <img src="https://placehold.it/150x100"
-                                                                                                     alt="...">
-                                                                                                    <img src="https://placehold.it/150x100"
-                                                                                                         alt="...">
-                                                                                                        <img src="https://placehold.it/150x100"
-                                                                                                             alt="...">
-                                                                                                        </div>
-                                                                                                    </div>
-                                                                                                </div>
-                                                                                                <!-- END timeline item -->
-                                                                                                <div>
-                                                                                                    <i class="far fa-clock bg-gray"></i>
-                                                                                                </div>
-                                                                                            </div>
-                                                                                        </div>
-                                                                                        <!-- /.tab-pane -->
-                                                                                        <div class="tab-pane"
-                                                                                             id="settings">
-                                                                                            <form class="form-horizontal">
-                                                                                                <div class="form-group row">
-                                                                                                    <label for="inputName"
-                                                                                                           class="col-sm-2 col-form-label">
-                                                                                                        Name
-                                                                                                    </label>
-                                                                                                    <div class="col-sm-10">
-                                                                                                        <input type="email"
-                                                                                                               class="form-control"
-                                                                                                               id="inputName"
-                                                                                                               placeholder="Name">
-                                                                                                    </div>
-                                                                                                </div>
-                                                                                                <div class="form-group row">
-                                                                                                    <label for="inputEmail"
-                                                                                                           class="col-sm-2 col-form-label">
-                                                                                                        Email
-                                                                                                    </label>
-                                                                                                    <div class="col-sm-10">
-                                                                                                        <input type="email"
-                                                                                                               class="form-control"
-                                                                                                               id="inputEmail"
-                                                                                                               placeholder="Email">
-                                                                                                    </div>
-                                                                                                </div>
-                                                                                                <div class="form-group row">
-                                                                                                    <label for="inputName2"
-                                                                                                           class="col-sm-2 col-form-label">
-                                                                                                        Name
-                                                                                                    </label>
-                                                                                                    <div class="col-sm-10">
-                                                                                                        <input type="text"
-                                                                                                               class="form-control"
-                                                                                                               id="inputName2"
-                                                                                                               placeholder="Name">
-                                                                                                    </div>
-                                                                                                </div>
-                                                                                                <div class="form-group row">
-                                                                                                    <label for="inputExperience"
-                                                                                                           class="col-sm-2 col-form-label">
-                                                                                                        Experience
-                                                                                                    </label>
-                                                                                                    <div class="col-sm-10">
-                                                                                                        <textarea class="form-control"
-                                                                                                                  id="inputExperience"
-                                                                                                                  placeholder="Experience"></textarea>
-                                                                                                    </div>
-                                                                                                </div>
-                                                                                                <div class="form-group row">
-                                                                                                    <label for="inputSkills"
-                                                                                                           class="col-sm-2 col-form-label">
-                                                                                                        Skills
-                                                                                                    </label>
-                                                                                                    <div class="col-sm-10">
-                                                                                                        <input type="text"
-                                                                                                               class="form-control"
-                                                                                                               id="inputSkills"
-                                                                                                               placeholder="Skills">
-                                                                                                    </div>
-                                                                                                </div>
-                                                                                                <div class="form-group row">
-                                                                                                    <div class="offset-sm-2 col-sm-10">
-                                                                                                        <div class="checkbox">
-                                                                                                            <label>
-                                                                                                                <input type="checkbox">
-                                                                                                                I agree to the
-                                                                                                                <a href="#">
-                                                                                                                    terms and conditions
-                                                                                                                </a>
-                                                                                                            </label>
-                                                                                                        </div>
-                                                                                                    </div>
-                                                                                                </div>
-                                                                                                <div class="form-group row">
-                                                                                                    <div class="offset-sm-2 col-sm-10">
-                                                                                                        <button type="submit"
-                                                                                                                class="btn btn-danger">
-                                                                                                            Submit
-                                                                                                        </button>
-                                                                                                    </div>
-                                                                                                </div>
-                                                                                            </form>
-                                                                                        </div>
-                                                                                        <!-- /.tab-pane -->
-                                                                                    </div>
-                                                                                    <!-- /.tab-content -->
-                                                                                </div>
-                                                                                <!-- /.card-body -->
-                                                                            </div>
-                                                                            <!-- /.card -->
-                                                                        </div>
-                                                                        <!-- /.col -->
-                                                                    </div>
-                                                                    <!-- /.row -->
-                                                                </div>
-                                                                <!-- /.container-fluid -->
-                                                            </section>
-                                                            <!-- /.content -->
-                                                        </div>
-                                                    {% endblock content %}
-                                                    <!-- Specific Page JS goes HERE -->
-                                                    {% block javascripts %}
-                                                        <!-- jQuery -->
-                                                        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                                                        <!-- Bootstrap 4 -->
-                                                        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                                                        <!-- AdminLTE App -->
-                                                        <script src="/static/assets/js/adminlte.min.js"></script>
-                                                        <!-- AdminLTE for demo purposes -->
-                                                        <script src="/static/assets/js/demo.js"></script>
-                                                    {% endblock javascripts %}
+                                                    <!-- /.row -->
+                                                </div>
+                                                <!-- /.col -->
+                                            </div>
+                                            <!-- /.row -->
+                                            <p>
+                                                <a href="#" class="link-black text-sm mr-2">
+                                                    <i class="fas fa-share mr-1"></i>
+                                                    Share
+                                                </a>
+                                                <a href="#" class="link-black text-sm">
+                                                    <i class="far fa-thumbs-up mr-1"></i>
+                                                    Like
+                                                </a>
+                                                <span class="float-right">
+                                                    <a href="#" class="link-black text-sm">
+                                                        <i class="far fa-comments mr-1"></i>
+                                                        Comments (5)
+                                                    </a>
+                                                </span>
+                                            </p>
+                                            <input class="form-control form-control-sm"
+                                                   type="text"
+                                                   placeholder="Type a comment">
+                                        </div>
+                                        <!-- /.post -->
+                                    </div>
+                                    <!-- /.tab-pane -->
+                                    <div class="tab-pane" id="timeline">
+                                        <!-- The timeline -->
+                                        <div class="timeline timeline-inverse">
+                                            <!-- timeline time label -->
+                                            <div class="time-label">
+                                                <span class="bg-danger">
+                                                    10 Feb. 2014
+                                                </span>
+                                            </div>
+                                            <!-- /.timeline-label -->
+                                            <!-- timeline item -->
+                                            <div>
+                                                <i class="fas fa-envelope bg-primary"></i>
+                                                <div class="timeline-item">
+                                                    <span class="time">
+                                                        <i class="far fa-clock"></i>
+                                                        12:05
+                                                    </span>
+                                                    <h3 class="timeline-header">
+                                                        <a href="#">
+                                                            Support Team
+                                                        </a>
+                                                        sent you an email
+                                                    </h3>
+                                                    <div class="timeline-body">
+                                                        Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles,
+                                                        weebly ning heekya handango imeem plugg dopplr jibjab, movity
+                                                        jajah plickers sifteo edmodo ifttt zimbra. Babblely odeo kaboodle
+                                                        quora plaxo ideeli hulu weebly balihoo...
+                                                    </div>
+                                                    <div class="timeline-footer">
+                                                        <a href="#" class="btn btn-primary btn-sm">
+                                                            Read more
+                                                        </a>
+                                                        <a href="#" class="btn btn-danger btn-sm">
+                                                            Delete
+                                                        </a>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <!-- END timeline item -->
+                                            <!-- timeline item -->
+                                            <div>
+                                                <i class="fas fa-user bg-info"></i>
+                                                <div class="timeline-item">
+                                                    <span class="time">
+                                                        <i class="far fa-clock"></i>
+                                                        5 mins ago
+                                                    </span>
+                                                    <h3 class="timeline-header border-0">
+                                                        <a href="#">
+                                                            Sarah Young
+                                                        </a>
+                                                        accepted your friend request
+                                                    </h3>
+                                                </div>
+                                            </div>
+                                            <!-- END timeline item -->
+                                            <!-- timeline item -->
+                                            <div>
+                                                <i class="fas fa-comments bg-warning"></i>
+                                                <div class="timeline-item">
+                                                    <span class="time">
+                                                        <i class="far fa-clock"></i>
+                                                        27 mins ago
+                                                    </span>
+                                                    <h3 class="timeline-header">
+                                                        <a href="#">
+                                                            Jay White
+                                                        </a>
+                                                        commented on your post
+                                                    </h3>
+                                                    <div class="timeline-body">
+                                                        Take me to your leader!
+                                                        Switzerland is small and neutral!
+                                                        We are more like Germany, ambitious and misunderstood!
+                                                    </div>
+                                                    <div class="timeline-footer">
+                                                        <a href="#" class="btn btn-warning btn-flat btn-sm">
+                                                            View comment
+                                                        </a>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <!-- END timeline item -->
+                                            <!-- timeline time label -->
+                                            <div class="time-label">
+                                                <span class="bg-success">
+                                                    3 Jan. 2014
+                                                </span>
+                                            </div>
+                                            <!-- /.timeline-label -->
+                                            <!-- timeline item -->
+                                            <div>
+                                                <i class="fas fa-camera bg-purple"></i>
+                                                <div class="timeline-item">
+                                                    <span class="time">
+                                                        <i class="far fa-clock"></i>
+                                                        2 days ago
+                                                    </span>
+                                                    <h3 class="timeline-header">
+                                                        <a href="#">
+                                                            Mina Lee
+                                                        </a>
+                                                        uploaded new photos
+                                                    </h3>
+                                                    <div class="timeline-body">
+                                                        <img src="https://placehold.it/150x100" alt="...">
+                                                        <img src="https://placehold.it/150x100" alt="...">
+                                                        <img src="https://placehold.it/150x100" alt="...">
+                                                        <img src="https://placehold.it/150x100" alt="...">
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <!-- END timeline item -->
+                                            <div>
+                                                <i class="far fa-clock bg-gray"></i>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <!-- /.tab-pane -->
+                                    <div class="tab-pane" id="settings">
+                                        <form class="form-horizontal">
+                                            <div class="form-group row">
+                                                <label for="inputName" class="col-sm-2 col-form-label">
+                                                    Name
+                                                </label>
+                                                <div class="col-sm-10">
+                                                    <input type="email"
+                                                           class="form-control"
+                                                           id="inputName"
+                                                           placeholder="Name">
+                                                </div>
+                                            </div>
+                                            <div class="form-group row">
+                                                <label for="inputEmail" class="col-sm-2 col-form-label">
+                                                    Email
+                                                </label>
+                                                <div class="col-sm-10">
+                                                    <input type="email"
+                                                           class="form-control"
+                                                           id="inputEmail"
+                                                           placeholder="Email">
+                                                </div>
+                                            </div>
+                                            <div class="form-group row">
+                                                <label for="inputName2" class="col-sm-2 col-form-label">
+                                                    Name
+                                                </label>
+                                                <div class="col-sm-10">
+                                                    <input type="text"
+                                                           class="form-control"
+                                                           id="inputName2"
+                                                           placeholder="Name">
+                                                </div>
+                                            </div>
+                                            <div class="form-group row">
+                                                <label for="inputExperience" class="col-sm-2 col-form-label">
+                                                    Experience
+                                                </label>
+                                                <div class="col-sm-10">
+                                                    <textarea class="form-control"
+                                                              id="inputExperience"
+                                                              placeholder="Experience"></textarea>
+                                                </div>
+                                            </div>
+                                            <div class="form-group row">
+                                                <label for="inputSkills" class="col-sm-2 col-form-label">
+                                                    Skills
+                                                </label>
+                                                <div class="col-sm-10">
+                                                    <input type="text"
+                                                           class="form-control"
+                                                           id="inputSkills"
+                                                           placeholder="Skills">
+                                                </div>
+                                            </div>
+                                            <div class="form-group row">
+                                                <div class="offset-sm-2 col-sm-10">
+                                                    <div class="checkbox">
+                                                        <label>
+                                                            <input type="checkbox">
+                                                            I agree to the
+                                                            <a href="#">
+                                                                terms and conditions
+                                                            </a>
+                                                        </label>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <div class="form-group row">
+                                                <div class="offset-sm-2 col-sm-10">
+                                                    <button type="submit" class="btn btn-danger">
+                                                        Submit
+                                                    </button>
+                                                </div>
+                                            </div>
+                                        </form>
+                                    </div>
+                                    <!-- /.tab-pane -->
+                                </div>
+                                <!-- /.tab-content -->
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/examples-project-add.html b/tests/jinja_adminlte/examples-project-add.html
index 9ef74d8..8b741e4 100644
--- a/tests/jinja_adminlte/examples-project-add.html
+++ b/tests/jinja_adminlte/examples-project-add.html
@@ -56,21 +56,15 @@
                         </div>
                         <div class="card-body">
                             <div class="form-group">
-                                <label for="inputName">
-                                    Project Name
-                                </label>
+                                <label for="inputName">Project Name</label>
                                 <input type="text" id="inputName" class="form-control">
                             </div>
                             <div class="form-group">
-                                <label for="inputDescription">
-                                    Project Description
-                                </label>
+                                <label for="inputDescription">Project Description</label>
                                 <textarea id="inputDescription" class="form-control" rows="4"></textarea>
                             </div>
                             <div class="form-group">
-                                <label for="inputStatus">
-                                    Status
-                                </label>
+                                <label for="inputStatus">Status</label>
                                 <select id="inputStatus" class="form-control custom-select">
                                     <option selected disabled>
                                         Select one
@@ -87,15 +81,11 @@
                                 </select>
                             </div>
                             <div class="form-group">
-                                <label for="inputClientCompany">
-                                    Client Company
-                                </label>
+                                <label for="inputClientCompany">Client Company</label>
                                 <input type="text" id="inputClientCompany" class="form-control">
                             </div>
                             <div class="form-group">
-                                <label for="inputProjectLeader">
-                                    Project Leader
-                                </label>
+                                <label for="inputProjectLeader">Project Leader</label>
                                 <input type="text" id="inputProjectLeader" class="form-control">
                             </div>
                         </div>
@@ -118,15 +108,11 @@
                         </div>
                         <div class="card-body">
                             <div class="form-group">
-                                <label for="inputEstimatedBudget">
-                                    Estimated budget
-                                </label>
+                                <label for="inputEstimatedBudget">Estimated budget</label>
                                 <input type="number" id="inputEstimatedBudget" class="form-control">
                             </div>
                             <div class="form-group">
-                                <label for="inputSpentBudget">
-                                    Total amount spent
-                                </label>
+                                <label for="inputSpentBudget">Total amount spent</label>
                                 <input type="number" id="inputSpentBudget" class="form-control">
                             </div>
                             <div class="form-group">
diff --git a/tests/jinja_adminlte/examples-project-detail.html b/tests/jinja_adminlte/examples-project-detail.html
index 0dd2e3c..b905f9e 100644
--- a/tests/jinja_adminlte/examples-project-detail.html
+++ b/tests/jinja_adminlte/examples-project-detail.html
@@ -102,156 +102,156 @@
                                             <img class="img-circle img-bordered-sm"
                                                  src="/static/assets/img/user1-128x128.jpg"
                                                  alt="user image">
-                                                <span class="username">
-                                                    <a href="#">Jonathan Burke Jr.</a>
-                                                </span>
-                                                <span class="description">Shared publicly - 7:45 PM today</span>
-                                            </div>
-                                            <!-- /.user-block -->
-                                            <p>
-                                                Lorem ipsum represents a long-held tradition for designers,
-                                                typographers and the like. Some people hate it and argue for
-                                                its demise, but others ignore.
-                                            </p>
-                                            <p>
-                                                <a href="#" class="link-black text-sm">
-                                                    <i class="fas fa-link mr-1"></i>
-                                                    Demo File 1 v2
-                                                </a>
-                                            </p>
+                                            <span class="username">
+                                                <a href="#">Jonathan Burke Jr.</a>
+                                            </span>
+                                            <span class="description">Shared publicly - 7:45 PM today</span>
                                         </div>
-                                        <div class="post clearfix">
-                                            <div class="user-block">
-                                                <img class="img-circle img-bordered-sm"
-                                                     src="/static/assets/img/user7-128x128.jpg"
-                                                     alt="User Image">
-                                                    <span class="username">
-                                                        <a href="#">Sarah Ross</a>
-                                                    </span>
-                                                    <span class="description">Sent you a message - 3 days ago</span>
-                                                </div>
-                                                <!-- /.user-block -->
-                                                <p>
-                                                    Lorem ipsum represents a long-held tradition for designers,
-                                                    typographers and the like. Some people hate it and argue for
-                                                    its demise, but others ignore.
-                                                </p>
-                                                <p>
-                                                    <a href="#" class="link-black text-sm">
-                                                        <i class="fas fa-link mr-1"></i>
-                                                        Demo File 2
-                                                    </a>
-                                                </p>
-                                            </div>
-                                            <div class="post">
-                                                <div class="user-block">
-                                                    <img class="img-circle img-bordered-sm"
-                                                         src="/static/assets/img/user1-128x128.jpg"
-                                                         alt="user image">
-                                                        <span class="username">
-                                                            <a href="#">Jonathan Burke Jr.</a>
-                                                        </span>
-                                                        <span class="description">Shared publicly - 5 days ago</span>
-                                                    </div>
-                                                    <!-- /.user-block -->
-                                                    <p>
-                                                        Lorem ipsum represents a long-held tradition for designers,
-                                                        typographers and the like. Some people hate it and argue for
-                                                        its demise, but others ignore.
-                                                    </p>
-                                                    <p>
-                                                        <a href="#" class="link-black text-sm">
-                                                            <i class="fas fa-link mr-1"></i>
-                                                            Demo File 1 v1
-                                                        </a>
-                                                    </p>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="col-12 col-md-12 col-lg-4 order-1 order-md-2">
-                                        <h3 class="text-primary">
-                                            <i class="fas fa-paint-brush"></i>
-                                            AdminLTE v3
-                                        </h3>
-                                        <p class="text-muted">
-                                            Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terr.
+                                        <!-- /.user-block -->
+                                        <p>
+                                            Lorem ipsum represents a long-held tradition for designers,
+                                            typographers and the like. Some people hate it and argue for
+                                            its demise, but others ignore.
                                         </p>
-                                        <br>
-                                        <div class="text-muted">
-                                            <p class="text-sm">
-                                                Client Company
-                                                <b class="d-block">
-                                                Deveint Inc
-                                                </b>
-                                            </p>
-                                            <p class="text-sm">
-                                                Project Leader
-                                                <b class="d-block">
-                                                Tony Chicken
-                                                </b>
-                                            </p>
-                                        </div>
-                                        <h5 class="mt-5 text-muted">Project files</h5>
-                                        <ul class="list-unstyled">
-                                            <li>
-                                                <a href="" class="btn-link text-secondary">
-                                                    <i class="far fa-fw fa-file-word"></i>
-                                                    Functional-requirements.docx
-                                                </a>
-                                            </li>
-                                            <li>
-                                                <a href="" class="btn-link text-secondary">
-                                                    <i class="far fa-fw fa-file-pdf"></i>
-                                                    UAT.pdf
-                                                </a>
-                                            </li>
-                                            <li>
-                                                <a href="" class="btn-link text-secondary">
-                                                    <i class="far fa-fw fa-envelope"></i>
-                                                    Email-from-flatbal.mln
-                                                </a>
-                                            </li>
-                                            <li>
-                                                <a href="" class="btn-link text-secondary">
-                                                    <i class="far fa-fw fa-image "></i>
-                                                    Logo.png
-                                                </a>
-                                            </li>
-                                            <li>
-                                                <a href="" class="btn-link text-secondary">
-                                                    <i class="far fa-fw fa-file-word"></i>
-                                                    Contract-10_12_2014.docx
-                                                </a>
-                                            </li>
-                                        </ul>
-                                        <div class="text-center mt-5 mb-3">
-                                            <a href="#" class="btn btn-sm btn-primary">
-                                                Add files
-                                            </a>
-                                            <a href="#" class="btn btn-sm btn-warning">
-                                                Report contact
+                                        <p>
+                                            <a href="#" class="link-black text-sm">
+                                                <i class="fas fa-link mr-1"></i>
+                                                Demo File 1 v2
                                             </a>
+                                        </p>
+                                    </div>
+                                    <div class="post clearfix">
+                                        <div class="user-block">
+                                            <img class="img-circle img-bordered-sm"
+                                                 src="/static/assets/img/user7-128x128.jpg"
+                                                 alt="User Image">
+                                            <span class="username">
+                                                <a href="#">Sarah Ross</a>
+                                            </span>
+                                            <span class="description">Sent you a message - 3 days ago</span>
                                         </div>
+                                        <!-- /.user-block -->
+                                        <p>
+                                            Lorem ipsum represents a long-held tradition for designers,
+                                            typographers and the like. Some people hate it and argue for
+                                            its demise, but others ignore.
+                                        </p>
+                                        <p>
+                                            <a href="#" class="link-black text-sm">
+                                                <i class="fas fa-link mr-1"></i>
+                                                Demo File 2
+                                            </a>
+                                        </p>
+                                    </div>
+                                    <div class="post">
+                                        <div class="user-block">
+                                            <img class="img-circle img-bordered-sm"
+                                                 src="/static/assets/img/user1-128x128.jpg"
+                                                 alt="user image">
+                                            <span class="username">
+                                                <a href="#">Jonathan Burke Jr.</a>
+                                            </span>
+                                            <span class="description">Shared publicly - 5 days ago</span>
+                                        </div>
+                                        <!-- /.user-block -->
+                                        <p>
+                                            Lorem ipsum represents a long-held tradition for designers,
+                                            typographers and the like. Some people hate it and argue for
+                                            its demise, but others ignore.
+                                        </p>
+                                        <p>
+                                            <a href="#" class="link-black text-sm">
+                                                <i class="fas fa-link mr-1"></i>
+                                                Demo File 1 v1
+                                            </a>
+                                        </p>
                                     </div>
                                 </div>
                             </div>
-                            <!-- /.card-body -->
                         </div>
-                        <!-- /.card -->
-                    </section>
-                    <!-- /.content -->
+                        <div class="col-12 col-md-12 col-lg-4 order-1 order-md-2">
+                            <h3 class="text-primary">
+                                <i class="fas fa-paint-brush"></i>
+                                AdminLTE v3
+                            </h3>
+                            <p class="text-muted">
+                                Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terr.
+                            </p>
+                            <br>
+                            <div class="text-muted">
+                                <p class="text-sm">
+                                    Client Company
+                                    <b class="d-block">
+                                    Deveint Inc
+                                    </b>
+                                </p>
+                                <p class="text-sm">
+                                    Project Leader
+                                    <b class="d-block">
+                                    Tony Chicken
+                                    </b>
+                                </p>
+                            </div>
+                            <h5 class="mt-5 text-muted">Project files</h5>
+                            <ul class="list-unstyled">
+                                <li>
+                                    <a href="" class="btn-link text-secondary">
+                                        <i class="far fa-fw fa-file-word"></i>
+                                        Functional-requirements.docx
+                                    </a>
+                                </li>
+                                <li>
+                                    <a href="" class="btn-link text-secondary">
+                                        <i class="far fa-fw fa-file-pdf"></i>
+                                        UAT.pdf
+                                    </a>
+                                </li>
+                                <li>
+                                    <a href="" class="btn-link text-secondary">
+                                        <i class="far fa-fw fa-envelope"></i>
+                                        Email-from-flatbal.mln
+                                    </a>
+                                </li>
+                                <li>
+                                    <a href="" class="btn-link text-secondary">
+                                        <i class="far fa-fw fa-image "></i>
+                                        Logo.png
+                                    </a>
+                                </li>
+                                <li>
+                                    <a href="" class="btn-link text-secondary">
+                                        <i class="far fa-fw fa-file-word"></i>
+                                        Contract-10_12_2014.docx
+                                    </a>
+                                </li>
+                            </ul>
+                            <div class="text-center mt-5 mb-3">
+                                <a href="#" class="btn btn-sm btn-primary">
+                                    Add files
+                                </a>
+                                <a href="#" class="btn btn-sm btn-warning">
+                                    Report contact
+                                </a>
+                            </div>
+                        </div>
+                    </div>
                 </div>
-                <!-- /.content-wrapper -->
-            {% endblock content %}
-            <!-- Specific Page JS goes HERE -->
-            {% block javascripts %}
-                <!-- jQuery -->
-                <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                <!-- Bootstrap 4 -->
-                <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                <!-- AdminLTE App -->
-                <script src="/static/assets/js/adminlte.min.js"></script>
-                <!-- AdminLTE for demo purposes -->
-                <script src="/static/assets/js/demo.js"></script>
-            {% endblock javascripts %}
+                <!-- /.card-body -->
+            </div>
+            <!-- /.card -->
+        </section>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/examples-project-edit.html b/tests/jinja_adminlte/examples-project-edit.html
index 2a43f98..c759784 100644
--- a/tests/jinja_adminlte/examples-project-edit.html
+++ b/tests/jinja_adminlte/examples-project-edit.html
@@ -56,23 +56,17 @@
                         </div>
                         <div class="card-body">
                             <div class="form-group">
-                                <label for="inputName">
-                                    Project Name
-                                </label>
+                                <label for="inputName">Project Name</label>
                                 <input type="text" id="inputName" class="form-control" value="AdminLTE">
                             </div>
                             <div class="form-group">
-                                <label for="inputDescription">
-                                    Project Description
-                                </label>
+                                <label for="inputDescription">Project Description</label>
                                 <textarea id="inputDescription" class="form-control" rows="4">
-                                Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terr.
+                                    Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terr.
                                 </textarea>
                             </div>
                             <div class="form-group">
-                                <label for="inputStatus">
-                                    Status
-                                </label>
+                                <label for="inputStatus">Status</label>
                                 <select id="inputStatus" class="form-control custom-select">
                                     <option disabled>
                                         Select one
@@ -89,15 +83,11 @@
                                 </select>
                             </div>
                             <div class="form-group">
-                                <label for="inputClientCompany">
-                                    Client Company
-                                </label>
+                                <label for="inputClientCompany">Client Company</label>
                                 <input type="text" id="inputClientCompany" class="form-control" value="Deveint Inc">
                             </div>
                             <div class="form-group">
-                                <label for="inputProjectLeader">
-                                    Project Leader
-                                </label>
+                                <label for="inputProjectLeader">Project Leader</label>
                                 <input type="text" id="inputProjectLeader" class="form-control" value="Tony Chicken">
                             </div>
                         </div>
@@ -120,9 +110,7 @@
                         </div>
                         <div class="card-body">
                             <div class="form-group">
-                                <label for="inputEstimatedBudget">
-                                    Estimated budget
-                                </label>
+                                <label for="inputEstimatedBudget">Estimated budget</label>
                                 <input type="number"
                                        id="inputEstimatedBudget"
                                        class="form-control"
@@ -130,9 +118,7 @@
                                        step="1">
                             </div>
                             <div class="form-group">
-                                <label for="inputSpentBudget">
-                                    Total amount spent
-                                </label>
+                                <label for="inputSpentBudget">Total amount spent</label>
                                 <input type="number" id="inputSpentBudget" class="form-control" value="2000" step="1">
                             </div>
                             <div class="form-group">
@@ -151,7 +137,9 @@
                     <!-- /.card -->
                     <div class="card card-info">
                         <div class="card-header">
-                            <h3 class="card-title">Files</h3>
+                            <h3 class="card-title">
+                                Files
+                            </h3>
                             <div class="card-tools">
                                 <button type="button"
                                         class="btn btn-tool"
diff --git a/tests/jinja_adminlte/examples-projects.html b/tests/jinja_adminlte/examples-projects.html
index 10c3ec2..349800d 100644
--- a/tests/jinja_adminlte/examples-projects.html
+++ b/tests/jinja_adminlte/examples-projects.html
@@ -81,599 +81,567 @@
                                     <ul class="list-inline">
                                         <li class="list-inline-item">
                                             <img alt="Avatar" class="table-avatar" src="/static/assets/img/avatar.png">
-                                            </li>
-                                            <li class="list-inline-item">
-                                                <img alt="Avatar"
-                                                     class="table-avatar"
-                                                     src="/static/assets/img/avatar2.png">
-                                                </li>
-                                                <li class="list-inline-item">
-                                                    <img alt="Avatar"
-                                                         class="table-avatar"
-                                                         src="/static/assets/img/avatar3.png">
-                                                    </li>
-                                                    <li class="list-inline-item">
-                                                        <img alt="Avatar"
-                                                             class="table-avatar"
-                                                             src="/static/assets/img/avatar4.png">
-                                                        </li>
-                                                    </ul>
-                                                </td>
-                                                <td class="project_progress">
-                                                    <div class="progress progress-sm">
-                                                        <div class="progress-bar bg-green"
-                                                             role="progressbar"
-                                                             aria-valuenow="57"
-                                                             aria-valuemin="0"
-                                                             aria-valuemax="100"
-                                                             style="width: 57%"></div>
-                                                    </div>
-                                                    <small>
-                                                    57% Complete
-                                                    </small>
-                                                </td>
-                                                <td class="project-state">
-                                                    <span class="badge badge-success">Success</span>
-                                                </td>
-                                                <td class="project-actions text-right">
-                                                    <a class="btn btn-primary btn-sm" href="#">
-                                                        <i class="fas fa-folder"></i>
-                                                        View
-                                                    </a>
-                                                    <a class="btn btn-info btn-sm" href="#">
-                                                        <i class="fas fa-pencil-alt"></i>
-                                                        Edit
-                                                    </a>
-                                                    <a class="btn btn-danger btn-sm" href="#">
-                                                        <i class="fas fa-trash"></i>
-                                                        Delete
-                                                    </a>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>#</td>
-                                                <td>
-                                                    <a>AdminLTE v3</a>
-                                                    <br/>
-                                                    <small>
-                                                    Created 01.01.2019
-                                                    </small>
-                                                </td>
-                                                <td>
-                                                    <ul class="list-inline">
-                                                        <li class="list-inline-item">
-                                                            <img alt="Avatar"
-                                                                 class="table-avatar"
-                                                                 src="/static/assets/img/avatar.png">
-                                                            </li>
-                                                            <li class="list-inline-item">
-                                                                <img alt="Avatar"
-                                                                     class="table-avatar"
-                                                                     src="/static/assets/img/avatar2.png">
-                                                                </li>
-                                                            </ul>
-                                                        </td>
-                                                        <td class="project_progress">
-                                                            <div class="progress progress-sm">
-                                                                <div class="progress-bar bg-green"
-                                                                     role="progressbar"
-                                                                     aria-valuenow="47"
-                                                                     aria-valuemin="0"
-                                                                     aria-valuemax="100"
-                                                                     style="width: 47%"></div>
-                                                            </div>
-                                                            <small>
-                                                            47% Complete
-                                                            </small>
-                                                        </td>
-                                                        <td class="project-state">
-                                                            <span class="badge badge-success">Success</span>
-                                                        </td>
-                                                        <td class="project-actions text-right">
-                                                            <a class="btn btn-primary btn-sm" href="#">
-                                                                <i class="fas fa-folder"></i>
-                                                                View
-                                                            </a>
-                                                            <a class="btn btn-info btn-sm" href="#">
-                                                                <i class="fas fa-pencil-alt"></i>
-                                                                Edit
-                                                            </a>
-                                                            <a class="btn btn-danger btn-sm" href="#">
-                                                                <i class="fas fa-trash"></i>
-                                                                Delete
-                                                            </a>
-                                                        </td>
-                                                    </tr>
-                                                    <tr>
-                                                        <td>#</td>
-                                                        <td>
-                                                            <a>AdminLTE v3</a>
-                                                            <br/>
-                                                            <small>
-                                                            Created 01.01.2019
-                                                            </small>
-                                                        </td>
-                                                        <td>
-                                                            <ul class="list-inline">
-                                                                <li class="list-inline-item">
-                                                                    <img alt="Avatar"
-                                                                         class="table-avatar"
-                                                                         src="/static/assets/img/avatar.png">
-                                                                    </li>
-                                                                    <li class="list-inline-item">
-                                                                        <img alt="Avatar"
-                                                                             class="table-avatar"
-                                                                             src="/static/assets/img/avatar2.png">
-                                                                        </li>
-                                                                        <li class="list-inline-item">
-                                                                            <img alt="Avatar"
-                                                                                 class="table-avatar"
-                                                                                 src="/static/assets/img/avatar3.png">
-                                                                            </li>
-                                                                        </ul>
-                                                                    </td>
-                                                                    <td class="project_progress">
-                                                                        <div class="progress progress-sm">
-                                                                            <div class="progress-bar bg-green"
-                                                                                 role="progressbar"
-                                                                                 aria-valuenow="77"
-                                                                                 aria-valuemin="0"
-                                                                                 aria-valuemax="100"
-                                                                                 style="width: 77%"></div>
-                                                                        </div>
-                                                                        <small>
-                                                                        77% Complete
-                                                                        </small>
-                                                                    </td>
-                                                                    <td class="project-state">
-                                                                        <span class="badge badge-success">Success</span>
-                                                                    </td>
-                                                                    <td class="project-actions text-right">
-                                                                        <a class="btn btn-primary btn-sm" href="#">
-                                                                            <i class="fas fa-folder"></i>
-                                                                            View
-                                                                        </a>
-                                                                        <a class="btn btn-info btn-sm" href="#">
-                                                                            <i class="fas fa-pencil-alt"></i>
-                                                                            Edit
-                                                                        </a>
-                                                                        <a class="btn btn-danger btn-sm" href="#">
-                                                                            <i class="fas fa-trash"></i>
-                                                                            Delete
-                                                                        </a>
-                                                                    </td>
-                                                                </tr>
-                                                                <tr>
-                                                                    <td>#</td>
-                                                                    <td>
-                                                                        <a>AdminLTE v3</a>
-                                                                        <br/>
-                                                                        <small>
-                                                                        Created 01.01.2019
-                                                                        </small>
-                                                                    </td>
-                                                                    <td>
-                                                                        <ul class="list-inline">
-                                                                            <li class="list-inline-item">
-                                                                                <img alt="Avatar"
-                                                                                     class="table-avatar"
-                                                                                     src="/static/assets/img/avatar.png">
-                                                                                </li>
-                                                                                <li class="list-inline-item">
-                                                                                    <img alt="Avatar"
-                                                                                         class="table-avatar"
-                                                                                         src="/static/assets/img/avatar2.png">
-                                                                                    </li>
-                                                                                    <li class="list-inline-item">
-                                                                                        <img alt="Avatar"
-                                                                                             class="table-avatar"
-                                                                                             src="/static/assets/img/avatar3.png">
-                                                                                        </li>
-                                                                                        <li class="list-inline-item">
-                                                                                            <img alt="Avatar"
-                                                                                                 class="table-avatar"
-                                                                                                 src="/static/assets/img/avatar4.png">
-                                                                                            </li>
-                                                                                        </ul>
-                                                                                    </td>
-                                                                                    <td class="project_progress">
-                                                                                        <div class="progress progress-sm">
-                                                                                            <div class="progress-bar bg-green"
-                                                                                                 role="progressbar"
-                                                                                                 aria-valuenow="60"
-                                                                                                 aria-valuemin="0"
-                                                                                                 aria-valuemax="100"
-                                                                                                 style="width: 60%"></div>
-                                                                                        </div>
-                                                                                        <small>
-                                                                                        60% Complete
-                                                                                        </small>
-                                                                                    </td>
-                                                                                    <td class="project-state">
-                                                                                        <span class="badge badge-success">Success</span>
-                                                                                    </td>
-                                                                                    <td class="project-actions text-right">
-                                                                                        <a class="btn btn-primary btn-sm"
-                                                                                           href="#">
-                                                                                            <i class="fas fa-folder"></i>
-                                                                                            View
-                                                                                        </a>
-                                                                                        <a class="btn btn-info btn-sm"
-                                                                                           href="#">
-                                                                                            <i class="fas fa-pencil-alt"></i>
-                                                                                            Edit
-                                                                                        </a>
-                                                                                        <a class="btn btn-danger btn-sm"
-                                                                                           href="#">
-                                                                                            <i class="fas fa-trash"></i>
-                                                                                            Delete
-                                                                                        </a>
-                                                                                    </td>
-                                                                                </tr>
-                                                                                <tr>
-                                                                                    <td>
-                                                                                        #
-                                                                                    </td>
-                                                                                    <td>
-                                                                                        <a>
-                                                                                            AdminLTE v3
-                                                                                        </a>
-                                                                                        <br/>
-                                                                                        <small>
-                                                                                        Created 01.01.2019
-                                                                                        </small>
-                                                                                    </td>
-                                                                                    <td>
-                                                                                        <ul class="list-inline">
-                                                                                            <li class="list-inline-item">
-                                                                                                <img alt="Avatar"
-                                                                                                     class="table-avatar"
-                                                                                                     src="/static/assets/img/avatar.png">
-                                                                                                </li>
-                                                                                                <li class="list-inline-item">
-                                                                                                    <img alt="Avatar"
-                                                                                                         class="table-avatar"
-                                                                                                         src="/static/assets/img/avatar4.png">
-                                                                                                    </li>
-                                                                                                    <li class="list-inline-item">
-                                                                                                        <img alt="Avatar"
-                                                                                                             class="table-avatar"
-                                                                                                             src="/static/assets/img/avatar5.png">
-                                                                                                        </li>
-                                                                                                    </ul>
-                                                                                                </td>
-                                                                                                <td class="project_progress">
-                                                                                                    <div class="progress progress-sm">
-                                                                                                        <div class="progress-bar bg-green"
-                                                                                                             role="progressbar"
-                                                                                                             aria-valuenow="12"
-                                                                                                             aria-valuemin="0"
-                                                                                                             aria-valuemax="100"
-                                                                                                             style="width: 12%"></div>
-                                                                                                    </div>
-                                                                                                    <small>
-                                                                                                    12% Complete
-                                                                                                    </small>
-                                                                                                </td>
-                                                                                                <td class="project-state">
-                                                                                                    <span class="badge badge-success">
-                                                                                                        Success
-                                                                                                    </span>
-                                                                                                </td>
-                                                                                                <td class="project-actions text-right">
-                                                                                                    <a class="btn btn-primary btn-sm"
-                                                                                                       href="#">
-                                                                                                        <i class="fas fa-folder"></i>
-                                                                                                        View
-                                                                                                    </a>
-                                                                                                    <a class="btn btn-info btn-sm"
-                                                                                                       href="#">
-                                                                                                        <i class="fas fa-pencil-alt"></i>
-                                                                                                        Edit
-                                                                                                    </a>
-                                                                                                    <a class="btn btn-danger btn-sm"
-                                                                                                       href="#">
-                                                                                                        <i class="fas fa-trash"></i>
-                                                                                                        Delete
-                                                                                                    </a>
-                                                                                                </td>
-                                                                                            </tr>
-                                                                                            <tr>
-                                                                                                <td>
-                                                                                                    #
-                                                                                                </td>
-                                                                                                <td>
-                                                                                                    <a>
-                                                                                                        AdminLTE v3
-                                                                                                    </a>
-                                                                                                    <br/>
-                                                                                                    <small>
-                                                                                                    Created 01.01.2019
-                                                                                                    </small>
-                                                                                                </td>
-                                                                                                <td>
-                                                                                                    <ul class="list-inline">
-                                                                                                        <li class="list-inline-item">
-                                                                                                            <img alt="Avatar"
-                                                                                                                 class="table-avatar"
-                                                                                                                 src="/static/assets/img/avatar.png">
-                                                                                                            </li>
-                                                                                                            <li class="list-inline-item">
-                                                                                                                <img alt="Avatar"
-                                                                                                                     class="table-avatar"
-                                                                                                                     src="/static/assets/img/avatar2.png">
-                                                                                                                </li>
-                                                                                                                <li class="list-inline-item">
-                                                                                                                    <img alt="Avatar"
-                                                                                                                         class="table-avatar"
-                                                                                                                         src="/static/assets/img/avatar3.png">
-                                                                                                                    </li>
-                                                                                                                    <li class="list-inline-item">
-                                                                                                                        <img alt="Avatar"
-                                                                                                                             class="table-avatar"
-                                                                                                                             src="/static/assets/img/avatar4.png">
-                                                                                                                        </li>
-                                                                                                                    </ul>
-                                                                                                                </td>
-                                                                                                                <td class="project_progress">
-                                                                                                                    <div class="progress progress-sm">
-                                                                                                                        <div class="progress-bar bg-green"
-                                                                                                                             role="progressbar"
-                                                                                                                             aria-valuenow="35"
-                                                                                                                             aria-valuemin="0"
-                                                                                                                             aria-valuemax="100"
-                                                                                                                             style="width: 35%"></div>
-                                                                                                                    </div>
-                                                                                                                    <small>
-                                                                                                                    35% Complete
-                                                                                                                    </small>
-                                                                                                                </td>
-                                                                                                                <td class="project-state">
-                                                                                                                    <span class="badge badge-success">
-                                                                                                                        Success
-                                                                                                                    </span>
-                                                                                                                </td>
-                                                                                                                <td class="project-actions text-right">
-                                                                                                                    <a class="btn btn-primary btn-sm"
-                                                                                                                       href="#">
-                                                                                                                        <i class="fas fa-folder"></i>
-                                                                                                                        View
-                                                                                                                    </a>
-                                                                                                                    <a class="btn btn-info btn-sm"
-                                                                                                                       href="#">
-                                                                                                                        <i class="fas fa-pencil-alt"></i>
-                                                                                                                        Edit
-                                                                                                                    </a>
-                                                                                                                    <a class="btn btn-danger btn-sm"
-                                                                                                                       href="#">
-                                                                                                                        <i class="fas fa-trash"></i>
-                                                                                                                        Delete
-                                                                                                                    </a>
-                                                                                                                </td>
-                                                                                                            </tr>
-                                                                                                            <tr>
-                                                                                                                <td>
-                                                                                                                    #
-                                                                                                                </td>
-                                                                                                                <td>
-                                                                                                                    <a>
-                                                                                                                        AdminLTE v3
-                                                                                                                    </a>
-                                                                                                                    <br/>
-                                                                                                                    <small>
-                                                                                                                    Created 01.01.2019
-                                                                                                                    </small>
-                                                                                                                </td>
-                                                                                                                <td>
-                                                                                                                    <ul class="list-inline">
-                                                                                                                        <li class="list-inline-item">
-                                                                                                                            <img alt="Avatar"
-                                                                                                                                 class="table-avatar"
-                                                                                                                                 src="/static/assets/img/avatar4.png">
-                                                                                                                            </li>
-                                                                                                                            <li class="list-inline-item">
-                                                                                                                                <img alt="Avatar"
-                                                                                                                                     class="table-avatar"
-                                                                                                                                     src="/static/assets/img/avatar5.png">
-                                                                                                                                </li>
-                                                                                                                            </ul>
-                                                                                                                        </td>
-                                                                                                                        <td class="project_progress">
-                                                                                                                            <div class="progress progress-sm">
-                                                                                                                                <div class="progress-bar bg-green"
-                                                                                                                                     role="progressbar"
-                                                                                                                                     aria-valuenow="87"
-                                                                                                                                     aria-valuemin="0"
-                                                                                                                                     aria-valuemax="100"
-                                                                                                                                     style="width: 87%"></div>
-                                                                                                                            </div>
-                                                                                                                            <small>
-                                                                                                                            87% Complete
-                                                                                                                            </small>
-                                                                                                                        </td>
-                                                                                                                        <td class="project-state">
-                                                                                                                            <span class="badge badge-success">
-                                                                                                                                Success
-                                                                                                                            </span>
-                                                                                                                        </td>
-                                                                                                                        <td class="project-actions text-right">
-                                                                                                                            <a class="btn btn-primary btn-sm"
-                                                                                                                               href="#">
-                                                                                                                                <i class="fas fa-folder"></i>
-                                                                                                                                View
-                                                                                                                            </a>
-                                                                                                                            <a class="btn btn-info btn-sm"
-                                                                                                                               href="#">
-                                                                                                                                <i class="fas fa-pencil-alt"></i>
-                                                                                                                                Edit
-                                                                                                                            </a>
-                                                                                                                            <a class="btn btn-danger btn-sm"
-                                                                                                                               href="#">
-                                                                                                                                <i class="fas fa-trash"></i>
-                                                                                                                                Delete
-                                                                                                                            </a>
-                                                                                                                        </td>
-                                                                                                                    </tr>
-                                                                                                                    <tr>
-                                                                                                                        <td>
-                                                                                                                            #
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <a>
-                                                                                                                                AdminLTE v3
-                                                                                                                            </a>
-                                                                                                                            <br/>
-                                                                                                                            <small>
-                                                                                                                            Created 01.01.2019
-                                                                                                                            </small>
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <ul class="list-inline">
-                                                                                                                                <li class="list-inline-item">
-                                                                                                                                    <img alt="Avatar"
-                                                                                                                                         class="table-avatar"
-                                                                                                                                         src="/static/assets/img/avatar.png">
-                                                                                                                                    </li>
-                                                                                                                                    <li class="list-inline-item">
-                                                                                                                                        <img alt="Avatar"
-                                                                                                                                             class="table-avatar"
-                                                                                                                                             src="/static/assets/img/avatar3.png">
-                                                                                                                                        </li>
-                                                                                                                                        <li class="list-inline-item">
-                                                                                                                                            <img alt="Avatar"
-                                                                                                                                                 class="table-avatar"
-                                                                                                                                                 src="/static/assets/img/avatar4.png">
-                                                                                                                                            </li>
-                                                                                                                                        </ul>
-                                                                                                                                    </td>
-                                                                                                                                    <td class="project_progress">
-                                                                                                                                        <div class="progress progress-sm">
-                                                                                                                                            <div class="progress-bar bg-green"
-                                                                                                                                                 role="progressbar"
-                                                                                                                                                 aria-valuenow="77"
-                                                                                                                                                 aria-valuemin="0"
-                                                                                                                                                 aria-valuemax="100"
-                                                                                                                                                 style="width: 77%"></div>
-                                                                                                                                        </div>
-                                                                                                                                        <small>
-                                                                                                                                        77% Complete
-                                                                                                                                        </small>
-                                                                                                                                    </td>
-                                                                                                                                    <td class="project-state">
-                                                                                                                                        <span class="badge badge-success">
-                                                                                                                                            Success
-                                                                                                                                        </span>
-                                                                                                                                    </td>
-                                                                                                                                    <td class="project-actions text-right">
-                                                                                                                                        <a class="btn btn-primary btn-sm"
-                                                                                                                                           href="#">
-                                                                                                                                            <i class="fas fa-folder"></i>
-                                                                                                                                            View
-                                                                                                                                        </a>
-                                                                                                                                        <a class="btn btn-info btn-sm"
-                                                                                                                                           href="#">
-                                                                                                                                            <i class="fas fa-pencil-alt"></i>
-                                                                                                                                            Edit
-                                                                                                                                        </a>
-                                                                                                                                        <a class="btn btn-danger btn-sm"
-                                                                                                                                           href="#">
-                                                                                                                                            <i class="fas fa-trash"></i>
-                                                                                                                                            Delete
-                                                                                                                                        </a>
-                                                                                                                                    </td>
-                                                                                                                                </tr>
-                                                                                                                                <tr>
-                                                                                                                                    <td>
-                                                                                                                                        #
-                                                                                                                                    </td>
-                                                                                                                                    <td>
-                                                                                                                                        <a>
-                                                                                                                                            AdminLTE v3
-                                                                                                                                        </a>
-                                                                                                                                        <br/>
-                                                                                                                                        <small>
-                                                                                                                                        Created 01.01.2019
-                                                                                                                                        </small>
-                                                                                                                                    </td>
-                                                                                                                                    <td>
-                                                                                                                                        <ul class="list-inline">
-                                                                                                                                            <li class="list-inline-item">
-                                                                                                                                                <img alt="Avatar"
-                                                                                                                                                     class="table-avatar"
-                                                                                                                                                     src="/static/assets/img/avatar.png">
-                                                                                                                                                </li>
-                                                                                                                                                <li class="list-inline-item">
-                                                                                                                                                    <img alt="Avatar"
-                                                                                                                                                         class="table-avatar"
-                                                                                                                                                         src="/static/assets/img/avatar3.png">
-                                                                                                                                                    </li>
-                                                                                                                                                    <li class="list-inline-item">
-                                                                                                                                                        <img alt="Avatar"
-                                                                                                                                                             class="table-avatar"
-                                                                                                                                                             src="/static/assets/img/avatar4.png">
-                                                                                                                                                        </li>
-                                                                                                                                                        <li class="list-inline-item">
-                                                                                                                                                            <img alt="Avatar"
-                                                                                                                                                                 class="table-avatar"
-                                                                                                                                                                 src="/static/assets/img/avatar5.png">
-                                                                                                                                                            </li>
-                                                                                                                                                        </ul>
-                                                                                                                                                    </td>
-                                                                                                                                                    <td class="project_progress">
-                                                                                                                                                        <div class="progress progress-sm">
-                                                                                                                                                            <div class="progress-bar bg-green"
-                                                                                                                                                                 role="progressbar"
-                                                                                                                                                                 aria-valuenow="77"
-                                                                                                                                                                 aria-valuemin="0"
-                                                                                                                                                                 aria-valuemax="100"
-                                                                                                                                                                 style="width: 77%"></div>
-                                                                                                                                                        </div>
-                                                                                                                                                        <small>
-                                                                                                                                                        77% Complete
-                                                                                                                                                        </small>
-                                                                                                                                                    </td>
-                                                                                                                                                    <td class="project-state">
-                                                                                                                                                        <span class="badge badge-success">
-                                                                                                                                                            Success
-                                                                                                                                                        </span>
-                                                                                                                                                    </td>
-                                                                                                                                                    <td class="project-actions text-right">
-                                                                                                                                                        <a class="btn btn-primary btn-sm"
-                                                                                                                                                           href="#">
-                                                                                                                                                            <i class="fas fa-folder"></i>
-                                                                                                                                                            View
-                                                                                                                                                        </a>
-                                                                                                                                                        <a class="btn btn-info btn-sm"
-                                                                                                                                                           href="#">
-                                                                                                                                                            <i class="fas fa-pencil-alt"></i>
-                                                                                                                                                            Edit
-                                                                                                                                                        </a>
-                                                                                                                                                        <a class="btn btn-danger btn-sm"
-                                                                                                                                                           href="#">
-                                                                                                                                                            <i class="fas fa-trash"></i>
-                                                                                                                                                            Delete
-                                                                                                                                                        </a>
-                                                                                                                                                    </td>
-                                                                                                                                                </tr>
-                                                                                                                                            </tbody>
-                                                                                                                                        </table>
-                                                                                                                                    </div>
-                                                                                                                                    <!-- /.card-body -->
-                                                                                                                                </div>
-                                                                                                                                <!-- /.card -->
-                                                                                                                            </section>
-                                                                                                                            <!-- /.content -->
-                                                                                                                        </div>
-                                                                                                                        <!-- /.content-wrapper -->
-                                                                                                                    {% endblock content %}
-                                                                                                                    <!-- Specific Page JS goes HERE -->
-                                                                                                                    {% block javascripts %}
-                                                                                                                        <!-- jQuery -->
-                                                                                                                        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                                                                                                                        <!-- Bootstrap 4 -->
-                                                                                                                        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                                                                                                                        <!-- AdminLTE App -->
-                                                                                                                        <script src="/static/assets/js/adminlte.min.js"></script>
-                                                                                                                        <!-- AdminLTE for demo purposes -->
-                                                                                                                        <script src="/static/assets/js/demo.js"></script>
-                                                                                                                    {% endblock javascripts %}
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar2.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar3.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar4.png">
+                                        </li>
+                                    </ul>
+                                </td>
+                                <td class="project_progress">
+                                    <div class="progress progress-sm">
+                                        <div class="progress-bar bg-green"
+                                             role="progressbar"
+                                             aria-valuenow="57"
+                                             aria-valuemin="0"
+                                             aria-valuemax="100"
+                                             style="width: 57%"></div>
+                                    </div>
+                                    <small>
+                                    57% Complete
+                                    </small>
+                                </td>
+                                <td class="project-state">
+                                    <span class="badge badge-success">Success</span>
+                                </td>
+                                <td class="project-actions text-right">
+                                    <a class="btn btn-primary btn-sm" href="#">
+                                        <i class="fas fa-folder"></i>
+                                        View
+                                    </a>
+                                    <a class="btn btn-info btn-sm" href="#">
+                                        <i class="fas fa-pencil-alt"></i>
+                                        Edit
+                                    </a>
+                                    <a class="btn btn-danger btn-sm" href="#">
+                                        <i class="fas fa-trash"></i>
+                                        Delete
+                                    </a>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>#</td>
+                                <td>
+                                    <a>AdminLTE v3</a>
+                                    <br/>
+                                    <small>
+                                    Created 01.01.2019
+                                    </small>
+                                </td>
+                                <td>
+                                    <ul class="list-inline">
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar" class="table-avatar" src="/static/assets/img/avatar.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar2.png">
+                                        </li>
+                                    </ul>
+                                </td>
+                                <td class="project_progress">
+                                    <div class="progress progress-sm">
+                                        <div class="progress-bar bg-green"
+                                             role="progressbar"
+                                             aria-valuenow="47"
+                                             aria-valuemin="0"
+                                             aria-valuemax="100"
+                                             style="width: 47%"></div>
+                                    </div>
+                                    <small>
+                                    47% Complete
+                                    </small>
+                                </td>
+                                <td class="project-state">
+                                    <span class="badge badge-success">Success</span>
+                                </td>
+                                <td class="project-actions text-right">
+                                    <a class="btn btn-primary btn-sm" href="#">
+                                        <i class="fas fa-folder"></i>
+                                        View
+                                    </a>
+                                    <a class="btn btn-info btn-sm" href="#">
+                                        <i class="fas fa-pencil-alt"></i>
+                                        Edit
+                                    </a>
+                                    <a class="btn btn-danger btn-sm" href="#">
+                                        <i class="fas fa-trash"></i>
+                                        Delete
+                                    </a>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>#</td>
+                                <td>
+                                    <a>AdminLTE v3</a>
+                                    <br/>
+                                    <small>
+                                    Created 01.01.2019
+                                    </small>
+                                </td>
+                                <td>
+                                    <ul class="list-inline">
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar" class="table-avatar" src="/static/assets/img/avatar.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar2.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar3.png">
+                                        </li>
+                                    </ul>
+                                </td>
+                                <td class="project_progress">
+                                    <div class="progress progress-sm">
+                                        <div class="progress-bar bg-green"
+                                             role="progressbar"
+                                             aria-valuenow="77"
+                                             aria-valuemin="0"
+                                             aria-valuemax="100"
+                                             style="width: 77%"></div>
+                                    </div>
+                                    <small>
+                                    77% Complete
+                                    </small>
+                                </td>
+                                <td class="project-state">
+                                    <span class="badge badge-success">Success</span>
+                                </td>
+                                <td class="project-actions text-right">
+                                    <a class="btn btn-primary btn-sm" href="#">
+                                        <i class="fas fa-folder"></i>
+                                        View
+                                    </a>
+                                    <a class="btn btn-info btn-sm" href="#">
+                                        <i class="fas fa-pencil-alt"></i>
+                                        Edit
+                                    </a>
+                                    <a class="btn btn-danger btn-sm" href="#">
+                                        <i class="fas fa-trash"></i>
+                                        Delete
+                                    </a>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>#</td>
+                                <td>
+                                    <a>AdminLTE v3</a>
+                                    <br/>
+                                    <small>
+                                    Created 01.01.2019
+                                    </small>
+                                </td>
+                                <td>
+                                    <ul class="list-inline">
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar" class="table-avatar" src="/static/assets/img/avatar.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar2.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar3.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar4.png">
+                                        </li>
+                                    </ul>
+                                </td>
+                                <td class="project_progress">
+                                    <div class="progress progress-sm">
+                                        <div class="progress-bar bg-green"
+                                             role="progressbar"
+                                             aria-valuenow="60"
+                                             aria-valuemin="0"
+                                             aria-valuemax="100"
+                                             style="width: 60%"></div>
+                                    </div>
+                                    <small>
+                                    60% Complete
+                                    </small>
+                                </td>
+                                <td class="project-state">
+                                    <span class="badge badge-success">Success</span>
+                                </td>
+                                <td class="project-actions text-right">
+                                    <a class="btn btn-primary btn-sm" href="#">
+                                        <i class="fas fa-folder"></i>
+                                        View
+                                    </a>
+                                    <a class="btn btn-info btn-sm" href="#">
+                                        <i class="fas fa-pencil-alt"></i>
+                                        Edit
+                                    </a>
+                                    <a class="btn btn-danger btn-sm" href="#">
+                                        <i class="fas fa-trash"></i>
+                                        Delete
+                                    </a>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>
+                                    #
+                                </td>
+                                <td>
+                                    <a>
+                                        AdminLTE v3
+                                    </a>
+                                    <br/>
+                                    <small>
+                                    Created 01.01.2019
+                                    </small>
+                                </td>
+                                <td>
+                                    <ul class="list-inline">
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar" class="table-avatar" src="/static/assets/img/avatar.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar4.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar5.png">
+                                        </li>
+                                    </ul>
+                                </td>
+                                <td class="project_progress">
+                                    <div class="progress progress-sm">
+                                        <div class="progress-bar bg-green"
+                                             role="progressbar"
+                                             aria-valuenow="12"
+                                             aria-valuemin="0"
+                                             aria-valuemax="100"
+                                             style="width: 12%"></div>
+                                    </div>
+                                    <small>
+                                    12% Complete
+                                    </small>
+                                </td>
+                                <td class="project-state">
+                                    <span class="badge badge-success">
+                                        Success
+                                    </span>
+                                </td>
+                                <td class="project-actions text-right">
+                                    <a class="btn btn-primary btn-sm" href="#">
+                                        <i class="fas fa-folder"></i>
+                                        View
+                                    </a>
+                                    <a class="btn btn-info btn-sm" href="#">
+                                        <i class="fas fa-pencil-alt"></i>
+                                        Edit
+                                    </a>
+                                    <a class="btn btn-danger btn-sm" href="#">
+                                        <i class="fas fa-trash"></i>
+                                        Delete
+                                    </a>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>
+                                    #
+                                </td>
+                                <td>
+                                    <a>
+                                        AdminLTE v3
+                                    </a>
+                                    <br/>
+                                    <small>
+                                    Created 01.01.2019
+                                    </small>
+                                </td>
+                                <td>
+                                    <ul class="list-inline">
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar" class="table-avatar" src="/static/assets/img/avatar.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar2.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar3.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar4.png">
+                                        </li>
+                                    </ul>
+                                </td>
+                                <td class="project_progress">
+                                    <div class="progress progress-sm">
+                                        <div class="progress-bar bg-green"
+                                             role="progressbar"
+                                             aria-valuenow="35"
+                                             aria-valuemin="0"
+                                             aria-valuemax="100"
+                                             style="width: 35%"></div>
+                                    </div>
+                                    <small>
+                                    35% Complete
+                                    </small>
+                                </td>
+                                <td class="project-state">
+                                    <span class="badge badge-success">
+                                        Success
+                                    </span>
+                                </td>
+                                <td class="project-actions text-right">
+                                    <a class="btn btn-primary btn-sm" href="#">
+                                        <i class="fas fa-folder"></i>
+                                        View
+                                    </a>
+                                    <a class="btn btn-info btn-sm" href="#">
+                                        <i class="fas fa-pencil-alt"></i>
+                                        Edit
+                                    </a>
+                                    <a class="btn btn-danger btn-sm" href="#">
+                                        <i class="fas fa-trash"></i>
+                                        Delete
+                                    </a>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>
+                                    #
+                                </td>
+                                <td>
+                                    <a>
+                                        AdminLTE v3
+                                    </a>
+                                    <br/>
+                                    <small>
+                                    Created 01.01.2019
+                                    </small>
+                                </td>
+                                <td>
+                                    <ul class="list-inline">
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar4.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar5.png">
+                                        </li>
+                                    </ul>
+                                </td>
+                                <td class="project_progress">
+                                    <div class="progress progress-sm">
+                                        <div class="progress-bar bg-green"
+                                             role="progressbar"
+                                             aria-valuenow="87"
+                                             aria-valuemin="0"
+                                             aria-valuemax="100"
+                                             style="width: 87%"></div>
+                                    </div>
+                                    <small>
+                                    87% Complete
+                                    </small>
+                                </td>
+                                <td class="project-state">
+                                    <span class="badge badge-success">
+                                        Success
+                                    </span>
+                                </td>
+                                <td class="project-actions text-right">
+                                    <a class="btn btn-primary btn-sm" href="#">
+                                        <i class="fas fa-folder"></i>
+                                        View
+                                    </a>
+                                    <a class="btn btn-info btn-sm" href="#">
+                                        <i class="fas fa-pencil-alt"></i>
+                                        Edit
+                                    </a>
+                                    <a class="btn btn-danger btn-sm" href="#">
+                                        <i class="fas fa-trash"></i>
+                                        Delete
+                                    </a>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>
+                                    #
+                                </td>
+                                <td>
+                                    <a>
+                                        AdminLTE v3
+                                    </a>
+                                    <br/>
+                                    <small>
+                                    Created 01.01.2019
+                                    </small>
+                                </td>
+                                <td>
+                                    <ul class="list-inline">
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar" class="table-avatar" src="/static/assets/img/avatar.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar3.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar4.png">
+                                        </li>
+                                    </ul>
+                                </td>
+                                <td class="project_progress">
+                                    <div class="progress progress-sm">
+                                        <div class="progress-bar bg-green"
+                                             role="progressbar"
+                                             aria-valuenow="77"
+                                             aria-valuemin="0"
+                                             aria-valuemax="100"
+                                             style="width: 77%"></div>
+                                    </div>
+                                    <small>
+                                    77% Complete
+                                    </small>
+                                </td>
+                                <td class="project-state">
+                                    <span class="badge badge-success">
+                                        Success
+                                    </span>
+                                </td>
+                                <td class="project-actions text-right">
+                                    <a class="btn btn-primary btn-sm" href="#">
+                                        <i class="fas fa-folder"></i>
+                                        View
+                                    </a>
+                                    <a class="btn btn-info btn-sm" href="#">
+                                        <i class="fas fa-pencil-alt"></i>
+                                        Edit
+                                    </a>
+                                    <a class="btn btn-danger btn-sm" href="#">
+                                        <i class="fas fa-trash"></i>
+                                        Delete
+                                    </a>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>
+                                    #
+                                </td>
+                                <td>
+                                    <a>
+                                        AdminLTE v3
+                                    </a>
+                                    <br/>
+                                    <small>
+                                    Created 01.01.2019
+                                    </small>
+                                </td>
+                                <td>
+                                    <ul class="list-inline">
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar" class="table-avatar" src="/static/assets/img/avatar.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar3.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar4.png">
+                                        </li>
+                                        <li class="list-inline-item">
+                                            <img alt="Avatar"
+                                                 class="table-avatar"
+                                                 src="/static/assets/img/avatar5.png">
+                                        </li>
+                                    </ul>
+                                </td>
+                                <td class="project_progress">
+                                    <div class="progress progress-sm">
+                                        <div class="progress-bar bg-green"
+                                             role="progressbar"
+                                             aria-valuenow="77"
+                                             aria-valuemin="0"
+                                             aria-valuemax="100"
+                                             style="width: 77%"></div>
+                                    </div>
+                                    <small>
+                                    77% Complete
+                                    </small>
+                                </td>
+                                <td class="project-state">
+                                    <span class="badge badge-success">
+                                        Success
+                                    </span>
+                                </td>
+                                <td class="project-actions text-right">
+                                    <a class="btn btn-primary btn-sm" href="#">
+                                        <i class="fas fa-folder"></i>
+                                        View
+                                    </a>
+                                    <a class="btn btn-info btn-sm" href="#">
+                                        <i class="fas fa-pencil-alt"></i>
+                                        Edit
+                                    </a>
+                                    <a class="btn btn-danger btn-sm" href="#">
+                                        <i class="fas fa-trash"></i>
+                                        Delete
+                                    </a>
+                                </td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+                <!-- /.card-body -->
+            </div>
+            <!-- /.card -->
+        </section>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/forms-advanced.html b/tests/jinja_adminlte/forms-advanced.html
index 026f3d3..c8c04f3 100644
--- a/tests/jinja_adminlte/forms-advanced.html
+++ b/tests/jinja_adminlte/forms-advanced.html
@@ -73,9 +73,7 @@
                         <div class="row">
                             <div class="col-md-6">
                                 <div class="form-group">
-                                    <label>
-                                        Minimal
-                                    </label>
+                                    <label>Minimal</label>
                                     <select class="form-control select2" style="width: 100%;">
                                         <option selected="selected">
                                             Alabama
@@ -102,9 +100,7 @@
                                 </div>
                                 <!-- /.form-group -->
                                 <div class="form-group">
-                                    <label>
-                                        Disabled
-                                    </label>
+                                    <label>Disabled</label>
                                     <select class="form-control select2" disabled="disabled" style="width: 100%;">
                                         <option selected="selected">
                                             Alabama
@@ -134,9 +130,7 @@
                             <!-- /.col -->
                             <div class="col-md-6">
                                 <div class="form-group">
-                                    <label>
-                                        Multiple
-                                    </label>
+                                    <label>Multiple</label>
                                     <select class="select2"
                                             multiple="multiple"
                                             data-placeholder="Select a State"
@@ -166,9 +160,7 @@
                                 </div>
                                 <!-- /.form-group -->
                                 <div class="form-group">
-                                    <label>
-                                        Disabled Result
-                                    </label>
+                                    <label>Disabled Result</label>
                                     <select class="form-control select2" style="width: 100%;">
                                         <option selected="selected">
                                             Alabama
@@ -202,9 +194,7 @@
                         <div class="row">
                             <div class="col-12 col-sm-6">
                                 <div class="form-group">
-                                    <label>
-                                        Minimal (.select2-danger)
-                                    </label>
+                                    <label>Minimal (.select2-danger)</label>
                                     <select class="form-control select2 select2-danger"
                                             data-dropdown-css-class="select2-danger"
                                             style="width: 100%;">
@@ -236,9 +226,7 @@
                             <!-- /.col -->
                             <div class="col-12 col-sm-6">
                                 <div class="form-group">
-                                    <label>
-                                        Multiple (.select2-purple)
-                                    </label>
+                                    <label>Multiple (.select2-purple)</label>
                                     <div class="select2-purple">
                                         <select class="select2"
                                                 multiple="multiple"
@@ -304,9 +292,7 @@
                         <div class="row">
                             <div class="col-md-6">
                                 <div class="form-group">
-                                    <label>
-                                        Minimal
-                                    </label>
+                                    <label>Minimal</label>
                                     <select class="form-control select2bs4" style="width: 100%;">
                                         <option selected="selected">
                                             Alabama
@@ -333,9 +319,7 @@
                                 </div>
                                 <!-- /.form-group -->
                                 <div class="form-group">
-                                    <label>
-                                        Disabled
-                                    </label>
+                                    <label>Disabled</label>
                                     <select class="form-control select2bs4" disabled="disabled" style="width: 100%;">
                                         <option selected="selected">
                                             Alabama
@@ -591,9 +575,7 @@
                                                 <i class="fas fa-laptop"></i>
                                             </span>
                                         </div>
-                                        <input type="text"
-                                               class="form-control"
-                                               data-inputmask="'alias': 'ip'">
+                                        <input type="text" class="form-control" data-inputmask="'alias': 'ip'">
                                     </div>
                                     <!-- /.input group -->
                                 </div>
@@ -884,7 +866,9 @@
                         <!-- Bootstrap Switch -->
                         <div class="card card-secondary">
                             <div class="card-header">
-                                <h3 class="card-title">Bootstrap Switch</h3>
+                                <h3 class="card-title">
+                                    Bootstrap Switch
+                                </h3>
                             </div>
                             <div class="card-body">
                                 <input type="checkbox" name="my-checkbox" checked data-bootstrap-switch>
diff --git a/tests/jinja_adminlte/forms-general.html b/tests/jinja_adminlte/forms-general.html
index 12ae22b..d076484 100644
--- a/tests/jinja_adminlte/forms-general.html
+++ b/tests/jinja_adminlte/forms-general.html
@@ -53,27 +53,21 @@
                             <form>
                                 <div class="card-body">
                                     <div class="form-group">
-                                        <label for="exampleInputEmail1">
-                                            Email address
-                                        </label>
+                                        <label for="exampleInputEmail1">Email address</label>
                                         <input type="email"
                                                class="form-control"
                                                id="exampleInputEmail1"
                                                placeholder="Enter email">
                                     </div>
                                     <div class="form-group">
-                                        <label for="exampleInputPassword1">
-                                            Password
-                                        </label>
+                                        <label for="exampleInputPassword1">Password</label>
                                         <input type="password"
                                                class="form-control"
                                                id="exampleInputPassword1"
                                                placeholder="Password">
                                     </div>
                                     <div class="form-group">
-                                        <label for="exampleInputFile">
-                                            File input
-                                        </label>
+                                        <label for="exampleInputFile">File input</label>
                                         <div class="input-group">
                                             <div class="custom-file">
                                                 <input type="file" class="custom-file-input" id="exampleInputFile">
@@ -152,16 +146,22 @@
                                 <div class="input-group mb-3">
                                     <input type="text" class="form-control">
                                     <div class="input-group-append">
-                                        <span class="input-group-text">.00</span>
+                                        <span class="input-group-text">
+                                            .00
+                                        </span>
                                     </div>
                                 </div>
                                 <div class="input-group">
                                     <div class="input-group-prepend">
-                                        <span class="input-group-text">$</span>
+                                        <span class="input-group-text">
+                                            $
+                                        </span>
                                     </div>
                                     <input type="text" class="form-control">
                                     <div class="input-group-append">
-                                        <span class="input-group-text">.00</span>
+                                        <span class="input-group-text">
+                                            .00
+                                        </span>
                                     </div>
                                 </div>
                                 <h4>With icons</h4>
@@ -375,20 +375,14 @@
                                         <div class="col-sm-6">
                                             <!-- text input -->
                                             <div class="form-group">
-                                                <label>
-                                                    Text
-                                                </label>
+                                                <label>Text</label>
                                                 <input type="text" class="form-control" placeholder="Enter ...">
                                             </div>
                                         </div>
                                         <div class="col-sm-6">
                                             <div class="form-group">
-                                                <label>
-                                                    Text Disabled
-                                                </label>
-                                                <input type="text"
-                                                       class="form-control"
-                                                       placeholder="Enter ...">
+                                                <label>Text Disabled</label>
+                                                <input type="text" class="form-control" placeholder="Enter ...">
                                             </div>
                                         </div>
                                     </div>
@@ -396,9 +390,7 @@
                                         <div class="col-sm-6">
                                             <!-- textarea -->
                                             <div class="form-group">
-                                                <label>
-                                                    Textarea
-                                                </label>
+                                                <label>Textarea</label>
                                                 <textarea class="form-control"
                                                           rows="3"
                                                           placeholder="Enter ..."></textarea>
@@ -406,9 +398,7 @@
                                         </div>
                                         <div class="col-sm-6">
                                             <div class="form-group">
-                                                <label>
-                                                    Textarea Disabled
-                                                </label>
+                                                <label>Textarea Disabled</label>
                                                 <textarea class="form-control"
                                                           rows="3"
                                                           placeholder="Enter ..."></textarea>
@@ -501,9 +491,7 @@
                                         <div class="col-sm-6">
                                             <!-- select -->
                                             <div class="form-group">
-                                                <label>
-                                                    Select
-                                                </label>
+                                                <label>Select</label>
                                                 <select class="form-control">
                                                     <option>
                                                         option 1
@@ -525,9 +513,7 @@
                                         </div>
                                         <div class="col-sm-6">
                                             <div class="form-group">
-                                                <label>
-                                                    Select Disabled
-                                                </label>
+                                                <label>Select Disabled</label>
                                                 <select class="form-control" disabled>
                                                     <option>
                                                         option 1
@@ -552,9 +538,7 @@
                                         <div class="col-sm-6">
                                             <!-- Select multiple-->
                                             <div class="form-group">
-                                                <label>
-                                                    Select Multiple
-                                                </label>
+                                                <label>Select Multiple</label>
                                                 <select multiple class="form-control">
                                                     <option>
                                                         option 1
@@ -576,9 +560,7 @@
                                         </div>
                                         <div class="col-sm-6">
                                             <div class="form-group">
-                                                <label>
-                                                    Select Multiple Disabled
-                                                </label>
+                                                <label>Select Multiple Disabled</label>
                                                 <select multiple class="form-control" disabled>
                                                     <option>
                                                         option 1
@@ -669,9 +651,7 @@
                                                     </label>
                                                 </div>
                                                 <div class="custom-control custom-radio">
-                                                    <input class="custom-control-input"
-                                                           type="radio"
-                                                           id="customRadio3">
+                                                    <input class="custom-control-input" type="radio" id="customRadio3">
                                                     <label for="customRadio3" class="custom-control-label">
                                                         Custom Radio disabled
                                                     </label>
diff --git a/tests/jinja_adminlte/forms-validation.html b/tests/jinja_adminlte/forms-validation.html
index c3b81ae..89a28ee 100644
--- a/tests/jinja_adminlte/forms-validation.html
+++ b/tests/jinja_adminlte/forms-validation.html
@@ -59,9 +59,7 @@
                             <form id="quickForm">
                                 <div class="card-body">
                                     <div class="form-group">
-                                        <label for="exampleInputEmail1">
-                                            Email address
-                                        </label>
+                                        <label for="exampleInputEmail1">Email address</label>
                                         <input type="email"
                                                name="email"
                                                class="form-control"
@@ -69,9 +67,7 @@
                                                placeholder="Enter email">
                                     </div>
                                     <div class="form-group">
-                                        <label for="exampleInputPassword1">
-                                            Password
-                                        </label>
+                                        <label for="exampleInputPassword1">Password</label>
                                         <input type="password"
                                                name="password"
                                                class="form-control"
diff --git a/tests/jinja_adminlte/gallery.html b/tests/jinja_adminlte/gallery.html
index 363e138..f93024d 100644
--- a/tests/jinja_adminlte/gallery.html
+++ b/tests/jinja_adminlte/gallery.html
@@ -2,355 +2,199 @@
 {% block title %}Gallery {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- Ekko Lightbox -->
-        <link rel="stylesheet" href="/static/assets/plugins/ekko-lightbox/ekko-lightbox.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>Gallery</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    Gallery
-                                </li>
-                            </ol>
-                        </div>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- Ekko Lightbox -->
+    <link rel="stylesheet" href="/static/assets/plugins/ekko-lightbox/ekko-lightbox.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>Gallery</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                Gallery
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-12">
-                            <div class="card card-primary">
-                                <div class="card-header">
-                                    <h4 class="card-title">FilterizR Gallery with Ekko Lightbox</h4>
-                                </div>
-                                <div class="card-body">
-                                    <div>
-                                        <div class="btn-group w-100 mb-2">
-                                            <a class="btn btn-info active" href="javascript:void(0)" data-filter="all">
-                                                All items
-                                            </a>
-                                            <a class="btn btn-info" href="javascript:void(0)" data-filter="1">
-                                                Category 1 (WHITE)
-                                            </a>
-                                            <a class="btn btn-info" href="javascript:void(0)" data-filter="2">
-                                                Category 2 (BLACK)
-                                            </a>
-                                            <a class="btn btn-info" href="javascript:void(0)" data-filter="3">
-                                                Category 3 (COLORED)
-                                            </a>
-                                            <a class="btn btn-info" href="javascript:void(0)" data-filter="4">
-                                                Category 4 (COLORED, BLACK)
-                                            </a>
-                                        </div>
-                                        <div class="mb-2">
-                                            <a class="btn btn-secondary" href="javascript:void(0)" data-shuffle>
-                                                Shuffle items
-                                            </a>
-                                            <div class="float-right">
-                                                <select class="custom-select" style="width: auto;" data-sortOrder>
-                                                    <option value="index">
-                                                        Sort by Position
-                                                    </option>
-                                                    <option value="sortData">
-                                                        Sort by Custom Data
-                                                    </option>
-                                                </select>
-                                                <div class="btn-group">
-                                                    <a class="btn btn-default" href="javascript:void(0)" data-sortAsc>
-                                                        Ascending
-                                                    </a>
-                                                    <a class="btn btn-default" href="javascript:void(0)" data-sortDesc>
-                                                        Descending
-                                                    </a>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div>
-                                        <div class="filter-container p-0 row">
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="1"
-                                                 data-sort="white sample">
-                                                <a href="https://via.placeholder.com/1200/FFFFFF.png?text=1"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 1 - white">
-                                                    <img src="https://via.placeholder.com/300/FFFFFF?text=1"
-                                                         class="img-fluid mb-2"
-                                                         alt="white sample"/>
-                                                </a>
-                                            </div>
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="2, 4"
-                                                 data-sort="black sample">
-                                                <a href="https://via.placeholder.com/1200/000000.png?text=2"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 2 - black">
-                                                    <img src="https://via.placeholder.com/300/000000?text=2"
-                                                         class="img-fluid mb-2"
-                                                         alt="black sample"/>
-                                                </a>
-                                            </div>
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="3, 4"
-                                                 data-sort="red sample">
-                                                <a href="https://via.placeholder.com/1200/FF0000/FFFFFF.png?text=3"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 3 - red">
-                                                    <img src="https://via.placeholder.com/300/FF0000/FFFFFF?text=3"
-                                                         class="img-fluid mb-2"
-                                                         alt="red sample"/>
-                                                </a>
-                                            </div>
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="3, 4"
-                                                 data-sort="red sample">
-                                                <a href="https://via.placeholder.com/1200/FF0000/FFFFFF.png?text=4"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 4 - red">
-                                                    <img src="https://via.placeholder.com/300/FF0000/FFFFFF?text=4"
-                                                         class="img-fluid mb-2"
-                                                         alt="red sample"/>
-                                                </a>
-                                            </div>
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="2, 4"
-                                                 data-sort="black sample">
-                                                <a href="https://via.placeholder.com/1200/000000.png?text=5"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 5 - black">
-                                                    <img src="https://via.placeholder.com/300/000000?text=5"
-                                                         class="img-fluid mb-2"
-                                                         alt="black sample"/>
-                                                </a>
-                                            </div>
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="1"
-                                                 data-sort="white sample">
-                                                <a href="https://via.placeholder.com/1200/FFFFFF.png?text=6"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 6 - white">
-                                                    <img src="https://via.placeholder.com/300/FFFFFF?text=6"
-                                                         class="img-fluid mb-2"
-                                                         alt="white sample"/>
-                                                </a>
-                                            </div>
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="1"
-                                                 data-sort="white sample">
-                                                <a href="https://via.placeholder.com/1200/FFFFFF.png?text=7"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 7 - white">
-                                                    <img src="https://via.placeholder.com/300/FFFFFF?text=7"
-                                                         class="img-fluid mb-2"
-                                                         alt="white sample"/>
-                                                </a>
-                                            </div>
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="2, 4"
-                                                 data-sort="black sample">
-                                                <a href="https://via.placeholder.com/1200/000000.png?text=8"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 8 - black">
-                                                    <img src="https://via.placeholder.com/300/000000?text=8"
-                                                         class="img-fluid mb-2"
-                                                         alt="black sample"/>
-                                                </a>
-                                            </div>
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="3, 4"
-                                                 data-sort="red sample">
-                                                <a href="https://via.placeholder.com/1200/FF0000/FFFFFF.png?text=9"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 9 - red">
-                                                    <img src="https://via.placeholder.com/300/FF0000/FFFFFF?text=9"
-                                                         class="img-fluid mb-2"
-                                                         alt="red sample"/>
-                                                </a>
-                                            </div>
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="1"
-                                                 data-sort="white sample">
-                                                <a href="https://via.placeholder.com/1200/FFFFFF.png?text=10"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 10 - white">
-                                                    <img src="https://via.placeholder.com/300/FFFFFF?text=10"
-                                                         class="img-fluid mb-2"
-                                                         alt="white sample"/>
-                                                </a>
-                                            </div>
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="1"
-                                                 data-sort="white sample">
-                                                <a href="https://via.placeholder.com/1200/FFFFFF.png?text=11"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 11 - white">
-                                                    <img src="https://via.placeholder.com/300/FFFFFF?text=11"
-                                                         class="img-fluid mb-2"
-                                                         alt="white sample"/>
-                                                </a>
-                                            </div>
-                                            <div class="filtr-item col-sm-2"
-                                                 data-category="2, 4"
-                                                 data-sort="black sample">
-                                                <a href="https://via.placeholder.com/1200/000000.png?text=12"
-                                                   data-toggle="lightbox"
-                                                   data-title="sample 12 - black">
-                                                    <img src="https://via.placeholder.com/300/000000?text=12"
-                                                         class="img-fluid mb-2"
-                                                         alt="black sample"/>
-                                                </a>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-12">
+                        <div class="card card-primary">
+                            <div class="card-header">
+                                <h4 class="card-title">FilterizR Gallery with Ekko Lightbox</h4>
                             </div>
-                        </div>
-                        <div class="col-12">
-                            <div class="card card-primary">
-                                <div class="card-header">
-                                    <h4 class="card-title">Ekko Lightbox</h4>
+                            <div class="card-body">
+                                <div>
+                                    <div class="btn-group w-100 mb-2">
+                                        <a class="btn btn-info active" href="javascript:void(0)" data-filter="all">
+                                            All items
+                                        </a>
+                                        <a class="btn btn-info" href="javascript:void(0)" data-filter="1">
+                                            Category 1 (WHITE)
+                                        </a>
+                                        <a class="btn btn-info" href="javascript:void(0)" data-filter="2">
+                                            Category 2 (BLACK)
+                                        </a>
+                                        <a class="btn btn-info" href="javascript:void(0)" data-filter="3">
+                                            Category 3 (COLORED)
+                                        </a>
+                                        <a class="btn btn-info" href="javascript:void(0)" data-filter="4">
+                                            Category 4 (COLORED, BLACK)
+                                        </a>
+                                    </div>
+                                    <div class="mb-2">
+                                        <a class="btn btn-secondary" href="javascript:void(0)" data-shuffle>
+                                            Shuffle items
+                                        </a>
+                                        <div class="float-right">
+                                            <select class="custom-select" style="width: auto;" data-sortOrder>
+                                                <option value="index">
+                                                    Sort by Position
+                                                </option>
+                                                <option value="sortData">
+                                                    Sort by Custom Data
+                                                </option>
+                                            </select>
+                                            <div class="btn-group">
+                                                <a class="btn btn-default" href="javascript:void(0)" data-sortAsc>
+                                                    Ascending
+                                                </a>
+                                                <a class="btn btn-default" href="javascript:void(0)" data-sortDesc>
+                                                    Descending
+                                                </a>
+                                            </div>
+                                        </div>
+                                    </div>
                                 </div>
-                                <div class="card-body">
-                                    <div class="row">
-                                        <div class="col-sm-2">
+                                <div>
+                                    <div class="filter-container p-0 row">
+                                        <div class="filtr-item col-sm-2" data-category="1" data-sort="white sample">
                                             <a href="https://via.placeholder.com/1200/FFFFFF.png?text=1"
                                                data-toggle="lightbox"
-                                               data-title="sample 1 - white"
-                                               data-gallery="gallery">
+                                               data-title="sample 1 - white">
                                                 <img src="https://via.placeholder.com/300/FFFFFF?text=1"
                                                      class="img-fluid mb-2"
                                                      alt="white sample"/>
                                             </a>
                                         </div>
-                                        <div class="col-sm-2">
+                                        <div class="filtr-item col-sm-2" data-category="2, 4" data-sort="black sample">
                                             <a href="https://via.placeholder.com/1200/000000.png?text=2"
                                                data-toggle="lightbox"
-                                               data-title="sample 2 - black"
-                                               data-gallery="gallery">
+                                               data-title="sample 2 - black">
                                                 <img src="https://via.placeholder.com/300/000000?text=2"
                                                      class="img-fluid mb-2"
                                                      alt="black sample"/>
                                             </a>
                                         </div>
-                                        <div class="col-sm-2">
+                                        <div class="filtr-item col-sm-2" data-category="3, 4" data-sort="red sample">
                                             <a href="https://via.placeholder.com/1200/FF0000/FFFFFF.png?text=3"
                                                data-toggle="lightbox"
-                                               data-title="sample 3 - red"
-                                               data-gallery="gallery">
+                                               data-title="sample 3 - red">
                                                 <img src="https://via.placeholder.com/300/FF0000/FFFFFF?text=3"
                                                      class="img-fluid mb-2"
                                                      alt="red sample"/>
                                             </a>
                                         </div>
-                                        <div class="col-sm-2">
+                                        <div class="filtr-item col-sm-2" data-category="3, 4" data-sort="red sample">
                                             <a href="https://via.placeholder.com/1200/FF0000/FFFFFF.png?text=4"
                                                data-toggle="lightbox"
-                                               data-title="sample 4 - red"
-                                               data-gallery="gallery">
+                                               data-title="sample 4 - red">
                                                 <img src="https://via.placeholder.com/300/FF0000/FFFFFF?text=4"
                                                      class="img-fluid mb-2"
                                                      alt="red sample"/>
                                             </a>
                                         </div>
-                                        <div class="col-sm-2">
+                                        <div class="filtr-item col-sm-2" data-category="2, 4" data-sort="black sample">
                                             <a href="https://via.placeholder.com/1200/000000.png?text=5"
                                                data-toggle="lightbox"
-                                               data-title="sample 5 - black"
-                                               data-gallery="gallery">
+                                               data-title="sample 5 - black">
                                                 <img src="https://via.placeholder.com/300/000000?text=5"
                                                      class="img-fluid mb-2"
                                                      alt="black sample"/>
                                             </a>
                                         </div>
-                                        <div class="col-sm-2">
+                                        <div class="filtr-item col-sm-2" data-category="1" data-sort="white sample">
                                             <a href="https://via.placeholder.com/1200/FFFFFF.png?text=6"
                                                data-toggle="lightbox"
-                                               data-title="sample 6 - white"
-                                               data-gallery="gallery">
+                                               data-title="sample 6 - white">
                                                 <img src="https://via.placeholder.com/300/FFFFFF?text=6"
                                                      class="img-fluid mb-2"
                                                      alt="white sample"/>
                                             </a>
                                         </div>
-                                        <div class="col-sm-2">
+                                        <div class="filtr-item col-sm-2" data-category="1" data-sort="white sample">
                                             <a href="https://via.placeholder.com/1200/FFFFFF.png?text=7"
                                                data-toggle="lightbox"
-                                               data-title="sample 7 - white"
-                                               data-gallery="gallery">
+                                               data-title="sample 7 - white">
                                                 <img src="https://via.placeholder.com/300/FFFFFF?text=7"
                                                      class="img-fluid mb-2"
                                                      alt="white sample"/>
                                             </a>
                                         </div>
-                                        <div class="col-sm-2">
+                                        <div class="filtr-item col-sm-2" data-category="2, 4" data-sort="black sample">
                                             <a href="https://via.placeholder.com/1200/000000.png?text=8"
                                                data-toggle="lightbox"
-                                               data-title="sample 8 - black"
-                                               data-gallery="gallery">
+                                               data-title="sample 8 - black">
                                                 <img src="https://via.placeholder.com/300/000000?text=8"
                                                      class="img-fluid mb-2"
                                                      alt="black sample"/>
                                             </a>
                                         </div>
-                                        <div class="col-sm-2">
+                                        <div class="filtr-item col-sm-2" data-category="3, 4" data-sort="red sample">
                                             <a href="https://via.placeholder.com/1200/FF0000/FFFFFF.png?text=9"
                                                data-toggle="lightbox"
-                                               data-title="sample 9 - red"
-                                               data-gallery="gallery">
+                                               data-title="sample 9 - red">
                                                 <img src="https://via.placeholder.com/300/FF0000/FFFFFF?text=9"
                                                      class="img-fluid mb-2"
                                                      alt="red sample"/>
                                             </a>
                                         </div>
-                                        <div class="col-sm-2">
+                                        <div class="filtr-item col-sm-2" data-category="1" data-sort="white sample">
                                             <a href="https://via.placeholder.com/1200/FFFFFF.png?text=10"
                                                data-toggle="lightbox"
-                                               data-title="sample 10 - white"
-                                               data-gallery="gallery">
+                                               data-title="sample 10 - white">
                                                 <img src="https://via.placeholder.com/300/FFFFFF?text=10"
                                                      class="img-fluid mb-2"
                                                      alt="white sample"/>
                                             </a>
                                         </div>
-                                        <div class="col-sm-2">
+                                        <div class="filtr-item col-sm-2" data-category="1" data-sort="white sample">
                                             <a href="https://via.placeholder.com/1200/FFFFFF.png?text=11"
                                                data-toggle="lightbox"
-                                               data-title="sample 11 - white"
-                                               data-gallery="gallery">
+                                               data-title="sample 11 - white">
                                                 <img src="https://via.placeholder.com/300/FFFFFF?text=11"
                                                      class="img-fluid mb-2"
                                                      alt="white sample"/>
                                             </a>
                                         </div>
-                                        <div class="col-sm-2">
+                                        <div class="filtr-item col-sm-2" data-category="2, 4" data-sort="black sample">
                                             <a href="https://via.placeholder.com/1200/000000.png?text=12"
                                                data-toggle="lightbox"
-                                               data-title="sample 12 - black"
-                                               data-gallery="gallery">
+                                               data-title="sample 12 - black">
                                                 <img src="https://via.placeholder.com/300/000000?text=12"
                                                      class="img-fluid mb-2"
                                                      alt="black sample"/>
@@ -361,31 +205,163 @@
                             </div>
                         </div>
                     </div>
+                    <div class="col-12">
+                        <div class="card card-primary">
+                            <div class="card-header">
+                                <h4 class="card-title">Ekko Lightbox</h4>
+                            </div>
+                            <div class="card-body">
+                                <div class="row">
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/FFFFFF.png?text=1"
+                                           data-toggle="lightbox"
+                                           data-title="sample 1 - white"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/FFFFFF?text=1"
+                                                 class="img-fluid mb-2"
+                                                 alt="white sample"/>
+                                        </a>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/000000.png?text=2"
+                                           data-toggle="lightbox"
+                                           data-title="sample 2 - black"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/000000?text=2"
+                                                 class="img-fluid mb-2"
+                                                 alt="black sample"/>
+                                        </a>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/FF0000/FFFFFF.png?text=3"
+                                           data-toggle="lightbox"
+                                           data-title="sample 3 - red"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/FF0000/FFFFFF?text=3"
+                                                 class="img-fluid mb-2"
+                                                 alt="red sample"/>
+                                        </a>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/FF0000/FFFFFF.png?text=4"
+                                           data-toggle="lightbox"
+                                           data-title="sample 4 - red"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/FF0000/FFFFFF?text=4"
+                                                 class="img-fluid mb-2"
+                                                 alt="red sample"/>
+                                        </a>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/000000.png?text=5"
+                                           data-toggle="lightbox"
+                                           data-title="sample 5 - black"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/000000?text=5"
+                                                 class="img-fluid mb-2"
+                                                 alt="black sample"/>
+                                        </a>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/FFFFFF.png?text=6"
+                                           data-toggle="lightbox"
+                                           data-title="sample 6 - white"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/FFFFFF?text=6"
+                                                 class="img-fluid mb-2"
+                                                 alt="white sample"/>
+                                        </a>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/FFFFFF.png?text=7"
+                                           data-toggle="lightbox"
+                                           data-title="sample 7 - white"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/FFFFFF?text=7"
+                                                 class="img-fluid mb-2"
+                                                 alt="white sample"/>
+                                        </a>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/000000.png?text=8"
+                                           data-toggle="lightbox"
+                                           data-title="sample 8 - black"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/000000?text=8"
+                                                 class="img-fluid mb-2"
+                                                 alt="black sample"/>
+                                        </a>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/FF0000/FFFFFF.png?text=9"
+                                           data-toggle="lightbox"
+                                           data-title="sample 9 - red"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/FF0000/FFFFFF?text=9"
+                                                 class="img-fluid mb-2"
+                                                 alt="red sample"/>
+                                        </a>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/FFFFFF.png?text=10"
+                                           data-toggle="lightbox"
+                                           data-title="sample 10 - white"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/FFFFFF?text=10"
+                                                 class="img-fluid mb-2"
+                                                 alt="white sample"/>
+                                        </a>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/FFFFFF.png?text=11"
+                                           data-toggle="lightbox"
+                                           data-title="sample 11 - white"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/FFFFFF?text=11"
+                                                 class="img-fluid mb-2"
+                                                 alt="white sample"/>
+                                        </a>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <a href="https://via.placeholder.com/1200/000000.png?text=12"
+                                           data-toggle="lightbox"
+                                           data-title="sample 12 - black"
+                                           data-gallery="gallery">
+                                            <img src="https://via.placeholder.com/300/000000?text=12"
+                                                 class="img-fluid mb-2"
+                                                 alt="black sample"/>
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- /.content -->
-        </div>
-        <!-- /.content-wrapper -->
-    {% endblock content %}
-    <!-- Specific Page JS goes HERE -->
-    {% block javascripts %}
-        <!-- jQuery -->
-        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-        <!-- Bootstrap -->
-        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-        <!-- jQuery UI -->
-        <script src="/static/assets/plugins/jquery-ui/jquery-ui.min.js"></script>
-        <!-- Ekko Lightbox -->
-        <script src="/static/assets/plugins/ekko-lightbox/ekko-lightbox.min.js"></script>
-        <!-- AdminLTE App -->
-        <script src="/static/assets/js/adminlte.min.js"></script>
-        <!-- AdminLTE for demo purposes -->
-        <script src="/static/assets/js/demo.js"></script>
-        <!-- Filterizr-->
-        <script src="/static/assets/plugins/filterizr/jquery.filterizr.min.js"></script>
-        <!-- Page specific script -->
-        <script>
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- jQuery UI -->
+    <script src="/static/assets/plugins/jquery-ui/jquery-ui.min.js"></script>
+    <!-- Ekko Lightbox -->
+    <script src="/static/assets/plugins/ekko-lightbox/ekko-lightbox.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+    <!-- Filterizr-->
+    <script src="/static/assets/plugins/filterizr/jquery.filterizr.min.js"></script>
+    <!-- Page specific script -->
+    <script>
     $(function () {
       $(document).on('click', '[data-toggle="lightbox"]', function(event) {
         event.preventDefault();
@@ -400,5 +376,5 @@
         $(this).addClass('active');
       });
     })
-        </script>
-    {% endblock javascripts %}
+    </script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/includes/navigation.html b/tests/jinja_adminlte/includes/navigation.html
index b17aae3..7452aa3 100644
--- a/tests/jinja_adminlte/includes/navigation.html
+++ b/tests/jinja_adminlte/includes/navigation.html
@@ -44,127 +44,127 @@
                         <img src="/static/assets/img/user1-128x128.jpg"
                              alt="User Avatar"
                              class="img-size-50 mr-3 img-circle">
-                            <div class="media-body">
-                                <h3 class="dropdown-item-title">
-                                    Brad Diesel
-                                    <span class="float-right text-sm text-danger">
-                                        <i class="fas fa-star"></i>
-                                    </span>
-                                </h3>
-                                <p class="text-sm">
-                                    Call me whenever you can...
-                                </p>
-                                <p class="text-sm text-muted">
-                                    <i class="far fa-clock mr-1"></i>
-                                    4 Hours Ago
-                                </p>
-                            </div>
-                        </div>
-                        <!-- Message End -->
-                    </a>
-                    <div class="dropdown-divider"></div>
-                    <a href="#" class="dropdown-item">
-                        <!-- Message Start -->
-                        <div class="media">
-                            <img src="/static/assets/img/user8-128x128.jpg"
-                                 alt="User Avatar"
-                                 class="img-size-50 img-circle mr-3">
-                                <div class="media-body">
-                                    <h3 class="dropdown-item-title">
-                                        John Pierce
-                                        <span class="float-right text-sm text-muted">
-                                            <i class="fas fa-star"></i>
-                                        </span>
-                                    </h3>
-                                    <p class="text-sm">
-                                        I got your message bro
-                                    </p>
-                                    <p class="text-sm text-muted">
-                                        <i class="far fa-clock mr-1"></i>
-                                        4 Hours Ago
-                                    </p>
-                                </div>
-                            </div>
-                            <!-- Message End -->
-                        </a>
-                        <div class="dropdown-divider"></div>
-                        <a href="#" class="dropdown-item">
-                            <!-- Message Start -->
-                            <div class="media">
-                                <img src="/static/assets/img/user3-128x128.jpg"
-                                     alt="User Avatar"
-                                     class="img-size-50 img-circle mr-3">
-                                    <div class="media-body">
-                                        <h3 class="dropdown-item-title">
-                                            Nora Silvester
-                                            <span class="float-right text-sm text-warning">
-                                                <i class="fas fa-star"></i>
-                                            </span>
-                                        </h3>
-                                        <p class="text-sm">
-                                            The subject goes here
-                                        </p>
-                                        <p class="text-sm text-muted">
-                                            <i class="far fa-clock mr-1"></i>
-                                            4 Hours Ago
-                                        </p>
-                                    </div>
-                                </div>
-                                <!-- Message End -->
-                            </a>
-                            <div class="dropdown-divider"></div>
-                            <a href="#" class="dropdown-item dropdown-footer">
-                                See All Messages
-                            </a>
-                        </div>
-                    </li>
-                    <!-- Notifications Dropdown Menu -->
-                    <li class="nav-item dropdown">
-                        <a class="nav-link" data-toggle="dropdown" href="#">
-                            <i class="far fa-bell"></i>
-                            <span class="badge badge-warning navbar-badge">
-                                15
-                            </span>
-                        </a>
-                        <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
-                            <span class="dropdown-item dropdown-header">
-                                15 Notifications
-                            </span>
-                            <div class="dropdown-divider"></div>
-                            <a href="#" class="dropdown-item">
-                                <i class="fas fa-envelope mr-2"></i>
-                                4 new messages
-                                <span class="float-right text-muted text-sm">
-                                    3 mins
+                        <div class="media-body">
+                            <h3 class="dropdown-item-title">
+                                Brad Diesel
+                                <span class="float-right text-sm text-danger">
+                                    <i class="fas fa-star"></i>
                                 </span>
-                            </a>
-                            <div class="dropdown-divider"></div>
-                            <a href="#" class="dropdown-item">
-                                <i class="fas fa-users mr-2"></i>
-                                8 friend requests
-                                <span class="float-right text-muted text-sm">
-                                    12 hours
-                                </span>
-                            </a>
-                            <div class="dropdown-divider"></div>
-                            <a href="#" class="dropdown-item">
-                                <i class="fas fa-file mr-2"></i>
-                                3 new reports
-                                <span class="float-right text-muted text-sm">
-                                    2 days
-                                </span>
-                            </a>
-                            <div class="dropdown-divider"></div>
-                            <a href="#" class="dropdown-item dropdown-footer">
-                                See All Notifications
-                            </a>
+                            </h3>
+                            <p class="text-sm">
+                                Call me whenever you can...
+                            </p>
+                            <p class="text-sm text-muted">
+                                <i class="far fa-clock mr-1"></i>
+                                4 Hours Ago
+                            </p>
                         </div>
-                    </li>
-                    <li class="nav-item">
-                        <a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#" role="button">
-                            <i class="fas fa-th-large"></i>
-                        </a>
-                    </li>
-                </ul>
-            </nav>
-            <!-- /.navbar -->
+                    </div>
+                    <!-- Message End -->
+                </a>
+                <div class="dropdown-divider"></div>
+                <a href="#" class="dropdown-item">
+                    <!-- Message Start -->
+                    <div class="media">
+                        <img src="/static/assets/img/user8-128x128.jpg"
+                             alt="User Avatar"
+                             class="img-size-50 img-circle mr-3">
+                        <div class="media-body">
+                            <h3 class="dropdown-item-title">
+                                John Pierce
+                                <span class="float-right text-sm text-muted">
+                                    <i class="fas fa-star"></i>
+                                </span>
+                            </h3>
+                            <p class="text-sm">
+                                I got your message bro
+                            </p>
+                            <p class="text-sm text-muted">
+                                <i class="far fa-clock mr-1"></i>
+                                4 Hours Ago
+                            </p>
+                        </div>
+                    </div>
+                    <!-- Message End -->
+                </a>
+                <div class="dropdown-divider"></div>
+                <a href="#" class="dropdown-item">
+                    <!-- Message Start -->
+                    <div class="media">
+                        <img src="/static/assets/img/user3-128x128.jpg"
+                             alt="User Avatar"
+                             class="img-size-50 img-circle mr-3">
+                        <div class="media-body">
+                            <h3 class="dropdown-item-title">
+                                Nora Silvester
+                                <span class="float-right text-sm text-warning">
+                                    <i class="fas fa-star"></i>
+                                </span>
+                            </h3>
+                            <p class="text-sm">
+                                The subject goes here
+                            </p>
+                            <p class="text-sm text-muted">
+                                <i class="far fa-clock mr-1"></i>
+                                4 Hours Ago
+                            </p>
+                        </div>
+                    </div>
+                    <!-- Message End -->
+                </a>
+                <div class="dropdown-divider"></div>
+                <a href="#" class="dropdown-item dropdown-footer">
+                    See All Messages
+                </a>
+            </div>
+        </li>
+        <!-- Notifications Dropdown Menu -->
+        <li class="nav-item dropdown">
+            <a class="nav-link" data-toggle="dropdown" href="#">
+                <i class="far fa-bell"></i>
+                <span class="badge badge-warning navbar-badge">
+                    15
+                </span>
+            </a>
+            <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
+                <span class="dropdown-item dropdown-header">
+                    15 Notifications
+                </span>
+                <div class="dropdown-divider"></div>
+                <a href="#" class="dropdown-item">
+                    <i class="fas fa-envelope mr-2"></i>
+                    4 new messages
+                    <span class="float-right text-muted text-sm">
+                        3 mins
+                    </span>
+                </a>
+                <div class="dropdown-divider"></div>
+                <a href="#" class="dropdown-item">
+                    <i class="fas fa-users mr-2"></i>
+                    8 friend requests
+                    <span class="float-right text-muted text-sm">
+                        12 hours
+                    </span>
+                </a>
+                <div class="dropdown-divider"></div>
+                <a href="#" class="dropdown-item">
+                    <i class="fas fa-file mr-2"></i>
+                    3 new reports
+                    <span class="float-right text-muted text-sm">
+                        2 days
+                    </span>
+                </a>
+                <div class="dropdown-divider"></div>
+                <a href="#" class="dropdown-item dropdown-footer">
+                    See All Notifications
+                </a>
+            </div>
+        </li>
+        <li class="nav-item">
+            <a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#" role="button">
+                <i class="fas fa-th-large"></i>
+            </a>
+        </li>
+    </ul>
+</nav>
+<!-- /.navbar -->
diff --git a/tests/jinja_adminlte/includes/sidebar.html b/tests/jinja_adminlte/includes/sidebar.html
index 5936332..41632f1 100644
--- a/tests/jinja_adminlte/includes/sidebar.html
+++ b/tests/jinja_adminlte/includes/sidebar.html
@@ -6,45 +6,45 @@
              alt="AdminLTE Logo"
              class="brand-image img-circle elevation-3"
              style="opacity: .8">
-            <span class="brand-text font-weight-light">
-                AdminLTE 3
-            </span>
-        </a>
-        <!-- Sidebar -->
-        <div class="sidebar">
-            <!-- Sidebar user panel (optional) -->
-            <div class="user-panel mt-3 pb-3 mb-3 d-flex">
-                <div class="image">
-                    <img src="/static/assets/img/user2-160x160.jpg" class="img-circle elevation-2" alt="User Image">
-                    </div>
-                    <div class="info">
-                        <a href="#" class="d-block">Alexander Pierce</a>
-                    </div>
+        <span class="brand-text font-weight-light">
+            AdminLTE 3
+        </span>
+    </a>
+    <!-- Sidebar -->
+    <div class="sidebar">
+        <!-- Sidebar user panel (optional) -->
+        <div class="user-panel mt-3 pb-3 mb-3 d-flex">
+            <div class="image">
+                <img src="/static/assets/img/user2-160x160.jpg" class="img-circle elevation-2" alt="User Image">
+            </div>
+            <div class="info">
+                <a href="#" class="d-block">Alexander Pierce</a>
+            </div>
+        </div>
+        <!-- SidebarSearch Form -->
+        <div class="form-inline">
+            <div class="input-group" data-widget="sidebar-search">
+                <input class="form-control form-control-sidebar"
+                       type="search"
+                       placeholder="Search"
+                       aria-label="Search">
+                <div class="input-group-append">
+                    <button class="btn btn-sidebar">
+                        <i class="fas fa-search fa-fw"></i>
+                    </button>
                 </div>
-                <!-- SidebarSearch Form -->
-                <div class="form-inline">
-                    <div class="input-group" data-widget="sidebar-search">
-                        <input class="form-control form-control-sidebar"
-                               type="search"
-                               placeholder="Search"
-                               aria-label="Search">
-                        <div class="input-group-append">
-                            <button class="btn btn-sidebar">
-                                <i class="fas fa-search fa-fw"></i>
-                            </button>
-                        </div>
-                    </div>
-                </div>
-                <!-- Sidebar Menu -->
-                <nav class="mt-2">
-                    <ul class="nav nav-pills nav-sidebar flex-column"
-                        data-widget="treeview"
-                        role="menu"
-                        data-accordion="false">
-                        <!-- Add icons to the links using the .nav-icon class
-                    with font-awesome or any other icon font library -->
-                    <li class="nav-item has-treeview {% if 'index' in segment %}menu-open {% endif %}">
-                    <a href="#" class="nav-link {% if 'index' in segment %}active {% endif %}">
+            </div>
+        </div>
+        <!-- Sidebar Menu -->
+        <nav class="mt-2">
+            <ul class="nav nav-pills nav-sidebar flex-column"
+                data-widget="treeview"
+                role="menu"
+                data-accordion="false">
+                <!-- Add icons to the links using the .nav-icon class
+            with font-awesome or any other icon font library -->
+            <li class="nav-item has-treeview {% if 'index' in segment %}menu-open {% endif %}">
+                <a href="#" class="nav-link {% if 'index' in segment %}active {% endif %}">
                     <i class="nav-icon fas fa-tachometer-alt"></i>
                     <p>
                         Dashboard
@@ -54,632 +54,653 @@
                 <ul class="nav nav-treeview">
                     <li class="nav-item">
                         <a href="/index.html" class="nav-link {% if 'index.html' in segment %}active {% endif %}">
-                        <i class="far fa-circle nav-icon"></i>
-                        <p>
-                            Dashboard v1
-                        </p>
-                    </a>
-                </li>
-                <li class="nav-item">
-                    <a href="/index2.html" class="nav-link {% if 'index2.html' in segment %}active {% endif %}">
-                    <i class="far fa-circle nav-icon"></i>
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Dashboard v1
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/index2.html" class="nav-link {% if 'index2.html' in segment %}active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Dashboard v2
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/index3.html" class="nav-link {% if 'index3.html' in segment %}active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Dashboard v3
+                            </p>
+                        </a>
+                    </li>
+                </ul>
+            </li>
+            <li class="nav-item">
+                <a href="widgets.html" class="nav-link {% if 'widgets' in segment %}active {% endif %}">
+                    <i class="nav-icon fas fa-th"></i>
                     <p>
-                        Dashboard v2
+                        Widgets
+                        <span class="right badge badge-danger">
+                            New
+                        </span>
+                    </p>
+                </a>
+            </li>
+            <li class="nav-item has-treeview {% if 'layout' in segment %}menu-open {% endif %}">
+                <a href="#" class="nav-link {% if 'layout' in segment %}active {% endif %}">
+                    <i class="nav-icon fas fa-copy"></i>
+                    <p>
+                        Layout Options
+                        <i class="fas fa-angle-left right"></i>
+                        <span class="badge badge-info right">6</span>
+                    </p>
+                </a>
+                <ul class="nav nav-treeview">
+                    <li class="nav-item">
+                        <a href="/layout-top-nav-sidebar.html"
+                           class="nav-link {% if 'layout-top' in segment %}active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Top Navigation + Sidebar
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/layout-boxed.html"
+                           class="nav-link {% if 'layout-boxed' in segment %}active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Boxed
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/layout-fixed-sidebar.html"
+                           class="nav-link {% if 'layout-fixed-sidebar' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Fixed Sidebar
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/layout-fixed-topnav.html"
+                           class="nav-link {% if 'layout-fixed-topnav' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Fixed Navbar
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/layout-fixed-footer.html"
+                           class="nav-link {% if 'layout-fixed-footer' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Fixed Footer
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/layout-collapsed-sidebar.html"
+                           class="nav-link {% if 'layout-collapsed' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Collapsed Sidebar
+                            </p>
+                        </a>
+                    </li>
+                </ul>
+            </li>
+            <li class="nav-item has-treeview {% if 'charts' in segment %} menu-open {% endif %}">
+                <a href="#" class="nav-link {% if 'charts' in segment %} active {% endif %}">
+                    <i class="nav-icon fas fa-chart-pie"></i>
+                    <p>
+                        Charts
+                        <i class="right fas fa-angle-left"></i>
+                    </p>
+                </a>
+                <ul class="nav nav-treeview">
+                    <li class="nav-item">
+                        <a href="/charts-chartjs.html"
+                           class="nav-link {% if 'charts-chartjs' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                ChartJS
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/charts-flot.html"
+                           class="nav-link {% if 'charts-flot' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Flot
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/charts-inline.html"
+                           class="nav-link {% if 'charts-inline' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Inline
+                            </p>
+                        </a>
+                    </li>
+                </ul>
+            </li>
+            <li class="nav-item has-treeview {% if 'ui-' in segment %} menu-open {% endif %}">
+                <a href="#" class="nav-link {% if 'ui-' in segment %} active {% endif %}">
+                    <i class="nav-icon fas fa-tree"></i>
+                    <p>
+                        UI Elements
+                        <i class="fas fa-angle-left right"></i>
+                    </p>
+                </a>
+                <ul class="nav nav-treeview">
+                    <li class="nav-item">
+                        <a href="/ui-general.html"
+                           class="nav-link {% if 'ui-general' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                General
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/ui-icons.html" class="nav-link {% if 'ui-icons' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Icons
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/ui-buttons.html"
+                           class="nav-link {% if 'ui-buttons' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Buttons
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/ui-sliders.html"
+                           class="nav-link {% if 'ui-sliders' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Sliders
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/ui-modals.html" class="nav-link {% if 'ui-modals' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Modals & Alerts
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/ui-navbar.html" class="nav-link {% if 'ui-navbar' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Navbar & Tabs
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/ui-timeline.html"
+                           class="nav-link {% if 'ui-timeline' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Timeline
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/ui-ribbons.html"
+                           class="nav-link {% if 'ui-ribbons' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Ribbons
+                            </p>
+                        </a>
+                    </li>
+                </ul>
+            </li>
+            <li class="nav-item has-treeview {% if 'forms-' in segment %} menu-open {% endif %}">
+                <a href="#" class="nav-link {% if 'forms-' in segment %} active {% endif %}">
+                    <i class="nav-icon fas fa-edit"></i>
+                    <p>
+                        Forms
+                        <i class="fas fa-angle-left right"></i>
+                    </p>
+                </a>
+                <ul class="nav nav-treeview">
+                    <li class="nav-item">
+                        <a href="/forms-general.html"
+                           class="nav-link {% if 'forms-general' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                General Elements
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/forms-advanced.html"
+                           class="nav-link {% if 'forms-advanced' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Advanced Elements
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/forms-editors.html"
+                           class="nav-link {% if 'forms-editors' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Editors
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/forms-validation.html"
+                           class="nav-link {% if 'forms-validation' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Validation
+                            </p>
+                        </a>
+                    </li>
+                </ul>
+            </li>
+            <li class="nav-item has-treeview {% if 'tables-' in segment %} menu-open {% endif %}">
+                <a href="#" class="nav-link {% if 'tables-' in segment %} active {% endif %}">
+                    <i class="nav-icon fas fa-table"></i>
+                    <p>
+                        Tables
+                        <i class="fas fa-angle-left right"></i>
+                    </p>
+                </a>
+                <ul class="nav nav-treeview">
+                    <li class="nav-item">
+                        <a href="/tables-simple.html"
+                           class="nav-link {% if 'tables-simple' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Simple Tables
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/tables-data.html"
+                           class="nav-link {% if 'tables-data' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                DataTables
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/tables-jsgrid.html"
+                           class="nav-link {% if 'tables-jsgrid' in segment %} active {% endif %}">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                jsGrid
+                            </p>
+                        </a>
+                    </li>
+                </ul>
+            </li>
+            <li class="nav-header">
+                EXAMPLES
+            </li>
+            <li class="nav-item">
+                <a href="/calendar.html" class="nav-link">
+                    <i class="nav-icon far fa-calendar-alt"></i>
+                    <p>
+                        Calendar
+                        <span class="badge badge-info right">2</span>
                     </p>
                 </a>
             </li>
             <li class="nav-item">
-                <a href="/index3.html" class="nav-link {% if 'index3.html' in segment %}active {% endif %}">
-                <i class="far fa-circle nav-icon"></i>
-                <p>
-                    Dashboard v3
-                </p>
-            </a>
-        </li>
-    </ul>
-</li>
-<li class="nav-item">
-    <a href="widgets.html" class="nav-link {% if 'widgets' in segment %}active {% endif %}">
-    <i class="nav-icon fas fa-th"></i>
-    <p>
-        Widgets
-        <span class="right badge badge-danger">
-            New
-        </span>
-    </p>
-</a>
-</li>
-<li class="nav-item has-treeview {% if 'layout' in segment %}menu-open {% endif %}">
-<a href="#" class="nav-link {% if 'layout' in segment %}active {% endif %}">
-<i class="nav-icon fas fa-copy"></i>
-<p>
-Layout Options
-<i class="fas fa-angle-left right"></i>
-<span class="badge badge-info right">6</span>
-</p>
-</a>
-<ul class="nav nav-treeview">
-<li class="nav-item">
-<a href="/layout-top-nav-sidebar.html" class="nav-link {% if 'layout-top' in segment %}active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-    Top Navigation + Sidebar
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/layout-boxed.html" class="nav-link {% if 'layout-boxed' in segment %}active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Boxed
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/layout-fixed-sidebar.html" class="nav-link {% if 'layout-fixed-sidebar' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Fixed Sidebar
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/layout-fixed-topnav.html" class="nav-link {% if 'layout-fixed-topnav' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Fixed Navbar
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/layout-fixed-footer.html" class="nav-link {% if 'layout-fixed-footer' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Fixed Footer
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/layout-collapsed-sidebar.html" class="nav-link {% if 'layout-collapsed' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Collapsed Sidebar
-</p>
-</a>
-</li>
-</ul>
-</li>
-<li class="nav-item has-treeview {% if 'charts' in segment %} menu-open {% endif %}">
-<a href="#" class="nav-link {% if 'charts' in segment %} active {% endif %}">
-<i class="nav-icon fas fa-chart-pie"></i>
-<p>
-Charts
-<i class="right fas fa-angle-left"></i>
-</p>
-</a>
-<ul class="nav nav-treeview">
-<li class="nav-item">
-<a href="/charts-chartjs.html" class="nav-link {% if 'charts-chartjs' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-ChartJS
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/charts-flot.html" class="nav-link {% if 'charts-flot' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Flot
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/charts-inline.html" class="nav-link {% if 'charts-inline' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Inline
-</p>
-</a>
-</li>
-</ul>
-</li>
-<li class="nav-item has-treeview {% if 'ui-' in segment %} menu-open {% endif %}">
-<a href="#" class="nav-link {% if 'ui-' in segment %} active {% endif %}">
-<i class="nav-icon fas fa-tree"></i>
-<p>
-UI Elements
-<i class="fas fa-angle-left right"></i>
-</p>
-</a>
-<ul class="nav nav-treeview">
-<li class="nav-item">
-<a href="/ui-general.html" class="nav-link {% if 'ui-general' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-General
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/ui-icons.html" class="nav-link {% if 'ui-icons' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Icons
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/ui-buttons.html" class="nav-link {% if 'ui-buttons' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Buttons
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/ui-sliders.html" class="nav-link {% if 'ui-sliders' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Sliders
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/ui-modals.html" class="nav-link {% if 'ui-modals' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Modals & Alerts
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/ui-navbar.html" class="nav-link {% if 'ui-navbar' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Navbar & Tabs
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/ui-timeline.html" class="nav-link {% if 'ui-timeline' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Timeline
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/ui-ribbons.html" class="nav-link {% if 'ui-ribbons' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Ribbons
-</p>
-</a>
-</li>
-</ul>
-</li>
-<li class="nav-item has-treeview {% if 'forms-' in segment %} menu-open {% endif %}">
-<a href="#" class="nav-link {% if 'forms-' in segment %} active {% endif %}">
-<i class="nav-icon fas fa-edit"></i>
-<p>
-Forms
-<i class="fas fa-angle-left right"></i>
-</p>
-</a>
-<ul class="nav nav-treeview">
-<li class="nav-item">
-<a href="/forms-general.html" class="nav-link {% if 'forms-general' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-General Elements
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/forms-advanced.html" class="nav-link {% if 'forms-advanced' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Advanced Elements
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/forms-editors.html" class="nav-link {% if 'forms-editors' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Editors
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/forms-validation.html" class="nav-link {% if 'forms-validation' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Validation
-</p>
-</a>
-</li>
-</ul>
-</li>
-<li class="nav-item has-treeview {% if 'tables-' in segment %} menu-open {% endif %}">
-<a href="#" class="nav-link {% if 'tables-' in segment %} active {% endif %}">
-<i class="nav-icon fas fa-table"></i>
-<p>
-Tables
-<i class="fas fa-angle-left right"></i>
-</p>
-</a>
-<ul class="nav nav-treeview">
-<li class="nav-item">
-<a href="/tables-simple.html" class="nav-link {% if 'tables-simple' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Simple Tables
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/tables-data.html" class="nav-link {% if 'tables-data' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-DataTables
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/tables-jsgrid.html" class="nav-link {% if 'tables-jsgrid' in segment %} active {% endif %}">
-<i class="far fa-circle nav-icon"></i>
-<p>
-jsGrid
-</p>
-</a>
-</li>
-</ul>
-</li>
-<li class="nav-header">
-EXAMPLES
-</li>
-<li class="nav-item">
-<a href="/calendar.html" class="nav-link">
-<i class="nav-icon far fa-calendar-alt"></i>
-<p>
-Calendar
-<span class="badge badge-info right">2</span>
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/gallery.html" class="nav-link">
-<i class="nav-icon far fa-image"></i>
-<p>
-Gallery
-</p>
-</a>
-</li>
-<li class="nav-item has-treeview">
-<a href="#" class="nav-link">
-<i class="nav-icon far fa-envelope"></i>
-<p>
-Mailbox
-<i class="fas fa-angle-left right"></i>
-</p>
-</a>
-<ul class="nav nav-treeview">
-<li class="nav-item">
-<a href="/mailbox.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Inbox
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/mailbox-compose.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Compose
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/mailbox-read-mail.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Read
-</p>
-</a>
-</li>
-</ul>
-</li>
-<li class="nav-item has-treeview">
-<a href="#" class="nav-link">
-<i class="nav-icon fas fa-book"></i>
-<p>
-Pages
-<i class="fas fa-angle-left right"></i>
-</p>
-</a>
-<ul class="nav nav-treeview">
-<li class="nav-item">
-<a href="/examples-invoice.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Invoice
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-profile.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Profile
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-e-commerce.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-E-commerce
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-projects.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Projects
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-project-add.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Project Add
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-project-edit.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Project Edit
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-project-detail.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Project Detail
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-contacts.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Contacts
-</p>
-</a>
-</li>
-</ul>
-</li>
-<li class="nav-item has-treeview">
-<a href="#" class="nav-link">
-<i class="nav-icon far fa-plus-square"></i>
-<p>
-Extras
-<i class="fas fa-angle-left right"></i>
-</p>
-</a>
-<ul class="nav nav-treeview">
-<li class="nav-item">
-<a href="/examples-login.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Login
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-register.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Register
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-forgot-password.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Forgot Password
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-recover-password.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Recover Password
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-lockscreen.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Lockscreen
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-legacy-user-menu.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Legacy User Menu
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-language-menu.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Language Menu
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-404.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Error 404
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-500.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Error 500
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="/examples-blank.html" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Blank Page
-</p>
-</a>
-</li>
-</ul>
-</li>
-<li class="nav-header">
-MISCELLANEOUS
-</li>
-<li class="nav-item">
-<a target="_blank" rel="noopener noreferrer" href="https://adminlte.io/docs/3.0/" class="nav-link">
-<i class="nav-icon fas fa-file"></i>
-<p>
-UI Documentation
-</p>
-</a>
-</li>
-<li class="nav-header">
-MULTI LEVEL EXAMPLE
-</li>
-<li class="nav-item">
-<a href="#" class="nav-link">
-<i class="fas fa-circle nav-icon"></i>
-<p>
-Level 1
-</p>
-</a>
-</li>
-<li class="nav-item has-treeview">
-<a href="#" class="nav-link">
-<i class="nav-icon fas fa-circle"></i>
-<p>
-Level 1
-<i class="right fas fa-angle-left"></i>
-</p>
-</a>
-<ul class="nav nav-treeview">
-<li class="nav-item">
-<a href="#" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Level 2
-</p>
-</a>
-</li>
-<li class="nav-item has-treeview">
-<a href="#" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Level 2
-<i class="right fas fa-angle-left"></i>
-</p>
-</a>
-<ul class="nav nav-treeview">
-<li class="nav-item">
-<a href="#" class="nav-link">
-<i class="far fa-dot-circle nav-icon"></i>
-<p>
-Level 3
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="#" class="nav-link">
-<i class="far fa-dot-circle nav-icon"></i>
-<p>
-Level 3
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="#" class="nav-link">
-<i class="far fa-dot-circle nav-icon"></i>
-<p>
-Level 3
-</p>
-</a>
-</li>
-</ul>
-</li>
-<li class="nav-item">
-<a href="#" class="nav-link">
-<i class="far fa-circle nav-icon"></i>
-<p>
-Level 2
-</p>
-</a>
-</li>
-</ul>
-</li>
-<li class="nav-item">
-<a href="#" class="nav-link">
-<i class="fas fa-circle nav-icon"></i>
-<p>
-Level 1
-</p>
-</a>
-</li>
-<li class="nav-header">
-LABELS
-</li>
-<li class="nav-item">
-<a href="#" class="nav-link">
-<i class="nav-icon far fa-circle text-danger"></i>
-<p class="text">
-Important
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="#" class="nav-link">
-<i class="nav-icon far fa-circle text-warning"></i>
-<p>
-Warning
-</p>
-</a>
-</li>
-<li class="nav-item">
-<a href="#" class="nav-link">
-<i class="nav-icon far fa-circle text-info"></i>
-<p>
-Informational
-</p>
-</a>
-</li>
-</ul>
-</nav>
-<!-- /.sidebar-menu -->
+                <a href="/gallery.html" class="nav-link">
+                    <i class="nav-icon far fa-image"></i>
+                    <p>
+                        Gallery
+                    </p>
+                </a>
+            </li>
+            <li class="nav-item has-treeview">
+                <a href="#" class="nav-link">
+                    <i class="nav-icon far fa-envelope"></i>
+                    <p>
+                        Mailbox
+                        <i class="fas fa-angle-left right"></i>
+                    </p>
+                </a>
+                <ul class="nav nav-treeview">
+                    <li class="nav-item">
+                        <a href="/mailbox.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Inbox
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/mailbox-compose.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Compose
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/mailbox-read-mail.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Read
+                            </p>
+                        </a>
+                    </li>
+                </ul>
+            </li>
+            <li class="nav-item has-treeview">
+                <a href="#" class="nav-link">
+                    <i class="nav-icon fas fa-book"></i>
+                    <p>
+                        Pages
+                        <i class="fas fa-angle-left right"></i>
+                    </p>
+                </a>
+                <ul class="nav nav-treeview">
+                    <li class="nav-item">
+                        <a href="/examples-invoice.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Invoice
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-profile.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Profile
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-e-commerce.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                E-commerce
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-projects.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Projects
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-project-add.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Project Add
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-project-edit.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Project Edit
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-project-detail.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Project Detail
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-contacts.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Contacts
+                            </p>
+                        </a>
+                    </li>
+                </ul>
+            </li>
+            <li class="nav-item has-treeview">
+                <a href="#" class="nav-link">
+                    <i class="nav-icon far fa-plus-square"></i>
+                    <p>
+                        Extras
+                        <i class="fas fa-angle-left right"></i>
+                    </p>
+                </a>
+                <ul class="nav nav-treeview">
+                    <li class="nav-item">
+                        <a href="/examples-login.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Login
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-register.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Register
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-forgot-password.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Forgot Password
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-recover-password.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Recover Password
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-lockscreen.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Lockscreen
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-legacy-user-menu.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Legacy User Menu
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-language-menu.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Language Menu
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-404.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Error 404
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-500.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Error 500
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a href="/examples-blank.html" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Blank Page
+                            </p>
+                        </a>
+                    </li>
+                </ul>
+            </li>
+            <li class="nav-header">
+                MISCELLANEOUS
+            </li>
+            <li class="nav-item">
+                <a target="_blank" rel="noopener noreferrer" href="https://adminlte.io/docs/3.0/" class="nav-link">
+                    <i class="nav-icon fas fa-file"></i>
+                    <p>
+                        UI Documentation
+                    </p>
+                </a>
+            </li>
+            <li class="nav-header">
+                MULTI LEVEL EXAMPLE
+            </li>
+            <li class="nav-item">
+                <a href="#" class="nav-link">
+                    <i class="fas fa-circle nav-icon"></i>
+                    <p>
+                        Level 1
+                    </p>
+                </a>
+            </li>
+            <li class="nav-item has-treeview">
+                <a href="#" class="nav-link">
+                    <i class="nav-icon fas fa-circle"></i>
+                    <p>
+                        Level 1
+                        <i class="right fas fa-angle-left"></i>
+                    </p>
+                </a>
+                <ul class="nav nav-treeview">
+                    <li class="nav-item">
+                        <a href="#" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Level 2
+                            </p>
+                        </a>
+                    </li>
+                    <li class="nav-item has-treeview">
+                        <a href="#" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Level 2
+                                <i class="right fas fa-angle-left"></i>
+                            </p>
+                        </a>
+                        <ul class="nav nav-treeview">
+                            <li class="nav-item">
+                                <a href="#" class="nav-link">
+                                    <i class="far fa-dot-circle nav-icon"></i>
+                                    <p>
+                                        Level 3
+                                    </p>
+                                </a>
+                            </li>
+                            <li class="nav-item">
+                                <a href="#" class="nav-link">
+                                    <i class="far fa-dot-circle nav-icon"></i>
+                                    <p>
+                                        Level 3
+                                    </p>
+                                </a>
+                            </li>
+                            <li class="nav-item">
+                                <a href="#" class="nav-link">
+                                    <i class="far fa-dot-circle nav-icon"></i>
+                                    <p>
+                                        Level 3
+                                    </p>
+                                </a>
+                            </li>
+                        </ul>
+                    </li>
+                    <li class="nav-item">
+                        <a href="#" class="nav-link">
+                            <i class="far fa-circle nav-icon"></i>
+                            <p>
+                                Level 2
+                            </p>
+                        </a>
+                    </li>
+                </ul>
+            </li>
+            <li class="nav-item">
+                <a href="#" class="nav-link">
+                    <i class="fas fa-circle nav-icon"></i>
+                    <p>
+                        Level 1
+                    </p>
+                </a>
+            </li>
+            <li class="nav-header">
+                LABELS
+            </li>
+            <li class="nav-item">
+                <a href="#" class="nav-link">
+                    <i class="nav-icon far fa-circle text-danger"></i>
+                    <p class="text">
+                        Important
+                    </p>
+                </a>
+            </li>
+            <li class="nav-item">
+                <a href="#" class="nav-link">
+                    <i class="nav-icon far fa-circle text-warning"></i>
+                    <p>
+                        Warning
+                    </p>
+                </a>
+            </li>
+            <li class="nav-item">
+                <a href="#" class="nav-link">
+                    <i class="nav-icon far fa-circle text-info"></i>
+                    <p>
+                        Informational
+                    </p>
+                </a>
+            </li>
+        </ul>
+    </nav>
+    <!-- /.sidebar-menu -->
 </div>
 <!-- /.sidebar -->
 </aside>
diff --git a/tests/jinja_adminlte/index.html b/tests/jinja_adminlte/index.html
index 6b9ffad..cec1224 100644
--- a/tests/jinja_adminlte/index.html
+++ b/tests/jinja_adminlte/index.html
@@ -229,643 +229,610 @@
                                         <img class="direct-chat-img"
                                              src="/static/assets/img/user1-128x128.jpg"
                                              alt="message user image">
-                                            <!-- /.direct-chat-img -->
-                                            <div class="direct-chat-text">
-                                                Is this template really for free? That's unbelievable!
-                                            </div>
-                                            <!-- /.direct-chat-text -->
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            Is this template really for free? That's unbelievable!
                                         </div>
-                                        <!-- /.direct-chat-msg -->
-                                        <!-- Message to the right -->
-                                        <div class="direct-chat-msg right">
-                                            <div class="direct-chat-infos clearfix">
-                                                <span class="direct-chat-name float-right">
-                                                    Sarah Bullock
-                                                </span>
-                                                <span class="direct-chat-timestamp float-left">
-                                                    23 Jan 2:05 pm
-                                                </span>
-                                            </div>
-                                            <!-- /.direct-chat-infos -->
-                                            <img class="direct-chat-img"
-                                                 src="/static/assets/img/user3-128x128.jpg"
-                                                 alt="message user image">
-                                                <!-- /.direct-chat-img -->
-                                                <div class="direct-chat-text">
-                                                    You better believe it!
-                                                </div>
-                                                <!-- /.direct-chat-text -->
-                                            </div>
-                                            <!-- /.direct-chat-msg -->
-                                            <!-- Message. Default to the left -->
-                                            <div class="direct-chat-msg">
-                                                <div class="direct-chat-infos clearfix">
-                                                    <span class="direct-chat-name float-left">
-                                                        Alexander Pierce
-                                                    </span>
-                                                    <span class="direct-chat-timestamp float-right">
-                                                        23 Jan 5:37 pm
-                                                    </span>
-                                                </div>
-                                                <!-- /.direct-chat-infos -->
-                                                <img class="direct-chat-img"
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                    <!-- Message to the right -->
+                                    <div class="direct-chat-msg right">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-right">
+                                                Sarah Bullock
+                                            </span>
+                                            <span class="direct-chat-timestamp float-left">
+                                                23 Jan 2:05 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user3-128x128.jpg"
+                                             alt="message user image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            You better believe it!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                    <!-- Message. Default to the left -->
+                                    <div class="direct-chat-msg">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-left">
+                                                Alexander Pierce
+                                            </span>
+                                            <span class="direct-chat-timestamp float-right">
+                                                23 Jan 5:37 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user1-128x128.jpg"
+                                             alt="message user image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            Working with AdminLTE on a great new app! Wanna join?
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                    <!-- Message to the right -->
+                                    <div class="direct-chat-msg right">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-right">
+                                                Sarah Bullock
+                                            </span>
+                                            <span class="direct-chat-timestamp float-left">
+                                                23 Jan 6:10 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user3-128x128.jpg"
+                                             alt="message user image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            I would love to.
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                </div>
+                                <!--/.direct-chat-messages-->
+                                <!-- Contacts are loaded here -->
+                                <div class="direct-chat-contacts">
+                                    <ul class="contacts-list">
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
                                                      src="/static/assets/img/user1-128x128.jpg"
-                                                     alt="message user image">
-                                                    <!-- /.direct-chat-img -->
-                                                    <div class="direct-chat-text">
-                                                        Working with AdminLTE on a great new app! Wanna join?
-                                                    </div>
-                                                    <!-- /.direct-chat-text -->
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Count Dracula
+                                                        <small class="contacts-list-date float-right">
+                                                        2/28/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">How have you been? I was...</span>
                                                 </div>
-                                                <!-- /.direct-chat-msg -->
-                                                <!-- Message to the right -->
-                                                <div class="direct-chat-msg right">
-                                                    <div class="direct-chat-infos clearfix">
-                                                        <span class="direct-chat-name float-right">
-                                                            Sarah Bullock
-                                                        </span>
-                                                        <span class="direct-chat-timestamp float-left">
-                                                            23 Jan 6:10 pm
-                                                        </span>
-                                                    </div>
-                                                    <!-- /.direct-chat-infos -->
-                                                    <img class="direct-chat-img"
-                                                         src="/static/assets/img/user3-128x128.jpg"
-                                                         alt="message user image">
-                                                        <!-- /.direct-chat-img -->
-                                                        <div class="direct-chat-text">
-                                                            I would love to.
-                                                        </div>
-                                                        <!-- /.direct-chat-text -->
-                                                    </div>
-                                                    <!-- /.direct-chat-msg -->
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user7-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Sarah Doe
+                                                        <small class="contacts-list-date float-right">
+                                                        2/23/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">I will be waiting for...</span>
                                                 </div>
-                                                <!--/.direct-chat-messages-->
-                                                <!-- Contacts are loaded here -->
-                                                <div class="direct-chat-contacts">
-                                                    <ul class="contacts-list">
-                                                        <li>
-                                                            <a href="#">
-                                                                <img class="contacts-list-img"
-                                                                     src="/static/assets/img/user1-128x128.jpg"
-                                                                     alt="User Avatar">
-                                                                    <div class="contacts-list-info">
-                                                                        <span class="contacts-list-name">
-                                                                            Count Dracula
-                                                                            <small class="contacts-list-date float-right">
-                                                                            2/28/2015
-                                                                            </small>
-                                                                        </span>
-                                                                        <span class="contacts-list-msg">How have you been? I was...</span>
-                                                                    </div>
-                                                                    <!-- /.contacts-list-info -->
-                                                                </a>
-                                                            </li>
-                                                            <!-- End Contact Item -->
-                                                            <li>
-                                                                <a href="#">
-                                                                    <img class="contacts-list-img"
-                                                                         src="/static/assets/img/user7-128x128.jpg"
-                                                                         alt="User Avatar">
-                                                                        <div class="contacts-list-info">
-                                                                            <span class="contacts-list-name">
-                                                                                Sarah Doe
-                                                                                <small class="contacts-list-date float-right">
-                                                                                2/23/2015
-                                                                                </small>
-                                                                            </span>
-                                                                            <span class="contacts-list-msg">I will be waiting for...</span>
-                                                                        </div>
-                                                                        <!-- /.contacts-list-info -->
-                                                                    </a>
-                                                                </li>
-                                                                <!-- End Contact Item -->
-                                                                <li>
-                                                                    <a href="#">
-                                                                        <img class="contacts-list-img"
-                                                                             src="/static/assets/img/user3-128x128.jpg"
-                                                                             alt="User Avatar">
-                                                                            <div class="contacts-list-info">
-                                                                                <span class="contacts-list-name">
-                                                                                    Nadia Jolie
-                                                                                    <small class="contacts-list-date float-right">
-                                                                                    2/20/2015
-                                                                                    </small>
-                                                                                </span>
-                                                                                <span class="contacts-list-msg">I'll call you back at...</span>
-                                                                            </div>
-                                                                            <!-- /.contacts-list-info -->
-                                                                        </a>
-                                                                    </li>
-                                                                    <!-- End Contact Item -->
-                                                                    <li>
-                                                                        <a href="#">
-                                                                            <img class="contacts-list-img"
-                                                                                 src="/static/assets/img/user5-128x128.jpg"
-                                                                                 alt="User Avatar">
-                                                                                <div class="contacts-list-info">
-                                                                                    <span class="contacts-list-name">
-                                                                                        Nora S. Vans
-                                                                                        <small class="contacts-list-date float-right">
-                                                                                        2/10/2015
-                                                                                        </small>
-                                                                                    </span>
-                                                                                    <span class="contacts-list-msg">Where is your new...</span>
-                                                                                </div>
-                                                                                <!-- /.contacts-list-info -->
-                                                                            </a>
-                                                                        </li>
-                                                                        <!-- End Contact Item -->
-                                                                        <li>
-                                                                            <a href="#">
-                                                                                <img class="contacts-list-img"
-                                                                                     src="/static/assets/img/user6-128x128.jpg"
-                                                                                     alt="User Avatar">
-                                                                                    <div class="contacts-list-info">
-                                                                                        <span class="contacts-list-name">
-                                                                                            John K.
-                                                                                            <small class="contacts-list-date float-right">
-                                                                                            1/27/2015
-                                                                                            </small>
-                                                                                        </span>
-                                                                                        <span class="contacts-list-msg">Can I take a look at...</span>
-                                                                                    </div>
-                                                                                    <!-- /.contacts-list-info -->
-                                                                                </a>
-                                                                            </li>
-                                                                            <!-- End Contact Item -->
-                                                                            <li>
-                                                                                <a href="#">
-                                                                                    <img class="contacts-list-img"
-                                                                                         src="/static/assets/img/user8-128x128.jpg"
-                                                                                         alt="User Avatar">
-                                                                                        <div class="contacts-list-info">
-                                                                                            <span class="contacts-list-name">
-                                                                                                Kenneth M.
-                                                                                                <small class="contacts-list-date float-right">
-                                                                                                1/4/2015
-                                                                                                </small>
-                                                                                            </span>
-                                                                                            <span class="contacts-list-msg">Never mind I found...</span>
-                                                                                        </div>
-                                                                                        <!-- /.contacts-list-info -->
-                                                                                    </a>
-                                                                                </li>
-                                                                                <!-- End Contact Item -->
-                                                                            </ul>
-                                                                            <!-- /.contacts-list -->
-                                                                        </div>
-                                                                        <!-- /.direct-chat-pane -->
-                                                                    </div>
-                                                                    <!-- /.card-body -->
-                                                                    <div class="card-footer">
-                                                                        <form action="#" method="post">
-                                                                            <div class="input-group">
-                                                                                <input type="text"
-                                                                                       name="message"
-                                                                                       placeholder="Type Message ..."
-                                                                                       class="form-control">
-                                                                                <span class="input-group-append">
-                                                                                    <button type="button"
-                                                                                            class="btn btn-primary">
-                                                                                        Send
-                                                                                    </button>
-                                                                                </span>
-                                                                            </div>
-                                                                        </form>
-                                                                    </div>
-                                                                    <!-- /.card-footer-->
-                                                                </div>
-                                                                <!--/.direct-chat -->
-                                                                <!-- TO DO List -->
-                                                                <div class="card">
-                                                                    <div class="card-header">
-                                                                        <h3 class="card-title">
-                                                                            <i class="ion ion-clipboard mr-1"></i>
-                                                                            To Do List
-                                                                        </h3>
-                                                                        <div class="card-tools">
-                                                                            <ul class="pagination pagination-sm">
-                                                                                <li class="page-item">
-                                                                                    <a href="#"
-                                                                                       class="page-link">&laquo;</a>
-                                                                                </li>
-                                                                                <li class="page-item">
-                                                                                    <a href="#" class="page-link">
-                                                                                        1
-                                                                                    </a>
-                                                                                </li>
-                                                                                <li class="page-item">
-                                                                                    <a href="#" class="page-link">
-                                                                                        2
-                                                                                    </a>
-                                                                                </li>
-                                                                                <li class="page-item">
-                                                                                    <a href="#" class="page-link">
-                                                                                        3
-                                                                                    </a>
-                                                                                </li>
-                                                                                <li class="page-item">
-                                                                                    <a href="#" class="page-link">
-                                                                                        &raquo;
-                                                                                    </a>
-                                                                                </li>
-                                                                            </ul>
-                                                                        </div>
-                                                                    </div>
-                                                                    <!-- /.card-header -->
-                                                                    <div class="card-body">
-                                                                        <ul class="todo-list" data-widget="todo-list">
-                                                                            <li>
-                                                                                <!-- drag handle -->
-                                                                                <span class="handle">
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                </span>
-                                                                                <!-- checkbox -->
-                                                                                <div class="icheck-primary d-inline ml-2">
-                                                                                    <input type="checkbox"
-                                                                                           value=""
-                                                                                           name="todo1"
-                                                                                           id="todoCheck1">
-                                                                                    <label for="todoCheck1"></label>
-                                                                                </div>
-                                                                                <!-- todo text -->
-                                                                                <span class="text">
-                                                                                    Design a nice theme
-                                                                                </span>
-                                                                                <!-- Emphasis label -->
-                                                                                <small class="badge badge-danger">
-                                                                                <i class="far fa-clock"></i>
-                                                                                2 mins
-                                                                                </small>
-                                                                                <!-- General tools such as edit or delete-->
-                                                                                <div class="tools">
-                                                                                    <i class="fas fa-edit"></i>
-                                                                                    <i class="fas fa-trash-o"></i>
-                                                                                </div>
-                                                                            </li>
-                                                                            <li>
-                                                                                <span class="handle">
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                </span>
-                                                                                <div class="icheck-primary d-inline ml-2">
-                                                                                    <input type="checkbox"
-                                                                                           value=""
-                                                                                           name="todo2"
-                                                                                           id="todoCheck2"
-                                                                                           checked>
-                                                                                    <label for="todoCheck2"></label>
-                                                                                </div>
-                                                                                <span class="text">
-                                                                                    Make the theme responsive
-                                                                                </span>
-                                                                                <small class="badge badge-info">
-                                                                                <i class="far fa-clock"></i>
-                                                                                4 hours
-                                                                                </small>
-                                                                                <div class="tools">
-                                                                                    <i class="fas fa-edit"></i>
-                                                                                    <i class="fas fa-trash-o"></i>
-                                                                                </div>
-                                                                            </li>
-                                                                            <li>
-                                                                                <span class="handle">
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                </span>
-                                                                                <div class="icheck-primary d-inline ml-2">
-                                                                                    <input type="checkbox"
-                                                                                           value=""
-                                                                                           name="todo3"
-                                                                                           id="todoCheck3">
-                                                                                    <label for="todoCheck3"></label>
-                                                                                </div>
-                                                                                <span class="text">
-                                                                                    Let theme shine like a star
-                                                                                </span>
-                                                                                <small class="badge badge-warning">
-                                                                                <i class="far fa-clock"></i>
-                                                                                1 day
-                                                                                </small>
-                                                                                <div class="tools">
-                                                                                    <i class="fas fa-edit"></i>
-                                                                                    <i class="fas fa-trash-o"></i>
-                                                                                </div>
-                                                                            </li>
-                                                                            <li>
-                                                                                <span class="handle">
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                </span>
-                                                                                <div class="icheck-primary d-inline ml-2">
-                                                                                    <input type="checkbox"
-                                                                                           value=""
-                                                                                           name="todo4"
-                                                                                           id="todoCheck4">
-                                                                                    <label for="todoCheck4"></label>
-                                                                                </div>
-                                                                                <span class="text">
-                                                                                    Let theme shine like a star
-                                                                                </span>
-                                                                                <small class="badge badge-success">
-                                                                                <i class="far fa-clock"></i>
-                                                                                3 days
-                                                                                </small>
-                                                                                <div class="tools">
-                                                                                    <i class="fas fa-edit"></i>
-                                                                                    <i class="fas fa-trash-o"></i>
-                                                                                </div>
-                                                                            </li>
-                                                                            <li>
-                                                                                <span class="handle">
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                </span>
-                                                                                <div class="icheck-primary d-inline ml-2">
-                                                                                    <input type="checkbox"
-                                                                                           value=""
-                                                                                           name="todo5"
-                                                                                           id="todoCheck5">
-                                                                                    <label for="todoCheck5"></label>
-                                                                                </div>
-                                                                                <span class="text">
-                                                                                    Check your messages and notifications
-                                                                                </span>
-                                                                                <small class="badge badge-primary">
-                                                                                <i class="far fa-clock"></i>
-                                                                                1 week
-                                                                                </small>
-                                                                                <div class="tools">
-                                                                                    <i class="fas fa-edit"></i>
-                                                                                    <i class="fas fa-trash-o"></i>
-                                                                                </div>
-                                                                            </li>
-                                                                            <li>
-                                                                                <span class="handle">
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                    <i class="fas fa-ellipsis-v"></i>
-                                                                                </span>
-                                                                                <div class="icheck-primary d-inline ml-2">
-                                                                                    <input type="checkbox"
-                                                                                           value=""
-                                                                                           name="todo6"
-                                                                                           id="todoCheck6">
-                                                                                    <label for="todoCheck6"></label>
-                                                                                </div>
-                                                                                <span class="text">
-                                                                                    Let theme shine like a star
-                                                                                </span>
-                                                                                <small class="badge badge-secondary">
-                                                                                <i class="far fa-clock"></i>
-                                                                                1 month
-                                                                                </small>
-                                                                                <div class="tools">
-                                                                                    <i class="fas fa-edit"></i>
-                                                                                    <i class="fas fa-trash-o"></i>
-                                                                                </div>
-                                                                            </li>
-                                                                        </ul>
-                                                                    </div>
-                                                                    <!-- /.card-body -->
-                                                                    <div class="card-footer clearfix">
-                                                                        <button type="button"
-                                                                                class="btn btn-info float-right">
-                                                                            <i class="fas fa-plus"></i>
-                                                                            Add item
-                                                                        </button>
-                                                                    </div>
-                                                                </div>
-                                                                <!-- /.card -->
-                                                            </section>
-                                                            <!-- /.Left col -->
-                                                            <!-- right col (We are only adding the ID to make the widgets sortable)-->
-                                                            <section class="col-lg-5 connectedSortable">
-                                                                <!-- Map card -->
-                                                                <div class="card bg-gradient-primary">
-                                                                    <div class="card-header border-0">
-                                                                        <h3 class="card-title">
-                                                                            <i class="fas fa-map-marker-alt mr-1"></i>
-                                                                            Visitors
-                                                                        </h3>
-                                                                        <!-- card tools -->
-                                                                        <div class="card-tools">
-                                                                            <button type="button"
-                                                                                    class="btn btn-primary btn-sm daterange"
-                                                                                    title="Date range">
-                                                                                <i class="far fa-calendar-alt"></i>
-                                                                            </button>
-                                                                            <button type="button"
-                                                                                    class="btn btn-primary btn-sm"
-                                                                                    data-card-widget="collapse"
-                                                                                    title="Collapse">
-                                                                                <i class="fas fa-minus"></i>
-                                                                            </button>
-                                                                        </div>
-                                                                        <!-- /.card-tools -->
-                                                                    </div>
-                                                                    <div class="card-body">
-                                                                        <div id="world-map"
-                                                                             style="height: 250px; width: 100%;"></div>
-                                                                    </div>
-                                                                    <!-- /.card-body-->
-                                                                    <div class="card-footer bg-transparent">
-                                                                        <div class="row">
-                                                                            <div class="col-4 text-center">
-                                                                                <div id="sparkline-1"></div>
-                                                                                <div class="text-white">
-                                                                                    Visitors
-                                                                                </div>
-                                                                            </div>
-                                                                            <!-- ./col -->
-                                                                            <div class="col-4 text-center">
-                                                                                <div id="sparkline-2"></div>
-                                                                                <div class="text-white">
-                                                                                    Online
-                                                                                </div>
-                                                                            </div>
-                                                                            <!-- ./col -->
-                                                                            <div class="col-4 text-center">
-                                                                                <div id="sparkline-3"></div>
-                                                                                <div class="text-white">
-                                                                                    Sales
-                                                                                </div>
-                                                                            </div>
-                                                                            <!-- ./col -->
-                                                                        </div>
-                                                                        <!-- /.row -->
-                                                                    </div>
-                                                                </div>
-                                                                <!-- /.card -->
-                                                                <!-- solid sales graph -->
-                                                                <div class="card bg-gradient-info">
-                                                                    <div class="card-header border-0">
-                                                                        <h3 class="card-title">
-                                                                            <i class="fas fa-th mr-1"></i>
-                                                                            Sales Graph
-                                                                        </h3>
-                                                                        <div class="card-tools">
-                                                                            <button type="button"
-                                                                                    class="btn bg-info btn-sm"
-                                                                                    data-card-widget="collapse">
-                                                                                <i class="fas fa-minus"></i>
-                                                                            </button>
-                                                                            <button type="button"
-                                                                                    class="btn bg-info btn-sm"
-                                                                                    data-card-widget="remove">
-                                                                                <i class="fas fa-times"></i>
-                                                                            </button>
-                                                                        </div>
-                                                                    </div>
-                                                                    <div class="card-body">
-                                                                        <canvas class="chart"
-                                                                                id="line-chart"
-                                                                                style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%;"></canvas>
-                                                                    </div>
-                                                                    <!-- /.card-body -->
-                                                                    <div class="card-footer bg-transparent">
-                                                                        <div class="row">
-                                                                            <div class="col-4 text-center">
-                                                                                <input type="text"
-                                                                                       class="knob"
-                                                                                       data-readonly="true"
-                                                                                       value="20"
-                                                                                       data-width="60"
-                                                                                       data-height="60"
-                                                                                       data-fgColor="#39CCCC">
-                                                                                <div class="text-white">
-                                                                                    Mail-Orders
-                                                                                </div>
-                                                                            </div>
-                                                                            <!-- ./col -->
-                                                                            <div class="col-4 text-center">
-                                                                                <input type="text"
-                                                                                       class="knob"
-                                                                                       data-readonly="true"
-                                                                                       value="50"
-                                                                                       data-width="60"
-                                                                                       data-height="60"
-                                                                                       data-fgColor="#39CCCC">
-                                                                                <div class="text-white">
-                                                                                    Online
-                                                                                </div>
-                                                                            </div>
-                                                                            <!-- ./col -->
-                                                                            <div class="col-4 text-center">
-                                                                                <input type="text"
-                                                                                       class="knob"
-                                                                                       data-readonly="true"
-                                                                                       value="30"
-                                                                                       data-width="60"
-                                                                                       data-height="60"
-                                                                                       data-fgColor="#39CCCC">
-                                                                                <div class="text-white">
-                                                                                    In-Store
-                                                                                </div>
-                                                                            </div>
-                                                                            <!-- ./col -->
-                                                                        </div>
-                                                                        <!-- /.row -->
-                                                                    </div>
-                                                                    <!-- /.card-footer -->
-                                                                </div>
-                                                                <!-- /.card -->
-                                                                <!-- Calendar -->
-                                                                <div class="card bg-gradient-success">
-                                                                    <div class="card-header border-0">
-                                                                        <h3 class="card-title">
-                                                                            <i class="far fa-calendar-alt"></i>
-                                                                            Calendar
-                                                                        </h3>
-                                                                        <!-- tools card -->
-                                                                        <div class="card-tools">
-                                                                            <!-- button with a dropdown -->
-                                                                            <div class="btn-group">
-                                                                                <button type="button"
-                                                                                        class="btn btn-success btn-sm dropdown-toggle"
-                                                                                        data-toggle="dropdown"
-                                                                                        data-offset="-52">
-                                                                                    <i class="fas fa-bars"></i>
-                                                                                </button>
-                                                                                <div class="dropdown-menu" role="menu">
-                                                                                    <a href="#" class="dropdown-item">
-                                                                                        Add new event
-                                                                                    </a>
-                                                                                    <a href="#" class="dropdown-item">
-                                                                                        Clear events
-                                                                                    </a>
-                                                                                    <div class="dropdown-divider"></div>
-                                                                                    <a href="#" class="dropdown-item">
-                                                                                        View calendar
-                                                                                    </a>
-                                                                                </div>
-                                                                            </div>
-                                                                            <button type="button"
-                                                                                    class="btn btn-success btn-sm"
-                                                                                    data-card-widget="collapse">
-                                                                                <i class="fas fa-minus"></i>
-                                                                            </button>
-                                                                            <button type="button"
-                                                                                    class="btn btn-success btn-sm"
-                                                                                    data-card-widget="remove">
-                                                                                <i class="fas fa-times"></i>
-                                                                            </button>
-                                                                        </div>
-                                                                        <!-- /. tools -->
-                                                                    </div>
-                                                                    <!-- /.card-header -->
-                                                                    <div class="card-body pt-0">
-                                                                        <!--The calendar -->
-                                                                        <div id="calendar" style="width: 100%"></div>
-                                                                    </div>
-                                                                    <!-- /.card-body -->
-                                                                </div>
-                                                                <!-- /.card -->
-                                                            </section>
-                                                            <!-- right col -->
-                                                        </div>
-                                                        <!-- /.row (main row) -->
-                                                    </div>
-                                                    <!-- /.container-fluid -->
-                                                </section>
-                                                <!-- /.content -->
-                                            </div>
-                                        {% endblock content %}
-                                        <!-- Specific Page JS goes HERE -->
-                                        {% block javascripts %}
-                                            <!-- jQuery -->
-                                            <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                                            <!-- jQuery UI 1.11.4 -->
-                                            <script src="/static/assets/plugins/jquery-ui/jquery-ui.min.js"></script>
-                                            <!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
-                                            <script>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user3-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Nadia Jolie
+                                                        <small class="contacts-list-date float-right">
+                                                        2/20/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">I'll call you back at...</span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user5-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Nora S. Vans
+                                                        <small class="contacts-list-date float-right">
+                                                        2/10/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">Where is your new...</span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user6-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        John K.
+                                                        <small class="contacts-list-date float-right">
+                                                        1/27/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">Can I take a look at...</span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user8-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Kenneth M.
+                                                        <small class="contacts-list-date float-right">
+                                                        1/4/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">Never mind I found...</span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                    </ul>
+                                    <!-- /.contacts-list -->
+                                </div>
+                                <!-- /.direct-chat-pane -->
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer">
+                                <form action="#" method="post">
+                                    <div class="input-group">
+                                        <input type="text"
+                                               name="message"
+                                               placeholder="Type Message ..."
+                                               class="form-control">
+                                        <span class="input-group-append">
+                                            <button type="button" class="btn btn-primary">
+                                                Send
+                                            </button>
+                                        </span>
+                                    </div>
+                                </form>
+                            </div>
+                            <!-- /.card-footer-->
+                        </div>
+                        <!--/.direct-chat -->
+                        <!-- TO DO List -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="ion ion-clipboard mr-1"></i>
+                                    To Do List
+                                </h3>
+                                <div class="card-tools">
+                                    <ul class="pagination pagination-sm">
+                                        <li class="page-item">
+                                            <a href="#" class="page-link">&laquo;</a>
+                                        </li>
+                                        <li class="page-item">
+                                            <a href="#" class="page-link">
+                                                1
+                                            </a>
+                                        </li>
+                                        <li class="page-item">
+                                            <a href="#" class="page-link">
+                                                2
+                                            </a>
+                                        </li>
+                                        <li class="page-item">
+                                            <a href="#" class="page-link">
+                                                3
+                                            </a>
+                                        </li>
+                                        <li class="page-item">
+                                            <a href="#" class="page-link">
+                                                &raquo;
+                                            </a>
+                                        </li>
+                                    </ul>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <ul class="todo-list" data-widget="todo-list">
+                                    <li>
+                                        <!-- drag handle -->
+                                        <span class="handle">
+                                            <i class="fas fa-ellipsis-v"></i>
+                                            <i class="fas fa-ellipsis-v"></i>
+                                        </span>
+                                        <!-- checkbox -->
+                                        <div class="icheck-primary d-inline ml-2">
+                                            <input type="checkbox" value="" name="todo1" id="todoCheck1">
+                                            <label for="todoCheck1"></label>
+                                        </div>
+                                        <!-- todo text -->
+                                        <span class="text">
+                                            Design a nice theme
+                                        </span>
+                                        <!-- Emphasis label -->
+                                        <small class="badge badge-danger">
+                                        <i class="far fa-clock"></i>
+                                        2 mins
+                                        </small>
+                                        <!-- General tools such as edit or delete-->
+                                        <div class="tools">
+                                            <i class="fas fa-edit"></i>
+                                            <i class="fas fa-trash-o"></i>
+                                        </div>
+                                    </li>
+                                    <li>
+                                        <span class="handle">
+                                            <i class="fas fa-ellipsis-v"></i>
+                                            <i class="fas fa-ellipsis-v"></i>
+                                        </span>
+                                        <div class="icheck-primary d-inline ml-2">
+                                            <input type="checkbox" value="" name="todo2" id="todoCheck2" checked>
+                                            <label for="todoCheck2"></label>
+                                        </div>
+                                        <span class="text">
+                                            Make the theme responsive
+                                        </span>
+                                        <small class="badge badge-info">
+                                        <i class="far fa-clock"></i>
+                                        4 hours
+                                        </small>
+                                        <div class="tools">
+                                            <i class="fas fa-edit"></i>
+                                            <i class="fas fa-trash-o"></i>
+                                        </div>
+                                    </li>
+                                    <li>
+                                        <span class="handle">
+                                            <i class="fas fa-ellipsis-v"></i>
+                                            <i class="fas fa-ellipsis-v"></i>
+                                        </span>
+                                        <div class="icheck-primary d-inline ml-2">
+                                            <input type="checkbox" value="" name="todo3" id="todoCheck3">
+                                            <label for="todoCheck3"></label>
+                                        </div>
+                                        <span class="text">
+                                            Let theme shine like a star
+                                        </span>
+                                        <small class="badge badge-warning">
+                                        <i class="far fa-clock"></i>
+                                        1 day
+                                        </small>
+                                        <div class="tools">
+                                            <i class="fas fa-edit"></i>
+                                            <i class="fas fa-trash-o"></i>
+                                        </div>
+                                    </li>
+                                    <li>
+                                        <span class="handle">
+                                            <i class="fas fa-ellipsis-v"></i>
+                                            <i class="fas fa-ellipsis-v"></i>
+                                        </span>
+                                        <div class="icheck-primary d-inline ml-2">
+                                            <input type="checkbox" value="" name="todo4" id="todoCheck4">
+                                            <label for="todoCheck4"></label>
+                                        </div>
+                                        <span class="text">
+                                            Let theme shine like a star
+                                        </span>
+                                        <small class="badge badge-success">
+                                        <i class="far fa-clock"></i>
+                                        3 days
+                                        </small>
+                                        <div class="tools">
+                                            <i class="fas fa-edit"></i>
+                                            <i class="fas fa-trash-o"></i>
+                                        </div>
+                                    </li>
+                                    <li>
+                                        <span class="handle">
+                                            <i class="fas fa-ellipsis-v"></i>
+                                            <i class="fas fa-ellipsis-v"></i>
+                                        </span>
+                                        <div class="icheck-primary d-inline ml-2">
+                                            <input type="checkbox" value="" name="todo5" id="todoCheck5">
+                                            <label for="todoCheck5"></label>
+                                        </div>
+                                        <span class="text">
+                                            Check your messages and notifications
+                                        </span>
+                                        <small class="badge badge-primary">
+                                        <i class="far fa-clock"></i>
+                                        1 week
+                                        </small>
+                                        <div class="tools">
+                                            <i class="fas fa-edit"></i>
+                                            <i class="fas fa-trash-o"></i>
+                                        </div>
+                                    </li>
+                                    <li>
+                                        <span class="handle">
+                                            <i class="fas fa-ellipsis-v"></i>
+                                            <i class="fas fa-ellipsis-v"></i>
+                                        </span>
+                                        <div class="icheck-primary d-inline ml-2">
+                                            <input type="checkbox" value="" name="todo6" id="todoCheck6">
+                                            <label for="todoCheck6"></label>
+                                        </div>
+                                        <span class="text">
+                                            Let theme shine like a star
+                                        </span>
+                                        <small class="badge badge-secondary">
+                                        <i class="far fa-clock"></i>
+                                        1 month
+                                        </small>
+                                        <div class="tools">
+                                            <i class="fas fa-edit"></i>
+                                            <i class="fas fa-trash-o"></i>
+                                        </div>
+                                    </li>
+                                </ul>
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer clearfix">
+                                <button type="button" class="btn btn-info float-right">
+                                    <i class="fas fa-plus"></i>
+                                    Add item
+                                </button>
+                            </div>
+                        </div>
+                        <!-- /.card -->
+                    </section>
+                    <!-- /.Left col -->
+                    <!-- right col (We are only adding the ID to make the widgets sortable)-->
+                    <section class="col-lg-5 connectedSortable">
+                        <!-- Map card -->
+                        <div class="card bg-gradient-primary">
+                            <div class="card-header border-0">
+                                <h3 class="card-title">
+                                    <i class="fas fa-map-marker-alt mr-1"></i>
+                                    Visitors
+                                </h3>
+                                <!-- card tools -->
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-primary btn-sm daterange" title="Date range">
+                                        <i class="far fa-calendar-alt"></i>
+                                    </button>
+                                    <button type="button"
+                                            class="btn btn-primary btn-sm"
+                                            data-card-widget="collapse"
+                                            title="Collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <div class="card-body">
+                                <div id="world-map" style="height: 250px; width: 100%;"></div>
+                            </div>
+                            <!-- /.card-body-->
+                            <div class="card-footer bg-transparent">
+                                <div class="row">
+                                    <div class="col-4 text-center">
+                                        <div id="sparkline-1"></div>
+                                        <div class="text-white">
+                                            Visitors
+                                        </div>
+                                    </div>
+                                    <!-- ./col -->
+                                    <div class="col-4 text-center">
+                                        <div id="sparkline-2"></div>
+                                        <div class="text-white">
+                                            Online
+                                        </div>
+                                    </div>
+                                    <!-- ./col -->
+                                    <div class="col-4 text-center">
+                                        <div id="sparkline-3"></div>
+                                        <div class="text-white">
+                                            Sales
+                                        </div>
+                                    </div>
+                                    <!-- ./col -->
+                                </div>
+                                <!-- /.row -->
+                            </div>
+                        </div>
+                        <!-- /.card -->
+                        <!-- solid sales graph -->
+                        <div class="card bg-gradient-info">
+                            <div class="card-header border-0">
+                                <h3 class="card-title">
+                                    <i class="fas fa-th mr-1"></i>
+                                    Sales Graph
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn bg-info btn-sm" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button" class="btn bg-info btn-sm" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
+                            <div class="card-body">
+                                <canvas class="chart"
+                                        id="line-chart"
+                                        style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%;"></canvas>
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer bg-transparent">
+                                <div class="row">
+                                    <div class="col-4 text-center">
+                                        <input type="text"
+                                               class="knob"
+                                               data-readonly="true"
+                                               value="20"
+                                               data-width="60"
+                                               data-height="60"
+                                               data-fgColor="#39CCCC">
+                                        <div class="text-white">
+                                            Mail-Orders
+                                        </div>
+                                    </div>
+                                    <!-- ./col -->
+                                    <div class="col-4 text-center">
+                                        <input type="text"
+                                               class="knob"
+                                               data-readonly="true"
+                                               value="50"
+                                               data-width="60"
+                                               data-height="60"
+                                               data-fgColor="#39CCCC">
+                                        <div class="text-white">
+                                            Online
+                                        </div>
+                                    </div>
+                                    <!-- ./col -->
+                                    <div class="col-4 text-center">
+                                        <input type="text"
+                                               class="knob"
+                                               data-readonly="true"
+                                               value="30"
+                                               data-width="60"
+                                               data-height="60"
+                                               data-fgColor="#39CCCC">
+                                        <div class="text-white">
+                                            In-Store
+                                        </div>
+                                    </div>
+                                    <!-- ./col -->
+                                </div>
+                                <!-- /.row -->
+                            </div>
+                            <!-- /.card-footer -->
+                        </div>
+                        <!-- /.card -->
+                        <!-- Calendar -->
+                        <div class="card bg-gradient-success">
+                            <div class="card-header border-0">
+                                <h3 class="card-title">
+                                    <i class="far fa-calendar-alt"></i>
+                                    Calendar
+                                </h3>
+                                <!-- tools card -->
+                                <div class="card-tools">
+                                    <!-- button with a dropdown -->
+                                    <div class="btn-group">
+                                        <button type="button"
+                                                class="btn btn-success btn-sm dropdown-toggle"
+                                                data-toggle="dropdown"
+                                                data-offset="-52">
+                                            <i class="fas fa-bars"></i>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a href="#" class="dropdown-item">
+                                                Add new event
+                                            </a>
+                                            <a href="#" class="dropdown-item">
+                                                Clear events
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a href="#" class="dropdown-item">
+                                                View calendar
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <button type="button" class="btn btn-success btn-sm" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-success btn-sm" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                                <!-- /. tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body pt-0">
+                                <!--The calendar -->
+                                <div id="calendar" style="width: 100%"></div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </section>
+                    <!-- right col -->
+                </div>
+                <!-- /.row (main row) -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- jQuery UI 1.11.4 -->
+    <script src="/static/assets/plugins/jquery-ui/jquery-ui.min.js"></script>
+    <!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
+    <script>
     $.widget.bridge('uibutton', $.ui.button)
-                                            </script>
-                                            <!-- Bootstrap 4 -->
-                                            <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                                            <!-- ChartJS -->
-                                            <script src="/static/assets/plugins/chart.js/Chart.min.js"></script>
-                                            <!-- Sparkline -->
-                                            <script src="/static/assets/plugins/sparklines/sparkline.js"></script>
-                                            <!-- JQVMap -->
-                                            <script src="/static/assets/plugins/jqvmap/jquery.vmap.min.js"></script>
-                                            <script src="/static/assets/plugins/jqvmap/maps/jquery.vmap.usa.js"></script>
-                                            <!-- jQuery Knob Chart -->
-                                            <script src="/static/assets/plugins/jquery-knob/jquery.knob.min.js"></script>
-                                            <!-- daterangepicker -->
-                                            <script src="/static/assets/plugins/moment/moment.min.js"></script>
-                                            <script src="/static/assets/plugins/daterangepicker/daterangepicker.js"></script>
-                                            <!-- Tempusdominus Bootstrap 4 -->
-                                            <script src="/static/assets/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>
-                                            <!-- Summernote -->
-                                            <script src="/static/assets/plugins/summernote/summernote-bs4.min.js"></script>
-                                            <!-- overlayScrollbars -->
-                                            <script src="/static/assets/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>
-                                            <!-- AdminLTE App -->
-                                            <script src="/static/assets/js/adminlte.js"></script>
-                                            <!-- AdminLTE dashboard demo (This is only for demo purposes) -->
-                                            <script src="/static/assets/js/pages/dashboard.js"></script>
-                                            <!-- AdminLTE for demo purposes -->
-                                            <script src="/static/assets/js/demo.js"></script>
-                                        {% endblock javascripts %}
+    </script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- ChartJS -->
+    <script src="/static/assets/plugins/chart.js/Chart.min.js"></script>
+    <!-- Sparkline -->
+    <script src="/static/assets/plugins/sparklines/sparkline.js"></script>
+    <!-- JQVMap -->
+    <script src="/static/assets/plugins/jqvmap/jquery.vmap.min.js"></script>
+    <script src="/static/assets/plugins/jqvmap/maps/jquery.vmap.usa.js"></script>
+    <!-- jQuery Knob Chart -->
+    <script src="/static/assets/plugins/jquery-knob/jquery.knob.min.js"></script>
+    <!-- daterangepicker -->
+    <script src="/static/assets/plugins/moment/moment.min.js"></script>
+    <script src="/static/assets/plugins/daterangepicker/daterangepicker.js"></script>
+    <!-- Tempusdominus Bootstrap 4 -->
+    <script src="/static/assets/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>
+    <!-- Summernote -->
+    <script src="/static/assets/plugins/summernote/summernote-bs4.min.js"></script>
+    <!-- overlayScrollbars -->
+    <script src="/static/assets/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.js"></script>
+    <!-- AdminLTE dashboard demo (This is only for demo purposes) -->
+    <script src="/static/assets/js/pages/dashboard.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/index2.html b/tests/jinja_adminlte/index2.html
index 26f42de..70c02b4 100644
--- a/tests/jinja_adminlte/index2.html
+++ b/tests/jinja_adminlte/index2.html
@@ -420,864 +420,806 @@
                                                 <img class="direct-chat-img"
                                                      src="/static/assets/img/user1-128x128.jpg"
                                                      alt="message user image">
-                                                    <!-- /.direct-chat-img -->
-                                                    <div class="direct-chat-text">
-                                                        Is this template really for free? That's unbelievable!
-                                                    </div>
-                                                    <!-- /.direct-chat-text -->
+                                                <!-- /.direct-chat-img -->
+                                                <div class="direct-chat-text">
+                                                    Is this template really for free? That's unbelievable!
                                                 </div>
-                                                <!-- /.direct-chat-msg -->
-                                                <!-- Message to the right -->
-                                                <div class="direct-chat-msg right">
-                                                    <div class="direct-chat-infos clearfix">
-                                                        <span class="direct-chat-name float-right">
-                                                            Sarah Bullock
-                                                        </span>
-                                                        <span class="direct-chat-timestamp float-left">
-                                                            23 Jan 2:05 pm
-                                                        </span>
-                                                    </div>
-                                                    <!-- /.direct-chat-infos -->
-                                                    <img class="direct-chat-img"
-                                                         src="/static/assets/img/user3-128x128.jpg"
-                                                         alt="message user image">
-                                                        <!-- /.direct-chat-img -->
-                                                        <div class="direct-chat-text">
-                                                            You better believe it!
-                                                        </div>
-                                                        <!-- /.direct-chat-text -->
-                                                    </div>
-                                                    <!-- /.direct-chat-msg -->
-                                                    <!-- Message. Default to the left -->
-                                                    <div class="direct-chat-msg">
-                                                        <div class="direct-chat-infos clearfix">
-                                                            <span class="direct-chat-name float-left">
-                                                                Alexander Pierce
-                                                            </span>
-                                                            <span class="direct-chat-timestamp float-right">
-                                                                23 Jan 5:37 pm
-                                                            </span>
-                                                        </div>
-                                                        <!-- /.direct-chat-infos -->
-                                                        <img class="direct-chat-img"
+                                                <!-- /.direct-chat-text -->
+                                            </div>
+                                            <!-- /.direct-chat-msg -->
+                                            <!-- Message to the right -->
+                                            <div class="direct-chat-msg right">
+                                                <div class="direct-chat-infos clearfix">
+                                                    <span class="direct-chat-name float-right">
+                                                        Sarah Bullock
+                                                    </span>
+                                                    <span class="direct-chat-timestamp float-left">
+                                                        23 Jan 2:05 pm
+                                                    </span>
+                                                </div>
+                                                <!-- /.direct-chat-infos -->
+                                                <img class="direct-chat-img"
+                                                     src="/static/assets/img/user3-128x128.jpg"
+                                                     alt="message user image">
+                                                <!-- /.direct-chat-img -->
+                                                <div class="direct-chat-text">
+                                                    You better believe it!
+                                                </div>
+                                                <!-- /.direct-chat-text -->
+                                            </div>
+                                            <!-- /.direct-chat-msg -->
+                                            <!-- Message. Default to the left -->
+                                            <div class="direct-chat-msg">
+                                                <div class="direct-chat-infos clearfix">
+                                                    <span class="direct-chat-name float-left">
+                                                        Alexander Pierce
+                                                    </span>
+                                                    <span class="direct-chat-timestamp float-right">
+                                                        23 Jan 5:37 pm
+                                                    </span>
+                                                </div>
+                                                <!-- /.direct-chat-infos -->
+                                                <img class="direct-chat-img"
+                                                     src="/static/assets/img/user1-128x128.jpg"
+                                                     alt="message user image">
+                                                <!-- /.direct-chat-img -->
+                                                <div class="direct-chat-text">
+                                                    Working with AdminLTE on a great new app! Wanna join?
+                                                </div>
+                                                <!-- /.direct-chat-text -->
+                                            </div>
+                                            <!-- /.direct-chat-msg -->
+                                            <!-- Message to the right -->
+                                            <div class="direct-chat-msg right">
+                                                <div class="direct-chat-infos clearfix">
+                                                    <span class="direct-chat-name float-right">
+                                                        Sarah Bullock
+                                                    </span>
+                                                    <span class="direct-chat-timestamp float-left">
+                                                        23 Jan 6:10 pm
+                                                    </span>
+                                                </div>
+                                                <!-- /.direct-chat-infos -->
+                                                <img class="direct-chat-img"
+                                                     src="/static/assets/img/user3-128x128.jpg"
+                                                     alt="message user image">
+                                                <!-- /.direct-chat-img -->
+                                                <div class="direct-chat-text">
+                                                    I would love to.
+                                                </div>
+                                                <!-- /.direct-chat-text -->
+                                            </div>
+                                            <!-- /.direct-chat-msg -->
+                                        </div>
+                                        <!--/.direct-chat-messages-->
+                                        <!-- Contacts are loaded here -->
+                                        <div class="direct-chat-contacts">
+                                            <ul class="contacts-list">
+                                                <li>
+                                                    <a href="#">
+                                                        <img class="contacts-list-img"
                                                              src="/static/assets/img/user1-128x128.jpg"
-                                                             alt="message user image">
-                                                            <!-- /.direct-chat-img -->
-                                                            <div class="direct-chat-text">
-                                                                Working with AdminLTE on a great new app! Wanna join?
-                                                            </div>
-                                                            <!-- /.direct-chat-text -->
+                                                             alt="User Avatar">
+                                                        <div class="contacts-list-info">
+                                                            <span class="contacts-list-name">
+                                                                Count Dracula
+                                                                <small class="contacts-list-date float-right">
+                                                                2/28/2015
+                                                                </small>
+                                                            </span>
+                                                            <span class="contacts-list-msg">
+                                                                How have you been? I was...
+                                                            </span>
                                                         </div>
-                                                        <!-- /.direct-chat-msg -->
-                                                        <!-- Message to the right -->
-                                                        <div class="direct-chat-msg right">
-                                                            <div class="direct-chat-infos clearfix">
-                                                                <span class="direct-chat-name float-right">
-                                                                    Sarah Bullock
-                                                                </span>
-                                                                <span class="direct-chat-timestamp float-left">
-                                                                    23 Jan 6:10 pm
-                                                                </span>
-                                                            </div>
-                                                            <!-- /.direct-chat-infos -->
-                                                            <img class="direct-chat-img"
-                                                                 src="/static/assets/img/user3-128x128.jpg"
-                                                                 alt="message user image">
-                                                                <!-- /.direct-chat-img -->
-                                                                <div class="direct-chat-text">
-                                                                    I would love to.
-                                                                </div>
-                                                                <!-- /.direct-chat-text -->
-                                                            </div>
-                                                            <!-- /.direct-chat-msg -->
+                                                        <!-- /.contacts-list-info -->
+                                                    </a>
+                                                </li>
+                                                <!-- End Contact Item -->
+                                                <li>
+                                                    <a href="#">
+                                                        <img class="contacts-list-img"
+                                                             src="/static/assets/img/user7-128x128.jpg"
+                                                             alt="User Avatar">
+                                                        <div class="contacts-list-info">
+                                                            <span class="contacts-list-name">
+                                                                Sarah Doe
+                                                                <small class="contacts-list-date float-right">
+                                                                2/23/2015
+                                                                </small>
+                                                            </span>
+                                                            <span class="contacts-list-msg">
+                                                                I will be waiting for...
+                                                            </span>
                                                         </div>
-                                                        <!--/.direct-chat-messages-->
-                                                        <!-- Contacts are loaded here -->
-                                                        <div class="direct-chat-contacts">
-                                                            <ul class="contacts-list">
-                                                                <li>
-                                                                    <a href="#">
-                                                                        <img class="contacts-list-img"
-                                                                             src="/static/assets/img/user1-128x128.jpg"
-                                                                             alt="User Avatar">
-                                                                            <div class="contacts-list-info">
-                                                                                <span class="contacts-list-name">
-                                                                                    Count Dracula
-                                                                                    <small class="contacts-list-date float-right">
-                                                                                    2/28/2015
-                                                                                    </small>
-                                                                                </span>
-                                                                                <span class="contacts-list-msg">
-                                                                                    How have you been? I was...
-                                                                                </span>
-                                                                            </div>
-                                                                            <!-- /.contacts-list-info -->
-                                                                        </a>
-                                                                    </li>
-                                                                    <!-- End Contact Item -->
-                                                                    <li>
-                                                                        <a href="#">
-                                                                            <img class="contacts-list-img"
-                                                                                 src="/static/assets/img/user7-128x128.jpg"
-                                                                                 alt="User Avatar">
-                                                                                <div class="contacts-list-info">
-                                                                                    <span class="contacts-list-name">
-                                                                                        Sarah Doe
-                                                                                        <small class="contacts-list-date float-right">
-                                                                                        2/23/2015
-                                                                                        </small>
-                                                                                    </span>
-                                                                                    <span class="contacts-list-msg">
-                                                                                        I will be waiting for...
-                                                                                    </span>
-                                                                                </div>
-                                                                                <!-- /.contacts-list-info -->
-                                                                            </a>
-                                                                        </li>
-                                                                        <!-- End Contact Item -->
-                                                                        <li>
-                                                                            <a href="#">
-                                                                                <img class="contacts-list-img"
-                                                                                     src="/static/assets/img/user3-128x128.jpg"
-                                                                                     alt="User Avatar">
-                                                                                    <div class="contacts-list-info">
-                                                                                        <span class="contacts-list-name">
-                                                                                            Nadia Jolie
-                                                                                            <small class="contacts-list-date float-right">
-                                                                                            2/20/2015
-                                                                                            </small>
-                                                                                        </span>
-                                                                                        <span class="contacts-list-msg">
-                                                                                            I'll call you back at...
-                                                                                        </span>
-                                                                                    </div>
-                                                                                    <!-- /.contacts-list-info -->
-                                                                                </a>
-                                                                            </li>
-                                                                            <!-- End Contact Item -->
-                                                                            <li>
-                                                                                <a href="#">
-                                                                                    <img class="contacts-list-img"
-                                                                                         src="/static/assets/img/user5-128x128.jpg"
-                                                                                         alt="User Avatar">
-                                                                                        <div class="contacts-list-info">
-                                                                                            <span class="contacts-list-name">
-                                                                                                Nora S. Vans
-                                                                                                <small class="contacts-list-date float-right">
-                                                                                                2/10/2015
-                                                                                                </small>
-                                                                                            </span>
-                                                                                            <span class="contacts-list-msg">
-                                                                                                Where is your new...
-                                                                                            </span>
-                                                                                        </div>
-                                                                                        <!-- /.contacts-list-info -->
-                                                                                    </a>
-                                                                                </li>
-                                                                                <!-- End Contact Item -->
-                                                                                <li>
-                                                                                    <a href="#">
-                                                                                        <img class="contacts-list-img"
-                                                                                             src="/static/assets/img/user6-128x128.jpg"
-                                                                                             alt="User Avatar">
-                                                                                            <div class="contacts-list-info">
-                                                                                                <span class="contacts-list-name">
-                                                                                                    John K.
-                                                                                                    <small class="contacts-list-date float-right">
-                                                                                                    1/27/2015
-                                                                                                    </small>
-                                                                                                </span>
-                                                                                                <span class="contacts-list-msg">
-                                                                                                    Can I take a look at...
-                                                                                                </span>
-                                                                                            </div>
-                                                                                            <!-- /.contacts-list-info -->
-                                                                                        </a>
-                                                                                    </li>
-                                                                                    <!-- End Contact Item -->
-                                                                                    <li>
-                                                                                        <a href="#">
-                                                                                            <img class="contacts-list-img"
-                                                                                                 src="/static/assets/img/user8-128x128.jpg"
-                                                                                                 alt="User Avatar">
-                                                                                                <div class="contacts-list-info">
-                                                                                                    <span class="contacts-list-name">
-                                                                                                        Kenneth M.
-                                                                                                        <small class="contacts-list-date float-right">
-                                                                                                        1/4/2015
-                                                                                                        </small>
-                                                                                                    </span>
-                                                                                                    <span class="contacts-list-msg">
-                                                                                                        Never mind I found...
-                                                                                                    </span>
-                                                                                                </div>
-                                                                                                <!-- /.contacts-list-info -->
-                                                                                            </a>
-                                                                                        </li>
-                                                                                        <!-- End Contact Item -->
-                                                                                    </ul>
-                                                                                    <!-- /.contacts-list -->
-                                                                                </div>
-                                                                                <!-- /.direct-chat-pane -->
-                                                                            </div>
-                                                                            <!-- /.card-body -->
-                                                                            <div class="card-footer">
-                                                                                <form action="#" method="post">
-                                                                                    <div class="input-group">
-                                                                                        <input type="text"
-                                                                                               name="message"
-                                                                                               placeholder="Type Message ..."
-                                                                                               class="form-control">
-                                                                                        <span class="input-group-append">
-                                                                                            <button type="button"
-                                                                                                    class="btn btn-warning">
-                                                                                                Send
-                                                                                            </button>
-                                                                                        </span>
-                                                                                    </div>
-                                                                                </form>
-                                                                            </div>
-                                                                            <!-- /.card-footer-->
-                                                                        </div>
-                                                                        <!--/.direct-chat -->
-                                                                    </div>
-                                                                    <!-- /.col -->
-                                                                    <div class="col-md-6">
-                                                                        <!-- USERS LIST -->
-                                                                        <div class="card">
-                                                                            <div class="card-header">
-                                                                                <h3 class="card-title">
-                                                                                    Latest Members
-                                                                                </h3>
-                                                                                <div class="card-tools">
-                                                                                    <span class="badge badge-danger">
-                                                                                        8 New Members
-                                                                                    </span>
-                                                                                    <button type="button"
-                                                                                            class="btn btn-tool"
-                                                                                            data-card-widget="collapse">
-                                                                                        <i class="fas fa-minus"></i>
-                                                                                    </button>
-                                                                                    <button type="button"
-                                                                                            class="btn btn-tool"
-                                                                                            data-card-widget="remove">
-                                                                                        <i class="fas fa-times"></i>
-                                                                                    </button>
-                                                                                </div>
-                                                                            </div>
-                                                                            <!-- /.card-header -->
-                                                                            <div class="card-body p-0">
-                                                                                <ul class="users-list clearfix">
-                                                                                    <li>
-                                                                                        <img src="/static/assets/img/user1-128x128.jpg"
-                                                                                             alt="User Image">
-                                                                                            <a class="users-list-name"
-                                                                                               href="#">
-                                                                                                Alexander Pierce
-                                                                                            </a>
-                                                                                            <span class="users-list-date">
-                                                                                                Today
-                                                                                            </span>
-                                                                                        </li>
-                                                                                        <li>
-                                                                                            <img src="/static/assets/img/user8-128x128.jpg"
-                                                                                                 alt="User Image">
-                                                                                                <a class="users-list-name"
-                                                                                                   href="#">
-                                                                                                    Norman
-                                                                                                </a>
-                                                                                                <span class="users-list-date">
-                                                                                                    Yesterday
-                                                                                                </span>
-                                                                                            </li>
-                                                                                            <li>
-                                                                                                <img src="/static/assets/img/user7-128x128.jpg"
-                                                                                                     alt="User Image">
-                                                                                                    <a class="users-list-name"
-                                                                                                       href="#">
-                                                                                                        Jane
-                                                                                                    </a>
-                                                                                                    <span class="users-list-date">
-                                                                                                        12 Jan
-                                                                                                    </span>
-                                                                                                </li>
-                                                                                                <li>
-                                                                                                    <img src="/static/assets/img/user6-128x128.jpg"
-                                                                                                         alt="User Image">
-                                                                                                        <a class="users-list-name"
-                                                                                                           href="#">
-                                                                                                            John
-                                                                                                        </a>
-                                                                                                        <span class="users-list-date">
-                                                                                                            12 Jan
-                                                                                                        </span>
-                                                                                                    </li>
-                                                                                                    <li>
-                                                                                                        <img src="/static/assets/img/user2-160x160.jpg"
-                                                                                                             alt="User Image">
-                                                                                                            <a class="users-list-name"
-                                                                                                               href="#">
-                                                                                                                Alexander
-                                                                                                            </a>
-                                                                                                            <span class="users-list-date">
-                                                                                                                13 Jan
-                                                                                                            </span>
-                                                                                                        </li>
-                                                                                                        <li>
-                                                                                                            <img src="/static/assets/img/user5-128x128.jpg"
-                                                                                                                 alt="User Image">
-                                                                                                                <a class="users-list-name"
-                                                                                                                   href="#">
-                                                                                                                    Sarah
-                                                                                                                </a>
-                                                                                                                <span class="users-list-date">
-                                                                                                                    14 Jan
-                                                                                                                </span>
-                                                                                                            </li>
-                                                                                                            <li>
-                                                                                                                <img src="/static/assets/img/user4-128x128.jpg"
-                                                                                                                     alt="User Image">
-                                                                                                                    <a class="users-list-name"
-                                                                                                                       href="#">
-                                                                                                                        Nora
-                                                                                                                    </a>
-                                                                                                                    <span class="users-list-date">
-                                                                                                                        15 Jan
-                                                                                                                    </span>
-                                                                                                                </li>
-                                                                                                                <li>
-                                                                                                                    <img src="/static/assets/img/user3-128x128.jpg"
-                                                                                                                         alt="User Image">
-                                                                                                                        <a class="users-list-name"
-                                                                                                                           href="#">
-                                                                                                                            Nadia
-                                                                                                                        </a>
-                                                                                                                        <span class="users-list-date">
-                                                                                                                            15 Jan
-                                                                                                                        </span>
-                                                                                                                    </li>
-                                                                                                                </ul>
-                                                                                                                <!-- /.users-list -->
-                                                                                                            </div>
-                                                                                                            <!-- /.card-body -->
-                                                                                                            <div class="card-footer text-center">
-                                                                                                                <a href="javascript:">
-                                                                                                                    View All Users
-                                                                                                                </a>
-                                                                                                            </div>
-                                                                                                            <!-- /.card-footer -->
-                                                                                                        </div>
-                                                                                                        <!--/.card -->
-                                                                                                    </div>
-                                                                                                    <!-- /.col -->
-                                                                                                </div>
-                                                                                                <!-- /.row -->
-                                                                                                <!-- TABLE: LATEST ORDERS -->
-                                                                                                <div class="card">
-                                                                                                    <div class="card-header border-transparent">
-                                                                                                        <h3 class="card-title">
-                                                                                                            Latest Orders
-                                                                                                        </h3>
-                                                                                                        <div class="card-tools">
-                                                                                                            <button type="button"
-                                                                                                                    class="btn btn-tool"
-                                                                                                                    data-card-widget="collapse">
-                                                                                                                <i class="fas fa-minus"></i>
-                                                                                                            </button>
-                                                                                                            <button type="button"
-                                                                                                                    class="btn btn-tool"
-                                                                                                                    data-card-widget="remove">
-                                                                                                                <i class="fas fa-times"></i>
-                                                                                                            </button>
-                                                                                                        </div>
-                                                                                                    </div>
-                                                                                                    <!-- /.card-header -->
-                                                                                                    <div class="card-body p-0">
-                                                                                                        <div class="table-responsive">
-                                                                                                            <table class="table m-0">
-                                                                                                                <thead>
-                                                                                                                    <tr>
-                                                                                                                        <th>Order ID</th>
-                                                                                                                        <th>Item</th>
-                                                                                                                        <th>Status</th>
-                                                                                                                        <th>Popularity</th>
-                                                                                                                    </tr>
-                                                                                                                </thead>
-                                                                                                                <tbody>
-                                                                                                                    <tr>
-                                                                                                                        <td>
-                                                                                                                            <a href="pages/examples/invoice.html">
-                                                                                                                                OR9842
-                                                                                                                            </a>
-                                                                                                                        </td>
-                                                                                                                        <td>Call of Duty IV</td>
-                                                                                                                        <td>
-                                                                                                                            <span class="badge badge-success">
-                                                                                                                                Shipped
-                                                                                                                            </span>
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <div class="sparkbar"
-                                                                                                                                 data-color="#00a65a"
-                                                                                                                                 data-height="20">
-                                                                                                                                90,80,90,-70,61,-83,63
-                                                                                                                            </div>
-                                                                                                                        </td>
-                                                                                                                    </tr>
-                                                                                                                    <tr>
-                                                                                                                        <td>
-                                                                                                                            <a href="pages/examples/invoice.html">
-                                                                                                                                OR1848
-                                                                                                                            </a>
-                                                                                                                        </td>
-                                                                                                                        <td>Samsung Smart TV</td>
-                                                                                                                        <td>
-                                                                                                                            <span class="badge badge-warning">
-                                                                                                                                Pending
-                                                                                                                            </span>
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <div class="sparkbar"
-                                                                                                                                 data-color="#f39c12"
-                                                                                                                                 data-height="20">
-                                                                                                                                90,80,-90,70,61,-83,68
-                                                                                                                            </div>
-                                                                                                                        </td>
-                                                                                                                    </tr>
-                                                                                                                    <tr>
-                                                                                                                        <td>
-                                                                                                                            <a href="pages/examples/invoice.html">
-                                                                                                                                OR7429
-                                                                                                                            </a>
-                                                                                                                        </td>
-                                                                                                                        <td>iPhone 6 Plus</td>
-                                                                                                                        <td>
-                                                                                                                            <span class="badge badge-danger">
-                                                                                                                                Delivered
-                                                                                                                            </span>
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <div class="sparkbar"
-                                                                                                                                 data-color="#f56954"
-                                                                                                                                 data-height="20">
-                                                                                                                                90,-80,90,70,-61,83,63
-                                                                                                                            </div>
-                                                                                                                        </td>
-                                                                                                                    </tr>
-                                                                                                                    <tr>
-                                                                                                                        <td>
-                                                                                                                            <a href="pages/examples/invoice.html">
-                                                                                                                                OR7429
-                                                                                                                            </a>
-                                                                                                                        </td>
-                                                                                                                        <td>Samsung Smart TV</td>
-                                                                                                                        <td>
-                                                                                                                            <span class="badge badge-info">
-                                                                                                                                Processing
-                                                                                                                            </span>
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <div class="sparkbar"
-                                                                                                                                 data-color="#00c0ef"
-                                                                                                                                 data-height="20">
-                                                                                                                                90,80,-90,70,-61,83,63
-                                                                                                                            </div>
-                                                                                                                        </td>
-                                                                                                                    </tr>
-                                                                                                                    <tr>
-                                                                                                                        <td>
-                                                                                                                            <a href="pages/examples/invoice.html">
-                                                                                                                                OR1848
-                                                                                                                            </a>
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            Samsung Smart TV
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <span class="badge badge-warning">
-                                                                                                                                Pending
-                                                                                                                            </span>
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <div class="sparkbar"
-                                                                                                                                 data-color="#f39c12"
-                                                                                                                                 data-height="20">
-                                                                                                                                90,80,-90,70,61,-83,68
-                                                                                                                            </div>
-                                                                                                                        </td>
-                                                                                                                    </tr>
-                                                                                                                    <tr>
-                                                                                                                        <td>
-                                                                                                                            <a href="pages/examples/invoice.html">
-                                                                                                                                OR7429
-                                                                                                                            </a>
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            iPhone 6 Plus
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <span class="badge badge-danger">
-                                                                                                                                Delivered
-                                                                                                                            </span>
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <div class="sparkbar"
-                                                                                                                                 data-color="#f56954"
-                                                                                                                                 data-height="20">
-                                                                                                                                90,-80,90,70,-61,83,63
-                                                                                                                            </div>
-                                                                                                                        </td>
-                                                                                                                    </tr>
-                                                                                                                    <tr>
-                                                                                                                        <td>
-                                                                                                                            <a href="pages/examples/invoice.html">
-                                                                                                                                OR9842
-                                                                                                                            </a>
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            Call of Duty IV
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <span class="badge badge-success">
-                                                                                                                                Shipped
-                                                                                                                            </span>
-                                                                                                                        </td>
-                                                                                                                        <td>
-                                                                                                                            <div class="sparkbar"
-                                                                                                                                 data-color="#00a65a"
-                                                                                                                                 data-height="20">
-                                                                                                                                90,80,90,-70,61,-83,63
-                                                                                                                            </div>
-                                                                                                                        </td>
-                                                                                                                    </tr>
-                                                                                                                </tbody>
-                                                                                                            </table>
-                                                                                                        </div>
-                                                                                                        <!-- /.table-responsive -->
-                                                                                                    </div>
-                                                                                                    <!-- /.card-body -->
-                                                                                                    <div class="card-footer clearfix">
-                                                                                                        <a href="javascript:void(0)"
-                                                                                                           class="btn btn-sm btn-info float-left">
-                                                                                                            Place New Order
-                                                                                                        </a>
-                                                                                                        <a href="javascript:void(0)"
-                                                                                                           class="btn btn-sm btn-secondary float-right">
-                                                                                                            View All Orders
-                                                                                                        </a>
-                                                                                                    </div>
-                                                                                                    <!-- /.card-footer -->
-                                                                                                </div>
-                                                                                                <!-- /.card -->
-                                                                                            </div>
-                                                                                            <!-- /.col -->
-                                                                                            <div class="col-md-4">
-                                                                                                <!-- Info Boxes Style 2 -->
-                                                                                                <div class="info-box mb-3 bg-warning">
-                                                                                                    <span class="info-box-icon">
-                                                                                                        <i class="fas fa-tag"></i>
-                                                                                                    </span>
-                                                                                                    <div class="info-box-content">
-                                                                                                        <span class="info-box-text">
-                                                                                                            Inventory
-                                                                                                        </span>
-                                                                                                        <span class="info-box-number">
-                                                                                                            5,200
-                                                                                                        </span>
-                                                                                                    </div>
-                                                                                                    <!-- /.info-box-content -->
-                                                                                                </div>
-                                                                                                <!-- /.info-box -->
-                                                                                                <div class="info-box mb-3 bg-success">
-                                                                                                    <span class="info-box-icon">
-                                                                                                        <i class="far fa-heart"></i>
-                                                                                                    </span>
-                                                                                                    <div class="info-box-content">
-                                                                                                        <span class="info-box-text">
-                                                                                                            Mentions
-                                                                                                        </span>
-                                                                                                        <span class="info-box-number">
-                                                                                                            92,050
-                                                                                                        </span>
-                                                                                                    </div>
-                                                                                                    <!-- /.info-box-content -->
-                                                                                                </div>
-                                                                                                <!-- /.info-box -->
-                                                                                                <div class="info-box mb-3 bg-danger">
-                                                                                                    <span class="info-box-icon">
-                                                                                                        <i class="fas fa-cloud-download-alt"></i>
-                                                                                                    </span>
-                                                                                                    <div class="info-box-content">
-                                                                                                        <span class="info-box-text">
-                                                                                                            Downloads
-                                                                                                        </span>
-                                                                                                        <span class="info-box-number">
-                                                                                                            114,381
-                                                                                                        </span>
-                                                                                                    </div>
-                                                                                                    <!-- /.info-box-content -->
-                                                                                                </div>
-                                                                                                <!-- /.info-box -->
-                                                                                                <div class="info-box mb-3 bg-info">
-                                                                                                    <span class="info-box-icon">
-                                                                                                        <i class="far fa-comment"></i>
-                                                                                                    </span>
-                                                                                                    <div class="info-box-content">
-                                                                                                        <span class="info-box-text">
-                                                                                                            Direct Messages
-                                                                                                        </span>
-                                                                                                        <span class="info-box-number">
-                                                                                                            163,921
-                                                                                                        </span>
-                                                                                                    </div>
-                                                                                                    <!-- /.info-box-content -->
-                                                                                                </div>
-                                                                                                <!-- /.info-box -->
-                                                                                                <div class="card">
-                                                                                                    <div class="card-header">
-                                                                                                        <h3 class="card-title">
-                                                                                                            Browser Usage
-                                                                                                        </h3>
-                                                                                                        <div class="card-tools">
-                                                                                                            <button type="button"
-                                                                                                                    class="btn btn-tool"
-                                                                                                                    data-card-widget="collapse">
-                                                                                                                <i class="fas fa-minus"></i>
-                                                                                                            </button>
-                                                                                                            <button type="button"
-                                                                                                                    class="btn btn-tool"
-                                                                                                                    data-card-widget="remove">
-                                                                                                                <i class="fas fa-times"></i>
-                                                                                                            </button>
-                                                                                                        </div>
-                                                                                                    </div>
-                                                                                                    <!-- /.card-header -->
-                                                                                                    <div class="card-body">
-                                                                                                        <div class="row">
-                                                                                                            <div class="col-md-8">
-                                                                                                                <div class="chart-responsive">
-                                                                                                                    <canvas id="pieChart"
-                                                                                                                            height="150"></canvas>
-                                                                                                                </div>
-                                                                                                                <!-- ./chart-responsive -->
-                                                                                                            </div>
-                                                                                                            <!-- /.col -->
-                                                                                                            <div class="col-md-4">
-                                                                                                                <ul class="chart-legend clearfix">
-                                                                                                                    <li>
-                                                                                                                        <i class="far fa-circle text-danger"></i>
-                                                                                                                        Chrome
-                                                                                                                    </li>
-                                                                                                                    <li>
-                                                                                                                        <i class="far fa-circle text-success"></i>
-                                                                                                                        IE
-                                                                                                                    </li>
-                                                                                                                    <li>
-                                                                                                                        <i class="far fa-circle text-warning"></i>
-                                                                                                                        FireFox
-                                                                                                                    </li>
-                                                                                                                    <li>
-                                                                                                                        <i class="far fa-circle text-info"></i>
-                                                                                                                        Safari
-                                                                                                                    </li>
-                                                                                                                    <li>
-                                                                                                                        <i class="far fa-circle text-primary"></i>
-                                                                                                                        Opera
-                                                                                                                    </li>
-                                                                                                                    <li>
-                                                                                                                        <i class="far fa-circle text-secondary"></i>
-                                                                                                                        Navigator
-                                                                                                                    </li>
-                                                                                                                </ul>
-                                                                                                            </div>
-                                                                                                            <!-- /.col -->
-                                                                                                        </div>
-                                                                                                        <!-- /.row -->
-                                                                                                    </div>
-                                                                                                    <!-- /.card-body -->
-                                                                                                    <div class="card-footer bg-white p-0">
-                                                                                                        <ul class="nav nav-pills flex-column">
-                                                                                                            <li class="nav-item">
-                                                                                                                <a href="#"
-                                                                                                                   class="nav-link">
-                                                                                                                    United States of America
-                                                                                                                    <span class="float-right text-danger">
-                                                                                                                        <i class="fas fa-arrow-down text-sm"></i>
-                                                                                                                        12%
-                                                                                                                    </span>
-                                                                                                                </a>
-                                                                                                            </li>
-                                                                                                            <li class="nav-item">
-                                                                                                                <a href="#"
-                                                                                                                   class="nav-link">
-                                                                                                                    India
-                                                                                                                    <span class="float-right text-success">
-                                                                                                                        <i class="fas fa-arrow-up text-sm"></i>
-                                                                                                                        4%
-                                                                                                                    </span>
-                                                                                                                </a>
-                                                                                                            </li>
-                                                                                                            <li class="nav-item">
-                                                                                                                <a href="#"
-                                                                                                                   class="nav-link">
-                                                                                                                    China
-                                                                                                                    <span class="float-right text-warning">
-                                                                                                                        <i class="fas fa-arrow-left text-sm"></i>
-                                                                                                                        0%
-                                                                                                                    </span>
-                                                                                                                </a>
-                                                                                                            </li>
-                                                                                                        </ul>
-                                                                                                    </div>
-                                                                                                    <!-- /.footer -->
-                                                                                                </div>
-                                                                                                <!-- /.card -->
-                                                                                                <!-- PRODUCT LIST -->
-                                                                                                <div class="card">
-                                                                                                    <div class="card-header">
-                                                                                                        <h3 class="card-title">
-                                                                                                            Recently Added Products
-                                                                                                        </h3>
-                                                                                                        <div class="card-tools">
-                                                                                                            <button type="button"
-                                                                                                                    class="btn btn-tool"
-                                                                                                                    data-card-widget="collapse">
-                                                                                                                <i class="fas fa-minus"></i>
-                                                                                                            </button>
-                                                                                                            <button type="button"
-                                                                                                                    class="btn btn-tool"
-                                                                                                                    data-card-widget="remove">
-                                                                                                                <i class="fas fa-times"></i>
-                                                                                                            </button>
-                                                                                                        </div>
-                                                                                                    </div>
-                                                                                                    <!-- /.card-header -->
-                                                                                                    <div class="card-body p-0">
-                                                                                                        <ul class="products-list product-list-in-card pl-2 pr-2">
-                                                                                                            <li class="item">
-                                                                                                                <div class="product-img">
-                                                                                                                    <img src="/static/assets/img/default-150x150.png"
-                                                                                                                         alt="Product Image"
-                                                                                                                         class="img-size-50">
-                                                                                                                    </div>
-                                                                                                                    <div class="product-info">
-                                                                                                                        <a href="javascript:void(0)"
-                                                                                                                           class="product-title">
-                                                                                                                            Samsung TV
-                                                                                                                            <span class="badge badge-warning float-right">
-                                                                                                                                $1800
-                                                                                                                            </span>
-                                                                                                                        </a>
-                                                                                                                        <span class="product-description">
-                                                                                                                            Samsung 32" 1080p 60Hz LED Smart HDTV.
-                                                                                                                        </span>
-                                                                                                                    </div>
-                                                                                                                </li>
-                                                                                                                <!-- /.item -->
-                                                                                                                <li class="item">
-                                                                                                                    <div class="product-img">
-                                                                                                                        <img src="/static/assets/img/default-150x150.png"
-                                                                                                                             alt="Product Image"
-                                                                                                                             class="img-size-50">
-                                                                                                                        </div>
-                                                                                                                        <div class="product-info">
-                                                                                                                            <a href="javascript:void(0)"
-                                                                                                                               class="product-title">
-                                                                                                                                Bicycle
-                                                                                                                                <span class="badge badge-info float-right">
-                                                                                                                                    $700
-                                                                                                                                </span>
-                                                                                                                            </a>
-                                                                                                                            <span class="product-description">
-                                                                                                                                26" Mongoose Dolomite Men's 7-speed, Navy Blue.
-                                                                                                                            </span>
-                                                                                                                        </div>
-                                                                                                                    </li>
-                                                                                                                    <!-- /.item -->
-                                                                                                                    <li class="item">
-                                                                                                                        <div class="product-img">
-                                                                                                                            <img src="/static/assets/img/default-150x150.png"
-                                                                                                                                 alt="Product Image"
-                                                                                                                                 class="img-size-50">
-                                                                                                                            </div>
-                                                                                                                            <div class="product-info">
-                                                                                                                                <a href="javascript:void(0)"
-                                                                                                                                   class="product-title">
-                                                                                                                                    Xbox One
-                                                                                                                                    <span class="badge badge-danger float-right">
-                                                                                                                                        $350
-                                                                                                                                    </span>
-                                                                                                                                </a>
-                                                                                                                                <span class="product-description">
-                                                                                                                                    Xbox One Console Bundle with Halo Master Chief Collection.
-                                                                                                                                </span>
-                                                                                                                            </div>
-                                                                                                                        </li>
-                                                                                                                        <!-- /.item -->
-                                                                                                                        <li class="item">
-                                                                                                                            <div class="product-img">
-                                                                                                                                <img src="/static/assets/img/default-150x150.png"
-                                                                                                                                     alt="Product Image"
-                                                                                                                                     class="img-size-50">
-                                                                                                                                </div>
-                                                                                                                                <div class="product-info">
-                                                                                                                                    <a href="javascript:void(0)"
-                                                                                                                                       class="product-title">
-                                                                                                                                        PlayStation 4
-                                                                                                                                        <span class="badge badge-success float-right">
-                                                                                                                                            $399
-                                                                                                                                        </span>
-                                                                                                                                    </a>
-                                                                                                                                    <span class="product-description">
-                                                                                                                                        PlayStation 4 500GB Console (PS4)
-                                                                                                                                    </span>
-                                                                                                                                </div>
-                                                                                                                            </li>
-                                                                                                                            <!-- /.item -->
-                                                                                                                        </ul>
-                                                                                                                    </div>
-                                                                                                                    <!-- /.card-body -->
-                                                                                                                    <div class="card-footer text-center">
-                                                                                                                        <a href="javascript:void(0)"
-                                                                                                                           class="uppercase">
-                                                                                                                            View All Products
-                                                                                                                        </a>
-                                                                                                                    </div>
-                                                                                                                    <!-- /.card-footer -->
-                                                                                                                </div>
-                                                                                                                <!-- /.card -->
-                                                                                                            </div>
-                                                                                                            <!-- /.col -->
-                                                                                                        </div>
-                                                                                                        <!-- /.row -->
-                                                                                                    </div>
-                                                                                                    <!--/. container-fluid -->
-                                                                                                </section>
-                                                                                                <!-- /.content -->
-                                                                                            </div>
-                                                                                            <!-- /.content-wrapper -->
-                                                                                        {% endblock content %}
-                                                                                        <!-- Specific Page JS goes HERE -->
-                                                                                        {% block javascripts %}
-                                                                                            <!-- REQUIRED SCRIPTS -->
-                                                                                            <!-- jQuery -->
-                                                                                            <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                                                                                            <!-- Bootstrap -->
-                                                                                            <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                                                                                            <!-- overlayScrollbars -->
-                                                                                            <script src="/static/assets/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>
-                                                                                            <!-- AdminLTE App -->
-                                                                                            <script src="/static/assets/js/adminlte.js"></script>
-                                                                                            <!-- OPTIONAL SCRIPTS -->
-                                                                                            <script src="/static/assets/js/demo.js"></script>
-                                                                                            <!-- PAGE PLUGINS -->
-                                                                                            <!-- jQuery Mapael -->
-                                                                                            <script src="/static/assets/plugins/jquery-mousewheel/jquery.mousewheel.js"></script>
-                                                                                            <script src="/static/assets/plugins/raphael/raphael.min.js"></script>
-                                                                                            <script src="/static/assets/plugins/jquery-mapael/jquery.mapael.min.js"></script>
-                                                                                            <script src="/static/assets/plugins/jquery-mapael/maps/usa_states.min.js"></script>
-                                                                                            <!-- ChartJS -->
-                                                                                            <script src="/static/assets/plugins/chart.js/Chart.min.js"></script>
-                                                                                            <!-- PAGE SCRIPTS -->
-                                                                                            <script src="/static/assets/js/pages/dashboard2.js"></script>
-                                                                                        {% endblock javascripts %}
+                                                        <!-- /.contacts-list-info -->
+                                                    </a>
+                                                </li>
+                                                <!-- End Contact Item -->
+                                                <li>
+                                                    <a href="#">
+                                                        <img class="contacts-list-img"
+                                                             src="/static/assets/img/user3-128x128.jpg"
+                                                             alt="User Avatar">
+                                                        <div class="contacts-list-info">
+                                                            <span class="contacts-list-name">
+                                                                Nadia Jolie
+                                                                <small class="contacts-list-date float-right">
+                                                                2/20/2015
+                                                                </small>
+                                                            </span>
+                                                            <span class="contacts-list-msg">
+                                                                I'll call you back at...
+                                                            </span>
+                                                        </div>
+                                                        <!-- /.contacts-list-info -->
+                                                    </a>
+                                                </li>
+                                                <!-- End Contact Item -->
+                                                <li>
+                                                    <a href="#">
+                                                        <img class="contacts-list-img"
+                                                             src="/static/assets/img/user5-128x128.jpg"
+                                                             alt="User Avatar">
+                                                        <div class="contacts-list-info">
+                                                            <span class="contacts-list-name">
+                                                                Nora S. Vans
+                                                                <small class="contacts-list-date float-right">
+                                                                2/10/2015
+                                                                </small>
+                                                            </span>
+                                                            <span class="contacts-list-msg">
+                                                                Where is your new...
+                                                            </span>
+                                                        </div>
+                                                        <!-- /.contacts-list-info -->
+                                                    </a>
+                                                </li>
+                                                <!-- End Contact Item -->
+                                                <li>
+                                                    <a href="#">
+                                                        <img class="contacts-list-img"
+                                                             src="/static/assets/img/user6-128x128.jpg"
+                                                             alt="User Avatar">
+                                                        <div class="contacts-list-info">
+                                                            <span class="contacts-list-name">
+                                                                John K.
+                                                                <small class="contacts-list-date float-right">
+                                                                1/27/2015
+                                                                </small>
+                                                            </span>
+                                                            <span class="contacts-list-msg">
+                                                                Can I take a look at...
+                                                            </span>
+                                                        </div>
+                                                        <!-- /.contacts-list-info -->
+                                                    </a>
+                                                </li>
+                                                <!-- End Contact Item -->
+                                                <li>
+                                                    <a href="#">
+                                                        <img class="contacts-list-img"
+                                                             src="/static/assets/img/user8-128x128.jpg"
+                                                             alt="User Avatar">
+                                                        <div class="contacts-list-info">
+                                                            <span class="contacts-list-name">
+                                                                Kenneth M.
+                                                                <small class="contacts-list-date float-right">
+                                                                1/4/2015
+                                                                </small>
+                                                            </span>
+                                                            <span class="contacts-list-msg">
+                                                                Never mind I found...
+                                                            </span>
+                                                        </div>
+                                                        <!-- /.contacts-list-info -->
+                                                    </a>
+                                                </li>
+                                                <!-- End Contact Item -->
+                                            </ul>
+                                            <!-- /.contacts-list -->
+                                        </div>
+                                        <!-- /.direct-chat-pane -->
+                                    </div>
+                                    <!-- /.card-body -->
+                                    <div class="card-footer">
+                                        <form action="#" method="post">
+                                            <div class="input-group">
+                                                <input type="text"
+                                                       name="message"
+                                                       placeholder="Type Message ..."
+                                                       class="form-control">
+                                                <span class="input-group-append">
+                                                    <button type="button" class="btn btn-warning">
+                                                        Send
+                                                    </button>
+                                                </span>
+                                            </div>
+                                        </form>
+                                    </div>
+                                    <!-- /.card-footer-->
+                                </div>
+                                <!--/.direct-chat -->
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-md-6">
+                                <!-- USERS LIST -->
+                                <div class="card">
+                                    <div class="card-header">
+                                        <h3 class="card-title">
+                                            Latest Members
+                                        </h3>
+                                        <div class="card-tools">
+                                            <span class="badge badge-danger">
+                                                8 New Members
+                                            </span>
+                                            <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                                <i class="fas fa-minus"></i>
+                                            </button>
+                                            <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                                <i class="fas fa-times"></i>
+                                            </button>
+                                        </div>
+                                    </div>
+                                    <!-- /.card-header -->
+                                    <div class="card-body p-0">
+                                        <ul class="users-list clearfix">
+                                            <li>
+                                                <img src="/static/assets/img/user1-128x128.jpg" alt="User Image">
+                                                <a class="users-list-name" href="#">
+                                                    Alexander Pierce
+                                                </a>
+                                                <span class="users-list-date">
+                                                    Today
+                                                </span>
+                                            </li>
+                                            <li>
+                                                <img src="/static/assets/img/user8-128x128.jpg" alt="User Image">
+                                                <a class="users-list-name" href="#">
+                                                    Norman
+                                                </a>
+                                                <span class="users-list-date">
+                                                    Yesterday
+                                                </span>
+                                            </li>
+                                            <li>
+                                                <img src="/static/assets/img/user7-128x128.jpg" alt="User Image">
+                                                <a class="users-list-name" href="#">
+                                                    Jane
+                                                </a>
+                                                <span class="users-list-date">
+                                                    12 Jan
+                                                </span>
+                                            </li>
+                                            <li>
+                                                <img src="/static/assets/img/user6-128x128.jpg" alt="User Image">
+                                                <a class="users-list-name" href="#">
+                                                    John
+                                                </a>
+                                                <span class="users-list-date">
+                                                    12 Jan
+                                                </span>
+                                            </li>
+                                            <li>
+                                                <img src="/static/assets/img/user2-160x160.jpg" alt="User Image">
+                                                <a class="users-list-name" href="#">
+                                                    Alexander
+                                                </a>
+                                                <span class="users-list-date">
+                                                    13 Jan
+                                                </span>
+                                            </li>
+                                            <li>
+                                                <img src="/static/assets/img/user5-128x128.jpg" alt="User Image">
+                                                <a class="users-list-name" href="#">
+                                                    Sarah
+                                                </a>
+                                                <span class="users-list-date">
+                                                    14 Jan
+                                                </span>
+                                            </li>
+                                            <li>
+                                                <img src="/static/assets/img/user4-128x128.jpg" alt="User Image">
+                                                <a class="users-list-name" href="#">
+                                                    Nora
+                                                </a>
+                                                <span class="users-list-date">
+                                                    15 Jan
+                                                </span>
+                                            </li>
+                                            <li>
+                                                <img src="/static/assets/img/user3-128x128.jpg" alt="User Image">
+                                                <a class="users-list-name" href="#">
+                                                    Nadia
+                                                </a>
+                                                <span class="users-list-date">
+                                                    15 Jan
+                                                </span>
+                                            </li>
+                                        </ul>
+                                        <!-- /.users-list -->
+                                    </div>
+                                    <!-- /.card-body -->
+                                    <div class="card-footer text-center">
+                                        <a href="javascript:">
+                                            View All Users
+                                        </a>
+                                    </div>
+                                    <!-- /.card-footer -->
+                                </div>
+                                <!--/.card -->
+                            </div>
+                            <!-- /.col -->
+                        </div>
+                        <!-- /.row -->
+                        <!-- TABLE: LATEST ORDERS -->
+                        <div class="card">
+                            <div class="card-header border-transparent">
+                                <h3 class="card-title">
+                                    Latest Orders
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body p-0">
+                                <div class="table-responsive">
+                                    <table class="table m-0">
+                                        <thead>
+                                            <tr>
+                                                <th>Order ID</th>
+                                                <th>Item</th>
+                                                <th>Status</th>
+                                                <th>Popularity</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+                                            <tr>
+                                                <td>
+                                                    <a href="pages/examples/invoice.html">
+                                                        OR9842
+                                                    </a>
+                                                </td>
+                                                <td>Call of Duty IV</td>
+                                                <td>
+                                                    <span class="badge badge-success">
+                                                        Shipped
+                                                    </span>
+                                                </td>
+                                                <td>
+                                                    <div class="sparkbar" data-color="#00a65a" data-height="20">
+                                                        90,80,90,-70,61,-83,63
+                                                    </div>
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    <a href="pages/examples/invoice.html">
+                                                        OR1848
+                                                    </a>
+                                                </td>
+                                                <td>Samsung Smart TV</td>
+                                                <td>
+                                                    <span class="badge badge-warning">
+                                                        Pending
+                                                    </span>
+                                                </td>
+                                                <td>
+                                                    <div class="sparkbar" data-color="#f39c12" data-height="20">
+                                                        90,80,-90,70,61,-83,68
+                                                    </div>
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    <a href="pages/examples/invoice.html">
+                                                        OR7429
+                                                    </a>
+                                                </td>
+                                                <td>iPhone 6 Plus</td>
+                                                <td>
+                                                    <span class="badge badge-danger">
+                                                        Delivered
+                                                    </span>
+                                                </td>
+                                                <td>
+                                                    <div class="sparkbar" data-color="#f56954" data-height="20">
+                                                        90,-80,90,70,-61,83,63
+                                                    </div>
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    <a href="pages/examples/invoice.html">
+                                                        OR7429
+                                                    </a>
+                                                </td>
+                                                <td>Samsung Smart TV</td>
+                                                <td>
+                                                    <span class="badge badge-info">
+                                                        Processing
+                                                    </span>
+                                                </td>
+                                                <td>
+                                                    <div class="sparkbar" data-color="#00c0ef" data-height="20">
+                                                        90,80,-90,70,-61,83,63
+                                                    </div>
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    <a href="pages/examples/invoice.html">
+                                                        OR1848
+                                                    </a>
+                                                </td>
+                                                <td>
+                                                    Samsung Smart TV
+                                                </td>
+                                                <td>
+                                                    <span class="badge badge-warning">
+                                                        Pending
+                                                    </span>
+                                                </td>
+                                                <td>
+                                                    <div class="sparkbar" data-color="#f39c12" data-height="20">
+                                                        90,80,-90,70,61,-83,68
+                                                    </div>
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    <a href="pages/examples/invoice.html">
+                                                        OR7429
+                                                    </a>
+                                                </td>
+                                                <td>
+                                                    iPhone 6 Plus
+                                                </td>
+                                                <td>
+                                                    <span class="badge badge-danger">
+                                                        Delivered
+                                                    </span>
+                                                </td>
+                                                <td>
+                                                    <div class="sparkbar" data-color="#f56954" data-height="20">
+                                                        90,-80,90,70,-61,83,63
+                                                    </div>
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    <a href="pages/examples/invoice.html">
+                                                        OR9842
+                                                    </a>
+                                                </td>
+                                                <td>
+                                                    Call of Duty IV
+                                                </td>
+                                                <td>
+                                                    <span class="badge badge-success">
+                                                        Shipped
+                                                    </span>
+                                                </td>
+                                                <td>
+                                                    <div class="sparkbar" data-color="#00a65a" data-height="20">
+                                                        90,80,90,-70,61,-83,63
+                                                    </div>
+                                                </td>
+                                            </tr>
+                                        </tbody>
+                                    </table>
+                                </div>
+                                <!-- /.table-responsive -->
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer clearfix">
+                                <a href="javascript:void(0)" class="btn btn-sm btn-info float-left">
+                                    Place New Order
+                                </a>
+                                <a href="javascript:void(0)" class="btn btn-sm btn-secondary float-right">
+                                    View All Orders
+                                </a>
+                            </div>
+                            <!-- /.card-footer -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-4">
+                        <!-- Info Boxes Style 2 -->
+                        <div class="info-box mb-3 bg-warning">
+                            <span class="info-box-icon">
+                                <i class="fas fa-tag"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Inventory
+                                </span>
+                                <span class="info-box-number">
+                                    5,200
+                                </span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                        <div class="info-box mb-3 bg-success">
+                            <span class="info-box-icon">
+                                <i class="far fa-heart"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Mentions
+                                </span>
+                                <span class="info-box-number">
+                                    92,050
+                                </span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                        <div class="info-box mb-3 bg-danger">
+                            <span class="info-box-icon">
+                                <i class="fas fa-cloud-download-alt"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Downloads
+                                </span>
+                                <span class="info-box-number">
+                                    114,381
+                                </span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                        <div class="info-box mb-3 bg-info">
+                            <span class="info-box-icon">
+                                <i class="far fa-comment"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Direct Messages
+                                </span>
+                                <span class="info-box-number">
+                                    163,921
+                                </span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Browser Usage
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <div class="row">
+                                    <div class="col-md-8">
+                                        <div class="chart-responsive">
+                                            <canvas id="pieChart" height="150"></canvas>
+                                        </div>
+                                        <!-- ./chart-responsive -->
+                                    </div>
+                                    <!-- /.col -->
+                                    <div class="col-md-4">
+                                        <ul class="chart-legend clearfix">
+                                            <li>
+                                                <i class="far fa-circle text-danger"></i>
+                                                Chrome
+                                            </li>
+                                            <li>
+                                                <i class="far fa-circle text-success"></i>
+                                                IE
+                                            </li>
+                                            <li>
+                                                <i class="far fa-circle text-warning"></i>
+                                                FireFox
+                                            </li>
+                                            <li>
+                                                <i class="far fa-circle text-info"></i>
+                                                Safari
+                                            </li>
+                                            <li>
+                                                <i class="far fa-circle text-primary"></i>
+                                                Opera
+                                            </li>
+                                            <li>
+                                                <i class="far fa-circle text-secondary"></i>
+                                                Navigator
+                                            </li>
+                                        </ul>
+                                    </div>
+                                    <!-- /.col -->
+                                </div>
+                                <!-- /.row -->
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer bg-white p-0">
+                                <ul class="nav nav-pills flex-column">
+                                    <li class="nav-item">
+                                        <a href="#" class="nav-link">
+                                            United States of America
+                                            <span class="float-right text-danger">
+                                                <i class="fas fa-arrow-down text-sm"></i>
+                                                12%
+                                            </span>
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a href="#" class="nav-link">
+                                            India
+                                            <span class="float-right text-success">
+                                                <i class="fas fa-arrow-up text-sm"></i>
+                                                4%
+                                            </span>
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a href="#" class="nav-link">
+                                            China
+                                            <span class="float-right text-warning">
+                                                <i class="fas fa-arrow-left text-sm"></i>
+                                                0%
+                                            </span>
+                                        </a>
+                                    </li>
+                                </ul>
+                            </div>
+                            <!-- /.footer -->
+                        </div>
+                        <!-- /.card -->
+                        <!-- PRODUCT LIST -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Recently Added Products
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body p-0">
+                                <ul class="products-list product-list-in-card pl-2 pr-2">
+                                    <li class="item">
+                                        <div class="product-img">
+                                            <img src="/static/assets/img/default-150x150.png"
+                                                 alt="Product Image"
+                                                 class="img-size-50">
+                                        </div>
+                                        <div class="product-info">
+                                            <a href="javascript:void(0)" class="product-title">
+                                                Samsung TV
+                                                <span class="badge badge-warning float-right">
+                                                    $1800
+                                                </span>
+                                            </a>
+                                            <span class="product-description">
+                                                Samsung 32" 1080p 60Hz LED Smart HDTV.
+                                            </span>
+                                        </div>
+                                    </li>
+                                    <!-- /.item -->
+                                    <li class="item">
+                                        <div class="product-img">
+                                            <img src="/static/assets/img/default-150x150.png"
+                                                 alt="Product Image"
+                                                 class="img-size-50">
+                                        </div>
+                                        <div class="product-info">
+                                            <a href="javascript:void(0)" class="product-title">
+                                                Bicycle
+                                                <span class="badge badge-info float-right">
+                                                    $700
+                                                </span>
+                                            </a>
+                                            <span class="product-description">
+                                                26" Mongoose Dolomite Men's 7-speed, Navy Blue.
+                                            </span>
+                                        </div>
+                                    </li>
+                                    <!-- /.item -->
+                                    <li class="item">
+                                        <div class="product-img">
+                                            <img src="/static/assets/img/default-150x150.png"
+                                                 alt="Product Image"
+                                                 class="img-size-50">
+                                        </div>
+                                        <div class="product-info">
+                                            <a href="javascript:void(0)" class="product-title">
+                                                Xbox One
+                                                <span class="badge badge-danger float-right">
+                                                    $350
+                                                </span>
+                                            </a>
+                                            <span class="product-description">
+                                                Xbox One Console Bundle with Halo Master Chief Collection.
+                                            </span>
+                                        </div>
+                                    </li>
+                                    <!-- /.item -->
+                                    <li class="item">
+                                        <div class="product-img">
+                                            <img src="/static/assets/img/default-150x150.png"
+                                                 alt="Product Image"
+                                                 class="img-size-50">
+                                        </div>
+                                        <div class="product-info">
+                                            <a href="javascript:void(0)" class="product-title">
+                                                PlayStation 4
+                                                <span class="badge badge-success float-right">
+                                                    $399
+                                                </span>
+                                            </a>
+                                            <span class="product-description">
+                                                PlayStation 4 500GB Console (PS4)
+                                            </span>
+                                        </div>
+                                    </li>
+                                    <!-- /.item -->
+                                </ul>
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer text-center">
+                                <a href="javascript:void(0)" class="uppercase">
+                                    View All Products
+                                </a>
+                            </div>
+                            <!-- /.card-footer -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+            </div>
+            <!--/. container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- REQUIRED SCRIPTS -->
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- overlayScrollbars -->
+    <script src="/static/assets/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.js"></script>
+    <!-- OPTIONAL SCRIPTS -->
+    <script src="/static/assets/js/demo.js"></script>
+    <!-- PAGE PLUGINS -->
+    <!-- jQuery Mapael -->
+    <script src="/static/assets/plugins/jquery-mousewheel/jquery.mousewheel.js"></script>
+    <script src="/static/assets/plugins/raphael/raphael.min.js"></script>
+    <script src="/static/assets/plugins/jquery-mapael/jquery.mapael.min.js"></script>
+    <script src="/static/assets/plugins/jquery-mapael/maps/usa_states.min.js"></script>
+    <!-- ChartJS -->
+    <script src="/static/assets/plugins/chart.js/Chart.min.js"></script>
+    <!-- PAGE SCRIPTS -->
+    <script src="/static/assets/js/pages/dashboard2.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/index3.html b/tests/jinja_adminlte/index3.html
index 5b14537..0a5af30 100644
--- a/tests/jinja_adminlte/index3.html
+++ b/tests/jinja_adminlte/index3.html
@@ -115,219 +115,219 @@
                                                 <img src="/static/assets/img/default-150x150.png"
                                                      alt="Product 1"
                                                      class="img-circle img-size-32 mr-2">
-                                                    Some Product
-                                                </td>
-                                                <td>$13 USD</td>
-                                                <td>
-                                                    <small class="text-success mr-1">
-                                                    <i class="fas fa-arrow-up"></i>
-                                                    12%
-                                                    </small>
-                                                    12,000 Sold
-                                                </td>
-                                                <td>
-                                                    <a href="#" class="text-muted">
-                                                        <i class="fas fa-search"></i>
-                                                    </a>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <img src="/static/assets/img/default-150x150.png"
-                                                         alt="Product 1"
-                                                         class="img-circle img-size-32 mr-2">
-                                                        Another Product
-                                                    </td>
-                                                    <td>$29 USD</td>
-                                                    <td>
-                                                        <small class="text-warning mr-1">
-                                                        <i class="fas fa-arrow-down"></i>
-                                                        0.5%
-                                                        </small>
-                                                        123,234 Sold
-                                                    </td>
-                                                    <td>
-                                                        <a href="#" class="text-muted">
-                                                            <i class="fas fa-search"></i>
-                                                        </a>
-                                                    </td>
-                                                </tr>
-                                                <tr>
-                                                    <td>
-                                                        <img src="/static/assets/img/default-150x150.png"
-                                                             alt="Product 1"
-                                                             class="img-circle img-size-32 mr-2">
-                                                            Amazing Product
-                                                        </td>
-                                                        <td>$1,230 USD</td>
-                                                        <td>
-                                                            <small class="text-danger mr-1">
-                                                            <i class="fas fa-arrow-down"></i>
-                                                            3%
-                                                            </small>
-                                                            198 Sold
-                                                        </td>
-                                                        <td>
-                                                            <a href="#" class="text-muted">
-                                                                <i class="fas fa-search"></i>
-                                                            </a>
-                                                        </td>
-                                                    </tr>
-                                                    <tr>
-                                                        <td>
-                                                            <img src="/static/assets/img/default-150x150.png"
-                                                                 alt="Product 1"
-                                                                 class="img-circle img-size-32 mr-2">
-                                                                Perfect Item
-                                                                <span class="badge bg-danger">NEW</span>
-                                                            </td>
-                                                            <td>$199 USD</td>
-                                                            <td>
-                                                                <small class="text-success mr-1">
-                                                                <i class="fas fa-arrow-up"></i>
-                                                                63%
-                                                                </small>
-                                                                87 Sold
-                                                            </td>
-                                                            <td>
-                                                                <a href="#" class="text-muted">
-                                                                    <i class="fas fa-search"></i>
-                                                                </a>
-                                                            </td>
-                                                        </tr>
-                                                    </tbody>
-                                                </table>
-                                            </div>
-                                        </div>
-                                        <!-- /.card -->
-                                    </div>
-                                    <!-- /.col-md-6 -->
-                                    <div class="col-lg-6">
-                                        <div class="card">
-                                            <div class="card-header border-0">
-                                                <div class="d-flex justify-content-between">
-                                                    <h3 class="card-title">Sales</h3>
-                                                    <a href="javascript:void(0);">View Report</a>
-                                                </div>
-                                            </div>
-                                            <div class="card-body">
-                                                <div class="d-flex">
-                                                    <p class="d-flex flex-column">
-                                                        <span class="text-bold text-lg">
-                                                            $18,230.00
-                                                        </span>
-                                                        <span>Sales Over Time</span>
-                                                    </p>
-                                                    <p class="ml-auto d-flex flex-column text-right">
-                                                        <span class="text-success">
-                                                            <i class="fas fa-arrow-up"></i>
-                                                            33.1%
-                                                        </span>
-                                                        <span class="text-muted">
-                                                            Since last month
-                                                        </span>
-                                                    </p>
-                                                </div>
-                                                <!-- /.d-flex -->
-                                                <div class="position-relative mb-4">
-                                                    <canvas id="sales-chart" height="200"></canvas>
-                                                </div>
-                                                <div class="d-flex flex-row justify-content-end">
-                                                    <span class="mr-2">
-                                                        <i class="fas fa-square text-primary"></i>
-                                                        This year
-                                                    </span>
-                                                    <span>
-                                                        <i class="fas fa-square text-gray"></i>
-                                                        Last year
-                                                    </span>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <!-- /.card -->
-                                        <div class="card">
-                                            <div class="card-header border-0">
-                                                <h3 class="card-title">
-                                                    Online Store Overview
-                                                </h3>
-                                                <div class="card-tools">
-                                                    <a href="#" class="btn btn-sm btn-tool">
-                                                        <i class="fas fa-download"></i>
-                                                    </a>
-                                                    <a href="#" class="btn btn-sm btn-tool">
-                                                        <i class="fas fa-bars"></i>
-                                                    </a>
-                                                </div>
-                                            </div>
-                                            <div class="card-body">
-                                                <div class="d-flex justify-content-between align-items-center border-bottom mb-3">
-                                                    <p class="text-success text-xl">
-                                                        <i class="ion ion-ios-refresh-empty"></i>
-                                                    </p>
-                                                    <p class="d-flex flex-column text-right">
-                                                        <span class="font-weight-bold">
-                                                            <i class="ion ion-android-arrow-up text-success"></i>
-                                                            12%
-                                                        </span>
-                                                        <span class="text-muted">
-                                                            CONVERSION RATE
-                                                        </span>
-                                                    </p>
-                                                </div>
-                                                <!-- /.d-flex -->
-                                                <div class="d-flex justify-content-between align-items-center border-bottom mb-3">
-                                                    <p class="text-warning text-xl">
-                                                        <i class="ion ion-ios-cart-outline"></i>
-                                                    </p>
-                                                    <p class="d-flex flex-column text-right">
-                                                        <span class="font-weight-bold">
-                                                            <i class="ion ion-android-arrow-up text-warning"></i>
-                                                            0.8%
-                                                        </span>
-                                                        <span class="text-muted">
-                                                            SALES RATE
-                                                        </span>
-                                                    </p>
-                                                </div>
-                                                <!-- /.d-flex -->
-                                                <div class="d-flex justify-content-between align-items-center mb-0">
-                                                    <p class="text-danger text-xl">
-                                                        <i class="ion ion-ios-people-outline"></i>
-                                                    </p>
-                                                    <p class="d-flex flex-column text-right">
-                                                        <span class="font-weight-bold">
-                                                            <i class="ion ion-android-arrow-down text-danger"></i>
-                                                            1%
-                                                        </span>
-                                                        <span class="text-muted">
-                                                            REGISTRATION RATE
-                                                        </span>
-                                                    </p>
-                                                </div>
-                                                <!-- /.d-flex -->
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <!-- /.col-md-6 -->
-                                </div>
-                                <!-- /.row -->
+                                                Some Product
+                                            </td>
+                                            <td>$13 USD</td>
+                                            <td>
+                                                <small class="text-success mr-1">
+                                                <i class="fas fa-arrow-up"></i>
+                                                12%
+                                                </small>
+                                                12,000 Sold
+                                            </td>
+                                            <td>
+                                                <a href="#" class="text-muted">
+                                                    <i class="fas fa-search"></i>
+                                                </a>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                <img src="/static/assets/img/default-150x150.png"
+                                                     alt="Product 1"
+                                                     class="img-circle img-size-32 mr-2">
+                                                Another Product
+                                            </td>
+                                            <td>$29 USD</td>
+                                            <td>
+                                                <small class="text-warning mr-1">
+                                                <i class="fas fa-arrow-down"></i>
+                                                0.5%
+                                                </small>
+                                                123,234 Sold
+                                            </td>
+                                            <td>
+                                                <a href="#" class="text-muted">
+                                                    <i class="fas fa-search"></i>
+                                                </a>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                <img src="/static/assets/img/default-150x150.png"
+                                                     alt="Product 1"
+                                                     class="img-circle img-size-32 mr-2">
+                                                Amazing Product
+                                            </td>
+                                            <td>$1,230 USD</td>
+                                            <td>
+                                                <small class="text-danger mr-1">
+                                                <i class="fas fa-arrow-down"></i>
+                                                3%
+                                                </small>
+                                                198 Sold
+                                            </td>
+                                            <td>
+                                                <a href="#" class="text-muted">
+                                                    <i class="fas fa-search"></i>
+                                                </a>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                <img src="/static/assets/img/default-150x150.png"
+                                                     alt="Product 1"
+                                                     class="img-circle img-size-32 mr-2">
+                                                Perfect Item
+                                                <span class="badge bg-danger">NEW</span>
+                                            </td>
+                                            <td>$199 USD</td>
+                                            <td>
+                                                <small class="text-success mr-1">
+                                                <i class="fas fa-arrow-up"></i>
+                                                63%
+                                                </small>
+                                                87 Sold
+                                            </td>
+                                            <td>
+                                                <a href="#" class="text-muted">
+                                                    <i class="fas fa-search"></i>
+                                                </a>
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                </table>
                             </div>
-                            <!-- /.container-fluid -->
                         </div>
-                        <!-- /.content -->
+                        <!-- /.card -->
                     </div>
-                    <!-- /.content-wrapper -->
-                {% endblock content %}
-                <!-- Specific Page JS goes HERE -->
-                {% block javascripts %}
-                    <!-- jQuery -->
-                    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                    <!-- Bootstrap -->
-                    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                    <!-- AdminLTE -->
-                    <script src="/static/assets/js/adminlte.js"></script>
-                    <!-- OPTIONAL SCRIPTS -->
-                    <script src="/static/assets/plugins/chart.js/Chart.min.js"></script>
-                    <script src="/static/assets/js/demo.js"></script>
-                    <script src="/static/assets/js/pages/dashboard3.js"></script>
-                {% endblock javascripts %}
+                    <!-- /.col-md-6 -->
+                    <div class="col-lg-6">
+                        <div class="card">
+                            <div class="card-header border-0">
+                                <div class="d-flex justify-content-between">
+                                    <h3 class="card-title">Sales</h3>
+                                    <a href="javascript:void(0);">View Report</a>
+                                </div>
+                            </div>
+                            <div class="card-body">
+                                <div class="d-flex">
+                                    <p class="d-flex flex-column">
+                                        <span class="text-bold text-lg">
+                                            $18,230.00
+                                        </span>
+                                        <span>Sales Over Time</span>
+                                    </p>
+                                    <p class="ml-auto d-flex flex-column text-right">
+                                        <span class="text-success">
+                                            <i class="fas fa-arrow-up"></i>
+                                            33.1%
+                                        </span>
+                                        <span class="text-muted">
+                                            Since last month
+                                        </span>
+                                    </p>
+                                </div>
+                                <!-- /.d-flex -->
+                                <div class="position-relative mb-4">
+                                    <canvas id="sales-chart" height="200"></canvas>
+                                </div>
+                                <div class="d-flex flex-row justify-content-end">
+                                    <span class="mr-2">
+                                        <i class="fas fa-square text-primary"></i>
+                                        This year
+                                    </span>
+                                    <span>
+                                        <i class="fas fa-square text-gray"></i>
+                                        Last year
+                                    </span>
+                                </div>
+                            </div>
+                        </div>
+                        <!-- /.card -->
+                        <div class="card">
+                            <div class="card-header border-0">
+                                <h3 class="card-title">
+                                    Online Store Overview
+                                </h3>
+                                <div class="card-tools">
+                                    <a href="#" class="btn btn-sm btn-tool">
+                                        <i class="fas fa-download"></i>
+                                    </a>
+                                    <a href="#" class="btn btn-sm btn-tool">
+                                        <i class="fas fa-bars"></i>
+                                    </a>
+                                </div>
+                            </div>
+                            <div class="card-body">
+                                <div class="d-flex justify-content-between align-items-center border-bottom mb-3">
+                                    <p class="text-success text-xl">
+                                        <i class="ion ion-ios-refresh-empty"></i>
+                                    </p>
+                                    <p class="d-flex flex-column text-right">
+                                        <span class="font-weight-bold">
+                                            <i class="ion ion-android-arrow-up text-success"></i>
+                                            12%
+                                        </span>
+                                        <span class="text-muted">
+                                            CONVERSION RATE
+                                        </span>
+                                    </p>
+                                </div>
+                                <!-- /.d-flex -->
+                                <div class="d-flex justify-content-between align-items-center border-bottom mb-3">
+                                    <p class="text-warning text-xl">
+                                        <i class="ion ion-ios-cart-outline"></i>
+                                    </p>
+                                    <p class="d-flex flex-column text-right">
+                                        <span class="font-weight-bold">
+                                            <i class="ion ion-android-arrow-up text-warning"></i>
+                                            0.8%
+                                        </span>
+                                        <span class="text-muted">
+                                            SALES RATE
+                                        </span>
+                                    </p>
+                                </div>
+                                <!-- /.d-flex -->
+                                <div class="d-flex justify-content-between align-items-center mb-0">
+                                    <p class="text-danger text-xl">
+                                        <i class="ion ion-ios-people-outline"></i>
+                                    </p>
+                                    <p class="d-flex flex-column text-right">
+                                        <span class="font-weight-bold">
+                                            <i class="ion ion-android-arrow-down text-danger"></i>
+                                            1%
+                                        </span>
+                                        <span class="text-muted">
+                                            REGISTRATION RATE
+                                        </span>
+                                    </p>
+                                </div>
+                                <!-- /.d-flex -->
+                            </div>
+                        </div>
+                    </div>
+                    <!-- /.col-md-6 -->
+                </div>
+                <!-- /.row -->
+            </div>
+            <!-- /.container-fluid -->
+        </div>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE -->
+    <script src="/static/assets/js/adminlte.js"></script>
+    <!-- OPTIONAL SCRIPTS -->
+    <script src="/static/assets/plugins/chart.js/Chart.min.js"></script>
+    <script src="/static/assets/js/demo.js"></script>
+    <script src="/static/assets/js/pages/dashboard3.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/layouts/base-fullscreen.html b/tests/jinja_adminlte/layouts/base-fullscreen.html
index 5b31235..0856c97 100644
--- a/tests/jinja_adminlte/layouts/base-fullscreen.html
+++ b/tests/jinja_adminlte/layouts/base-fullscreen.html
@@ -12,10 +12,10 @@
         </title>
         <!-- Specific Page CSS goes HERE -->
         {% block stylesheets %}{% endblock stylesheets %}
-        </head>
-        <body class="hold-transition {% block body_class %}{% endblock body_class %}">
-            {% block content %}{% endblock content %}
-                <!-- Specific Page JS goes HERE -->
-                {% block javascripts %}{% endblock javascripts %}
-                </body>
-            </html>
+    </head>
+    <body class="hold-transition {% block body_class %}{% endblock body_class %}">
+        {% block content %}{% endblock content %}
+        <!-- Specific Page JS goes HERE -->
+        {% block javascripts %}{% endblock javascripts %}
+    </body>
+</html>
diff --git a/tests/jinja_adminlte/layouts/base.html b/tests/jinja_adminlte/layouts/base.html
index d6498b2..1569d21 100644
--- a/tests/jinja_adminlte/layouts/base.html
+++ b/tests/jinja_adminlte/layouts/base.html
@@ -11,21 +11,21 @@
         | AppSeed
         </title>
         {% block stylesheets %}{% endblock stylesheets %}
-        </head>
-        <body class="hold-transition {% block body_class %}{% endblock body_class %}">
-            <div class="wrapper">
-                {% include 'includes/navigation.html' %}
-                {% include 'includes/sidebar.html' %}
-                {% block content %}{% endblock content %}
-                    {% include 'includes/footer.html' %}
-                    <!-- Control Sidebar -->
-                    <aside class="control-sidebar control-sidebar-dark">
-                        <!-- Control sidebar content goes here -->
-                    </aside>
-                    <!-- /.control-sidebar -->
-                </div>
-                <!-- ./wrapper -->
-                <!-- Specific Page JS goes HERE -->
-                {% block javascripts %}{% endblock javascripts %}
-                </body>
-            </html>
+    </head>
+    <body class="hold-transition {% block body_class %}{% endblock body_class %}">
+        <div class="wrapper">
+            {% include 'includes/navigation.html' %}
+            {% include 'includes/sidebar.html' %}
+            {% block content %}{% endblock content %}
+            {% include 'includes/footer.html' %}
+            <!-- Control Sidebar -->
+            <aside class="control-sidebar control-sidebar-dark">
+                <!-- Control sidebar content goes here -->
+            </aside>
+            <!-- /.control-sidebar -->
+        </div>
+        <!-- ./wrapper -->
+        <!-- Specific Page JS goes HERE -->
+        {% block javascripts %}{% endblock javascripts %}
+    </body>
+</html>
diff --git a/tests/jinja_adminlte/login.html b/tests/jinja_adminlte/login.html
index 19b95c0..e687ce0 100644
--- a/tests/jinja_adminlte/login.html
+++ b/tests/jinja_adminlte/login.html
@@ -53,9 +53,7 @@
                         <div class="col-8">
                             <div class="icheck-primary">
                                 <input type="checkbox" id="remember">
-                                <label for="remember">
-                                    Remember Me
-                                </label>
+                                <label for="remember">Remember Me</label>
                             </div>
                         </div>
                         <!-- /.col -->
diff --git a/tests/jinja_adminlte/mailbox-compose.html b/tests/jinja_adminlte/mailbox-compose.html
index bda77bf..4973275 100644
--- a/tests/jinja_adminlte/mailbox-compose.html
+++ b/tests/jinja_adminlte/mailbox-compose.html
@@ -151,47 +151,47 @@
                                 </div>
                                 <div class="form-group">
                                     <textarea id="compose-textarea" class="form-control" style="height: 300px">
-                                    <h1>
-                                        <u>
-                                        Heading Of Message
-                                        </u>
-                                    </h1>
-                                    <h4>Subheading</h4>
-                                    <p>
-                                        But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain
-                                        was born and I will give you a complete account of the system, and expound the actual teachings
-                                        of the great explorer of the truth, the master-builder of human happiness. No one rejects,
-                                        dislikes, or avoids pleasure itself, because it is pleasure, but because those who do not know
-                                        how to pursue pleasure rationally encounter consequences that are extremely painful. Nor again
-                                        is there anyone who loves or pursues or desires to obtain pain of itself, because it is pain,
-                                        but because occasionally circumstances occur in which toil and pain can procure him some great
-                                        pleasure. To take a trivial example, which of us ever undertakes laborious physical exercise,
-                                        except to obtain some advantage from it? But who has any right to find fault with a man who
-                                        chooses to enjoy a pleasure that has no annoying consequences, or one who avoids a pain that
-                                        produces no resultant pleasure? On the other hand, we denounce with righteous indignation and
-                                        dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so
-                                        blinded by desire, that they cannot foresee
-                                    </p>
-                                    <ul>
-                                        <li>
-                                            List item one
-                                        </li>
-                                        <li>
-                                            List item two
-                                        </li>
-                                        <li>
-                                            List item three
-                                        </li>
-                                        <li>
-                                            List item four
-                                        </li>
-                                    </ul>
-                                    <p>
-                                        Thank you,
-                                    </p>
-                                    <p>
-                                        John Doe
-                                    </p>
+                                        <h1>
+                                            <u>
+                                            Heading Of Message
+                                            </u>
+                                        </h1>
+                                        <h4>Subheading</h4>
+                                        <p>
+                                            But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain
+                                            was born and I will give you a complete account of the system, and expound the actual teachings
+                                            of the great explorer of the truth, the master-builder of human happiness. No one rejects,
+                                            dislikes, or avoids pleasure itself, because it is pleasure, but because those who do not know
+                                            how to pursue pleasure rationally encounter consequences that are extremely painful. Nor again
+                                            is there anyone who loves or pursues or desires to obtain pain of itself, because it is pain,
+                                            but because occasionally circumstances occur in which toil and pain can procure him some great
+                                            pleasure. To take a trivial example, which of us ever undertakes laborious physical exercise,
+                                            except to obtain some advantage from it? But who has any right to find fault with a man who
+                                            chooses to enjoy a pleasure that has no annoying consequences, or one who avoids a pain that
+                                            produces no resultant pleasure? On the other hand, we denounce with righteous indignation and
+                                            dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so
+                                            blinded by desire, that they cannot foresee
+                                        </p>
+                                        <ul>
+                                            <li>
+                                                List item one
+                                            </li>
+                                            <li>
+                                                List item two
+                                            </li>
+                                            <li>
+                                                List item three
+                                            </li>
+                                            <li>
+                                                List item four
+                                            </li>
+                                        </ul>
+                                        <p>
+                                            Thank you,
+                                        </p>
+                                        <p>
+                                            John Doe
+                                        </p>
                                     </textarea>
                                 </div>
                                 <div class="form-group">
diff --git a/tests/jinja_adminlte/mailbox-read-mail.html b/tests/jinja_adminlte/mailbox-read-mail.html
index 74ac910..27eb44f 100644
--- a/tests/jinja_adminlte/mailbox-read-mail.html
+++ b/tests/jinja_adminlte/mailbox-read-mail.html
@@ -274,81 +274,81 @@
                                     <li>
                                         <span class="mailbox-attachment-icon has-img">
                                             <img src="/static/assets/img/photo1.png" alt="Attachment">
-                                            </span>
-                                            <div class="mailbox-attachment-info">
-                                                <a href="#" class="mailbox-attachment-name">
-                                                    <i class="fas fa-camera"></i>
-                                                    photo1.png
+                                        </span>
+                                        <div class="mailbox-attachment-info">
+                                            <a href="#" class="mailbox-attachment-name">
+                                                <i class="fas fa-camera"></i>
+                                                photo1.png
+                                            </a>
+                                            <span class="mailbox-attachment-size clearfix mt-1">
+                                                <span>2.67 MB</span>
+                                                <a href="#" class="btn btn-default btn-sm float-right">
+                                                    <i class="fas fa-cloud-download-alt"></i>
                                                 </a>
-                                                <span class="mailbox-attachment-size clearfix mt-1">
-                                                    <span>2.67 MB</span>
-                                                    <a href="#" class="btn btn-default btn-sm float-right">
-                                                        <i class="fas fa-cloud-download-alt"></i>
-                                                    </a>
-                                                </span>
-                                            </div>
-                                        </li>
-                                        <li>
-                                            <span class="mailbox-attachment-icon has-img">
-                                                <img src="/static/assets/img/photo2.png" alt="Attachment">
-                                                </span>
-                                                <div class="mailbox-attachment-info">
-                                                    <a href="#" class="mailbox-attachment-name">
-                                                        <i class="fas fa-camera"></i>
-                                                        photo2.png
-                                                    </a>
-                                                    <span class="mailbox-attachment-size clearfix mt-1">
-                                                        <span>1.9 MB</span>
-                                                        <a href="#" class="btn btn-default btn-sm float-right">
-                                                            <i class="fas fa-cloud-download-alt"></i>
-                                                        </a>
-                                                    </span>
-                                                </div>
-                                            </li>
-                                        </ul>
-                                    </div>
-                                    <!-- /.card-footer -->
-                                    <div class="card-footer">
-                                        <div class="float-right">
-                                            <button type="button" class="btn btn-default">
-                                                <i class="fas fa-reply"></i>
-                                                Reply
-                                            </button>
-                                            <button type="button" class="btn btn-default">
-                                                <i class="fas fa-share"></i>
-                                                Forward
-                                            </button>
+                                            </span>
                                         </div>
-                                        <button type="button" class="btn btn-default">
-                                            <i class="far fa-trash-alt"></i>
-                                            Delete
-                                        </button>
-                                        <button type="button" class="btn btn-default">
-                                            <i class="fas fa-print"></i>
-                                            Print
-                                        </button>
-                                    </div>
-                                    <!-- /.card-footer -->
-                                </div>
-                                <!-- /.card -->
+                                    </li>
+                                    <li>
+                                        <span class="mailbox-attachment-icon has-img">
+                                            <img src="/static/assets/img/photo2.png" alt="Attachment">
+                                        </span>
+                                        <div class="mailbox-attachment-info">
+                                            <a href="#" class="mailbox-attachment-name">
+                                                <i class="fas fa-camera"></i>
+                                                photo2.png
+                                            </a>
+                                            <span class="mailbox-attachment-size clearfix mt-1">
+                                                <span>1.9 MB</span>
+                                                <a href="#" class="btn btn-default btn-sm float-right">
+                                                    <i class="fas fa-cloud-download-alt"></i>
+                                                </a>
+                                            </span>
+                                        </div>
+                                    </li>
+                                </ul>
                             </div>
-                            <!-- /.col -->
+                            <!-- /.card-footer -->
+                            <div class="card-footer">
+                                <div class="float-right">
+                                    <button type="button" class="btn btn-default">
+                                        <i class="fas fa-reply"></i>
+                                        Reply
+                                    </button>
+                                    <button type="button" class="btn btn-default">
+                                        <i class="fas fa-share"></i>
+                                        Forward
+                                    </button>
+                                </div>
+                                <button type="button" class="btn btn-default">
+                                    <i class="far fa-trash-alt"></i>
+                                    Delete
+                                </button>
+                                <button type="button" class="btn btn-default">
+                                    <i class="fas fa-print"></i>
+                                    Print
+                                </button>
+                            </div>
+                            <!-- /.card-footer -->
                         </div>
-                        <!-- /.row -->
+                        <!-- /.card -->
                     </div>
-                    <!-- /.container-fluid -->
-                </section>
-                <!-- /.content -->
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
             </div>
-        {% endblock content %}
-        <!-- Specific Page JS goes HERE -->
-        {% block javascripts %}
-            <!-- jQuery -->
-            <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-            <!-- Bootstrap 4 -->
-            <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-            <!-- AdminLTE App -->
-            <script src="/static/assets/js/adminlte.min.js"></script>
-            <!-- AdminLTE for demo purposes -->
-            <script src="/static/assets/js/demo.js"></script>
-        {% endblock javascripts %}
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/mailbox.html b/tests/jinja_adminlte/mailbox.html
index 2e815a3..448c469 100644
--- a/tests/jinja_adminlte/mailbox.html
+++ b/tests/jinja_adminlte/mailbox.html
@@ -238,7 +238,9 @@
                                             <td class="mailbox-attachment">
                                                 <i class="fas fa-paperclip"></i>
                                             </td>
-                                            <td class="mailbox-date">28 mins ago</td>
+                                            <td class="mailbox-date">
+                                                28 mins ago
+                                            </td>
                                         </tr>
                                         <tr>
                                             <td>
@@ -253,7 +255,9 @@
                                                 </a>
                                             </td>
                                             <td class="mailbox-name">
-                                                <a href="read-mail.html">Alexander Pierce</a>
+                                                <a href="read-mail.html">
+                                                    Alexander Pierce
+                                                </a>
                                             </td>
                                             <td class="mailbox-subject">
                                                 <b>
diff --git a/tests/jinja_adminlte/tables-data.html b/tests/jinja_adminlte/tables-data.html
index a0d3dbe..d398ebc 100644
--- a/tests/jinja_adminlte/tables-data.html
+++ b/tests/jinja_adminlte/tables-data.html
@@ -2,1035 +2,1066 @@
 {% block title %}Tables Data {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- DataTables -->
-        <link rel="stylesheet" href="/static/assets/plugins/datatables-bs4/css/dataTables.bootstrap4.min.css">
-        <link rel="stylesheet" href="/static/assets/plugins/datatables-responsive/css/responsive.bootstrap4.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>DataTables</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    DataTables
-                                </li>
-                            </ol>
-                        </div>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- DataTables -->
+    <link rel="stylesheet" href="/static/assets/plugins/datatables-bs4/css/dataTables.bootstrap4.min.css">
+    <link rel="stylesheet" href="/static/assets/plugins/datatables-responsive/css/responsive.bootstrap4.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>DataTables</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                DataTables
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-12">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">DataTable with minimal features & hover style</h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <table id="example2" class="table table-bordered table-hover">
-                                        <thead>
-                                            <tr>
-                                                <th>Rendering engine</th>
-                                                <th>Browser</th>
-                                                <th>Platform(s)</th>
-                                                <th>Engine version</th>
-                                                <th>CSS grade</th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            <tr>
-                                                <td>Trident</td>
-                                                <td>
-                                                    Internet
-                                                    Explorer 4.0
-                                                </td>
-                                                <td>Win 95+</td>
-                                                <td>4</td>
-                                                <td>X</td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Trident
-                                                </td>
-                                                <td>
-                                                    Internet
-                                                    Explorer 5.0
-                                                </td>
-                                                <td>
-                                                    Win 95+
-                                                </td>
-                                                <td>
-                                                    5
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Trident
-                                                </td>
-                                                <td>
-                                                    Internet
-                                                    Explorer 5.5
-                                                </td>
-                                                <td>
-                                                    Win 95+
-                                                </td>
-                                                <td>
-                                                    5.5
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Trident
-                                                </td>
-                                                <td>
-                                                    Internet
-                                                    Explorer 6
-                                                </td>
-                                                <td>
-                                                    Win 98+
-                                                </td>
-                                                <td>
-                                                    6
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Trident
-                                                </td>
-                                                <td>
-                                                    Internet Explorer 7
-                                                </td>
-                                                <td>
-                                                    Win XP SP2+
-                                                </td>
-                                                <td>
-                                                    7
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Trident
-                                                </td>
-                                                <td>
-                                                    AOL browser (AOL desktop)
-                                                </td>
-                                                <td>
-                                                    Win XP
-                                                </td>
-                                                <td>
-                                                    6
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Firefox 1.0
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.7
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Firefox 1.5
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Firefox 2.0
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Firefox 3.0
-                                                </td>
-                                                <td>
-                                                    Win 2k+ / OSX.3+
-                                                </td>
-                                                <td>
-                                                    1.9
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Camino 1.0
-                                                </td>
-                                                <td>
-                                                    OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Camino 1.5
-                                                </td>
-                                                <td>
-                                                    OSX.3+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Netscape 7.2
-                                                </td>
-                                                <td>
-                                                    Win 95+ / Mac OS 8.6-9.2
-                                                </td>
-                                                <td>
-                                                    1.7
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Netscape Browser 8
-                                                </td>
-                                                <td>
-                                                    Win 98SE+
-                                                </td>
-                                                <td>
-                                                    1.7
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Netscape Navigator 9
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.0
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.1
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.1
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.2
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.2
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.3
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.3
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.4
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.4
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.5
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.5
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.6
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.6
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.7
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.7
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.8
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Seamonkey 1.1
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Epiphany 2.20
-                                                </td>
-                                                <td>
-                                                    Gnome
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    Safari 1.2
-                                                </td>
-                                                <td>
-                                                    OSX.3
-                                                </td>
-                                                <td>
-                                                    125.5
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    Safari 1.3
-                                                </td>
-                                                <td>
-                                                    OSX.3
-                                                </td>
-                                                <td>
-                                                    312.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    Safari 2.0
-                                                </td>
-                                                <td>
-                                                    OSX.4+
-                                                </td>
-                                                <td>
-                                                    419.3
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    Safari 3.0
-                                                </td>
-                                                <td>
-                                                    OSX.4+
-                                                </td>
-                                                <td>
-                                                    522.1
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    OmniWeb 5.5
-                                                </td>
-                                                <td>
-                                                    OSX.4+
-                                                </td>
-                                                <td>
-                                                    420
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    iPod Touch / iPhone
-                                                </td>
-                                                <td>
-                                                    iPod
-                                                </td>
-                                                <td>
-                                                    420.1
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    S60
-                                                </td>
-                                                <td>
-                                                    S60
-                                                </td>
-                                                <td>
-                                                    413
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 7.0
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 7.5
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 8.0
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 8.5
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 9.0
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.3+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 9.2
-                                                </td>
-                                                <td>
-                                                    Win 88+ / OSX.3+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 9.5
-                                                </td>
-                                                <td>
-                                                    Win 88+ / OSX.3+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera for Wii
-                                                </td>
-                                                <td>
-                                                    Wii
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Nokia N800
-                                                </td>
-                                                <td>
-                                                    N800
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Nintendo DS browser
-                                                </td>
-                                                <td>
-                                                    Nintendo DS
-                                                </td>
-                                                <td>
-                                                    8.5
-                                                </td>
-                                                <td>
-                                                    C/A
-                                                    <sup>
-                                                    1
-                                                    </sup>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    KHTML
-                                                </td>
-                                                <td>
-                                                    Konqureror 3.1
-                                                </td>
-                                                <td>
-                                                    KDE 3.1
-                                                </td>
-                                                <td>
-                                                    3.1
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    KHTML
-                                                </td>
-                                                <td>
-                                                    Konqureror 3.3
-                                                </td>
-                                                <td>
-                                                    KDE 3.3
-                                                </td>
-                                                <td>
-                                                    3.3
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    KHTML
-                                                </td>
-                                                <td>
-                                                    Konqureror 3.5
-                                                </td>
-                                                <td>
-                                                    KDE 3.5
-                                                </td>
-                                                <td>
-                                                    3.5
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Tasman
-                                                </td>
-                                                <td>
-                                                    Internet Explorer 4.5
-                                                </td>
-                                                <td>
-                                                    Mac OS 8-9
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    X
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Tasman
-                                                </td>
-                                                <td>
-                                                    Internet Explorer 5.1
-                                                </td>
-                                                <td>
-                                                    Mac OS 7.6-9
-                                                </td>
-                                                <td>
-                                                    1
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Tasman
-                                                </td>
-                                                <td>
-                                                    Internet Explorer 5.2
-                                                </td>
-                                                <td>
-                                                    Mac OS 8-X
-                                                </td>
-                                                <td>
-                                                    1
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    NetFront 3.1
-                                                </td>
-                                                <td>
-                                                    Embedded devices
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    NetFront 3.4
-                                                </td>
-                                                <td>
-                                                    Embedded devices
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    Dillo 0.8
-                                                </td>
-                                                <td>
-                                                    Embedded devices
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    X
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    Links
-                                                </td>
-                                                <td>
-                                                    Text only
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    X
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    Lynx
-                                                </td>
-                                                <td>
-                                                    Text only
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    X
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    IE Mobile
-                                                </td>
-                                                <td>
-                                                    Windows Mobile 6
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    PSP browser
-                                                </td>
-                                                <td>
-                                                    PSP
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Other browsers
-                                                </td>
-                                                <td>
-                                                    All others
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    U
-                                                </td>
-                                            </tr>
-                                        </tbody>
-                                        <tfoot>
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-12">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">DataTable with minimal features & hover style</h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <table id="example2" class="table table-bordered table-hover">
+                                    <thead>
+                                        <tr>
+                                            <th>Rendering engine</th>
+                                            <th>Browser</th>
+                                            <th>Platform(s)</th>
+                                            <th>Engine version</th>
+                                            <th>CSS grade</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <td>Trident</td>
+                                            <td>
+                                                Internet
+                                                Explorer 4.0
+                                            </td>
+                                            <td>Win 95+</td>
+                                            <td>4</td>
+                                            <td>X</td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Trident
+                                            </td>
+                                            <td>
+                                                Internet
+                                                Explorer 5.0
+                                            </td>
+                                            <td>
+                                                Win 95+
+                                            </td>
+                                            <td>
+                                                5
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Trident
+                                            </td>
+                                            <td>
+                                                Internet
+                                                Explorer 5.5
+                                            </td>
+                                            <td>
+                                                Win 95+
+                                            </td>
+                                            <td>
+                                                5.5
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Trident
+                                            </td>
+                                            <td>
+                                                Internet
+                                                Explorer 6
+                                            </td>
+                                            <td>
+                                                Win 98+
+                                            </td>
+                                            <td>
+                                                6
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Trident
+                                            </td>
+                                            <td>
+                                                Internet Explorer 7
+                                            </td>
+                                            <td>
+                                                Win XP SP2+
+                                            </td>
+                                            <td>
+                                                7
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Trident
+                                            </td>
+                                            <td>
+                                                AOL browser (AOL desktop)
+                                            </td>
+                                            <td>
+                                                Win XP
+                                            </td>
+                                            <td>
+                                                6
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Firefox 1.0
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                1.7
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Firefox 1.5
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Firefox 2.0
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Firefox 3.0
+                                            </td>
+                                            <td>
+                                                Win 2k+ / OSX.3+
+                                            </td>
+                                            <td>
+                                                1.9
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Camino 1.0
+                                            </td>
+                                            <td>
+                                                OSX.2+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Camino 1.5
+                                            </td>
+                                            <td>
+                                                OSX.3+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Netscape 7.2
+                                            </td>
+                                            <td>
+                                                Win 95+ / Mac OS 8.6-9.2
+                                            </td>
+                                            <td>
+                                                1.7
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Netscape Browser 8
+                                            </td>
+                                            <td>
+                                                Win 98SE+
+                                            </td>
+                                            <td>
+                                                1.7
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Netscape Navigator 9
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.0
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.1
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.1
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.2
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.2
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.3
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.3
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.4
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.4
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.5
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.5
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.6
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.6
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.7
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.7
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.8
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Seamonkey 1.1
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Epiphany 2.20
+                                            </td>
+                                            <td>
+                                                Gnome
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                Safari 1.2
+                                            </td>
+                                            <td>
+                                                OSX.3
+                                            </td>
+                                            <td>
+                                                125.5
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                Safari 1.3
+                                            </td>
+                                            <td>
+                                                OSX.3
+                                            </td>
+                                            <td>
+                                                312.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                Safari 2.0
+                                            </td>
+                                            <td>
+                                                OSX.4+
+                                            </td>
+                                            <td>
+                                                419.3
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                Safari 3.0
+                                            </td>
+                                            <td>
+                                                OSX.4+
+                                            </td>
+                                            <td>
+                                                522.1
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                OmniWeb 5.5
+                                            </td>
+                                            <td>
+                                                OSX.4+
+                                            </td>
+                                            <td>
+                                                420
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                iPod Touch / iPhone
+                                            </td>
+                                            <td>
+                                                iPod
+                                            </td>
+                                            <td>
+                                                420.1
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                S60
+                                            </td>
+                                            <td>
+                                                S60
+                                            </td>
+                                            <td>
+                                                413
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 7.0
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 7.5
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 8.0
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 8.5
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 9.0
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.3+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 9.2
+                                            </td>
+                                            <td>
+                                                Win 88+ / OSX.3+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 9.5
+                                            </td>
+                                            <td>
+                                                Win 88+ / OSX.3+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera for Wii
+                                            </td>
+                                            <td>
+                                                Wii
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Nokia N800
+                                            </td>
+                                            <td>
+                                                N800
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Nintendo DS browser
+                                            </td>
+                                            <td>
+                                                Nintendo DS
+                                            </td>
+                                            <td>
+                                                8.5
+                                            </td>
+                                            <td>
+                                                C/A
+                                                <sup>
+                                                1
+                                                </sup>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                KHTML
+                                            </td>
+                                            <td>
+                                                Konqureror 3.1
+                                            </td>
+                                            <td>
+                                                KDE 3.1
+                                            </td>
+                                            <td>
+                                                3.1
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                KHTML
+                                            </td>
+                                            <td>
+                                                Konqureror 3.3
+                                            </td>
+                                            <td>
+                                                KDE 3.3
+                                            </td>
+                                            <td>
+                                                3.3
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                KHTML
+                                            </td>
+                                            <td>
+                                                Konqureror 3.5
+                                            </td>
+                                            <td>
+                                                KDE 3.5
+                                            </td>
+                                            <td>
+                                                3.5
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Tasman
+                                            </td>
+                                            <td>
+                                                Internet Explorer 4.5
+                                            </td>
+                                            <td>
+                                                Mac OS 8-9
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                X
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Tasman
+                                            </td>
+                                            <td>
+                                                Internet Explorer 5.1
+                                            </td>
+                                            <td>
+                                                Mac OS 7.6-9
+                                            </td>
+                                            <td>
+                                                1
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Tasman
+                                            </td>
+                                            <td>
+                                                Internet Explorer 5.2
+                                            </td>
+                                            <td>
+                                                Mac OS 8-X
+                                            </td>
+                                            <td>
+                                                1
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                NetFront 3.1
+                                            </td>
+                                            <td>
+                                                Embedded devices
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                NetFront 3.4
+                                            </td>
+                                            <td>
+                                                Embedded devices
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                Dillo 0.8
+                                            </td>
+                                            <td>
+                                                Embedded devices
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                X
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                Links
+                                            </td>
+                                            <td>
+                                                Text only
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                X
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                Lynx
+                                            </td>
+                                            <td>
+                                                Text only
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                X
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                IE Mobile
+                                            </td>
+                                            <td>
+                                                Windows Mobile 6
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                PSP browser
+                                            </td>
+                                            <td>
+                                                PSP
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Other browsers
+                                            </td>
+                                            <td>
+                                                All others
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                U
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                    <tfoot>
+                                    <tr>
+                                        <th>
+                                            Rendering engine
+                                        </th>
+                                        <th>
+                                            Browser
+                                        </th>
+                                        <th>
+                                            Platform(s)
+                                        </th>
+                                        <th>
+                                            Engine version
+                                        </th>
+                                        <th>
+                                            CSS grade
+                                        </th>
+                                    </tr>
+                                    </tfoot>
+                                </table>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">DataTable with default features</h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <table id="example1" class="table table-bordered table-striped">
+                                    <thead>
                                         <tr>
                                             <th>
                                                 Rendering engine
@@ -1048,1067 +1079,1036 @@
                                                 CSS grade
                                             </th>
                                         </tr>
-                                        </tfoot>
-                                    </table>
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">DataTable with default features</h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <table id="example1" class="table table-bordered table-striped">
-                                        <thead>
-                                            <tr>
-                                                <th>
-                                                    Rendering engine
-                                                </th>
-                                                <th>
-                                                    Browser
-                                                </th>
-                                                <th>
-                                                    Platform(s)
-                                                </th>
-                                                <th>
-                                                    Engine version
-                                                </th>
-                                                <th>
-                                                    CSS grade
-                                                </th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            <tr>
-                                                <td>
-                                                    Trident
-                                                </td>
-                                                <td>
-                                                    Internet
-                                                    Explorer 4.0
-                                                </td>
-                                                <td>
-                                                    Win 95+
-                                                </td>
-                                                <td>
-                                                    4
-                                                </td>
-                                                <td>
-                                                    X
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Trident
-                                                </td>
-                                                <td>
-                                                    Internet
-                                                    Explorer 5.0
-                                                </td>
-                                                <td>
-                                                    Win 95+
-                                                </td>
-                                                <td>
-                                                    5
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Trident
-                                                </td>
-                                                <td>
-                                                    Internet
-                                                    Explorer 5.5
-                                                </td>
-                                                <td>
-                                                    Win 95+
-                                                </td>
-                                                <td>
-                                                    5.5
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Trident
-                                                </td>
-                                                <td>
-                                                    Internet
-                                                    Explorer 6
-                                                </td>
-                                                <td>
-                                                    Win 98+
-                                                </td>
-                                                <td>
-                                                    6
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Trident
-                                                </td>
-                                                <td>
-                                                    Internet Explorer 7
-                                                </td>
-                                                <td>
-                                                    Win XP SP2+
-                                                </td>
-                                                <td>
-                                                    7
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Trident
-                                                </td>
-                                                <td>
-                                                    AOL browser (AOL desktop)
-                                                </td>
-                                                <td>
-                                                    Win XP
-                                                </td>
-                                                <td>
-                                                    6
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Firefox 1.0
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.7
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Firefox 1.5
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Firefox 2.0
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Firefox 3.0
-                                                </td>
-                                                <td>
-                                                    Win 2k+ / OSX.3+
-                                                </td>
-                                                <td>
-                                                    1.9
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Camino 1.0
-                                                </td>
-                                                <td>
-                                                    OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Camino 1.5
-                                                </td>
-                                                <td>
-                                                    OSX.3+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Netscape 7.2
-                                                </td>
-                                                <td>
-                                                    Win 95+ / Mac OS 8.6-9.2
-                                                </td>
-                                                <td>
-                                                    1.7
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Netscape Browser 8
-                                                </td>
-                                                <td>
-                                                    Win 98SE+
-                                                </td>
-                                                <td>
-                                                    1.7
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Netscape Navigator 9
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.0
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.1
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.1
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.2
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.2
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.3
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.3
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.4
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.4
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.5
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.5
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.6
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.6
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.7
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.7
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Mozilla 1.8
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Seamonkey 1.1
-                                                </td>
-                                                <td>
-                                                    Win 98+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Gecko
-                                                </td>
-                                                <td>
-                                                    Epiphany 2.20
-                                                </td>
-                                                <td>
-                                                    Gnome
-                                                </td>
-                                                <td>
-                                                    1.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    Safari 1.2
-                                                </td>
-                                                <td>
-                                                    OSX.3
-                                                </td>
-                                                <td>
-                                                    125.5
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    Safari 1.3
-                                                </td>
-                                                <td>
-                                                    OSX.3
-                                                </td>
-                                                <td>
-                                                    312.8
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    Safari 2.0
-                                                </td>
-                                                <td>
-                                                    OSX.4+
-                                                </td>
-                                                <td>
-                                                    419.3
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    Safari 3.0
-                                                </td>
-                                                <td>
-                                                    OSX.4+
-                                                </td>
-                                                <td>
-                                                    522.1
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    OmniWeb 5.5
-                                                </td>
-                                                <td>
-                                                    OSX.4+
-                                                </td>
-                                                <td>
-                                                    420
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    iPod Touch / iPhone
-                                                </td>
-                                                <td>
-                                                    iPod
-                                                </td>
-                                                <td>
-                                                    420.1
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Webkit
-                                                </td>
-                                                <td>
-                                                    S60
-                                                </td>
-                                                <td>
-                                                    S60
-                                                </td>
-                                                <td>
-                                                    413
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 7.0
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.1+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 7.5
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 8.0
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 8.5
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.2+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 9.0
-                                                </td>
-                                                <td>
-                                                    Win 95+ / OSX.3+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 9.2
-                                                </td>
-                                                <td>
-                                                    Win 88+ / OSX.3+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera 9.5
-                                                </td>
-                                                <td>
-                                                    Win 88+ / OSX.3+
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Opera for Wii
-                                                </td>
-                                                <td>
-                                                    Wii
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Nokia N800
-                                                </td>
-                                                <td>
-                                                    N800
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Presto
-                                                </td>
-                                                <td>
-                                                    Nintendo DS browser
-                                                </td>
-                                                <td>
-                                                    Nintendo DS
-                                                </td>
-                                                <td>
-                                                    8.5
-                                                </td>
-                                                <td>
-                                                    C/A
-                                                    <sup>
-                                                    1
-                                                    </sup>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    KHTML
-                                                </td>
-                                                <td>
-                                                    Konqureror 3.1
-                                                </td>
-                                                <td>
-                                                    KDE 3.1
-                                                </td>
-                                                <td>
-                                                    3.1
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    KHTML
-                                                </td>
-                                                <td>
-                                                    Konqureror 3.3
-                                                </td>
-                                                <td>
-                                                    KDE 3.3
-                                                </td>
-                                                <td>
-                                                    3.3
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    KHTML
-                                                </td>
-                                                <td>
-                                                    Konqureror 3.5
-                                                </td>
-                                                <td>
-                                                    KDE 3.5
-                                                </td>
-                                                <td>
-                                                    3.5
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Tasman
-                                                </td>
-                                                <td>
-                                                    Internet Explorer 4.5
-                                                </td>
-                                                <td>
-                                                    Mac OS 8-9
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    X
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Tasman
-                                                </td>
-                                                <td>
-                                                    Internet Explorer 5.1
-                                                </td>
-                                                <td>
-                                                    Mac OS 7.6-9
-                                                </td>
-                                                <td>
-                                                    1
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Tasman
-                                                </td>
-                                                <td>
-                                                    Internet Explorer 5.2
-                                                </td>
-                                                <td>
-                                                    Mac OS 8-X
-                                                </td>
-                                                <td>
-                                                    1
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    NetFront 3.1
-                                                </td>
-                                                <td>
-                                                    Embedded devices
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    NetFront 3.4
-                                                </td>
-                                                <td>
-                                                    Embedded devices
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    A
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    Dillo 0.8
-                                                </td>
-                                                <td>
-                                                    Embedded devices
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    X
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    Links
-                                                </td>
-                                                <td>
-                                                    Text only
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    X
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    Lynx
-                                                </td>
-                                                <td>
-                                                    Text only
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    X
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    IE Mobile
-                                                </td>
-                                                <td>
-                                                    Windows Mobile 6
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Misc
-                                                </td>
-                                                <td>
-                                                    PSP browser
-                                                </td>
-                                                <td>
-                                                    PSP
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    C
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    Other browsers
-                                                </td>
-                                                <td>
-                                                    All others
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    -
-                                                </td>
-                                                <td>
-                                                    U
-                                                </td>
-                                            </tr>
-                                        </tbody>
-                                        <tfoot>
+                                    </thead>
+                                    <tbody>
                                         <tr>
-                                            <th>
-                                                Rendering engine
-                                            </th>
-                                            <th>
-                                                Browser
-                                            </th>
-                                            <th>
-                                                Platform(s)
-                                            </th>
-                                            <th>
-                                                Engine version
-                                            </th>
-                                            <th>
-                                                CSS grade
-                                            </th>
+                                            <td>
+                                                Trident
+                                            </td>
+                                            <td>
+                                                Internet
+                                                Explorer 4.0
+                                            </td>
+                                            <td>
+                                                Win 95+
+                                            </td>
+                                            <td>
+                                                4
+                                            </td>
+                                            <td>
+                                                X
+                                            </td>
                                         </tr>
-                                        </tfoot>
-                                    </table>
-                                </div>
-                                <!-- /.card-body -->
+                                        <tr>
+                                            <td>
+                                                Trident
+                                            </td>
+                                            <td>
+                                                Internet
+                                                Explorer 5.0
+                                            </td>
+                                            <td>
+                                                Win 95+
+                                            </td>
+                                            <td>
+                                                5
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Trident
+                                            </td>
+                                            <td>
+                                                Internet
+                                                Explorer 5.5
+                                            </td>
+                                            <td>
+                                                Win 95+
+                                            </td>
+                                            <td>
+                                                5.5
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Trident
+                                            </td>
+                                            <td>
+                                                Internet
+                                                Explorer 6
+                                            </td>
+                                            <td>
+                                                Win 98+
+                                            </td>
+                                            <td>
+                                                6
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Trident
+                                            </td>
+                                            <td>
+                                                Internet Explorer 7
+                                            </td>
+                                            <td>
+                                                Win XP SP2+
+                                            </td>
+                                            <td>
+                                                7
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Trident
+                                            </td>
+                                            <td>
+                                                AOL browser (AOL desktop)
+                                            </td>
+                                            <td>
+                                                Win XP
+                                            </td>
+                                            <td>
+                                                6
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Firefox 1.0
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                1.7
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Firefox 1.5
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Firefox 2.0
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Firefox 3.0
+                                            </td>
+                                            <td>
+                                                Win 2k+ / OSX.3+
+                                            </td>
+                                            <td>
+                                                1.9
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Camino 1.0
+                                            </td>
+                                            <td>
+                                                OSX.2+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Camino 1.5
+                                            </td>
+                                            <td>
+                                                OSX.3+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Netscape 7.2
+                                            </td>
+                                            <td>
+                                                Win 95+ / Mac OS 8.6-9.2
+                                            </td>
+                                            <td>
+                                                1.7
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Netscape Browser 8
+                                            </td>
+                                            <td>
+                                                Win 98SE+
+                                            </td>
+                                            <td>
+                                                1.7
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Netscape Navigator 9
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.0
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.1
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.1
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.2
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.2
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.3
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.3
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.4
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.4
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.5
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.5
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.6
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.6
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.7
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.7
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Mozilla 1.8
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Seamonkey 1.1
+                                            </td>
+                                            <td>
+                                                Win 98+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Gecko
+                                            </td>
+                                            <td>
+                                                Epiphany 2.20
+                                            </td>
+                                            <td>
+                                                Gnome
+                                            </td>
+                                            <td>
+                                                1.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                Safari 1.2
+                                            </td>
+                                            <td>
+                                                OSX.3
+                                            </td>
+                                            <td>
+                                                125.5
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                Safari 1.3
+                                            </td>
+                                            <td>
+                                                OSX.3
+                                            </td>
+                                            <td>
+                                                312.8
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                Safari 2.0
+                                            </td>
+                                            <td>
+                                                OSX.4+
+                                            </td>
+                                            <td>
+                                                419.3
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                Safari 3.0
+                                            </td>
+                                            <td>
+                                                OSX.4+
+                                            </td>
+                                            <td>
+                                                522.1
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                OmniWeb 5.5
+                                            </td>
+                                            <td>
+                                                OSX.4+
+                                            </td>
+                                            <td>
+                                                420
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                iPod Touch / iPhone
+                                            </td>
+                                            <td>
+                                                iPod
+                                            </td>
+                                            <td>
+                                                420.1
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Webkit
+                                            </td>
+                                            <td>
+                                                S60
+                                            </td>
+                                            <td>
+                                                S60
+                                            </td>
+                                            <td>
+                                                413
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 7.0
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.1+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 7.5
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 8.0
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 8.5
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.2+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 9.0
+                                            </td>
+                                            <td>
+                                                Win 95+ / OSX.3+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 9.2
+                                            </td>
+                                            <td>
+                                                Win 88+ / OSX.3+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera 9.5
+                                            </td>
+                                            <td>
+                                                Win 88+ / OSX.3+
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Opera for Wii
+                                            </td>
+                                            <td>
+                                                Wii
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Nokia N800
+                                            </td>
+                                            <td>
+                                                N800
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Presto
+                                            </td>
+                                            <td>
+                                                Nintendo DS browser
+                                            </td>
+                                            <td>
+                                                Nintendo DS
+                                            </td>
+                                            <td>
+                                                8.5
+                                            </td>
+                                            <td>
+                                                C/A
+                                                <sup>
+                                                1
+                                                </sup>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                KHTML
+                                            </td>
+                                            <td>
+                                                Konqureror 3.1
+                                            </td>
+                                            <td>
+                                                KDE 3.1
+                                            </td>
+                                            <td>
+                                                3.1
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                KHTML
+                                            </td>
+                                            <td>
+                                                Konqureror 3.3
+                                            </td>
+                                            <td>
+                                                KDE 3.3
+                                            </td>
+                                            <td>
+                                                3.3
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                KHTML
+                                            </td>
+                                            <td>
+                                                Konqureror 3.5
+                                            </td>
+                                            <td>
+                                                KDE 3.5
+                                            </td>
+                                            <td>
+                                                3.5
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Tasman
+                                            </td>
+                                            <td>
+                                                Internet Explorer 4.5
+                                            </td>
+                                            <td>
+                                                Mac OS 8-9
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                X
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Tasman
+                                            </td>
+                                            <td>
+                                                Internet Explorer 5.1
+                                            </td>
+                                            <td>
+                                                Mac OS 7.6-9
+                                            </td>
+                                            <td>
+                                                1
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Tasman
+                                            </td>
+                                            <td>
+                                                Internet Explorer 5.2
+                                            </td>
+                                            <td>
+                                                Mac OS 8-X
+                                            </td>
+                                            <td>
+                                                1
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                NetFront 3.1
+                                            </td>
+                                            <td>
+                                                Embedded devices
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                NetFront 3.4
+                                            </td>
+                                            <td>
+                                                Embedded devices
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                A
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                Dillo 0.8
+                                            </td>
+                                            <td>
+                                                Embedded devices
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                X
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                Links
+                                            </td>
+                                            <td>
+                                                Text only
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                X
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                Lynx
+                                            </td>
+                                            <td>
+                                                Text only
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                X
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                IE Mobile
+                                            </td>
+                                            <td>
+                                                Windows Mobile 6
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Misc
+                                            </td>
+                                            <td>
+                                                PSP browser
+                                            </td>
+                                            <td>
+                                                PSP
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                C
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                Other browsers
+                                            </td>
+                                            <td>
+                                                All others
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                -
+                                            </td>
+                                            <td>
+                                                U
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                    <tfoot>
+                                    <tr>
+                                        <th>
+                                            Rendering engine
+                                        </th>
+                                        <th>
+                                            Browser
+                                        </th>
+                                        <th>
+                                            Platform(s)
+                                        </th>
+                                        <th>
+                                            Engine version
+                                        </th>
+                                        <th>
+                                            CSS grade
+                                        </th>
+                                    </tr>
+                                    </tfoot>
+                                </table>
                             </div>
-                            <!-- /.card -->
+                            <!-- /.card-body -->
                         </div>
-                        <!-- /.col -->
+                        <!-- /.card -->
                     </div>
-                    <!-- /.row -->
+                    <!-- /.col -->
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- /.content -->
-        </div>
-    {% endblock content %}
-    <!-- Specific Page JS goes HERE -->
-    {% block javascripts %}
-        <!-- jQuery -->
-        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-        <!-- Bootstrap 4 -->
-        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-        <!-- DataTables -->
-        <script src="/static/assets/plugins/datatables/jquery.dataTables.min.js"></script>
-        <script src="/static/assets/plugins/datatables-bs4/js/dataTables.bootstrap4.min.js"></script>
-        <script src="/static/assets/plugins/datatables-responsive/js/dataTables.responsive.min.js"></script>
-        <script src="/static/assets/plugins/datatables-responsive/js/responsive.bootstrap4.min.js"></script>
-        <!-- AdminLTE App -->
-        <script src="/static/assets/js/adminlte.min.js"></script>
-        <!-- AdminLTE for demo purposes -->
-        <script src="/static/assets/js/demo.js"></script>
-        <!-- page script -->
-        <script>
+                <!-- /.row -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- DataTables -->
+    <script src="/static/assets/plugins/datatables/jquery.dataTables.min.js"></script>
+    <script src="/static/assets/plugins/datatables-bs4/js/dataTables.bootstrap4.min.js"></script>
+    <script src="/static/assets/plugins/datatables-responsive/js/dataTables.responsive.min.js"></script>
+    <script src="/static/assets/plugins/datatables-responsive/js/responsive.bootstrap4.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+    <!-- page script -->
+    <script>
     $(function () {
       $("#example1").DataTable({
         "responsive": true,
@@ -2124,5 +2124,5 @@
         "responsive": true,
       });
     });
-        </script>
-    {% endblock javascripts %}
+    </script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/tables-jsgrid.html b/tests/jinja_adminlte/tables-jsgrid.html
index b4721e2..696ebdd 100644
--- a/tests/jinja_adminlte/tables-jsgrid.html
+++ b/tests/jinja_adminlte/tables-jsgrid.html
@@ -2,75 +2,75 @@
 {% block title %}Tables JSGrid {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- jsGrid -->
-        <link rel="stylesheet" href="/static/assets/plugins/jsgrid/jsgrid.min.css">
-        <link rel="stylesheet" href="/static/assets/plugins/jsgrid/jsgrid-theme.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>jsGrid</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    jsGrid
-                                </li>
-                            </ol>
-                        </div>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- jsGrid -->
+    <link rel="stylesheet" href="/static/assets/plugins/jsgrid/jsgrid.min.css">
+    <link rel="stylesheet" href="/static/assets/plugins/jsgrid/jsgrid-theme.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>jsGrid</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                jsGrid
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="card">
-                    <div class="card-header">
-                        <h3 class="card-title">jsGrid</h3>
-                    </div>
-                    <!-- /.card-header -->
-                    <div class="card-body">
-                        <div id="jsGrid1"></div>
-                    </div>
-                    <!-- /.card-body -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="card">
+                <div class="card-header">
+                    <h3 class="card-title">jsGrid</h3>
                 </div>
-                <!-- /.card -->
-            </section>
-            <!-- /.content -->
-        </div>
-    {% endblock content %}
-    <!-- Specific Page JS goes HERE -->
-    {% block javascripts %}
-        <!-- jQuery -->
-        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-        <!-- Bootstrap 4 -->
-        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-        <!-- jsGrid -->
-        <script src="/static/assets/plugins/jsgrid/demos/db.js"></script>
-        <script src="/static/assets/plugins/jsgrid/jsgrid.min.js"></script>
-        <!-- AdminLTE App -->
-        <script src="/static/assets/js/adminlte.min.js"></script>
-        <!-- AdminLTE for demo purposes -->
-        <script src="/static/assets/js/demo.js"></script>
-        <!-- page script -->
-        <script>
+                <!-- /.card-header -->
+                <div class="card-body">
+                    <div id="jsGrid1"></div>
+                </div>
+                <!-- /.card-body -->
+            </div>
+            <!-- /.card -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- jsGrid -->
+    <script src="/static/assets/plugins/jsgrid/demos/db.js"></script>
+    <script src="/static/assets/plugins/jsgrid/jsgrid.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+    <!-- page script -->
+    <script>
     $(function () {
       $("#jsGrid1").jsGrid({
           height: "100%",
@@ -90,5 +90,5 @@
           ]
       });
     });
-        </script>
-    {% endblock javascripts %}
+    </script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/tables-simple.html b/tests/jinja_adminlte/tables-simple.html
index 86aa92c..0ddb49f 100644
--- a/tests/jinja_adminlte/tables-simple.html
+++ b/tests/jinja_adminlte/tables-simple.html
@@ -2,123 +2,267 @@
 {% block title %}Tables {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>Simple Tables</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    Simple Tables
-                                </li>
-                            </ol>
-                        </div>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>Simple Tables</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                Simple Tables
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-md-6">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">Bordered Table</h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <table class="table table-bordered">
-                                        <thead>
-                                            <tr>
-                                                <th style="width: 10px">#</th>
-                                                <th>Task</th>
-                                                <th>Progress</th>
-                                                <th style="width: 40px">Label</th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            <tr>
-                                                <td>1.</td>
-                                                <td>Update software</td>
-                                                <td>
-                                                    <div class="progress progress-xs">
-                                                        <div class="progress-bar progress-bar-danger"
-                                                             style="width: 55%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-danger">55%</span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>2.</td>
-                                                <td>Clean database</td>
-                                                <td>
-                                                    <div class="progress progress-xs">
-                                                        <div class="progress-bar bg-warning" style="width: 70%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-warning">70%</span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>3.</td>
-                                                <td>Cron job running</td>
-                                                <td>
-                                                    <div class="progress progress-xs progress-striped active">
-                                                        <div class="progress-bar bg-primary" style="width: 30%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-primary">30%</span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>4.</td>
-                                                <td>
-                                                    Fix and squish bugs
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs progress-striped active">
-                                                        <div class="progress-bar bg-success" style="width: 90%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-success">90%</span>
-                                                </td>
-                                            </tr>
-                                        </tbody>
-                                    </table>
-                                </div>
-                                <!-- /.card-body -->
-                                <div class="card-footer clearfix">
-                                    <ul class="pagination pagination-sm m-0 float-right">
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">Bordered Table</h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <table class="table table-bordered">
+                                    <thead>
+                                        <tr>
+                                            <th style="width: 10px">#</th>
+                                            <th>Task</th>
+                                            <th>Progress</th>
+                                            <th style="width: 40px">Label</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <td>1.</td>
+                                            <td>Update software</td>
+                                            <td>
+                                                <div class="progress progress-xs">
+                                                    <div class="progress-bar progress-bar-danger"
+                                                         style="width: 55%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-danger">55%</span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>2.</td>
+                                            <td>Clean database</td>
+                                            <td>
+                                                <div class="progress progress-xs">
+                                                    <div class="progress-bar bg-warning" style="width: 70%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-warning">70%</span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>3.</td>
+                                            <td>Cron job running</td>
+                                            <td>
+                                                <div class="progress progress-xs progress-striped active">
+                                                    <div class="progress-bar bg-primary" style="width: 30%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-primary">30%</span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>4.</td>
+                                            <td>
+                                                Fix and squish bugs
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs progress-striped active">
+                                                    <div class="progress-bar bg-success" style="width: 90%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-success">90%</span>
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                </table>
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer clearfix">
+                                <ul class="pagination pagination-sm m-0 float-right">
+                                    <li class="page-item">
+                                        <a class="page-link" href="#">&laquo;</a>
+                                    </li>
+                                    <li class="page-item">
+                                        <a class="page-link" href="#">1</a>
+                                    </li>
+                                    <li class="page-item">
+                                        <a class="page-link" href="#">
+                                            2
+                                        </a>
+                                    </li>
+                                    <li class="page-item">
+                                        <a class="page-link" href="#">
+                                            3
+                                        </a>
+                                    </li>
+                                    <li class="page-item">
+                                        <a class="page-link" href="#">
+                                            &raquo;
+                                        </a>
+                                    </li>
+                                </ul>
+                            </div>
+                        </div>
+                        <!-- /.card -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Condensed Full Width Table
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body p-0">
+                                <table class="table table-sm">
+                                    <thead>
+                                        <tr>
+                                            <th style="width: 10px">
+                                                #
+                                            </th>
+                                            <th>
+                                                Task
+                                            </th>
+                                            <th>
+                                                Progress
+                                            </th>
+                                            <th style="width: 40px">
+                                                Label
+                                            </th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <td>
+                                                1.
+                                            </td>
+                                            <td>
+                                                Update software
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs">
+                                                    <div class="progress-bar progress-bar-danger"
+                                                         style="width: 55%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-danger">
+                                                    55%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                2.
+                                            </td>
+                                            <td>
+                                                Clean database
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs">
+                                                    <div class="progress-bar bg-warning" style="width: 70%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-warning">
+                                                    70%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                3.
+                                            </td>
+                                            <td>
+                                                Cron job running
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs progress-striped active">
+                                                    <div class="progress-bar bg-primary" style="width: 30%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-primary">
+                                                    30%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                4.
+                                            </td>
+                                            <td>
+                                                Fix and squish bugs
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs progress-striped active">
+                                                    <div class="progress-bar bg-success" style="width: 90%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-success">
+                                                    90%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                </table>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Simple Full Width Table
+                                </h3>
+                                <div class="card-tools">
+                                    <ul class="pagination pagination-sm float-right">
                                         <li class="page-item">
-                                            <a class="page-link" href="#">&laquo;</a>
+                                            <a class="page-link" href="#">
+                                                &laquo;
+                                            </a>
                                         </li>
                                         <li class="page-item">
-                                            <a class="page-link" href="#">1</a>
+                                            <a class="page-link" href="#">
+                                                1
+                                            </a>
                                         </li>
                                         <li class="page-item">
                                             <a class="page-link" href="#">
@@ -138,938 +282,794 @@
                                     </ul>
                                 </div>
                             </div>
-                            <!-- /.card -->
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Condensed Full Width Table
-                                    </h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body p-0">
-                                    <table class="table table-sm">
-                                        <thead>
-                                            <tr>
-                                                <th style="width: 10px">
-                                                    #
-                                                </th>
-                                                <th>
-                                                    Task
-                                                </th>
-                                                <th>
-                                                    Progress
-                                                </th>
-                                                <th style="width: 40px">
-                                                    Label
-                                                </th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            <tr>
-                                                <td>
-                                                    1.
-                                                </td>
-                                                <td>
-                                                    Update software
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs">
-                                                        <div class="progress-bar progress-bar-danger"
-                                                             style="width: 55%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-danger">
-                                                        55%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    2.
-                                                </td>
-                                                <td>
-                                                    Clean database
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs">
-                                                        <div class="progress-bar bg-warning" style="width: 70%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-warning">
-                                                        70%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    3.
-                                                </td>
-                                                <td>
-                                                    Cron job running
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs progress-striped active">
-                                                        <div class="progress-bar bg-primary" style="width: 30%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-primary">
-                                                        30%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    4.
-                                                </td>
-                                                <td>
-                                                    Fix and squish bugs
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs progress-striped active">
-                                                        <div class="progress-bar bg-success" style="width: 90%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-success">
-                                                        90%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                        </tbody>
-                                    </table>
-                                </div>
-                                <!-- /.card-body -->
+                            <!-- /.card-header -->
+                            <div class="card-body p-0">
+                                <table class="table">
+                                    <thead>
+                                        <tr>
+                                            <th style="width: 10px">
+                                                #
+                                            </th>
+                                            <th>
+                                                Task
+                                            </th>
+                                            <th>
+                                                Progress
+                                            </th>
+                                            <th style="width: 40px">
+                                                Label
+                                            </th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <td>
+                                                1.
+                                            </td>
+                                            <td>
+                                                Update software
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs">
+                                                    <div class="progress-bar progress-bar-danger"
+                                                         style="width: 55%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-danger">
+                                                    55%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                2.
+                                            </td>
+                                            <td>
+                                                Clean database
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs">
+                                                    <div class="progress-bar bg-warning" style="width: 70%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-warning">
+                                                    70%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                3.
+                                            </td>
+                                            <td>
+                                                Cron job running
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs progress-striped active">
+                                                    <div class="progress-bar bg-primary" style="width: 30%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-primary">
+                                                    30%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                4.
+                                            </td>
+                                            <td>
+                                                Fix and squish bugs
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs progress-striped active">
+                                                    <div class="progress-bar bg-success" style="width: 90%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-success">
+                                                    90%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                </table>
                             </div>
-                            <!-- /.card -->
+                            <!-- /.card-body -->
                         </div>
-                        <!-- /.col -->
-                        <div class="col-md-6">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Simple Full Width Table
-                                    </h3>
-                                    <div class="card-tools">
-                                        <ul class="pagination pagination-sm float-right">
-                                            <li class="page-item">
-                                                <a class="page-link" href="#">
-                                                    &laquo;
-                                                </a>
-                                            </li>
-                                            <li class="page-item">
-                                                <a class="page-link" href="#">
-                                                    1
-                                                </a>
-                                            </li>
-                                            <li class="page-item">
-                                                <a class="page-link" href="#">
-                                                    2
-                                                </a>
-                                            </li>
-                                            <li class="page-item">
-                                                <a class="page-link" href="#">
-                                                    3
-                                                </a>
-                                            </li>
-                                            <li class="page-item">
-                                                <a class="page-link" href="#">
-                                                    &raquo;
-                                                </a>
-                                            </li>
-                                        </ul>
-                                    </div>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body p-0">
-                                    <table class="table">
-                                        <thead>
-                                            <tr>
-                                                <th style="width: 10px">
-                                                    #
-                                                </th>
-                                                <th>
-                                                    Task
-                                                </th>
-                                                <th>
-                                                    Progress
-                                                </th>
-                                                <th style="width: 40px">
-                                                    Label
-                                                </th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            <tr>
-                                                <td>
-                                                    1.
-                                                </td>
-                                                <td>
-                                                    Update software
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs">
-                                                        <div class="progress-bar progress-bar-danger"
-                                                             style="width: 55%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-danger">
-                                                        55%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    2.
-                                                </td>
-                                                <td>
-                                                    Clean database
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs">
-                                                        <div class="progress-bar bg-warning" style="width: 70%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-warning">
-                                                        70%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    3.
-                                                </td>
-                                                <td>
-                                                    Cron job running
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs progress-striped active">
-                                                        <div class="progress-bar bg-primary" style="width: 30%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-primary">
-                                                        30%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    4.
-                                                </td>
-                                                <td>
-                                                    Fix and squish bugs
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs progress-striped active">
-                                                        <div class="progress-bar bg-success" style="width: 90%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-success">
-                                                        90%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                        </tbody>
-                                    </table>
-                                </div>
-                                <!-- /.card-body -->
+                        <!-- /.card -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Striped Full Width Table
+                                </h3>
                             </div>
-                            <!-- /.card -->
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Striped Full Width Table
-                                    </h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body p-0">
-                                    <table class="table table-striped">
-                                        <thead>
-                                            <tr>
-                                                <th style="width: 10px">
-                                                    #
-                                                </th>
-                                                <th>
-                                                    Task
-                                                </th>
-                                                <th>
-                                                    Progress
-                                                </th>
-                                                <th style="width: 40px">
-                                                    Label
-                                                </th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            <tr>
-                                                <td>
-                                                    1.
-                                                </td>
-                                                <td>
-                                                    Update software
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs">
-                                                        <div class="progress-bar progress-bar-danger"
-                                                             style="width: 55%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-danger">
-                                                        55%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    2.
-                                                </td>
-                                                <td>
-                                                    Clean database
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs">
-                                                        <div class="progress-bar bg-warning" style="width: 70%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-warning">
-                                                        70%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    3.
-                                                </td>
-                                                <td>
-                                                    Cron job running
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs progress-striped active">
-                                                        <div class="progress-bar bg-primary" style="width: 30%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-primary">
-                                                        30%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    4.
-                                                </td>
-                                                <td>
-                                                    Fix and squish bugs
-                                                </td>
-                                                <td>
-                                                    <div class="progress progress-xs progress-striped active">
-                                                        <div class="progress-bar bg-success" style="width: 90%"></div>
-                                                    </div>
-                                                </td>
-                                                <td>
-                                                    <span class="badge bg-success">
-                                                        90%
-                                                    </span>
-                                                </td>
-                                            </tr>
-                                        </tbody>
-                                    </table>
-                                </div>
-                                <!-- /.card-body -->
+                            <!-- /.card-header -->
+                            <div class="card-body p-0">
+                                <table class="table table-striped">
+                                    <thead>
+                                        <tr>
+                                            <th style="width: 10px">
+                                                #
+                                            </th>
+                                            <th>
+                                                Task
+                                            </th>
+                                            <th>
+                                                Progress
+                                            </th>
+                                            <th style="width: 40px">
+                                                Label
+                                            </th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <td>
+                                                1.
+                                            </td>
+                                            <td>
+                                                Update software
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs">
+                                                    <div class="progress-bar progress-bar-danger"
+                                                         style="width: 55%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-danger">
+                                                    55%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                2.
+                                            </td>
+                                            <td>
+                                                Clean database
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs">
+                                                    <div class="progress-bar bg-warning" style="width: 70%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-warning">
+                                                    70%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                3.
+                                            </td>
+                                            <td>
+                                                Cron job running
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs progress-striped active">
+                                                    <div class="progress-bar bg-primary" style="width: 30%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-primary">
+                                                    30%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                4.
+                                            </td>
+                                            <td>
+                                                Fix and squish bugs
+                                            </td>
+                                            <td>
+                                                <div class="progress progress-xs progress-striped active">
+                                                    <div class="progress-bar bg-success" style="width: 90%"></div>
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <span class="badge bg-success">
+                                                    90%
+                                                </span>
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                </table>
                             </div>
-                            <!-- /.card -->
+                            <!-- /.card-body -->
                         </div>
-                        <!-- /.col -->
+                        <!-- /.card -->
                     </div>
-                    <!-- /.row -->
-                    <div class="row">
-                        <div class="col-12">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Responsive Hover Table
-                                    </h3>
-                                    <div class="card-tools">
-                                        <div class="input-group input-group-sm" style="width: 150px;">
-                                            <input type="text"
-                                                   name="table_search"
-                                                   class="form-control float-right"
-                                                   placeholder="Search">
-                                            <div class="input-group-append">
-                                                <button type="submit" class="btn btn-default">
-                                                    <i class="fas fa-search"></i>
-                                                </button>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body table-responsive p-0">
-                                    <table class="table table-hover text-nowrap">
-                                        <thead>
-                                            <tr>
-                                                <th>
-                                                    ID
-                                                </th>
-                                                <th>
-                                                    User
-                                                </th>
-                                                <th>
-                                                    Date
-                                                </th>
-                                                <th>
-                                                    Status
-                                                </th>
-                                                <th>
-                                                    Reason
-                                                </th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            <tr>
-                                                <td>
-                                                    183
-                                                </td>
-                                                <td>
-                                                    John Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-success">
-                                                        Approved
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    219
-                                                </td>
-                                                <td>
-                                                    Alexander Pierce
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-warning">
-                                                        Pending
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    657
-                                                </td>
-                                                <td>
-                                                    Bob Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-primary">
-                                                        Approved
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    175
-                                                </td>
-                                                <td>
-                                                    Mike Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-danger">
-                                                        Denied
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                        </tbody>
-                                    </table>
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                    </div>
-                    <!-- /.row -->
-                    <div class="row">
-                        <div class="col-12">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Fixed Header Table
-                                    </h3>
-                                    <div class="card-tools">
-                                        <div class="input-group input-group-sm" style="width: 150px;">
-                                            <input type="text"
-                                                   name="table_search"
-                                                   class="form-control float-right"
-                                                   placeholder="Search">
-                                            <div class="input-group-append">
-                                                <button type="submit" class="btn btn-default">
-                                                    <i class="fas fa-search"></i>
-                                                </button>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body table-responsive p-0" style="height: 300px;">
-                                    <table class="table table-head-fixed text-nowrap">
-                                        <thead>
-                                            <tr>
-                                                <th>
-                                                    ID
-                                                </th>
-                                                <th>
-                                                    User
-                                                </th>
-                                                <th>
-                                                    Date
-                                                </th>
-                                                <th>
-                                                    Status
-                                                </th>
-                                                <th>
-                                                    Reason
-                                                </th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            <tr>
-                                                <td>
-                                                    183
-                                                </td>
-                                                <td>
-                                                    John Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-success">
-                                                        Approved
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    219
-                                                </td>
-                                                <td>
-                                                    Alexander Pierce
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-warning">
-                                                        Pending
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    657
-                                                </td>
-                                                <td>
-                                                    Bob Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-primary">
-                                                        Approved
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    175
-                                                </td>
-                                                <td>
-                                                    Mike Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-danger">
-                                                        Denied
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    134
-                                                </td>
-                                                <td>
-                                                    Jim Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-success">
-                                                        Approved
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    494
-                                                </td>
-                                                <td>
-                                                    Victoria Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-warning">
-                                                        Pending
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    832
-                                                </td>
-                                                <td>
-                                                    Michael Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-primary">
-                                                        Approved
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    982
-                                                </td>
-                                                <td>
-                                                    Rocky Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    <span class="tag tag-danger">
-                                                        Denied
-                                                    </span>
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                        </tbody>
-                                    </table>
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                    </div>
-                    <!-- /.row -->
-                    <div class="row">
-                        <div class="col-12">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Expandable Table
-                                    </h3>
-                                </div>
-                                <!-- ./card-header -->
-                                <div class="card-body">
-                                    <table class="table table-bordered table-hover">
-                                        <thead>
-                                            <tr>
-                                                <th>
-                                                    #
-                                                </th>
-                                                <th>
-                                                    User
-                                                </th>
-                                                <th>
-                                                    Date
-                                                </th>
-                                                <th>
-                                                    Status
-                                                </th>
-                                                <th>
-                                                    Reason
-                                                </th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            <tr data-widget="expandable-table" aria-expanded="false">
-                                                <td>
-                                                    183
-                                                </td>
-                                                <td>
-                                                    John Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    Approved
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr class="expandable-body">
-                                                <td colspan="5">
-                                                    <p>
-                                                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
-                                                    </p>
-                                                </td>
-                                            </tr>
-                                            <tr data-widget="expandable-table" aria-expanded="true">
-                                                <td>
-                                                    219
-                                                </td>
-                                                <td>
-                                                    Alexander Pierce
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    Pending
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr class="expandable-body">
-                                                <td colspan="5">
-                                                    <p>
-                                                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
-                                                    </p>
-                                                </td>
-                                            </tr>
-                                            <tr data-widget="expandable-table" aria-expanded="true">
-                                                <td>
-                                                    657
-                                                </td>
-                                                <td>
-                                                    Alexander Pierce
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    Approved
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr class="expandable-body">
-                                                <td colspan="5">
-                                                    <p>
-                                                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
-                                                    </p>
-                                                </td>
-                                            </tr>
-                                            <tr data-widget="expandable-table" aria-expanded="false">
-                                                <td>
-                                                    175
-                                                </td>
-                                                <td>
-                                                    Mike Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    Denied
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr class="expandable-body">
-                                                <td colspan="5">
-                                                    <p>
-                                                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
-                                                    </p>
-                                                </td>
-                                            </tr>
-                                            <tr data-widget="expandable-table" aria-expanded="false">
-                                                <td>
-                                                    134
-                                                </td>
-                                                <td>
-                                                    Jim Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    Approved
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr class="expandable-body">
-                                                <td colspan="5">
-                                                    <p>
-                                                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
-                                                    </p>
-                                                </td>
-                                            </tr>
-                                            <tr data-widget="expandable-table" aria-expanded="false">
-                                                <td>
-                                                    494
-                                                </td>
-                                                <td>
-                                                    Victoria Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    Pending
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr class="expandable-body">
-                                                <td colspan="5">
-                                                    <p>
-                                                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
-                                                    </p>
-                                                </td>
-                                            </tr>
-                                            <tr data-widget="expandable-table" aria-expanded="false">
-                                                <td>
-                                                    832
-                                                </td>
-                                                <td>
-                                                    Michael Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    Approved
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr class="expandable-body">
-                                                <td colspan="5">
-                                                    <p>
-                                                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
-                                                    </p>
-                                                </td>
-                                            </tr>
-                                            <tr data-widget="expandable-table" aria-expanded="false">
-                                                <td>
-                                                    982
-                                                </td>
-                                                <td>
-                                                    Rocky Doe
-                                                </td>
-                                                <td>
-                                                    11-7-2014
-                                                </td>
-                                                <td>
-                                                    Denied
-                                                </td>
-                                                <td>
-                                                    Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
-                                                </td>
-                                            </tr>
-                                            <tr class="expandable-body">
-                                                <td colspan="5">
-                                                    <p>
-                                                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
-                                                    </p>
-                                                </td>
-                                            </tr>
-                                        </tbody>
-                                    </table>
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                    </div>
-                    <!-- -->
+                    <!-- /.col -->
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- /.content -->
-        </div>
-    {% endblock content %}
-    <!-- Specific Page JS goes HERE -->
-    {% block javascripts %}
-        <!-- jQuery -->
-        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-        <!-- Bootstrap 4 -->
-        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-        <!-- AdminLTE App -->
-        <script src="/static/assets/js/adminlte.min.js"></script>
-        <!-- AdminLTE for demo purposes -->
-        <script src="/static/assets/js/demo.js"></script>
-    {% endblock javascripts %}
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-12">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Responsive Hover Table
+                                </h3>
+                                <div class="card-tools">
+                                    <div class="input-group input-group-sm" style="width: 150px;">
+                                        <input type="text"
+                                               name="table_search"
+                                               class="form-control float-right"
+                                               placeholder="Search">
+                                        <div class="input-group-append">
+                                            <button type="submit" class="btn btn-default">
+                                                <i class="fas fa-search"></i>
+                                            </button>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body table-responsive p-0">
+                                <table class="table table-hover text-nowrap">
+                                    <thead>
+                                        <tr>
+                                            <th>
+                                                ID
+                                            </th>
+                                            <th>
+                                                User
+                                            </th>
+                                            <th>
+                                                Date
+                                            </th>
+                                            <th>
+                                                Status
+                                            </th>
+                                            <th>
+                                                Reason
+                                            </th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <td>
+                                                183
+                                            </td>
+                                            <td>
+                                                John Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-success">
+                                                    Approved
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                219
+                                            </td>
+                                            <td>
+                                                Alexander Pierce
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-warning">
+                                                    Pending
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                657
+                                            </td>
+                                            <td>
+                                                Bob Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-primary">
+                                                    Approved
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                175
+                                            </td>
+                                            <td>
+                                                Mike Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-danger">
+                                                    Denied
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                </table>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                </div>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-12">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Fixed Header Table
+                                </h3>
+                                <div class="card-tools">
+                                    <div class="input-group input-group-sm" style="width: 150px;">
+                                        <input type="text"
+                                               name="table_search"
+                                               class="form-control float-right"
+                                               placeholder="Search">
+                                        <div class="input-group-append">
+                                            <button type="submit" class="btn btn-default">
+                                                <i class="fas fa-search"></i>
+                                            </button>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body table-responsive p-0" style="height: 300px;">
+                                <table class="table table-head-fixed text-nowrap">
+                                    <thead>
+                                        <tr>
+                                            <th>
+                                                ID
+                                            </th>
+                                            <th>
+                                                User
+                                            </th>
+                                            <th>
+                                                Date
+                                            </th>
+                                            <th>
+                                                Status
+                                            </th>
+                                            <th>
+                                                Reason
+                                            </th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <td>
+                                                183
+                                            </td>
+                                            <td>
+                                                John Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-success">
+                                                    Approved
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                219
+                                            </td>
+                                            <td>
+                                                Alexander Pierce
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-warning">
+                                                    Pending
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                657
+                                            </td>
+                                            <td>
+                                                Bob Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-primary">
+                                                    Approved
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                175
+                                            </td>
+                                            <td>
+                                                Mike Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-danger">
+                                                    Denied
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                134
+                                            </td>
+                                            <td>
+                                                Jim Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-success">
+                                                    Approved
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                494
+                                            </td>
+                                            <td>
+                                                Victoria Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-warning">
+                                                    Pending
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                832
+                                            </td>
+                                            <td>
+                                                Michael Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-primary">
+                                                    Approved
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td>
+                                                982
+                                            </td>
+                                            <td>
+                                                Rocky Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                <span class="tag tag-danger">
+                                                    Denied
+                                                </span>
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                </table>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                </div>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-12">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Expandable Table
+                                </h3>
+                            </div>
+                            <!-- ./card-header -->
+                            <div class="card-body">
+                                <table class="table table-bordered table-hover">
+                                    <thead>
+                                        <tr>
+                                            <th>
+                                                #
+                                            </th>
+                                            <th>
+                                                User
+                                            </th>
+                                            <th>
+                                                Date
+                                            </th>
+                                            <th>
+                                                Status
+                                            </th>
+                                            <th>
+                                                Reason
+                                            </th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr data-widget="expandable-table" aria-expanded="false">
+                                            <td>
+                                                183
+                                            </td>
+                                            <td>
+                                                John Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                Approved
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr class="expandable-body">
+                                            <td colspan="5">
+                                                <p>
+                                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
+                                                </p>
+                                            </td>
+                                        </tr>
+                                        <tr data-widget="expandable-table" aria-expanded="true">
+                                            <td>
+                                                219
+                                            </td>
+                                            <td>
+                                                Alexander Pierce
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                Pending
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr class="expandable-body">
+                                            <td colspan="5">
+                                                <p>
+                                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
+                                                </p>
+                                            </td>
+                                        </tr>
+                                        <tr data-widget="expandable-table" aria-expanded="true">
+                                            <td>
+                                                657
+                                            </td>
+                                            <td>
+                                                Alexander Pierce
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                Approved
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr class="expandable-body">
+                                            <td colspan="5">
+                                                <p>
+                                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
+                                                </p>
+                                            </td>
+                                        </tr>
+                                        <tr data-widget="expandable-table" aria-expanded="false">
+                                            <td>
+                                                175
+                                            </td>
+                                            <td>
+                                                Mike Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                Denied
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr class="expandable-body">
+                                            <td colspan="5">
+                                                <p>
+                                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
+                                                </p>
+                                            </td>
+                                        </tr>
+                                        <tr data-widget="expandable-table" aria-expanded="false">
+                                            <td>
+                                                134
+                                            </td>
+                                            <td>
+                                                Jim Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                Approved
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr class="expandable-body">
+                                            <td colspan="5">
+                                                <p>
+                                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
+                                                </p>
+                                            </td>
+                                        </tr>
+                                        <tr data-widget="expandable-table" aria-expanded="false">
+                                            <td>
+                                                494
+                                            </td>
+                                            <td>
+                                                Victoria Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                Pending
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr class="expandable-body">
+                                            <td colspan="5">
+                                                <p>
+                                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
+                                                </p>
+                                            </td>
+                                        </tr>
+                                        <tr data-widget="expandable-table" aria-expanded="false">
+                                            <td>
+                                                832
+                                            </td>
+                                            <td>
+                                                Michael Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                Approved
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr class="expandable-body">
+                                            <td colspan="5">
+                                                <p>
+                                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
+                                                </p>
+                                            </td>
+                                        </tr>
+                                        <tr data-widget="expandable-table" aria-expanded="false">
+                                            <td>
+                                                982
+                                            </td>
+                                            <td>
+                                                Rocky Doe
+                                            </td>
+                                            <td>
+                                                11-7-2014
+                                            </td>
+                                            <td>
+                                                Denied
+                                            </td>
+                                            <td>
+                                                Bacon ipsum dolor sit amet salami venison chicken flank fatback doner.
+                                            </td>
+                                        </tr>
+                                        <tr class="expandable-body">
+                                            <td colspan="5">
+                                                <p>
+                                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
+                                                </p>
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                </table>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                </div>
+                <!-- -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/ui-buttons.html b/tests/jinja_adminlte/ui-buttons.html
index 25a4846..b6a408d 100644
--- a/tests/jinja_adminlte/ui-buttons.html
+++ b/tests/jinja_adminlte/ui-buttons.html
@@ -2,2255 +2,2221 @@
 {% block title %}Ui Buttons {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>Buttons</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>Buttons</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                Buttons
+                            </li>
+                        </ol>
+                    </div>
+                </div>
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-md-12">
+                        <div class="card card-primary card-outline">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-edit"></i>
                                     Buttons
-                                </li>
-                            </ol>
+                                </h3>
+                            </div>
+                            <div class="card-body pad table-responsive">
+                                <p>
+                                    Various types of buttons. Using the base class
+                                    <code>
+                                    .btn
+                                    </code>
+                                </p>
+                                <table class="table table-bordered text-center">
+                                    <tr>
+                                        <th>Normal</th>
+                                        <th>
+                                            Large
+                                            <code>
+                                            .btn-lg
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Small
+                                            <code>
+                                            .btn-sm
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Extra Small
+                                            <code>
+                                            .btn-xs
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Flat
+                                            <code>
+                                            .btn-flat
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Disabled
+                                            <code>
+                                            .disabled
+                                            </code>
+                                        </th>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-default">
+                                                Default
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-default btn-lg">
+                                                Default
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-default btn-sm">
+                                                Default
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-default btn-xs">
+                                                Default
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-default btn-flat">
+                                                Default
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-default disabled">
+                                                Default
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-primary">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-primary btn-lg">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-primary btn-sm">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-primary btn-xs">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-primary btn-flat">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-primary disabled">
+                                                Primary
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-secondary">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-secondary btn-lg">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-secondary btn-sm">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-secondary btn-xs">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-secondary btn-flat">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-secondary disabled">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-success">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-success btn-lg">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-success btn-sm">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-success btn-xs">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-success btn-flat">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-success disabled">
+                                                Success
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-info">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-info btn-lg">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-info btn-sm">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-info btn-xs">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-info btn-flat">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-info disabled">
+                                                Info
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-danger">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-danger btn-lg">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-danger btn-sm">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-danger btn-xs">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-danger btn-flat">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-danger disabled">
+                                                Danger
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-warning">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-warning btn-lg">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-warning btn-sm">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-warning btn-xs">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-warning btn-flat">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-warning disabled">
+                                                Warning
+                                            </button>
+                                        </td>
+                                    </tr>
+                                </table>
+                            </div>
+                            <!-- /.card -->
                         </div>
                     </div>
+                    <!-- /.col -->
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-md-12">
-                            <div class="card card-primary card-outline">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        <i class="fas fa-edit"></i>
-                                        Buttons
-                                    </h3>
-                                </div>
-                                <div class="card-body pad table-responsive">
-                                    <p>
-                                        Various types of buttons. Using the base class
-                                        <code>
-                                        .btn
-                                        </code>
-                                    </p>
-                                    <table class="table table-bordered text-center">
-                                        <tr>
-                                            <th>Normal</th>
-                                            <th>
-                                                Large
-                                                <code>
-                                                .btn-lg
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Small
-                                                <code>
-                                                .btn-sm
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Extra Small
-                                                <code>
-                                                .btn-xs
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Flat
-                                                <code>
-                                                .btn-flat
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Disabled
-                                                <code>
-                                                .disabled
-                                                </code>
-                                            </th>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-default">
-                                                    Default
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-default btn-lg">
-                                                    Default
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-default btn-sm">
-                                                    Default
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-default btn-xs">
-                                                    Default
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-default btn-flat">
-                                                    Default
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-default disabled">
-                                                    Default
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-primary">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-primary btn-lg">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-primary btn-sm">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-primary btn-xs">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-primary btn-flat">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-primary disabled">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-secondary">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-secondary btn-lg">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-secondary btn-sm">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-secondary btn-xs">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-secondary btn-flat">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-secondary disabled">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-success">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-success btn-lg">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-success btn-sm">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-success btn-xs">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-success btn-flat">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-success disabled">
-                                                    Success
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-info">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-info btn-lg">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-info btn-sm">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-info btn-xs">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-info btn-flat">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-info disabled">
-                                                    Info
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-danger">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-danger btn-lg">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-danger btn-sm">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-danger btn-xs">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-danger btn-flat">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-danger disabled">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-warning">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-warning btn-lg">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-warning btn-sm">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-warning btn-xs">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-warning btn-flat">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-warning disabled">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                        </tr>
-                                    </table>
-                                </div>
-                                <!-- /.card -->
+                <!-- ./row -->
+                <div class="row">
+                    <div class="col-md-12">
+                        <div class="card card-primary card-outline">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-edit"></i>
+                                    Outline Buttons
+                                </h3>
                             </div>
+                            <div class="card-body pad table-responsive">
+                                <p>
+                                    Various types of buttons. Using the base class
+                                    <code>
+                                    .btn
+                                    </code>
+                                </p>
+                                <table class="table table-bordered text-center">
+                                    <tr>
+                                        <th>Normal</th>
+                                        <th>
+                                            Large
+                                            <code>
+                                            .btn-lg
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Small
+                                            <code>
+                                            .btn-sm
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Extra Small
+                                            <code>
+                                            .btn-xs
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Flat
+                                            <code>
+                                            .btn-flat
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Disabled
+                                            <code>
+                                            .disabled
+                                            </code>
+                                        </th>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-primary">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-primary btn-lg">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-primary btn-sm">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-primary btn-xs">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-primary btn-flat">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-primary disabled">
+                                                Primary
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-secondary">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-secondary btn-lg">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-secondary btn-sm">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-secondary btn-xs">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-secondary btn-flat">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-secondary disabled">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-success">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-success btn-lg">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-success btn-sm">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-success btn-xs">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-success btn-flat">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-success disabled">
+                                                Success
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-info">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-info btn-lg">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-info btn-sm">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-info btn-xs">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-info btn-flat">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-info disabled">
+                                                Info
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-danger">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-danger btn-lg">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-danger btn-sm">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-danger btn-xs">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-danger btn-flat">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-danger disabled">
+                                                Danger
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-warning">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-warning btn-lg">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-warning btn-sm">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-warning btn-xs">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-warning btn-flat">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block btn-outline-warning disabled">
+                                                Warning
+                                            </button>
+                                        </td>
+                                    </tr>
+                                </table>
+                            </div>
+                            <!-- /.card -->
                         </div>
-                        <!-- /.col -->
                     </div>
-                    <!-- ./row -->
-                    <div class="row">
-                        <div class="col-md-12">
-                            <div class="card card-primary card-outline">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        <i class="fas fa-edit"></i>
-                                        Outline Buttons
-                                    </h3>
-                                </div>
-                                <div class="card-body pad table-responsive">
-                                    <p>
-                                        Various types of buttons. Using the base class
-                                        <code>
-                                        .btn
-                                        </code>
-                                    </p>
-                                    <table class="table table-bordered text-center">
-                                        <tr>
-                                            <th>Normal</th>
-                                            <th>
-                                                Large
-                                                <code>
-                                                .btn-lg
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Small
-                                                <code>
-                                                .btn-sm
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Extra Small
-                                                <code>
-                                                .btn-xs
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Flat
-                                                <code>
-                                                .btn-flat
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Disabled
-                                                <code>
-                                                .disabled
-                                                </code>
-                                            </th>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-primary">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-primary btn-lg">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-primary btn-sm">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-primary btn-xs">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-primary btn-flat">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-primary disabled">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-secondary">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-secondary btn-lg">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-secondary btn-sm">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-secondary btn-xs">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-secondary btn-flat">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-secondary disabled">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-success">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-success btn-lg">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-success btn-sm">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-success btn-xs">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-success btn-flat">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-success disabled">
-                                                    Success
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-info">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-info btn-lg">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-info btn-sm">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-info btn-xs">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-info btn-flat">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-info disabled">
-                                                    Info
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-danger">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-danger btn-lg">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-danger btn-sm">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-danger btn-xs">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-danger btn-flat">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-danger disabled">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-warning">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-warning btn-lg">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-warning btn-sm">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block btn-outline-warning btn-xs">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-warning btn-flat">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block btn-outline-warning disabled">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                        </tr>
-                                    </table>
-                                </div>
-                                <!-- /.card -->
-                            </div>
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- ./row -->
-                    <div class="row">
-                        <div class="col-md-12">
-                            <div class="card card-primary card-outline">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        <i class="fas fa-edit"></i>
-                                        Gradient Buttons (bg-gradient-*)
-                                    </h3>
-                                </div>
-                                <div class="card-body pad table-responsive">
-                                    <p>
-                                        Various types of buttons. Using the base class
-                                        <code>
-                                        .btn
-                                        </code>
-                                    </p>
-                                    <table class="table table-bordered text-center">
-                                        <tr>
-                                            <th>Normal</th>
-                                            <th>
-                                                Large
-                                                <code>
-                                                .btn-lg
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Small
-                                                <code>
-                                                .btn-sm
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Extra Small
-                                                <code>
-                                                .btn-xs
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Flat
-                                                <code>
-                                                .btn-flat
-                                                </code>
-                                            </th>
-                                            <th>
-                                                Disabled
-                                                <code>
-                                                .disabled
-                                                </code>
-                                            </th>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-primary">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-primary btn-lg">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-primary btn-sm">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-primary btn-xs">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-primary btn-flat">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-primary disabled">
-                                                    Primary
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-secondary">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-secondary btn-lg">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-secondary btn-sm">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-secondary btn-xs">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-secondary btn-flat">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-secondary disabled">
-                                                    Secondary
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-success">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-success btn-lg">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-success btn-sm">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-success btn-xs">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-success btn-flat">
-                                                    Success
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-success disabled">
-                                                    Success
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-info">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-info btn-lg">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-info btn-sm">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-info btn-xs">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-info btn-flat">
-                                                    Info
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-info disabled">
-                                                    Info
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-danger">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-danger btn-lg">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-danger btn-sm">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-danger btn-xs">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-danger btn-flat">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-danger disabled">
-                                                    Danger
-                                                </button>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-warning">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-warning btn-lg">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-warning btn-sm">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button" class="btn btn-block bg-gradient-warning btn-xs">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-warning btn-flat">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                            <td>
-                                                <button type="button"
-                                                        class="btn btn-block bg-gradient-warning disabled">
-                                                    Warning
-                                                </button>
-                                            </td>
-                                        </tr>
-                                    </table>
-                                </div>
-                                <!-- /.card -->
-                            </div>
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- ./row -->
-                    <div class="row">
-                        <div class="col-md-6">
-                            <!-- Block buttons -->
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">Block Buttons</h3>
-                                </div>
-                                <div class="card-body">
-                                    <button type="button" class="btn btn-default btn-block">
-                                        .btn-block
-                                    </button>
-                                    <button type="button" class="btn btn-default btn-block btn-flat">
-                                        .btn-block .btn-flat
-                                    </button>
-                                    <button type="button" class="btn btn-default btn-block btn-sm">
-                                        .btn-block .btn-sm
-                                    </button>
-                                </div>
-                            </div>
-                            <!-- /.card -->
-                            <!-- Horizontal grouping -->
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">Horizontal Button Group</h3>
-                                </div>
-                                <div class="card-body table-responsive pad">
-                                    <p>
-                                        Horizontal button groups are easy to create with bootstrap. Just add your buttons
-                                        inside
-                                        <code>
-                                        &lt;div class="btn-group"&gt;&lt;/div&gt;
-                                        </code>
-                                    </p>
-                                    <table class="table table-bordered">
-                                        <tr>
-                                            <th>Button</th>
-                                            <th>Icons</th>
-                                            <th>Flat</th>
-                                            <th>Dropdown</th>
-                                        </tr>
-                                        <!-- Default -->
-                                        <tr>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-default">
-                                                        Left
-                                                    </button>
-                                                    <button type="button" class="btn btn-default">
-                                                        Middle
-                                                    </button>
-                                                    <button type="button" class="btn btn-default">
-                                                        Right
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-default">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-default">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-default">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-default btn-flat">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-default btn-flat">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-default btn-flat">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-default">
-                                                        1
-                                                    </button>
-                                                    <button type="button" class="btn btn-default">
-                                                        2
-                                                    </button>
-                                                    <div class="btn-group">
-                                                        <button type="button"
-                                                                class="btn btn-default dropdown-toggle dropdown-icon"
-                                                                data-toggle="dropdown"></button>
-                                                        <div class="dropdown-menu">
-                                                            <a class="dropdown-item" href="#">Dropdown link</a>
-                                                            <a class="dropdown-item" href="#">Dropdown link</a>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <!-- ./default -->
-                                        <!-- Info -->
-                                        <tr>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-info">
-                                                        Left
-                                                    </button>
-                                                    <button type="button" class="btn btn-info">
-                                                        Middle
-                                                    </button>
-                                                    <button type="button" class="btn btn-info">
-                                                        Right
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-info">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-info">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-info">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-info btn-flat">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-info btn-flat">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-info btn-flat">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-info">
-                                                        1
-                                                    </button>
-                                                    <button type="button" class="btn btn-info">
-                                                        2
-                                                    </button>
-                                                    <div class="btn-group">
-                                                        <button type="button"
-                                                                class="btn btn-info dropdown-toggle dropdown-icon"
-                                                                data-toggle="dropdown"></button>
-                                                        <div class="dropdown-menu">
-                                                            <a class="dropdown-item" href="#">Dropdown link</a>
-                                                            <a class="dropdown-item" href="#">Dropdown link</a>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <!-- /. info -->
-                                        <!-- /.danger -->
-                                        <tr>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-danger">
-                                                        Left
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger">
-                                                        Middle
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger">
-                                                        Right
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-danger">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-danger btn-flat">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger btn-flat">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger btn-flat">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-danger">
-                                                        1
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger">
-                                                        2
-                                                    </button>
-                                                    <div class="btn-group">
-                                                        <button type="button"
-                                                                class="btn btn-danger dropdown-toggle dropdown-icon"
-                                                                data-toggle="dropdown"></button>
-                                                        <div class="dropdown-menu">
-                                                            <a class="dropdown-item" href="#">Dropdown link</a>
-                                                            <a class="dropdown-item" href="#">Dropdown link</a>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <!-- /.danger -->
-                                        <!-- warning -->
-                                        <tr>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-warning">
-                                                        Left
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning">
-                                                        Middle
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning">
-                                                        Right
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-warning">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-warning btn-flat">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning btn-flat">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning btn-flat">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-warning">
-                                                        1
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning">
-                                                        2
-                                                    </button>
-                                                    <div class="btn-group">
-                                                        <button type="button"
-                                                                class="btn btn-warning dropdown-toggle dropdown-icon"
-                                                                data-toggle="dropdown"></button>
-                                                        <div class="dropdown-menu">
-                                                            <a class="dropdown-item" href="#">Dropdown link</a>
-                                                            <a class="dropdown-item" href="#">
-                                                                Dropdown link
-                                                            </a>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <!-- /.warning -->
-                                        <!-- success -->
-                                        <tr>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-success">
-                                                        Left
-                                                    </button>
-                                                    <button type="button" class="btn btn-success">
-                                                        Middle
-                                                    </button>
-                                                    <button type="button" class="btn btn-success">
-                                                        Right
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-success">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-success">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-success">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-success btn-flat">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-success btn-flat">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-success btn-flat">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group">
-                                                    <button type="button" class="btn btn-success">
-                                                        1
-                                                    </button>
-                                                    <button type="button" class="btn btn-success">
-                                                        2
-                                                    </button>
-                                                    <div class="btn-group">
-                                                        <button type="button"
-                                                                class="btn btn-success dropdown-toggle dropdown-icon"
-                                                                data-toggle="dropdown"></button>
-                                                        <div class="dropdown-menu">
-                                                            <a class="dropdown-item" href="#">
-                                                                Dropdown link
-                                                            </a>
-                                                            <a class="dropdown-item" href="#">
-                                                                Dropdown link
-                                                            </a>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <!-- /.success -->
-                                    </table>
-                                </div>
-                            </div>
-                            <!-- /.card -->
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Appended Buttons
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    <strong>With dropdown</strong>
-                                    <div class="input-group mb-3">
-                                        <div class="input-group-prepend">
-                                            <button type="button"
-                                                    class="btn btn-default dropdown-toggle"
-                                                    data-toggle="dropdown">
-                                                Action
-                                            </button>
-                                            <div class="dropdown-menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <!-- /btn-group -->
-                                        <input type="text" class="form-control">
-                                    </div>
-                                    <!-- /input-group -->
-                                    <strong>Normal</strong>
-                                    <div class="input-group mb-3">
-                                        <div class="input-group-prepend">
-                                            <button type="button" class="btn btn-danger">
-                                                Action
-                                            </button>
-                                        </div>
-                                        <!-- /btn-group -->
-                                        <input type="text" class="form-control">
-                                    </div>
-                                    <!-- /input-group -->
-                                    <strong>
-                                    Flat
-                                    </strong>
-                                    <div class="input-group mb-3">
-                                        <input type="text" class="form-control rounded-0">
-                                        <span class="input-group-append">
-                                            <button type="button" class="btn btn-info btn-flat">
-                                                Go!
-                                            </button>
-                                        </span>
-                                    </div>
-                                    <!-- /input-group -->
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                            <!-- split buttons box -->
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Split buttons
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    <!-- Split button -->
-                                    <p class="mb-1">
-                                        Normal split buttons:
-                                    </p>
-                                    <div class="margin">
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-default">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-default dropdown-toggle dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-info">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-info dropdown-toggle dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-danger">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-danger dropdown-toggle dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-success">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-success dropdown-toggle"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-warning">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-warning dropdown-toggle dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <!-- flat split buttons -->
-                                    <p class="mt-3 mb-1">
-                                        Flat split buttons:
-                                    </p>
-                                    <div class="margin">
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-default btn-flat">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-default btn-flat dropdown-toggle dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-info btn-flat">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-info btn-flat dropdown-toggle dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-danger btn-flat">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-danger btn-flat dropdown-toggle dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-success btn-flat">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-success btn-flat dropdown-toggle dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-warning btn-flat">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-warning btn-flat dropdown-toggle dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <!-- Split button -->
-                                    <p class="mt-3 mb-1">
-                                        Hoverable split buttons:
-                                    </p>
-                                    <div class="margin">
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-default">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-default dropdown-toggle dropdown-hover dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-info">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-info dropdown-toggle dropdown-hover dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-danger">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-danger dropdown-toggle dropdown-hover dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-success">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-success dropdown-toggle dropdown-hover dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                        <div class="btn-group">
-                                            <button type="button" class="btn btn-warning">
-                                                Action
-                                            </button>
-                                            <button type="button"
-                                                    class="btn btn-warning dropdown-toggle dropdown-hover dropdown-icon"
-                                                    data-toggle="dropdown">
-                                                <span class="sr-only">
-                                                    Toggle Dropdown
-                                                </span>
-                                            </button>
-                                            <div class="dropdown-menu" role="menu">
-                                                <a class="dropdown-item" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- end split buttons box -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-6">
-                            <!-- Application buttons -->
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Application Buttons
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    <p>
-                                        Add the classes
-                                        <code>
-                                        .btn.btn-app
-                                        </code>
-                                        to an
-                                        <code>
-                                        &lt;a>
-                                        </code>
-                                        tag to achieve the following:
-                                    </p>
-                                    <a class="btn btn-app">
-                                        <i class="fas fa-edit"></i>
-                                        Edit
-                                    </a>
-                                    <a class="btn btn-app">
-                                        <i class="fas fa-play"></i>
-                                        Play
-                                    </a>
-                                    <a class="btn btn-app">
-                                        <i class="fas fa-pause"></i>
-                                        Pause
-                                    </a>
-                                    <a class="btn btn-app">
-                                        <i class="fas fa-save"></i>
-                                        Save
-                                    </a>
-                                    <a class="btn btn-app">
-                                        <span class="badge bg-warning">
-                                            3
-                                        </span>
-                                        <i class="fas fa-bullhorn"></i>
-                                        Notifications
-                                    </a>
-                                    <a class="btn btn-app">
-                                        <span class="badge bg-success">
-                                            300
-                                        </span>
-                                        <i class="fas fa-barcode"></i>
-                                        Products
-                                    </a>
-                                    <a class="btn btn-app">
-                                        <span class="badge bg-purple">
-                                            891
-                                        </span>
-                                        <i class="fas fa-users"></i>
-                                        Users
-                                    </a>
-                                    <a class="btn btn-app">
-                                        <span class="badge bg-teal">
-                                            67
-                                        </span>
-                                        <i class="fas fa-inbox"></i>
-                                        Orders
-                                    </a>
-                                    <a class="btn btn-app">
-                                        <span class="badge bg-info">
-                                            12
-                                        </span>
-                                        <i class="fas fa-envelope"></i>
-                                        Inbox
-                                    </a>
-                                    <a class="btn btn-app">
-                                        <span class="badge bg-danger">
-                                            531
-                                        </span>
-                                        <i class="fas fa-heart"></i>
-                                        Likes
-                                    </a>
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                            <!-- Vertical grouping -->
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Vertical Button Group
-                                    </h3>
-                                </div>
-                                <div class="card-body table-responsive pad">
-                                    <p>
-                                        Vertical button groups are easy to create with bootstrap. Just add your buttons
-                                        inside
-                                        <code>
-                                        &lt;div class="btn-group-vertical"&gt;&lt;/div&gt;
-                                        </code>
-                                    </p>
-                                    <table class="table table-bordered">
-                                        <tr>
-                                            <th>
-                                                Button
-                                            </th>
-                                            <th>
-                                                Icons
-                                            </th>
-                                            <th>
-                                                Flat
-                                            </th>
-                                            <th>
-                                                Dropdown
-                                            </th>
-                                        </tr>
-                                        <!-- Default -->
-                                        <tr>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-default">
-                                                        Top
-                                                    </button>
-                                                    <button type="button" class="btn btn-default">
-                                                        Middle
-                                                    </button>
-                                                    <button type="button" class="btn btn-default">
-                                                        Bottom
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-default">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-default">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-default">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-default btn-flat">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-default btn-flat">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-default btn-flat">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-default">
-                                                        1
-                                                    </button>
-                                                    <button type="button" class="btn btn-default">
-                                                        2
-                                                    </button>
-                                                    <div class="btn-group">
-                                                        <button type="button"
-                                                                class="btn btn-default dropdown-toggle"
-                                                                data-toggle="dropdown"></button>
-                                                        <ul class="dropdown-menu">
-                                                            <li>
-                                                                <a class="dropdown-item" href="#">
-                                                                    Dropdown link
-                                                                </a>
-                                                            </li>
-                                                            <li>
-                                                                <a class="dropdown-item" href="#">
-                                                                    Dropdown link
-                                                                </a>
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <!-- ./default -->
-                                        <!-- Info -->
-                                        <tr>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-info">
-                                                        Top
-                                                    </button>
-                                                    <button type="button" class="btn btn-info">
-                                                        Middle
-                                                    </button>
-                                                    <button type="button" class="btn btn-info">
-                                                        Bottom
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-info">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-info">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-info">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-info btn-flat">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-info btn-flat">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-info btn-flat">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-info">
-                                                        1
-                                                    </button>
-                                                    <button type="button" class="btn btn-info">
-                                                        2
-                                                    </button>
-                                                    <div class="btn-group">
-                                                        <button type="button"
-                                                                class="btn btn-info dropdown-toggle"
-                                                                data-toggle="dropdown"></button>
-                                                        <ul class="dropdown-menu">
-                                                            <li>
-                                                                <a class="dropdown-item" href="#">
-                                                                    Dropdown link
-                                                                </a>
-                                                            </li>
-                                                            <li>
-                                                                <a class="dropdown-item" href="#">
-                                                                    Dropdown link
-                                                                </a>
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <!-- /. info -->
-                                        <!-- /.danger -->
-                                        <tr>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-danger">
-                                                        Top
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger">
-                                                        Middle
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger">
-                                                        Bottom
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-danger">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-danger btn-flat">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger btn-flat">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger btn-flat">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-danger">
-                                                        1
-                                                    </button>
-                                                    <button type="button" class="btn btn-danger">
-                                                        2
-                                                    </button>
-                                                    <div class="btn-group">
-                                                        <button type="button"
-                                                                class="btn btn-danger dropdown-toggle"
-                                                                data-toggle="dropdown"></button>
-                                                        <ul class="dropdown-menu">
-                                                            <li>
-                                                                <a class="dropdown-item" href="#">
-                                                                    Dropdown link
-                                                                </a>
-                                                            </li>
-                                                            <li>
-                                                                <a class="dropdown-item" href="#">
-                                                                    Dropdown link
-                                                                </a>
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <!-- /.danger -->
-                                        <!-- warning -->
-                                        <tr>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-warning">
-                                                        Top
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning">
-                                                        Middle
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning">
-                                                        Bottom
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-warning">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-warning btn-flat">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning btn-flat">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning btn-flat">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-warning">
-                                                        1
-                                                    </button>
-                                                    <button type="button" class="btn btn-warning">
-                                                        2
-                                                    </button>
-                                                    <div class="btn-group">
-                                                        <button type="button"
-                                                                class="btn btn-warning dropdown-toggle"
-                                                                data-toggle="dropdown"></button>
-                                                        <ul class="dropdown-menu">
-                                                            <li>
-                                                                <a class="dropdown-item" href="#">
-                                                                    Dropdown link
-                                                                </a>
-                                                            </li>
-                                                            <li>
-                                                                <a class="dropdown-item" href="#">
-                                                                    Dropdown link
-                                                                </a>
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <!-- /.warning -->
-                                        <!-- success -->
-                                        <tr>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-success">
-                                                        Top
-                                                    </button>
-                                                    <button type="button" class="btn btn-success">
-                                                        Middle
-                                                    </button>
-                                                    <button type="button" class="btn btn-success">
-                                                        Bottom
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-success">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-success">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-success">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-success btn-flat">
-                                                        <i class="fas fa-align-left"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-success btn-flat">
-                                                        <i class="fas fa-align-center"></i>
-                                                    </button>
-                                                    <button type="button" class="btn btn-success btn-flat">
-                                                        <i class="fas fa-align-right"></i>
-                                                    </button>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="btn-group-vertical">
-                                                    <button type="button" class="btn btn-success">
-                                                        1
-                                                    </button>
-                                                    <button type="button" class="btn btn-success">
-                                                        2
-                                                    </button>
-                                                    <div class="btn-group">
-                                                        <button type="button"
-                                                                class="btn btn-success dropdown-toggle"
-                                                                data-toggle="dropdown"></button>
-                                                        <ul class="dropdown-menu">
-                                                            <li>
-                                                                <a class="dropdown-item" href="#">
-                                                                    Dropdown link
-                                                                </a>
-                                                            </li>
-                                                            <li>
-                                                                <a class="dropdown-item" href="#">
-                                                                    Dropdown link
-                                                                </a>
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <!-- /.success -->
-                                    </table>
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                            <!-- Radio Buttons -->
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Radio Button Group
-                                    </h3>
-                                </div>
-                                <div class="card-body table-responsive pad">
-                                    <p class="mb-1">
-                                        Radio Button Group with
-                                        <code>
-                                        .btn-secondary
-                                        </code>
-                                    </p>
-                                    <div class="btn-group btn-group-toggle" data-toggle="buttons">
-                                        <label class="btn btn-secondary active">
-                                            <input type="radio"
-                                                   name="options"
-                                                   id="option_a1"
-                                                   autocomplete="off"
-                                                   checked>
-                                            Active
-                                        </label>
-                                        <label class="btn btn-secondary">
-                                            <input type="radio" name="options" id="option_a2" autocomplete="off">
-                                            Radio
-                                        </label>
-                                        <label class="btn btn-secondary">
-                                            <input type="radio" name="options" id="option_a3" autocomplete="off">
-                                            Radio
-                                        </label>
-                                    </div>
-                                    <p class="mt-3 mb-1">
-                                        Radio Button Group with
-                                        <code>
-                                        .bg-olive
-                                        </code>
-                                    </p>
-                                    <div class="btn-group btn-group-toggle" data-toggle="buttons">
-                                        <label class="btn bg-olive active">
-                                            <input type="radio"
-                                                   name="options"
-                                                   id="option_b1"
-                                                   autocomplete="off"
-                                                   checked>
-                                            Active
-                                        </label>
-                                        <label class="btn bg-olive">
-                                            <input type="radio" name="options" id="option_b2" autocomplete="off">
-                                            Radio
-                                        </label>
-                                        <label class="btn bg-olive">
-                                            <input type="radio" name="options" id="option_b3" autocomplete="off">
-                                            Radio
-                                        </label>
-                                    </div>
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- /. row -->
+                    <!-- /.col -->
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- /.content -->
-        </div>
-    {% endblock content %}
-    <!-- Specific Page JS goes HERE -->
-    {% block javascripts %}
-        <!-- jQuery -->
-        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-        <!-- Bootstrap 4 -->
-        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-        <!-- AdminLTE App -->
-        <script src="/static/assets/js/adminlte.min.js"></script>
-        <!-- AdminLTE for demo purposes -->
-        <script src="/static/assets/js/demo.js"></script>
-    {% endblock javascripts %}
+                <!-- ./row -->
+                <div class="row">
+                    <div class="col-md-12">
+                        <div class="card card-primary card-outline">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-edit"></i>
+                                    Gradient Buttons (bg-gradient-*)
+                                </h3>
+                            </div>
+                            <div class="card-body pad table-responsive">
+                                <p>
+                                    Various types of buttons. Using the base class
+                                    <code>
+                                    .btn
+                                    </code>
+                                </p>
+                                <table class="table table-bordered text-center">
+                                    <tr>
+                                        <th>Normal</th>
+                                        <th>
+                                            Large
+                                            <code>
+                                            .btn-lg
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Small
+                                            <code>
+                                            .btn-sm
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Extra Small
+                                            <code>
+                                            .btn-xs
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Flat
+                                            <code>
+                                            .btn-flat
+                                            </code>
+                                        </th>
+                                        <th>
+                                            Disabled
+                                            <code>
+                                            .disabled
+                                            </code>
+                                        </th>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-primary">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-primary btn-lg">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-primary btn-sm">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-primary btn-xs">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-primary btn-flat">
+                                                Primary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-primary disabled">
+                                                Primary
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-secondary">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-secondary btn-lg">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-secondary btn-sm">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-secondary btn-xs">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-secondary btn-flat">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-secondary disabled">
+                                                Secondary
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-success">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-success btn-lg">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-success btn-sm">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-success btn-xs">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-success btn-flat">
+                                                Success
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-success disabled">
+                                                Success
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-info">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-info btn-lg">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-info btn-sm">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-info btn-xs">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-info btn-flat">
+                                                Info
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-info disabled">
+                                                Info
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-danger">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-danger btn-lg">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-danger btn-sm">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-danger btn-xs">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-danger btn-flat">
+                                                Danger
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-danger disabled">
+                                                Danger
+                                            </button>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-warning">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-warning btn-lg">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-warning btn-sm">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-warning btn-xs">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-warning btn-flat">
+                                                Warning
+                                            </button>
+                                        </td>
+                                        <td>
+                                            <button type="button" class="btn btn-block bg-gradient-warning disabled">
+                                                Warning
+                                            </button>
+                                        </td>
+                                    </tr>
+                                </table>
+                            </div>
+                            <!-- /.card -->
+                        </div>
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- ./row -->
+                <div class="row">
+                    <div class="col-md-6">
+                        <!-- Block buttons -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">Block Buttons</h3>
+                            </div>
+                            <div class="card-body">
+                                <button type="button" class="btn btn-default btn-block">
+                                    .btn-block
+                                </button>
+                                <button type="button" class="btn btn-default btn-block btn-flat">
+                                    .btn-block .btn-flat
+                                </button>
+                                <button type="button" class="btn btn-default btn-block btn-sm">
+                                    .btn-block .btn-sm
+                                </button>
+                            </div>
+                        </div>
+                        <!-- /.card -->
+                        <!-- Horizontal grouping -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">Horizontal Button Group</h3>
+                            </div>
+                            <div class="card-body table-responsive pad">
+                                <p>
+                                    Horizontal button groups are easy to create with bootstrap. Just add your buttons
+                                    inside
+                                    <code>
+                                    &lt;div class="btn-group"&gt;&lt;/div&gt;
+                                    </code>
+                                </p>
+                                <table class="table table-bordered">
+                                    <tr>
+                                        <th>Button</th>
+                                        <th>Icons</th>
+                                        <th>Flat</th>
+                                        <th>Dropdown</th>
+                                    </tr>
+                                    <!-- Default -->
+                                    <tr>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-default">
+                                                    Left
+                                                </button>
+                                                <button type="button" class="btn btn-default">
+                                                    Middle
+                                                </button>
+                                                <button type="button" class="btn btn-default">
+                                                    Right
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-default">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-default">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-default">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-default btn-flat">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-default btn-flat">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-default btn-flat">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-default">
+                                                    1
+                                                </button>
+                                                <button type="button" class="btn btn-default">
+                                                    2
+                                                </button>
+                                                <div class="btn-group">
+                                                    <button type="button"
+                                                            class="btn btn-default dropdown-toggle dropdown-icon"
+                                                            data-toggle="dropdown"></button>
+                                                    <div class="dropdown-menu">
+                                                        <a class="dropdown-item" href="#">Dropdown link</a>
+                                                        <a class="dropdown-item" href="#">Dropdown link</a>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </td>
+                                    </tr>
+                                    <!-- ./default -->
+                                    <!-- Info -->
+                                    <tr>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-info">
+                                                    Left
+                                                </button>
+                                                <button type="button" class="btn btn-info">
+                                                    Middle
+                                                </button>
+                                                <button type="button" class="btn btn-info">
+                                                    Right
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-info">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-info">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-info">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-info btn-flat">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-info btn-flat">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-info btn-flat">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-info">
+                                                    1
+                                                </button>
+                                                <button type="button" class="btn btn-info">
+                                                    2
+                                                </button>
+                                                <div class="btn-group">
+                                                    <button type="button"
+                                                            class="btn btn-info dropdown-toggle dropdown-icon"
+                                                            data-toggle="dropdown"></button>
+                                                    <div class="dropdown-menu">
+                                                        <a class="dropdown-item" href="#">Dropdown link</a>
+                                                        <a class="dropdown-item" href="#">Dropdown link</a>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </td>
+                                    </tr>
+                                    <!-- /. info -->
+                                    <!-- /.danger -->
+                                    <tr>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-danger">
+                                                    Left
+                                                </button>
+                                                <button type="button" class="btn btn-danger">
+                                                    Middle
+                                                </button>
+                                                <button type="button" class="btn btn-danger">
+                                                    Right
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-danger">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-danger">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-danger">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-danger btn-flat">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-danger btn-flat">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-danger btn-flat">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-danger">
+                                                    1
+                                                </button>
+                                                <button type="button" class="btn btn-danger">
+                                                    2
+                                                </button>
+                                                <div class="btn-group">
+                                                    <button type="button"
+                                                            class="btn btn-danger dropdown-toggle dropdown-icon"
+                                                            data-toggle="dropdown"></button>
+                                                    <div class="dropdown-menu">
+                                                        <a class="dropdown-item" href="#">Dropdown link</a>
+                                                        <a class="dropdown-item" href="#">Dropdown link</a>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </td>
+                                    </tr>
+                                    <!-- /.danger -->
+                                    <!-- warning -->
+                                    <tr>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-warning">
+                                                    Left
+                                                </button>
+                                                <button type="button" class="btn btn-warning">
+                                                    Middle
+                                                </button>
+                                                <button type="button" class="btn btn-warning">
+                                                    Right
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-warning">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-warning">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-warning">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-warning btn-flat">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-warning btn-flat">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-warning btn-flat">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-warning">
+                                                    1
+                                                </button>
+                                                <button type="button" class="btn btn-warning">
+                                                    2
+                                                </button>
+                                                <div class="btn-group">
+                                                    <button type="button"
+                                                            class="btn btn-warning dropdown-toggle dropdown-icon"
+                                                            data-toggle="dropdown"></button>
+                                                    <div class="dropdown-menu">
+                                                        <a class="dropdown-item" href="#">Dropdown link</a>
+                                                        <a class="dropdown-item" href="#">
+                                                            Dropdown link
+                                                        </a>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </td>
+                                    </tr>
+                                    <!-- /.warning -->
+                                    <!-- success -->
+                                    <tr>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-success">
+                                                    Left
+                                                </button>
+                                                <button type="button" class="btn btn-success">
+                                                    Middle
+                                                </button>
+                                                <button type="button" class="btn btn-success">
+                                                    Right
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-success">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-success">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-success">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-success btn-flat">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-success btn-flat">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-success btn-flat">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group">
+                                                <button type="button" class="btn btn-success">
+                                                    1
+                                                </button>
+                                                <button type="button" class="btn btn-success">
+                                                    2
+                                                </button>
+                                                <div class="btn-group">
+                                                    <button type="button"
+                                                            class="btn btn-success dropdown-toggle dropdown-icon"
+                                                            data-toggle="dropdown"></button>
+                                                    <div class="dropdown-menu">
+                                                        <a class="dropdown-item" href="#">
+                                                            Dropdown link
+                                                        </a>
+                                                        <a class="dropdown-item" href="#">
+                                                            Dropdown link
+                                                        </a>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </td>
+                                    </tr>
+                                    <!-- /.success -->
+                                </table>
+                            </div>
+                        </div>
+                        <!-- /.card -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Appended Buttons
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                <strong>With dropdown</strong>
+                                <div class="input-group mb-3">
+                                    <div class="input-group-prepend">
+                                        <button type="button"
+                                                class="btn btn-default dropdown-toggle"
+                                                data-toggle="dropdown">
+                                            Action
+                                        </button>
+                                        <div class="dropdown-menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <!-- /btn-group -->
+                                    <input type="text" class="form-control">
+                                </div>
+                                <!-- /input-group -->
+                                <strong>Normal</strong>
+                                <div class="input-group mb-3">
+                                    <div class="input-group-prepend">
+                                        <button type="button" class="btn btn-danger">
+                                            Action
+                                        </button>
+                                    </div>
+                                    <!-- /btn-group -->
+                                    <input type="text" class="form-control">
+                                </div>
+                                <!-- /input-group -->
+                                <strong>
+                                Flat
+                                </strong>
+                                <div class="input-group mb-3">
+                                    <input type="text" class="form-control rounded-0">
+                                    <span class="input-group-append">
+                                        <button type="button" class="btn btn-info btn-flat">
+                                            Go!
+                                        </button>
+                                    </span>
+                                </div>
+                                <!-- /input-group -->
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                        <!-- split buttons box -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Split buttons
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                <!-- Split button -->
+                                <p class="mb-1">
+                                    Normal split buttons:
+                                </p>
+                                <div class="margin">
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-default">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-default dropdown-toggle dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-info">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-info dropdown-toggle dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-danger">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-danger dropdown-toggle dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-success">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-success dropdown-toggle"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-warning">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-warning dropdown-toggle dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                </div>
+                                <!-- flat split buttons -->
+                                <p class="mt-3 mb-1">
+                                    Flat split buttons:
+                                </p>
+                                <div class="margin">
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-default btn-flat">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-default btn-flat dropdown-toggle dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-info btn-flat">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-info btn-flat dropdown-toggle dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-danger btn-flat">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-danger btn-flat dropdown-toggle dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-success btn-flat">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-success btn-flat dropdown-toggle dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-warning btn-flat">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-warning btn-flat dropdown-toggle dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                </div>
+                                <!-- Split button -->
+                                <p class="mt-3 mb-1">
+                                    Hoverable split buttons:
+                                </p>
+                                <div class="margin">
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-default">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-default dropdown-toggle dropdown-hover dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-info">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-info dropdown-toggle dropdown-hover dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-danger">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-danger dropdown-toggle dropdown-hover dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-success">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-success dropdown-toggle dropdown-hover dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                    <div class="btn-group">
+                                        <button type="button" class="btn btn-warning">
+                                            Action
+                                        </button>
+                                        <button type="button"
+                                                class="btn btn-warning dropdown-toggle dropdown-hover dropdown-icon"
+                                                data-toggle="dropdown">
+                                            <span class="sr-only">
+                                                Toggle Dropdown
+                                            </span>
+                                        </button>
+                                        <div class="dropdown-menu" role="menu">
+                                            <a class="dropdown-item" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" href="#">
+                                                Separated link
+                                            </a>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- end split buttons box -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-6">
+                        <!-- Application buttons -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Application Buttons
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                <p>
+                                    Add the classes
+                                    <code>
+                                    .btn.btn-app
+                                    </code>
+                                    to an
+                                    <code>
+                                    &lt;a>
+                                    </code>
+                                    tag to achieve the following:
+                                </p>
+                                <a class="btn btn-app">
+                                    <i class="fas fa-edit"></i>
+                                    Edit
+                                </a>
+                                <a class="btn btn-app">
+                                    <i class="fas fa-play"></i>
+                                    Play
+                                </a>
+                                <a class="btn btn-app">
+                                    <i class="fas fa-pause"></i>
+                                    Pause
+                                </a>
+                                <a class="btn btn-app">
+                                    <i class="fas fa-save"></i>
+                                    Save
+                                </a>
+                                <a class="btn btn-app">
+                                    <span class="badge bg-warning">
+                                        3
+                                    </span>
+                                    <i class="fas fa-bullhorn"></i>
+                                    Notifications
+                                </a>
+                                <a class="btn btn-app">
+                                    <span class="badge bg-success">
+                                        300
+                                    </span>
+                                    <i class="fas fa-barcode"></i>
+                                    Products
+                                </a>
+                                <a class="btn btn-app">
+                                    <span class="badge bg-purple">
+                                        891
+                                    </span>
+                                    <i class="fas fa-users"></i>
+                                    Users
+                                </a>
+                                <a class="btn btn-app">
+                                    <span class="badge bg-teal">
+                                        67
+                                    </span>
+                                    <i class="fas fa-inbox"></i>
+                                    Orders
+                                </a>
+                                <a class="btn btn-app">
+                                    <span class="badge bg-info">
+                                        12
+                                    </span>
+                                    <i class="fas fa-envelope"></i>
+                                    Inbox
+                                </a>
+                                <a class="btn btn-app">
+                                    <span class="badge bg-danger">
+                                        531
+                                    </span>
+                                    <i class="fas fa-heart"></i>
+                                    Likes
+                                </a>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                        <!-- Vertical grouping -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Vertical Button Group
+                                </h3>
+                            </div>
+                            <div class="card-body table-responsive pad">
+                                <p>
+                                    Vertical button groups are easy to create with bootstrap. Just add your buttons
+                                    inside
+                                    <code>
+                                    &lt;div class="btn-group-vertical"&gt;&lt;/div&gt;
+                                    </code>
+                                </p>
+                                <table class="table table-bordered">
+                                    <tr>
+                                        <th>
+                                            Button
+                                        </th>
+                                        <th>
+                                            Icons
+                                        </th>
+                                        <th>
+                                            Flat
+                                        </th>
+                                        <th>
+                                            Dropdown
+                                        </th>
+                                    </tr>
+                                    <!-- Default -->
+                                    <tr>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-default">
+                                                    Top
+                                                </button>
+                                                <button type="button" class="btn btn-default">
+                                                    Middle
+                                                </button>
+                                                <button type="button" class="btn btn-default">
+                                                    Bottom
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-default">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-default">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-default">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-default btn-flat">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-default btn-flat">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-default btn-flat">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-default">
+                                                    1
+                                                </button>
+                                                <button type="button" class="btn btn-default">
+                                                    2
+                                                </button>
+                                                <div class="btn-group">
+                                                    <button type="button"
+                                                            class="btn btn-default dropdown-toggle"
+                                                            data-toggle="dropdown"></button>
+                                                    <ul class="dropdown-menu">
+                                                        <li>
+                                                            <a class="dropdown-item" href="#">
+                                                                Dropdown link
+                                                            </a>
+                                                        </li>
+                                                        <li>
+                                                            <a class="dropdown-item" href="#">
+                                                                Dropdown link
+                                                            </a>
+                                                        </li>
+                                                    </ul>
+                                                </div>
+                                            </div>
+                                        </td>
+                                    </tr>
+                                    <!-- ./default -->
+                                    <!-- Info -->
+                                    <tr>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-info">
+                                                    Top
+                                                </button>
+                                                <button type="button" class="btn btn-info">
+                                                    Middle
+                                                </button>
+                                                <button type="button" class="btn btn-info">
+                                                    Bottom
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-info">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-info">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-info">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-info btn-flat">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-info btn-flat">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-info btn-flat">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-info">
+                                                    1
+                                                </button>
+                                                <button type="button" class="btn btn-info">
+                                                    2
+                                                </button>
+                                                <div class="btn-group">
+                                                    <button type="button"
+                                                            class="btn btn-info dropdown-toggle"
+                                                            data-toggle="dropdown"></button>
+                                                    <ul class="dropdown-menu">
+                                                        <li>
+                                                            <a class="dropdown-item" href="#">
+                                                                Dropdown link
+                                                            </a>
+                                                        </li>
+                                                        <li>
+                                                            <a class="dropdown-item" href="#">
+                                                                Dropdown link
+                                                            </a>
+                                                        </li>
+                                                    </ul>
+                                                </div>
+                                            </div>
+                                        </td>
+                                    </tr>
+                                    <!-- /. info -->
+                                    <!-- /.danger -->
+                                    <tr>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-danger">
+                                                    Top
+                                                </button>
+                                                <button type="button" class="btn btn-danger">
+                                                    Middle
+                                                </button>
+                                                <button type="button" class="btn btn-danger">
+                                                    Bottom
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-danger">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-danger">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-danger">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-danger btn-flat">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-danger btn-flat">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-danger btn-flat">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-danger">
+                                                    1
+                                                </button>
+                                                <button type="button" class="btn btn-danger">
+                                                    2
+                                                </button>
+                                                <div class="btn-group">
+                                                    <button type="button"
+                                                            class="btn btn-danger dropdown-toggle"
+                                                            data-toggle="dropdown"></button>
+                                                    <ul class="dropdown-menu">
+                                                        <li>
+                                                            <a class="dropdown-item" href="#">
+                                                                Dropdown link
+                                                            </a>
+                                                        </li>
+                                                        <li>
+                                                            <a class="dropdown-item" href="#">
+                                                                Dropdown link
+                                                            </a>
+                                                        </li>
+                                                    </ul>
+                                                </div>
+                                            </div>
+                                        </td>
+                                    </tr>
+                                    <!-- /.danger -->
+                                    <!-- warning -->
+                                    <tr>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-warning">
+                                                    Top
+                                                </button>
+                                                <button type="button" class="btn btn-warning">
+                                                    Middle
+                                                </button>
+                                                <button type="button" class="btn btn-warning">
+                                                    Bottom
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-warning">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-warning">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-warning">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-warning btn-flat">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-warning btn-flat">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-warning btn-flat">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-warning">
+                                                    1
+                                                </button>
+                                                <button type="button" class="btn btn-warning">
+                                                    2
+                                                </button>
+                                                <div class="btn-group">
+                                                    <button type="button"
+                                                            class="btn btn-warning dropdown-toggle"
+                                                            data-toggle="dropdown"></button>
+                                                    <ul class="dropdown-menu">
+                                                        <li>
+                                                            <a class="dropdown-item" href="#">
+                                                                Dropdown link
+                                                            </a>
+                                                        </li>
+                                                        <li>
+                                                            <a class="dropdown-item" href="#">
+                                                                Dropdown link
+                                                            </a>
+                                                        </li>
+                                                    </ul>
+                                                </div>
+                                            </div>
+                                        </td>
+                                    </tr>
+                                    <!-- /.warning -->
+                                    <!-- success -->
+                                    <tr>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-success">
+                                                    Top
+                                                </button>
+                                                <button type="button" class="btn btn-success">
+                                                    Middle
+                                                </button>
+                                                <button type="button" class="btn btn-success">
+                                                    Bottom
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-success">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-success">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-success">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-success btn-flat">
+                                                    <i class="fas fa-align-left"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-success btn-flat">
+                                                    <i class="fas fa-align-center"></i>
+                                                </button>
+                                                <button type="button" class="btn btn-success btn-flat">
+                                                    <i class="fas fa-align-right"></i>
+                                                </button>
+                                            </div>
+                                        </td>
+                                        <td>
+                                            <div class="btn-group-vertical">
+                                                <button type="button" class="btn btn-success">
+                                                    1
+                                                </button>
+                                                <button type="button" class="btn btn-success">
+                                                    2
+                                                </button>
+                                                <div class="btn-group">
+                                                    <button type="button"
+                                                            class="btn btn-success dropdown-toggle"
+                                                            data-toggle="dropdown"></button>
+                                                    <ul class="dropdown-menu">
+                                                        <li>
+                                                            <a class="dropdown-item" href="#">
+                                                                Dropdown link
+                                                            </a>
+                                                        </li>
+                                                        <li>
+                                                            <a class="dropdown-item" href="#">
+                                                                Dropdown link
+                                                            </a>
+                                                        </li>
+                                                    </ul>
+                                                </div>
+                                            </div>
+                                        </td>
+                                    </tr>
+                                    <!-- /.success -->
+                                </table>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                        <!-- Radio Buttons -->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Radio Button Group
+                                </h3>
+                            </div>
+                            <div class="card-body table-responsive pad">
+                                <p class="mb-1">
+                                    Radio Button Group with
+                                    <code>
+                                    .btn-secondary
+                                    </code>
+                                </p>
+                                <div class="btn-group btn-group-toggle" data-toggle="buttons">
+                                    <label class="btn btn-secondary active">
+                                        <input type="radio" name="options" id="option_a1" autocomplete="off" checked>
+                                        Active
+                                    </label>
+                                    <label class="btn btn-secondary">
+                                        <input type="radio" name="options" id="option_a2" autocomplete="off">
+                                        Radio
+                                    </label>
+                                    <label class="btn btn-secondary">
+                                        <input type="radio" name="options" id="option_a3" autocomplete="off">
+                                        Radio
+                                    </label>
+                                </div>
+                                <p class="mt-3 mb-1">
+                                    Radio Button Group with
+                                    <code>
+                                    .bg-olive
+                                    </code>
+                                </p>
+                                <div class="btn-group btn-group-toggle" data-toggle="buttons">
+                                    <label class="btn bg-olive active">
+                                        <input type="radio" name="options" id="option_b1" autocomplete="off" checked>
+                                        Active
+                                    </label>
+                                    <label class="btn bg-olive">
+                                        <input type="radio" name="options" id="option_b2" autocomplete="off">
+                                        Radio
+                                    </label>
+                                    <label class="btn bg-olive">
+                                        <input type="radio" name="options" id="option_b3" autocomplete="off">
+                                        Radio
+                                    </label>
+                                </div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /. row -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/ui-general.html b/tests/jinja_adminlte/ui-general.html
index f1476eb..3dca08c 100644
--- a/tests/jinja_adminlte/ui-general.html
+++ b/tests/jinja_adminlte/ui-general.html
@@ -2,16 +2,16 @@
 {% block title %}UI General {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-        <style>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+    <style>
     .color-palette {
       height: 35px;
       line-height: 35px;
@@ -53,1510 +53,1502 @@
       display: block;
       z-index: 7;
     }
-        </style>
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>Inline Charts</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    Inline Charts
-                                </li>
-                            </ol>
-                        </div>
+    </style>
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>Inline Charts</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                Inline Charts
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <!-- COLOR PALETTE -->
-                    <div class="card card-default color-palette-box">
-                        <div class="card-header">
-                            <h3 class="card-title">
-                                <i class="fas fa-tag"></i>
-                                Color Palette
-                            </h3>
-                        </div>
-                        <div class="card-body">
-                            <div class="col-12">
-                                <h5>Theme Colors</h5>
-                            </div>
-                            <!-- /.col-12 -->
-                            <div class="row">
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center">Primary</h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-primary color-palette">
-                                            <span>#007bff</span>
-                                        </div>
-                                        <div class="bg-primary disabled color-palette">
-                                            <span>Disabled</span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center">Secondary</h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-secondary color-palette">
-                                            <span>#6c757d</span>
-                                        </div>
-                                        <div class="bg-secondary disabled color-palette">
-                                            <span>Disabled</span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center">Info</h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-info color-palette">
-                                            <span>#17a2b8</span>
-                                        </div>
-                                        <div class="bg-info disabled color-palette">
-                                            <span>Disabled</span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center">Success</h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-success color-palette">
-                                            <span>#28a745</span>
-                                        </div>
-                                        <div class="bg-success disabled color-palette">
-                                            <span>Disabled</span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-warning">Warning</h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-warning color-palette">
-                                            <span>
-                                                #ffc107
-                                            </span>
-                                        </div>
-                                        <div class="bg-warning disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center">Danger</h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-danger color-palette">
-                                            <span>
-                                                #dc3545
-                                            </span>
-                                        </div>
-                                        <div class="bg-danger disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                            </div>
-                            <!-- /.row -->
-                            <div class="col-12">
-                                <h5 class="mt-3">Black/White Nuances</h5>
-                            </div>
-                            <!-- /.col-12 -->
-                            <div class="row">
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center">Black</h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-black color-palette">
-                                            <span>
-                                                #000000
-                                            </span>
-                                        </div>
-                                        <div class="bg-black disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center">Gray Dark</h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-gray-dark color-palette">
-                                            <span>
-                                                #343a40
-                                            </span>
-                                        </div>
-                                        <div class="bg-gray-dark disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center">
-                                        Gray
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-gray color-palette">
-                                            <span>
-                                                #adb5bd
-                                            </span>
-                                        </div>
-                                        <div class="bg-gray disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-light">
-                                        Light
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-light color-palette">
-                                            <span>
-                                                #1f2d3d
-                                            </span>
-                                        </div>
-                                        <div class="bg-light disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                            </div>
-                            <!-- /.row -->
-                            <div class="col-12">
-                                <h5 class="mt-3">
-                                    Colors
-                                </h5>
-                            </div>
-                            <!-- /.col-12 -->
-                            <div class="row">
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-indigo">
-                                        Indigo
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-indigo color-palette">
-                                            <span>
-                                                #6610f2
-                                            </span>
-                                        </div>
-                                        <div class="bg-indigo disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-lightblue">
-                                        Lightblue
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-lightblue color-palette">
-                                            <span>
-                                                #3c8dbc
-                                            </span>
-                                        </div>
-                                        <div class="bg-lightblue disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-navy">
-                                        Navy
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-navy color-palette">
-                                            <span>
-                                                #001f3f
-                                            </span>
-                                        </div>
-                                        <div class="bg-navy disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-purple">
-                                        Purple
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-purple color-palette">
-                                            <span>
-                                                #605ca8
-                                            </span>
-                                        </div>
-                                        <div class="bg-purple disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-fuchsia">
-                                        Fuchsia
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-fuchsia color-palette">
-                                            <span>
-                                                #f012be
-                                            </span>
-                                        </div>
-                                        <div class="bg-fuchsia disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-pink">
-                                        Pink
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-pink color-palette">
-                                            <span>
-                                                #e83e8c
-                                            </span>
-                                        </div>
-                                        <div class="bg-pink disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-maroon">
-                                        Maroon
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-maroon color-palette">
-                                            <span>
-                                                #d81b60
-                                            </span>
-                                        </div>
-                                        <div class="bg-maroon disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-orange">
-                                        Orange
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-orange color-palette">
-                                            <span>
-                                                #ff851b
-                                            </span>
-                                        </div>
-                                        <div class="bg-orange disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-lime">
-                                        Lime
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-lime color-palette">
-                                            <span>
-                                                #01ff70
-                                            </span>
-                                        </div>
-                                        <div class="bg-lime disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-teal">
-                                        Teal
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-teal color-palette">
-                                            <span>
-                                                #39cccc
-                                            </span>
-                                        </div>
-                                        <div class="bg-teal disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                                <div class="col-sm-4 col-md-2">
-                                    <h4 class="text-center bg-olive">
-                                        Olive
-                                    </h4>
-                                    <div class="color-palette-set">
-                                        <div class="bg-olive color-palette">
-                                            <span>
-                                                #3d9970
-                                            </span>
-                                        </div>
-                                        <div class="bg-olive disabled color-palette">
-                                            <span>
-                                                Disabled
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.col -->
-                            </div>
-                            <!-- /.row -->
-                        </div>
-                        <!-- /.card-body -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <!-- COLOR PALETTE -->
+                <div class="card card-default color-palette-box">
+                    <div class="card-header">
+                        <h3 class="card-title">
+                            <i class="fas fa-tag"></i>
+                            Color Palette
+                        </h3>
                     </div>
-                    <!-- /.card -->
-                    <!-- START ALERTS AND CALLOUTS -->
-                    <h5 class="mt-4 mb-2">
-                        Alerts and Callouts
-                    </h5>
-                    <div class="row">
-                        <div class="col-md-6">
-                            <div class="card card-default">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        <i class="fas fa-exclamation-triangle"></i>
-                                        Alerts
-                                    </h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <div class="alert alert-danger alert-dismissible">
-                                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
-                                            &times;
-                                        </button>
-                                        <h5>
-                                            <i class="icon fas fa-ban"></i>
-                                            Alert!
-                                        </h5>
-                                        Danger alert preview. This alert is dismissable. A wonderful serenity has taken possession of my
-                                        entire
-                                        soul, like these sweet mornings of spring which I enjoy with my whole heart.
-                                    </div>
-                                    <div class="alert alert-info alert-dismissible">
-                                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
-                                            &times;
-                                        </button>
-                                        <h5>
-                                            <i class="icon fas fa-info"></i>
-                                            Alert!
-                                        </h5>
-                                        Info alert preview. This alert is dismissable.
-                                    </div>
-                                    <div class="alert alert-warning alert-dismissible">
-                                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
-                                            &times;
-                                        </button>
-                                        <h5>
-                                            <i class="icon fas fa-exclamation-triangle"></i>
-                                            Alert!
-                                        </h5>
-                                        Warning alert preview. This alert is dismissable.
-                                    </div>
-                                    <div class="alert alert-success alert-dismissible">
-                                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
-                                            &times;
-                                        </button>
-                                        <h5>
-                                            <i class="icon fas fa-check"></i>
-                                            Alert!
-                                        </h5>
-                                        Success alert preview. This alert is dismissable.
-                                    </div>
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-6">
-                            <div class="card card-default">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        <i class="fas fa-bullhorn"></i>
-                                        Callouts
-                                    </h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <div class="callout callout-danger">
-                                        <h5>
-                                            I am a danger callout!
-                                        </h5>
-                                        <p>
-                                            There is a problem that we need to fix. A wonderful serenity has taken possession of my entire
-                                            soul,
-                                            like these sweet mornings of spring which I enjoy with my whole heart.
-                                        </p>
-                                    </div>
-                                    <div class="callout callout-info">
-                                        <h5>
-                                            I am an info callout!
-                                        </h5>
-                                        <p>
-                                            Follow the steps to continue to payment.
-                                        </p>
-                                    </div>
-                                    <div class="callout callout-warning">
-                                        <h5>
-                                            I am a warning callout!
-                                        </h5>
-                                        <p>
-                                            This is a yellow callout.
-                                        </p>
-                                    </div>
-                                    <div class="callout callout-success">
-                                        <h5>
-                                            I am a success callout!
-                                        </h5>
-                                        <p>
-                                            This is a green callout.
-                                        </p>
-                                    </div>
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- /.row -->
-                    <!-- END ALERTS AND CALLOUTS -->
-                    <h5 class="mt-4 mb-2">
-                        Tabs in Cards
-                    </h5>
-                    <div class="row">
+                    <div class="card-body">
                         <div class="col-12">
-                            <!-- Custom Tabs -->
-                            <div class="card">
-                                <div class="card-header d-flex p-0">
-                                    <h3 class="card-title p-3">
-                                        Tabs
-                                    </h3>
-                                    <ul class="nav nav-pills ml-auto p-2">
-                                        <li class="nav-item">
-                                            <a class="nav-link active" href="#tab_1" data-toggle="tab">
-                                                Tab 1
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link" href="#tab_2" data-toggle="tab">
-                                                Tab 2
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link" href="#tab_3" data-toggle="tab">
-                                                Tab 3
-                                            </a>
-                                        </li>
-                                        <li class="nav-item dropdown">
-                                            <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#">
-                                                Dropdown
-                                                <span class="caret"></span>
-                                            </a>
-                                            <div class="dropdown-menu">
-                                                <a class="dropdown-item" tabindex="-1" href="#">
-                                                    Action
-                                                </a>
-                                                <a class="dropdown-item" tabindex="-1" href="#">
-                                                    Another action
-                                                </a>
-                                                <a class="dropdown-item" tabindex="-1" href="#">
-                                                    Something else here
-                                                </a>
-                                                <div class="dropdown-divider"></div>
-                                                <a class="dropdown-item" tabindex="-1" href="#">
-                                                    Separated link
-                                                </a>
-                                            </div>
-                                        </li>
-                                    </ul>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <div class="tab-content">
-                                        <div class="tab-pane active" id="tab_1">
-                                            A wonderful serenity has taken possession of my entire soul,
-                                            like these sweet mornings of spring which I enjoy with my whole heart.
-                                            I am alone, and feel the charm of existence in this spot,
-                                            which was created for the bliss of souls like mine. I am so happy,
-                                            my dear friend, so absorbed in the exquisite sense of mere tranquil existence,
-                                            that I neglect my talents. I should be incapable of drawing a single stroke
-                                            at the present moment; and yet I feel that I never was a greater artist than now.
-                                        </div>
-                                        <!-- /.tab-pane -->
-                                        <div class="tab-pane" id="tab_2">
-                                            The European languages are members of the same family. Their separate existence is a myth.
-                                            For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ
-                                            in their grammar, their pronunciation and their most common words. Everyone realizes why a
-                                            new common language would be desirable: one could refuse to pay expensive translators. To
-                                            achieve this, it would be necessary to have uniform grammar, pronunciation and more common
-                                            words. If several languages coalesce, the grammar of the resulting language is more simple
-                                            and regular than that of the individual languages.
-                                        </div>
-                                        <!-- /.tab-pane -->
-                                        <div class="tab-pane" id="tab_3">
-                                            Lorem Ipsum is simply dummy text of the printing and typesetting industry.
-                                            Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
-                                            when an unknown printer took a galley of type and scrambled it to make a type specimen book.
-                                            It has survived not only five centuries, but also the leap into electronic typesetting,
-                                            remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset
-                                            sheets containing Lorem Ipsum passages, and more recently with desktop publishing software
-                                            like Aldus PageMaker including versions of Lorem Ipsum.
-                                        </div>
-                                        <!-- /.tab-pane -->
-                                    </div>
-                                    <!-- /.tab-content -->
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- ./card -->
+                            <h5>Theme Colors</h5>
                         </div>
-                        <!-- /.col -->
+                        <!-- /.col-12 -->
+                        <div class="row">
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center">Primary</h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-primary color-palette">
+                                        <span>#007bff</span>
+                                    </div>
+                                    <div class="bg-primary disabled color-palette">
+                                        <span>Disabled</span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center">Secondary</h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-secondary color-palette">
+                                        <span>#6c757d</span>
+                                    </div>
+                                    <div class="bg-secondary disabled color-palette">
+                                        <span>Disabled</span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center">Info</h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-info color-palette">
+                                        <span>#17a2b8</span>
+                                    </div>
+                                    <div class="bg-info disabled color-palette">
+                                        <span>Disabled</span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center">Success</h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-success color-palette">
+                                        <span>#28a745</span>
+                                    </div>
+                                    <div class="bg-success disabled color-palette">
+                                        <span>Disabled</span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-warning">Warning</h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-warning color-palette">
+                                        <span>
+                                            #ffc107
+                                        </span>
+                                    </div>
+                                    <div class="bg-warning disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center">Danger</h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-danger color-palette">
+                                        <span>
+                                            #dc3545
+                                        </span>
+                                    </div>
+                                    <div class="bg-danger disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                        </div>
+                        <!-- /.row -->
+                        <div class="col-12">
+                            <h5 class="mt-3">Black/White Nuances</h5>
+                        </div>
+                        <!-- /.col-12 -->
+                        <div class="row">
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center">Black</h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-black color-palette">
+                                        <span>
+                                            #000000
+                                        </span>
+                                    </div>
+                                    <div class="bg-black disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center">Gray Dark</h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-gray-dark color-palette">
+                                        <span>
+                                            #343a40
+                                        </span>
+                                    </div>
+                                    <div class="bg-gray-dark disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center">
+                                    Gray
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-gray color-palette">
+                                        <span>
+                                            #adb5bd
+                                        </span>
+                                    </div>
+                                    <div class="bg-gray disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-light">
+                                    Light
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-light color-palette">
+                                        <span>
+                                            #1f2d3d
+                                        </span>
+                                    </div>
+                                    <div class="bg-light disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                        </div>
+                        <!-- /.row -->
+                        <div class="col-12">
+                            <h5 class="mt-3">
+                                Colors
+                            </h5>
+                        </div>
+                        <!-- /.col-12 -->
+                        <div class="row">
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-indigo">
+                                    Indigo
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-indigo color-palette">
+                                        <span>
+                                            #6610f2
+                                        </span>
+                                    </div>
+                                    <div class="bg-indigo disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-lightblue">
+                                    Lightblue
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-lightblue color-palette">
+                                        <span>
+                                            #3c8dbc
+                                        </span>
+                                    </div>
+                                    <div class="bg-lightblue disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-navy">
+                                    Navy
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-navy color-palette">
+                                        <span>
+                                            #001f3f
+                                        </span>
+                                    </div>
+                                    <div class="bg-navy disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-purple">
+                                    Purple
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-purple color-palette">
+                                        <span>
+                                            #605ca8
+                                        </span>
+                                    </div>
+                                    <div class="bg-purple disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-fuchsia">
+                                    Fuchsia
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-fuchsia color-palette">
+                                        <span>
+                                            #f012be
+                                        </span>
+                                    </div>
+                                    <div class="bg-fuchsia disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-pink">
+                                    Pink
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-pink color-palette">
+                                        <span>
+                                            #e83e8c
+                                        </span>
+                                    </div>
+                                    <div class="bg-pink disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-maroon">
+                                    Maroon
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-maroon color-palette">
+                                        <span>
+                                            #d81b60
+                                        </span>
+                                    </div>
+                                    <div class="bg-maroon disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-orange">
+                                    Orange
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-orange color-palette">
+                                        <span>
+                                            #ff851b
+                                        </span>
+                                    </div>
+                                    <div class="bg-orange disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-lime">
+                                    Lime
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-lime color-palette">
+                                        <span>
+                                            #01ff70
+                                        </span>
+                                    </div>
+                                    <div class="bg-lime disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-teal">
+                                    Teal
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-teal color-palette">
+                                        <span>
+                                            #39cccc
+                                        </span>
+                                    </div>
+                                    <div class="bg-teal disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                            <div class="col-sm-4 col-md-2">
+                                <h4 class="text-center bg-olive">
+                                    Olive
+                                </h4>
+                                <div class="color-palette-set">
+                                    <div class="bg-olive color-palette">
+                                        <span>
+                                            #3d9970
+                                        </span>
+                                    </div>
+                                    <div class="bg-olive disabled color-palette">
+                                        <span>
+                                            Disabled
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.col -->
+                        </div>
+                        <!-- /.row -->
                     </div>
-                    <!-- /.row -->
-                    <!-- END CUSTOM TABS -->
-                    <!-- START PROGRESS BARS -->
-                    <h5 class="mt-4 mb-2">
-                        Progress Bars
-                    </h5>
-                    <div class="row">
-                        <div class="col-md-6">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Progress Bars Different Sizes
-                                    </h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <p>
-                                        <code>
-                                        .progress
-                                        </code>
-                                    </p>
-                                    <div class="progress">
-                                        <div class="progress-bar bg-primary progress-bar-striped"
-                                             role="progressbar"
-                                             aria-valuenow="40"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="width: 40%">
-                                            <span class="sr-only">
-                                                40% Complete (success)
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <p>
-                                        <code>
-                                        .progress-sm
-                                        </code>
-                                    </p>
-                                    <div class="progress progress-sm active">
-                                        <div class="progress-bar bg-success progress-bar-striped"
-                                             role="progressbar"
-                                             aria-valuenow="20"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="width: 20%">
-                                            <span class="sr-only">
-                                                20% Complete
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <p>
-                                        <code>
-                                        .progress-xs
-                                        </code>
-                                    </p>
-                                    <div class="progress progress-xs">
-                                        <div class="progress-bar bg-warning progress-bar-striped"
-                                             role="progressbar"
-                                             aria-valuenow="60"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="width: 60%">
-                                            <span class="sr-only">
-                                                60% Complete (warning)
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <p>
-                                        <code>
-                                        .progress-xxs
-                                        </code>
-                                    </p>
-                                    <div class="progress progress-xxs">
-                                        <div class="progress-bar progress-bar-danger progress-bar-striped"
-                                             role="progressbar"
-                                             aria-valuenow="60"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="width: 60%">
-                                            <span class="sr-only">
-                                                60% Complete (warning)
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card-body -->
+                    <!-- /.card-body -->
+                </div>
+                <!-- /.card -->
+                <!-- START ALERTS AND CALLOUTS -->
+                <h5 class="mt-4 mb-2">
+                    Alerts and Callouts
+                </h5>
+                <div class="row">
+                    <div class="col-md-6">
+                        <div class="card card-default">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-exclamation-triangle"></i>
+                                    Alerts
+                                </h3>
                             </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col (left) -->
-                        <div class="col-md-6">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Progress bars
-                                    </h3>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <div class="alert alert-danger alert-dismissible">
+                                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
+                                        &times;
+                                    </button>
+                                    <h5>
+                                        <i class="icon fas fa-ban"></i>
+                                        Alert!
+                                    </h5>
+                                    Danger alert preview. This alert is dismissable. A wonderful serenity has taken possession of my
+                                    entire
+                                    soul, like these sweet mornings of spring which I enjoy with my whole heart.
                                 </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <div class="progress mb-3">
-                                        <div class="progress-bar bg-success"
-                                             role="progressbar"
-                                             aria-valuenow="40"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="width: 40%">
-                                            <span class="sr-only">
-                                                40% Complete (success)
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <div class="progress mb-3">
-                                        <div class="progress-bar bg-info"
-                                             role="progressbar"
-                                             aria-valuenow="20"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="width: 20%">
-                                            <span class="sr-only">
-                                                20% Complete
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <div class="progress mb-3">
-                                        <div class="progress-bar bg-warning"
-                                             role="progressbar"
-                                             aria-valuenow="60"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="width: 60%">
-                                            <span class="sr-only">
-                                                60% Complete (warning)
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <div class="progress mb-3">
-                                        <div class="progress-bar bg-danger"
-                                             role="progressbar"
-                                             aria-valuenow="80"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="width: 80%">
-                                            <span class="sr-only">
-                                                80% Complete
-                                            </span>
-                                        </div>
-                                    </div>
+                                <div class="alert alert-info alert-dismissible">
+                                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
+                                        &times;
+                                    </button>
+                                    <h5>
+                                        <i class="icon fas fa-info"></i>
+                                        Alert!
+                                    </h5>
+                                    Info alert preview. This alert is dismissable.
+                                </div>
+                                <div class="alert alert-warning alert-dismissible">
+                                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
+                                        &times;
+                                    </button>
+                                    <h5>
+                                        <i class="icon fas fa-exclamation-triangle"></i>
+                                        Alert!
+                                    </h5>
+                                    Warning alert preview. This alert is dismissable.
+                                </div>
+                                <div class="alert alert-success alert-dismissible">
+                                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
+                                        &times;
+                                    </button>
+                                    <h5>
+                                        <i class="icon fas fa-check"></i>
+                                        Alert!
+                                    </h5>
+                                    Success alert preview. This alert is dismissable.
                                 </div>
-                                <!-- /.card-body -->
                             </div>
-                            <!-- /.card -->
+                            <!-- /.card-body -->
                         </div>
-                        <!-- /.col (right) -->
+                        <!-- /.card -->
                     </div>
-                    <!-- /.row -->
-                    <div class="row">
-                        <div class="col-md-6">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Vertical Progress Bars Different Sizes
-                                    </h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body text-center">
-                                    <p>
-                                        By adding the class
-                                        <code>
-                                        .vertical
-                                        </code>
-                                        and
-                                        <code>
-                                        .progress-sm
-                                        </code>
-                                        ,
-                                        <code>
-                                        .progress-xs
-                                        </code>
-                                        or
-                                        <code>
-                                        .progress-xxs
-                                        </code>
-                                        we achieve:
-                                    </p>
-                                    <div class="progress vertical active">
-                                        <div class="progress-bar bg-primary progress-bar-striped"
-                                             role="progressbar"
-                                             aria-valuenow="40"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="height: 40%">
-                                            <span class="sr-only">
-                                                40%
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <div class="progress vertical progress-sm">
-                                        <div class="progress-bar bg-success"
-                                             role="progressbar"
-                                             aria-valuenow="20"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="height: 100%">
-                                            <span class="sr-only">
-                                                100%
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <div class="progress vertical progress-xs">
-                                        <div class="progress-bar bg-warning progress-bar-striped"
-                                             role="progressbar"
-                                             aria-valuenow="60"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="height: 60%">
-                                            <span class="sr-only">
-                                                60%
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <div class="progress vertical progress-xxs">
-                                        <div class="progress-bar bg-info progress-bar-striped"
-                                             role="progressbar"
-                                             aria-valuenow="60"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="height: 60%">
-                                            <span class="sr-only">
-                                                60%
-                                            </span>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card-body -->
+                    <!-- /.col -->
+                    <div class="col-md-6">
+                        <div class="card card-default">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-bullhorn"></i>
+                                    Callouts
+                                </h3>
                             </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col (left) -->
-                        <div class="col-md-6">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Vertical Progress bars
-                                    </h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body text-center">
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <div class="callout callout-danger">
+                                    <h5>
+                                        I am a danger callout!
+                                    </h5>
                                     <p>
-                                        By adding the class
-                                        <code>
-                                        .vertical
-                                        </code>
-                                        we achieve:
+                                        There is a problem that we need to fix. A wonderful serenity has taken possession of my entire
+                                        soul,
+                                        like these sweet mornings of spring which I enjoy with my whole heart.
+                                    </p>
+                                </div>
+                                <div class="callout callout-info">
+                                    <h5>
+                                        I am an info callout!
+                                    </h5>
+                                    <p>
+                                        Follow the steps to continue to payment.
+                                    </p>
+                                </div>
+                                <div class="callout callout-warning">
+                                    <h5>
+                                        I am a warning callout!
+                                    </h5>
+                                    <p>
+                                        This is a yellow callout.
+                                    </p>
+                                </div>
+                                <div class="callout callout-success">
+                                    <h5>
+                                        I am a success callout!
+                                    </h5>
+                                    <p>
+                                        This is a green callout.
                                     </p>
-                                    <div class="progress vertical">
-                                        <div class="progress-bar bg-success"
-                                             role="progressbar"
-                                             aria-valuenow="40"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="height: 40%">
-                                            <span class="sr-only">
-                                                40%
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <div class="progress vertical">
-                                        <div class="progress-bar bg-info"
-                                             role="progressbar"
-                                             aria-valuenow="20"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="height: 20%">
-                                            <span class="sr-only">
-                                                20%
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <div class="progress vertical">
-                                        <div class="progress-bar bg-warning"
-                                             role="progressbar"
-                                             aria-valuenow="60"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="height: 60%">
-                                            <span class="sr-only">
-                                                60%
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <div class="progress vertical">
-                                        <div class="progress-bar bg-danger"
-                                             role="progressbar"
-                                             aria-valuenow="80"
-                                             aria-valuemin="0"
-                                             aria-valuemax="100"
-                                             style="height: 80%">
-                                            <span class="sr-only">
-                                                80%
-                                            </span>
-                                        </div>
-                                    </div>
                                 </div>
-                                <!-- /.card-body -->
                             </div>
-                            <!-- /.card -->
+                            <!-- /.card-body -->
                         </div>
-                        <!-- /.col (right) -->
+                        <!-- /.card -->
                     </div>
-                    <!-- /.row -->
-                    <!-- END PROGRESS BARS -->
-                    <!-- START ACCORDION & CAROUSEL-->
-                    <h5 class="mt-4 mb-2">
-                        Bootstrap Accordion & Carousel
-                    </h5>
-                    <div class="row">
-                        <div class="col-md-6">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Collapsible Accordion
-                                    </h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <!-- we are adding the accordion ID so Bootstrap's collapse plugin detects it -->
-                                    <div id="accordion">
-                                        <div class="card card-primary">
-                                            <div class="card-header">
-                                                <h4 class="card-title w-100">
-                                                    <a class="d-block w-100"
-                                                       data-toggle="collapse"
-                                                       href="#collapseOne">
-                                                        Collapsible Group Item #1
-                                                    </a>
-                                                </h4>
-                                            </div>
-                                            <div id="collapseOne" class="collapse show" data-parent="#accordion">
-                                                <div class="card-body">
-                                                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
-                                                    3
-                                                    wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
-                                                    laborum
-                                                    eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee
-                                                    nulla
-                                                    assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred
-                                                    nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft
-                                                    beer
-                                                    farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
-                                                    labore sustainable VHS.
-                                                </div>
-                                            </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- END ALERTS AND CALLOUTS -->
+                <h5 class="mt-4 mb-2">
+                    Tabs in Cards
+                </h5>
+                <div class="row">
+                    <div class="col-12">
+                        <!-- Custom Tabs -->
+                        <div class="card">
+                            <div class="card-header d-flex p-0">
+                                <h3 class="card-title p-3">
+                                    Tabs
+                                </h3>
+                                <ul class="nav nav-pills ml-auto p-2">
+                                    <li class="nav-item">
+                                        <a class="nav-link active" href="#tab_1" data-toggle="tab">
+                                            Tab 1
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link" href="#tab_2" data-toggle="tab">
+                                            Tab 2
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link" href="#tab_3" data-toggle="tab">
+                                            Tab 3
+                                        </a>
+                                    </li>
+                                    <li class="nav-item dropdown">
+                                        <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#">
+                                            Dropdown
+                                            <span class="caret"></span>
+                                        </a>
+                                        <div class="dropdown-menu">
+                                            <a class="dropdown-item" tabindex="-1" href="#">
+                                                Action
+                                            </a>
+                                            <a class="dropdown-item" tabindex="-1" href="#">
+                                                Another action
+                                            </a>
+                                            <a class="dropdown-item" tabindex="-1" href="#">
+                                                Something else here
+                                            </a>
+                                            <div class="dropdown-divider"></div>
+                                            <a class="dropdown-item" tabindex="-1" href="#">
+                                                Separated link
+                                            </a>
                                         </div>
-                                        <div class="card card-danger">
-                                            <div class="card-header">
-                                                <h4 class="card-title w-100">
-                                                    <a class="d-block w-100"
-                                                       data-toggle="collapse"
-                                                       href="#collapseTwo">
-                                                        Collapsible Group Danger
-                                                    </a>
-                                                </h4>
-                                            </div>
-                                            <div id="collapseTwo" class="collapse" data-parent="#accordion">
-                                                <div class="card-body">
-                                                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
-                                                    3
-                                                    wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
-                                                    laborum
-                                                    eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee
-                                                    nulla
-                                                    assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred
-                                                    nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft
-                                                    beer
-                                                    farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
-                                                    labore sustainable VHS.
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div class="card card-success">
-                                            <div class="card-header">
-                                                <h4 class="card-title w-100">
-                                                    <a class="d-block w-100"
-                                                       data-toggle="collapse"
-                                                       href="#collapseThree">
-                                                        Collapsible Group Success
-                                                    </a>
-                                                </h4>
-                                            </div>
-                                            <div id="collapseThree" class="collapse" data-parent="#accordion">
-                                                <div class="card-body">
-                                                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
-                                                    3
-                                                    wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
-                                                    laborum
-                                                    eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee
-                                                    nulla
-                                                    assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred
-                                                    nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft
-                                                    beer
-                                                    farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
-                                                    labore sustainable VHS.
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card-body -->
+                                    </li>
+                                </ul>
                             </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-6">
-                            <div class="card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Carousel
-                                    </h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
-                                        <ol class="carousel-indicators">
-                                            <li data-target="#carouselExampleIndicators"
-                                                data-slide-to="0"
-                                                class="active"></li>
-                                            <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
-                                            <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
-                                        </ol>
-                                        <div class="carousel-inner">
-                                            <div class="carousel-item active">
-                                                <img class="d-block w-100"
-                                                     src="https://placehold.it/900x500/39CCCC/ffffff&text=I+Love+Bootstrap"
-                                                     alt="First slide">
-                                                </div>
-                                                <div class="carousel-item">
-                                                    <img class="d-block w-100"
-                                                         src="https://placehold.it/900x500/3c8dbc/ffffff&text=I+Love+Bootstrap"
-                                                         alt="Second slide">
-                                                    </div>
-                                                    <div class="carousel-item">
-                                                        <img class="d-block w-100"
-                                                             src="https://placehold.it/900x500/f39c12/ffffff&text=I+Love+Bootstrap"
-                                                             alt="Third slide">
-                                                        </div>
-                                                    </div>
-                                                    <a class="carousel-control-prev"
-                                                       href="#carouselExampleIndicators"
-                                                       role="button"
-                                                       data-slide="prev">
-                                                        <span class="carousel-control-prev-icon"
-                                                              aria-hidden="true"></span>
-                                                        <span class="sr-only">
-                                                            Previous
-                                                        </span>
-                                                    </a>
-                                                    <a class="carousel-control-next"
-                                                       href="#carouselExampleIndicators"
-                                                       role="button"
-                                                       data-slide="next">
-                                                        <span class="carousel-control-next-icon"
-                                                              aria-hidden="true"></span>
-                                                        <span class="sr-only">
-                                                            Next
-                                                        </span>
-                                                    </a>
-                                                </div>
-                                            </div>
-                                            <!-- /.card-body -->
-                                        </div>
-                                        <!-- /.card -->
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <div class="tab-content">
+                                    <div class="tab-pane active" id="tab_1">
+                                        A wonderful serenity has taken possession of my entire soul,
+                                        like these sweet mornings of spring which I enjoy with my whole heart.
+                                        I am alone, and feel the charm of existence in this spot,
+                                        which was created for the bliss of souls like mine. I am so happy,
+                                        my dear friend, so absorbed in the exquisite sense of mere tranquil existence,
+                                        that I neglect my talents. I should be incapable of drawing a single stroke
+                                        at the present moment; and yet I feel that I never was a greater artist than now.
                                     </div>
-                                    <!-- /.col -->
+                                    <!-- /.tab-pane -->
+                                    <div class="tab-pane" id="tab_2">
+                                        The European languages are members of the same family. Their separate existence is a myth.
+                                        For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ
+                                        in their grammar, their pronunciation and their most common words. Everyone realizes why a
+                                        new common language would be desirable: one could refuse to pay expensive translators. To
+                                        achieve this, it would be necessary to have uniform grammar, pronunciation and more common
+                                        words. If several languages coalesce, the grammar of the resulting language is more simple
+                                        and regular than that of the individual languages.
+                                    </div>
+                                    <!-- /.tab-pane -->
+                                    <div class="tab-pane" id="tab_3">
+                                        Lorem Ipsum is simply dummy text of the printing and typesetting industry.
+                                        Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
+                                        when an unknown printer took a galley of type and scrambled it to make a type specimen book.
+                                        It has survived not only five centuries, but also the leap into electronic typesetting,
+                                        remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset
+                                        sheets containing Lorem Ipsum passages, and more recently with desktop publishing software
+                                        like Aldus PageMaker including versions of Lorem Ipsum.
+                                    </div>
+                                    <!-- /.tab-pane -->
                                 </div>
-                                <!-- /.row -->
-                                <!-- END ACCORDION & CAROUSEL-->
-                                <!-- START TYPOGRAPHY -->
-                                <h5 class="mt-4 mb-2">
-                                    Typography
+                                <!-- /.tab-content -->
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- ./card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- END CUSTOM TABS -->
+                <!-- START PROGRESS BARS -->
+                <h5 class="mt-4 mb-2">
+                    Progress Bars
+                </h5>
+                <div class="row">
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Progress Bars Different Sizes
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <p>
+                                    <code>
+                                    .progress
+                                    </code>
+                                </p>
+                                <div class="progress">
+                                    <div class="progress-bar bg-primary progress-bar-striped"
+                                         role="progressbar"
+                                         aria-valuenow="40"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="width: 40%">
+                                        <span class="sr-only">
+                                            40% Complete (success)
+                                        </span>
+                                    </div>
+                                </div>
+                                <p>
+                                    <code>
+                                    .progress-sm
+                                    </code>
+                                </p>
+                                <div class="progress progress-sm active">
+                                    <div class="progress-bar bg-success progress-bar-striped"
+                                         role="progressbar"
+                                         aria-valuenow="20"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="width: 20%">
+                                        <span class="sr-only">
+                                            20% Complete
+                                        </span>
+                                    </div>
+                                </div>
+                                <p>
+                                    <code>
+                                    .progress-xs
+                                    </code>
+                                </p>
+                                <div class="progress progress-xs">
+                                    <div class="progress-bar bg-warning progress-bar-striped"
+                                         role="progressbar"
+                                         aria-valuenow="60"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="width: 60%">
+                                        <span class="sr-only">
+                                            60% Complete (warning)
+                                        </span>
+                                    </div>
+                                </div>
+                                <p>
+                                    <code>
+                                    .progress-xxs
+                                    </code>
+                                </p>
+                                <div class="progress progress-xxs">
+                                    <div class="progress-bar progress-bar-danger progress-bar-striped"
+                                         role="progressbar"
+                                         aria-valuenow="60"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="width: 60%">
+                                        <span class="sr-only">
+                                            60% Complete (warning)
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col (left) -->
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Progress bars
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <div class="progress mb-3">
+                                    <div class="progress-bar bg-success"
+                                         role="progressbar"
+                                         aria-valuenow="40"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="width: 40%">
+                                        <span class="sr-only">
+                                            40% Complete (success)
+                                        </span>
+                                    </div>
+                                </div>
+                                <div class="progress mb-3">
+                                    <div class="progress-bar bg-info"
+                                         role="progressbar"
+                                         aria-valuenow="20"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="width: 20%">
+                                        <span class="sr-only">
+                                            20% Complete
+                                        </span>
+                                    </div>
+                                </div>
+                                <div class="progress mb-3">
+                                    <div class="progress-bar bg-warning"
+                                         role="progressbar"
+                                         aria-valuenow="60"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="width: 60%">
+                                        <span class="sr-only">
+                                            60% Complete (warning)
+                                        </span>
+                                    </div>
+                                </div>
+                                <div class="progress mb-3">
+                                    <div class="progress-bar bg-danger"
+                                         role="progressbar"
+                                         aria-valuenow="80"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="width: 80%">
+                                        <span class="sr-only">
+                                            80% Complete
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col (right) -->
+                </div>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Vertical Progress Bars Different Sizes
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body text-center">
+                                <p>
+                                    By adding the class
+                                    <code>
+                                    .vertical
+                                    </code>
+                                    and
+                                    <code>
+                                    .progress-sm
+                                    </code>
+                                    ,
+                                    <code>
+                                    .progress-xs
+                                    </code>
+                                    or
+                                    <code>
+                                    .progress-xxs
+                                    </code>
+                                    we achieve:
+                                </p>
+                                <div class="progress vertical active">
+                                    <div class="progress-bar bg-primary progress-bar-striped"
+                                         role="progressbar"
+                                         aria-valuenow="40"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="height: 40%">
+                                        <span class="sr-only">
+                                            40%
+                                        </span>
+                                    </div>
+                                </div>
+                                <div class="progress vertical progress-sm">
+                                    <div class="progress-bar bg-success"
+                                         role="progressbar"
+                                         aria-valuenow="20"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="height: 100%">
+                                        <span class="sr-only">
+                                            100%
+                                        </span>
+                                    </div>
+                                </div>
+                                <div class="progress vertical progress-xs">
+                                    <div class="progress-bar bg-warning progress-bar-striped"
+                                         role="progressbar"
+                                         aria-valuenow="60"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="height: 60%">
+                                        <span class="sr-only">
+                                            60%
+                                        </span>
+                                    </div>
+                                </div>
+                                <div class="progress vertical progress-xxs">
+                                    <div class="progress-bar bg-info progress-bar-striped"
+                                         role="progressbar"
+                                         aria-valuenow="60"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="height: 60%">
+                                        <span class="sr-only">
+                                            60%
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col (left) -->
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Vertical Progress bars
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body text-center">
+                                <p>
+                                    By adding the class
+                                    <code>
+                                    .vertical
+                                    </code>
+                                    we achieve:
+                                </p>
+                                <div class="progress vertical">
+                                    <div class="progress-bar bg-success"
+                                         role="progressbar"
+                                         aria-valuenow="40"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="height: 40%">
+                                        <span class="sr-only">
+                                            40%
+                                        </span>
+                                    </div>
+                                </div>
+                                <div class="progress vertical">
+                                    <div class="progress-bar bg-info"
+                                         role="progressbar"
+                                         aria-valuenow="20"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="height: 20%">
+                                        <span class="sr-only">
+                                            20%
+                                        </span>
+                                    </div>
+                                </div>
+                                <div class="progress vertical">
+                                    <div class="progress-bar bg-warning"
+                                         role="progressbar"
+                                         aria-valuenow="60"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="height: 60%">
+                                        <span class="sr-only">
+                                            60%
+                                        </span>
+                                    </div>
+                                </div>
+                                <div class="progress vertical">
+                                    <div class="progress-bar bg-danger"
+                                         role="progressbar"
+                                         aria-valuenow="80"
+                                         aria-valuemin="0"
+                                         aria-valuemax="100"
+                                         style="height: 80%">
+                                        <span class="sr-only">
+                                            80%
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col (right) -->
+                </div>
+                <!-- /.row -->
+                <!-- END PROGRESS BARS -->
+                <!-- START ACCORDION & CAROUSEL-->
+                <h5 class="mt-4 mb-2">
+                    Bootstrap Accordion & Carousel
+                </h5>
+                <div class="row">
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Collapsible Accordion
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <!-- we are adding the accordion ID so Bootstrap's collapse plugin detects it -->
+                                <div id="accordion">
+                                    <div class="card card-primary">
+                                        <div class="card-header">
+                                            <h4 class="card-title w-100">
+                                                <a class="d-block w-100" data-toggle="collapse" href="#collapseOne">
+                                                    Collapsible Group Item #1
+                                                </a>
+                                            </h4>
+                                        </div>
+                                        <div id="collapseOne" class="collapse show" data-parent="#accordion">
+                                            <div class="card-body">
+                                                Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
+                                                3
+                                                wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
+                                                laborum
+                                                eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee
+                                                nulla
+                                                assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred
+                                                nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft
+                                                beer
+                                                farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
+                                                labore sustainable VHS.
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="card card-danger">
+                                        <div class="card-header">
+                                            <h4 class="card-title w-100">
+                                                <a class="d-block w-100" data-toggle="collapse" href="#collapseTwo">
+                                                    Collapsible Group Danger
+                                                </a>
+                                            </h4>
+                                        </div>
+                                        <div id="collapseTwo" class="collapse" data-parent="#accordion">
+                                            <div class="card-body">
+                                                Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
+                                                3
+                                                wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
+                                                laborum
+                                                eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee
+                                                nulla
+                                                assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred
+                                                nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft
+                                                beer
+                                                farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
+                                                labore sustainable VHS.
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="card card-success">
+                                        <div class="card-header">
+                                            <h4 class="card-title w-100">
+                                                <a class="d-block w-100" data-toggle="collapse" href="#collapseThree">
+                                                    Collapsible Group Success
+                                                </a>
+                                            </h4>
+                                        </div>
+                                        <div id="collapseThree" class="collapse" data-parent="#accordion">
+                                            <div class="card-body">
+                                                Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
+                                                3
+                                                wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
+                                                laborum
+                                                eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee
+                                                nulla
+                                                assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred
+                                                nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft
+                                                beer
+                                                farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
+                                                labore sustainable VHS.
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Carousel
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
+                                    <ol class="carousel-indicators">
+                                        <li data-target="#carouselExampleIndicators"
+                                            data-slide-to="0"
+                                            class="active"></li>
+                                        <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
+                                        <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
+                                    </ol>
+                                    <div class="carousel-inner">
+                                        <div class="carousel-item active">
+                                            <img class="d-block w-100"
+                                                 src="https://placehold.it/900x500/39CCCC/ffffff&text=I+Love+Bootstrap"
+                                                 alt="First slide">
+                                        </div>
+                                        <div class="carousel-item">
+                                            <img class="d-block w-100"
+                                                 src="https://placehold.it/900x500/3c8dbc/ffffff&text=I+Love+Bootstrap"
+                                                 alt="Second slide">
+                                        </div>
+                                        <div class="carousel-item">
+                                            <img class="d-block w-100"
+                                                 src="https://placehold.it/900x500/f39c12/ffffff&text=I+Love+Bootstrap"
+                                                 alt="Third slide">
+                                        </div>
+                                    </div>
+                                    <a class="carousel-control-prev"
+                                       href="#carouselExampleIndicators"
+                                       role="button"
+                                       data-slide="prev">
+                                        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+                                        <span class="sr-only">
+                                            Previous
+                                        </span>
+                                    </a>
+                                    <a class="carousel-control-next"
+                                       href="#carouselExampleIndicators"
+                                       role="button"
+                                       data-slide="next">
+                                        <span class="carousel-control-next-icon" aria-hidden="true"></span>
+                                        <span class="sr-only">
+                                            Next
+                                        </span>
+                                    </a>
+                                </div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- END ACCORDION & CAROUSEL-->
+                <!-- START TYPOGRAPHY -->
+                <h5 class="mt-4 mb-2">
+                    Typography
+                </h5>
+                <div class="row">
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-text-width"></i>
+                                    Headlines
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <h1>
+                                    h1. Bootstrap heading
+                                </h1>
+                                <h2>
+                                    h2. Bootstrap heading
+                                </h2>
+                                <h3>
+                                    h3. Bootstrap heading
+                                </h3>
+                                <h4>
+                                    h4. Bootstrap heading
+                                </h4>
+                                <h5>
+                                    h5. Bootstrap heading
                                 </h5>
-                                <div class="row">
-                                    <div class="col-md-6">
-                                        <div class="card">
-                                            <div class="card-header">
-                                                <h3 class="card-title">
-                                                    <i class="fas fa-text-width"></i>
-                                                    Headlines
-                                                </h3>
-                                            </div>
-                                            <!-- /.card-header -->
-                                            <div class="card-body">
-                                                <h1>
-                                                    h1. Bootstrap heading
-                                                </h1>
-                                                <h2>
-                                                    h2. Bootstrap heading
-                                                </h2>
-                                                <h3>
-                                                    h3. Bootstrap heading
-                                                </h3>
-                                                <h4>
-                                                    h4. Bootstrap heading
-                                                </h4>
-                                                <h5>
-                                                    h5. Bootstrap heading
-                                                </h5>
-                                                <h6>
-                                                    h6. Bootstrap heading
-                                                </h6>
-                                            </div>
-                                            <!-- /.card-body -->
-                                        </div>
-                                        <!-- /.card -->
-                                    </div>
-                                    <!-- ./col -->
-                                    <div class="col-md-6">
-                                        <div class="card">
-                                            <div class="card-header">
-                                                <h3 class="card-title">
-                                                    <i class="fas fa-text-width"></i>
-                                                    Text Emphasis
-                                                </h3>
-                                            </div>
-                                            <!-- /.card-header -->
-                                            <div class="card-body">
-                                                <p class="lead">
-                                                    Lead to emphasize importance
-                                                </p>
-                                                <p class="text-success">
-                                                    Text green to emphasize success
-                                                </p>
-                                                <p class="text-info">
-                                                    Text aqua to emphasize info
-                                                </p>
-                                                <p class="text-primary">
-                                                    Text light blue to emphasize info (2)
-                                                </p>
-                                                <p class="text-danger">
-                                                    Text red to emphasize danger
-                                                </p>
-                                                <p class="text-warning">
-                                                    Text yellow to emphasize warning
-                                                </p>
-                                                <p class="text-muted">
-                                                    Text muted to emphasize general
-                                                </p>
-                                            </div>
-                                            <!-- /.card-body -->
-                                        </div>
-                                        <!-- /.card -->
-                                    </div>
-                                    <!-- ./col -->
-                                </div>
-                                <!-- /.row -->
-                                <div class="row">
-                                    <div class="col-md-6">
-                                        <div class="card">
-                                            <div class="card-header">
-                                                <h3 class="card-title">
-                                                    <i class="fas fa-text-width"></i>
-                                                    Primary Block Quotes
-                                                </h3>
-                                            </div>
-                                            <!-- /.card-header -->
-                                            <div class="card-body">
-                                                <blockquote>
-                                                    <p>
-                                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
-                                                    </p>
-                                                    <small>
-                                                    Someone famous in
-                                                    <cite title="Source Title">
-                                                    Source Title
-                                                    </cite>
-                                                    </small>
-                                                </blockquote>
-                                            </div>
-                                            <!-- /.card-body -->
-                                        </div>
-                                        <!-- /.card -->
-                                    </div>
-                                    <!-- ./col -->
-                                    <div class="col-md-6">
-                                        <div class="card">
-                                            <div class="card-header">
-                                                <h3 class="card-title">
-                                                    <i class="fas fa-text-width"></i>
-                                                    Secondary Block Quotes
-                                                </h3>
-                                            </div>
-                                            <!-- /.card-header -->
-                                            <div class="card-body clearfix">
-                                                <blockquote class="quote-secondary">
-                                                    <p>
-                                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
-                                                    </p>
-                                                    <small>
-                                                    Someone famous in
-                                                    <cite title="Source Title">
-                                                    Source Title
-                                                    </cite>
-                                                    </small>
-                                                </blockquote>
-                                            </div>
-                                            <!-- /.card-body -->
-                                        </div>
-                                        <!-- /.card -->
-                                    </div>
-                                    <!-- ./col -->
-                                </div>
-                                <!-- /.row -->
-                                <div class="row">
-                                    <div class="col-md-4">
-                                        <div class="card">
-                                            <div class="card-header">
-                                                <h3 class="card-title">
-                                                    <i class="fas fa-text-width"></i>
-                                                    Unordered List
-                                                </h3>
-                                            </div>
-                                            <!-- /.card-header -->
-                                            <div class="card-body">
-                                                <ul>
-                                                    <li>
-                                                        Lorem ipsum dolor sit amet
-                                                    </li>
-                                                    <li>
-                                                        Consectetur adipiscing elit
-                                                    </li>
-                                                    <li>
-                                                        Integer molestie lorem at massa
-                                                    </li>
-                                                    <li>
-                                                        Facilisis in pretium nisl aliquet
-                                                    </li>
-                                                    <li>
-                                                        Nulla volutpat aliquam velit
-                                                        <ul>
-                                                            <li>
-                                                                Phasellus iaculis neque
-                                                            </li>
-                                                            <li>
-                                                                Purus sodales ultricies
-                                                            </li>
-                                                            <li>
-                                                                Vestibulum laoreet porttitor sem
-                                                            </li>
-                                                            <li>
-                                                                Ac tristique libero volutpat at
-                                                            </li>
-                                                        </ul>
-                                                    </li>
-                                                    <li>
-                                                        Faucibus porta lacus fringilla vel
-                                                    </li>
-                                                    <li>
-                                                        Aenean sit amet erat nunc
-                                                    </li>
-                                                    <li>
-                                                        Eget porttitor lorem
-                                                    </li>
-                                                </ul>
-                                            </div>
-                                            <!-- /.card-body -->
-                                        </div>
-                                        <!-- /.card -->
-                                    </div>
-                                    <!-- ./col -->
-                                    <div class="col-md-4">
-                                        <div class="card">
-                                            <div class="card-header">
-                                                <h3 class="card-title">
-                                                    <i class="fas fa-text-width"></i>
-                                                    Ordered Lists
-                                                </h3>
-                                            </div>
-                                            <!-- /.card-header -->
-                                            <div class="card-body">
-                                                <ol>
-                                                    <li>
-                                                        Lorem ipsum dolor sit amet
-                                                    </li>
-                                                    <li>
-                                                        Consectetur adipiscing elit
-                                                    </li>
-                                                    <li>
-                                                        Integer molestie lorem at massa
-                                                    </li>
-                                                    <li>
-                                                        Facilisis in pretium nisl aliquet
-                                                    </li>
-                                                    <li>
-                                                        Nulla volutpat aliquam velit
-                                                        <ol>
-                                                            <li>
-                                                                Phasellus iaculis neque
-                                                            </li>
-                                                            <li>
-                                                                Purus sodales ultricies
-                                                            </li>
-                                                            <li>
-                                                                Vestibulum laoreet porttitor sem
-                                                            </li>
-                                                            <li>
-                                                                Ac tristique libero volutpat at
-                                                            </li>
-                                                        </ol>
-                                                    </li>
-                                                    <li>
-                                                        Faucibus porta lacus fringilla vel
-                                                    </li>
-                                                    <li>
-                                                        Aenean sit amet erat nunc
-                                                    </li>
-                                                    <li>
-                                                        Eget porttitor lorem
-                                                    </li>
-                                                </ol>
-                                            </div>
-                                            <!-- /.card-body -->
-                                        </div>
-                                        <!-- /.card -->
-                                    </div>
-                                    <!-- ./col -->
-                                    <div class="col-md-4">
-                                        <div class="card">
-                                            <div class="card-header">
-                                                <h3 class="card-title">
-                                                    <i class="fas fa-text-width"></i>
-                                                    Unstyled List
-                                                </h3>
-                                            </div>
-                                            <!-- /.card-header -->
-                                            <div class="card-body">
-                                                <ul class="list-unstyled">
-                                                    <li>
-                                                        Lorem ipsum dolor sit amet
-                                                    </li>
-                                                    <li>
-                                                        Consectetur adipiscing elit
-                                                    </li>
-                                                    <li>
-                                                        Integer molestie lorem at massa
-                                                    </li>
-                                                    <li>
-                                                        Facilisis in pretium nisl aliquet
-                                                    </li>
-                                                    <li>
-                                                        Nulla volutpat aliquam velit
-                                                        <ul>
-                                                            <li>
-                                                                Phasellus iaculis neque
-                                                            </li>
-                                                            <li>
-                                                                Purus sodales ultricies
-                                                            </li>
-                                                            <li>
-                                                                Vestibulum laoreet porttitor sem
-                                                            </li>
-                                                            <li>
-                                                                Ac tristique libero volutpat at
-                                                            </li>
-                                                        </ul>
-                                                    </li>
-                                                    <li>
-                                                        Faucibus porta lacus fringilla vel
-                                                    </li>
-                                                    <li>
-                                                        Aenean sit amet erat nunc
-                                                    </li>
-                                                    <li>
-                                                        Eget porttitor lorem
-                                                    </li>
-                                                </ul>
-                                            </div>
-                                            <!-- /.card-body -->
-                                        </div>
-                                        <!-- /.card -->
-                                    </div>
-                                    <!-- ./col -->
-                                </div>
-                                <!-- /.row -->
-                                <div class="row">
-                                    <div class="col-md-6">
-                                        <div class="card">
-                                            <div class="card-header">
-                                                <h3 class="card-title">
-                                                    <i class="fas fa-text-width"></i>
-                                                    Description
-                                                </h3>
-                                            </div>
-                                            <!-- /.card-header -->
-                                            <div class="card-body">
-                                                <dl>
-                                                    <dt>
-                                                    Description lists
-                                                    </dt>
-                                                    <dd>
-                                                    A description list is perfect for defining terms.
-                                                    </dd>
-                                                    <dt>
-                                                    Euismod
-                                                    </dt>
-                                                    <dd>
-                                                    Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
-                                                    </dd>
-                                                    <dd>
-                                                    Donec id elit non mi porta gravida at eget metus.
-                                                    </dd>
-                                                    <dt>
-                                                    Malesuada porta
-                                                    </dt>
-                                                    <dd>
-                                                    Etiam porta sem malesuada magna mollis euismod.
-                                                    </dd>
-                                                </dl>
-                                            </div>
-                                            <!-- /.card-body -->
-                                        </div>
-                                        <!-- /.card -->
-                                    </div>
-                                    <!-- ./col -->
-                                    <div class="col-md-6">
-                                        <div class="card">
-                                            <div class="card-header">
-                                                <h3 class="card-title">
-                                                    <i class="fas fa-text-width"></i>
-                                                    Description Horizontal
-                                                </h3>
-                                            </div>
-                                            <!-- /.card-header -->
-                                            <div class="card-body">
-                                                <dl class="row">
-                                                    <dt class="col-sm-4">
-                                                    Description lists
-                                                    </dt>
-                                                    <dd class="col-sm-8">
-                                                    A description list is perfect for defining terms.
-                                                    </dd>
-                                                    <dt class="col-sm-4">
-                                                    Euismod
-                                                    </dt>
-                                                    <dd class="col-sm-8">
-                                                    Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
-                                                    </dd>
-                                                    <dd class="col-sm-8 offset-sm-4">
-                                                    Donec id elit non mi porta gravida at eget metus.
-                                                    </dd>
-                                                    <dt class="col-sm-4">
-                                                    Malesuada porta
-                                                    </dt>
-                                                    <dd class="col-sm-8">
-                                                    Etiam porta sem malesuada magna mollis euismod.
-                                                    </dd>
-                                                    <dt class="col-sm-4">
-                                                    Felis euismod semper eget lacinia
-                                                    </dt>
-                                                    <dd class="col-sm-8">
-                                                    Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo
-                                                    sit amet risus.
-                                                    </dd>
-                                                </dl>
-                                            </div>
-                                            <!-- /.card-body -->
-                                        </div>
-                                        <!-- /.card -->
-                                    </div>
-                                    <!-- ./col -->
-                                </div>
-                                <!-- /.row -->
-                                <!-- END TYPOGRAPHY -->
+                                <h6>
+                                    h6. Bootstrap heading
+                                </h6>
                             </div>
-                            <!-- /.container-fluid -->
-                        </section>
-                        <!-- /.content -->
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
                     </div>
-                {% endblock content %}
-                <!-- Specific Page JS goes HERE -->
-                {% block javascripts %}
-                    <!-- jQuery -->
-                    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                    <!-- Bootstrap 4 -->
-                    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                    <!-- AdminLTE App -->
-                    <script src="/static/assets/js/adminlte.min.js"></script>
-                    <!-- AdminLTE for demo purposes -->
-                    <script src="/static/assets/js/demo.js"></script>
-                {% endblock javascripts %}
+                    <!-- ./col -->
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-text-width"></i>
+                                    Text Emphasis
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <p class="lead">
+                                    Lead to emphasize importance
+                                </p>
+                                <p class="text-success">
+                                    Text green to emphasize success
+                                </p>
+                                <p class="text-info">
+                                    Text aqua to emphasize info
+                                </p>
+                                <p class="text-primary">
+                                    Text light blue to emphasize info (2)
+                                </p>
+                                <p class="text-danger">
+                                    Text red to emphasize danger
+                                </p>
+                                <p class="text-warning">
+                                    Text yellow to emphasize warning
+                                </p>
+                                <p class="text-muted">
+                                    Text muted to emphasize general
+                                </p>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- ./col -->
+                </div>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-text-width"></i>
+                                    Primary Block Quotes
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <blockquote>
+                                    <p>
+                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
+                                    </p>
+                                    <small>
+                                    Someone famous in
+                                    <cite title="Source Title">
+                                    Source Title
+                                    </cite>
+                                    </small>
+                                </blockquote>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- ./col -->
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-text-width"></i>
+                                    Secondary Block Quotes
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body clearfix">
+                                <blockquote class="quote-secondary">
+                                    <p>
+                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
+                                    </p>
+                                    <small>
+                                    Someone famous in
+                                    <cite title="Source Title">
+                                    Source Title
+                                    </cite>
+                                    </small>
+                                </blockquote>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- ./col -->
+                </div>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-md-4">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-text-width"></i>
+                                    Unordered List
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <ul>
+                                    <li>
+                                        Lorem ipsum dolor sit amet
+                                    </li>
+                                    <li>
+                                        Consectetur adipiscing elit
+                                    </li>
+                                    <li>
+                                        Integer molestie lorem at massa
+                                    </li>
+                                    <li>
+                                        Facilisis in pretium nisl aliquet
+                                    </li>
+                                    <li>
+                                        Nulla volutpat aliquam velit
+                                        <ul>
+                                            <li>
+                                                Phasellus iaculis neque
+                                            </li>
+                                            <li>
+                                                Purus sodales ultricies
+                                            </li>
+                                            <li>
+                                                Vestibulum laoreet porttitor sem
+                                            </li>
+                                            <li>
+                                                Ac tristique libero volutpat at
+                                            </li>
+                                        </ul>
+                                    </li>
+                                    <li>
+                                        Faucibus porta lacus fringilla vel
+                                    </li>
+                                    <li>
+                                        Aenean sit amet erat nunc
+                                    </li>
+                                    <li>
+                                        Eget porttitor lorem
+                                    </li>
+                                </ul>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- ./col -->
+                    <div class="col-md-4">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-text-width"></i>
+                                    Ordered Lists
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <ol>
+                                    <li>
+                                        Lorem ipsum dolor sit amet
+                                    </li>
+                                    <li>
+                                        Consectetur adipiscing elit
+                                    </li>
+                                    <li>
+                                        Integer molestie lorem at massa
+                                    </li>
+                                    <li>
+                                        Facilisis in pretium nisl aliquet
+                                    </li>
+                                    <li>
+                                        Nulla volutpat aliquam velit
+                                        <ol>
+                                            <li>
+                                                Phasellus iaculis neque
+                                            </li>
+                                            <li>
+                                                Purus sodales ultricies
+                                            </li>
+                                            <li>
+                                                Vestibulum laoreet porttitor sem
+                                            </li>
+                                            <li>
+                                                Ac tristique libero volutpat at
+                                            </li>
+                                        </ol>
+                                    </li>
+                                    <li>
+                                        Faucibus porta lacus fringilla vel
+                                    </li>
+                                    <li>
+                                        Aenean sit amet erat nunc
+                                    </li>
+                                    <li>
+                                        Eget porttitor lorem
+                                    </li>
+                                </ol>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- ./col -->
+                    <div class="col-md-4">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-text-width"></i>
+                                    Unstyled List
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <ul class="list-unstyled">
+                                    <li>
+                                        Lorem ipsum dolor sit amet
+                                    </li>
+                                    <li>
+                                        Consectetur adipiscing elit
+                                    </li>
+                                    <li>
+                                        Integer molestie lorem at massa
+                                    </li>
+                                    <li>
+                                        Facilisis in pretium nisl aliquet
+                                    </li>
+                                    <li>
+                                        Nulla volutpat aliquam velit
+                                        <ul>
+                                            <li>
+                                                Phasellus iaculis neque
+                                            </li>
+                                            <li>
+                                                Purus sodales ultricies
+                                            </li>
+                                            <li>
+                                                Vestibulum laoreet porttitor sem
+                                            </li>
+                                            <li>
+                                                Ac tristique libero volutpat at
+                                            </li>
+                                        </ul>
+                                    </li>
+                                    <li>
+                                        Faucibus porta lacus fringilla vel
+                                    </li>
+                                    <li>
+                                        Aenean sit amet erat nunc
+                                    </li>
+                                    <li>
+                                        Eget porttitor lorem
+                                    </li>
+                                </ul>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- ./col -->
+                </div>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-text-width"></i>
+                                    Description
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <dl>
+                                    <dt>
+                                    Description lists
+                                    </dt>
+                                    <dd>
+                                    A description list is perfect for defining terms.
+                                    </dd>
+                                    <dt>
+                                    Euismod
+                                    </dt>
+                                    <dd>
+                                    Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
+                                    </dd>
+                                    <dd>
+                                    Donec id elit non mi porta gravida at eget metus.
+                                    </dd>
+                                    <dt>
+                                    Malesuada porta
+                                    </dt>
+                                    <dd>
+                                    Etiam porta sem malesuada magna mollis euismod.
+                                    </dd>
+                                </dl>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- ./col -->
+                    <div class="col-md-6">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-text-width"></i>
+                                    Description Horizontal
+                                </h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <dl class="row">
+                                    <dt class="col-sm-4">
+                                    Description lists
+                                    </dt>
+                                    <dd class="col-sm-8">
+                                    A description list is perfect for defining terms.
+                                    </dd>
+                                    <dt class="col-sm-4">
+                                    Euismod
+                                    </dt>
+                                    <dd class="col-sm-8">
+                                    Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
+                                    </dd>
+                                    <dd class="col-sm-8 offset-sm-4">
+                                    Donec id elit non mi porta gravida at eget metus.
+                                    </dd>
+                                    <dt class="col-sm-4">
+                                    Malesuada porta
+                                    </dt>
+                                    <dd class="col-sm-8">
+                                    Etiam porta sem malesuada magna mollis euismod.
+                                    </dd>
+                                    <dt class="col-sm-4">
+                                    Felis euismod semper eget lacinia
+                                    </dt>
+                                    <dd class="col-sm-8">
+                                    Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo
+                                    sit amet risus.
+                                    </dd>
+                                </dl>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- ./col -->
+                </div>
+                <!-- /.row -->
+                <!-- END TYPOGRAPHY -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/ui-icons.html b/tests/jinja_adminlte/ui-icons.html
index f342f8d..d20495f 100644
--- a/tests/jinja_adminlte/ui-icons.html
+++ b/tests/jinja_adminlte/ui-icons.html
@@ -2,82 +2,82 @@
 {% block title %}UI Icons {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>Icons</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    Icons
-                                </li>
-                            </ol>
-                        </div>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>Icons</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                Icons
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <div class="card card-primary card-outline">
-                        <div class="card-header">
-                            <h3 class="card-title">Icons</h3>
-                        </div>
-                        <!-- /.card-body -->
-                        <div class="card-body">
-                            <p>
-                                You can use any font library you like with AdminLTE 3.
-                            </p>
-                            <strong>Recommendations</strong>
-                            <div>
-                                <a href="https://fontawesome.com/">
-                                    Font Awesome
-                                </a>
-                                <br>
-                                <a href="https://useiconic.com/open/">
-                                    Iconic Icons
-                                </a>
-                                <br>
-                                <a href="https://ionicons.com/">Ion Icons</a>
-                                <br>
-                            </div>
-                        </div>
-                        <!-- /.card-body -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <div class="card card-primary card-outline">
+                    <div class="card-header">
+                        <h3 class="card-title">Icons</h3>
                     </div>
+                    <!-- /.card-body -->
+                    <div class="card-body">
+                        <p>
+                            You can use any font library you like with AdminLTE 3.
+                        </p>
+                        <strong>Recommendations</strong>
+                        <div>
+                            <a href="https://fontawesome.com/">
+                                Font Awesome
+                            </a>
+                            <br>
+                            <a href="https://useiconic.com/open/">
+                                Iconic Icons
+                            </a>
+                            <br>
+                            <a href="https://ionicons.com/">Ion Icons</a>
+                            <br>
+                        </div>
+                    </div>
+                    <!-- /.card-body -->
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- /.content -->
-        </div>
-    {% endblock content %}
-    <!-- Specific Page JS goes HERE -->
-    {% block javascripts %}
-        <!-- jQuery -->
-        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-        <!-- Bootstrap 4 -->
-        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-        <!-- AdminLTE App -->
-        <script src="/static/assets/js/adminlte.min.js"></script>
-        <!-- AdminLTE for demo purposes -->
-        <script src="/static/assets/js/demo.js"></script>
-    {% endblock javascripts %}
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/ui-modals.html b/tests/jinja_adminlte/ui-modals.html
index 9849b16..f1b6ef1 100644
--- a/tests/jinja_adminlte/ui-modals.html
+++ b/tests/jinja_adminlte/ui-modals.html
@@ -2,621 +2,621 @@
 {% block title %}UI Modals {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- SweetAlert2 -->
-        <link rel="stylesheet" href="/static/assets/plugins/sweetalert2-theme-bootstrap-4/bootstrap-4.min.css">
-        <!-- Toastr -->
-        <link rel="stylesheet" href="/static/assets/plugins/toastr/toastr.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- SweetAlert2 -->
+    <link rel="stylesheet" href="/static/assets/plugins/sweetalert2-theme-bootstrap-4/bootstrap-4.min.css">
+    <!-- Toastr -->
+    <link rel="stylesheet" href="/static/assets/plugins/toastr/toastr.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>
+                            Modals & Alerts
+                            <small>
+                            new
+                            </small>
+                        </h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
                                 Modals & Alerts
-                                <small>
-                                new
-                                </small>
-                            </h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    Modals & Alerts
-                                </li>
-                            </ol>
-                        </div>
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-md-12">
-                            <div class="card card-primary card-outline">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        <i class="fas fa-edit"></i>
-                                        Modal Examples
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    <button type="button"
-                                            class="btn btn-default"
-                                            data-toggle="modal"
-                                            data-target="#modal-default">
-                                        Launch Default Modal
-                                    </button>
-                                    <button type="button"
-                                            class="btn btn-primary"
-                                            data-toggle="modal"
-                                            data-target="#modal-primary">
-                                        Launch Primary Modal
-                                    </button>
-                                    <button type="button"
-                                            class="btn btn-secondary"
-                                            data-toggle="modal"
-                                            data-target="#modal-secondary">
-                                        Launch Secondary Modal
-                                    </button>
-                                    <button type="button"
-                                            class="btn btn-info"
-                                            data-toggle="modal"
-                                            data-target="#modal-info">
-                                        Launch Info Modal
-                                    </button>
-                                    <button type="button"
-                                            class="btn btn-danger"
-                                            data-toggle="modal"
-                                            data-target="#modal-danger">
-                                        Launch Danger Modal
-                                    </button>
-                                    <button type="button"
-                                            class="btn btn-warning"
-                                            data-toggle="modal"
-                                            data-target="#modal-warning">
-                                        Launch Warning Modal
-                                    </button>
-                                    <button type="button"
-                                            class="btn btn-success"
-                                            data-toggle="modal"
-                                            data-target="#modal-success">
-                                        Launch Success Modal
-                                    </button>
-                                    <br />
-                                    <br />
-                                    <button type="button"
-                                            class="btn btn-default"
-                                            data-toggle="modal"
-                                            data-target="#modal-sm">
-                                        Launch Small Modal
-                                    </button>
-                                    <button type="button"
-                                            class="btn btn-default"
-                                            data-toggle="modal"
-                                            data-target="#modal-lg">
-                                        Launch Large Modal
-                                    </button>
-                                    <button type="button"
-                                            class="btn btn-default"
-                                            data-toggle="modal"
-                                            data-target="#modal-xl">
-                                        Launch Extra Large Modal
-                                    </button>
-                                    <br />
-                                    <br />
-                                    <button type="button"
-                                            class="btn btn-default"
-                                            data-toggle="modal"
-                                            data-target="#modal-overlay">
-                                        Launch Modal with Overlay
-                                    </button>
-                                    <div class="text-muted mt-3">
-                                        Instructions for how to use modals are available on the
-                                        <a href="https://getbootstrap.com/docs/4.4/components/modal/">
-                                            Bootstrap documentation
-                                        </a>
-                                    </div>
-                                </div>
-                                <!-- /.card -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-md-12">
+                        <div class="card card-primary card-outline">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-edit"></i>
+                                    Modal Examples
+                                </h3>
                             </div>
-                            <div class="card card-info card-outline">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        <i class="fas fa-edit"></i>
-                                        Toasts Examples
-                                        <small>
-                                        built in AdminLTE
-                                        </small>
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    <button type="button" class="btn btn-default toastsDefaultDefault">
-                                        Launch Default Toast
-                                    </button>
-                                    <button type="button" class="btn btn-default toastsDefaultFull">
-                                        Launch Full Toast (with icon)
-                                    </button>
-                                    <button type="button" class="btn btn-default toastsDefaultFullImage">
-                                        Launch Full Toast (with image)
-                                    </button>
-                                    <button type="button" class="btn btn-default toastsDefaultAutohide">
-                                        Launch Default Toasts with autohide
-                                    </button>
-                                    <button type="button" class="btn btn-default toastsDefaultNotFixed">
-                                        Launch Default Toasts with not fixed
-                                    </button>
-                                    <br />
-                                    <br />
-                                    <button type="button" class="btn btn-default toastsDefaultTopLeft">
-                                        Launch Default Toast (topLeft)
-                                    </button>
-                                    <button type="button" class="btn btn-default toastsDefaultBottomRight">
-                                        Launch Default Toast (bottomRight)
-                                    </button>
-                                    <button type="button" class="btn btn-default toastsDefaultBottomLeft">
-                                        Launch Default Toast (bottomLeft)
-                                    </button>
-                                    <br />
-                                    <br />
-                                    <button type="button" class="btn btn-success toastsDefaultSuccess">
-                                        Launch Success Toast
-                                    </button>
-                                    <button type="button" class="btn btn-info toastsDefaultInfo">
-                                        Launch Info Toast
-                                    </button>
-                                    <button type="button" class="btn btn-warning toastsDefaultWarning">
-                                        Launch Warning Toast
-                                    </button>
-                                    <button type="button" class="btn btn-danger toastsDefaultDanger">
-                                        Launch Danger Toast
-                                    </button>
-                                    <button type="button" class="btn btn-default bg-maroon toastsDefaultMaroon">
-                                        Launch Maroon Toast
-                                    </button>
-                                    <div class="text-muted mt-3"></div>
+                            <div class="card-body">
+                                <button type="button"
+                                        class="btn btn-default"
+                                        data-toggle="modal"
+                                        data-target="#modal-default">
+                                    Launch Default Modal
+                                </button>
+                                <button type="button"
+                                        class="btn btn-primary"
+                                        data-toggle="modal"
+                                        data-target="#modal-primary">
+                                    Launch Primary Modal
+                                </button>
+                                <button type="button"
+                                        class="btn btn-secondary"
+                                        data-toggle="modal"
+                                        data-target="#modal-secondary">
+                                    Launch Secondary Modal
+                                </button>
+                                <button type="button"
+                                        class="btn btn-info"
+                                        data-toggle="modal"
+                                        data-target="#modal-info">
+                                    Launch Info Modal
+                                </button>
+                                <button type="button"
+                                        class="btn btn-danger"
+                                        data-toggle="modal"
+                                        data-target="#modal-danger">
+                                    Launch Danger Modal
+                                </button>
+                                <button type="button"
+                                        class="btn btn-warning"
+                                        data-toggle="modal"
+                                        data-target="#modal-warning">
+                                    Launch Warning Modal
+                                </button>
+                                <button type="button"
+                                        class="btn btn-success"
+                                        data-toggle="modal"
+                                        data-target="#modal-success">
+                                    Launch Success Modal
+                                </button>
+                                <br />
+                                <br />
+                                <button type="button"
+                                        class="btn btn-default"
+                                        data-toggle="modal"
+                                        data-target="#modal-sm">
+                                    Launch Small Modal
+                                </button>
+                                <button type="button"
+                                        class="btn btn-default"
+                                        data-toggle="modal"
+                                        data-target="#modal-lg">
+                                    Launch Large Modal
+                                </button>
+                                <button type="button"
+                                        class="btn btn-default"
+                                        data-toggle="modal"
+                                        data-target="#modal-xl">
+                                    Launch Extra Large Modal
+                                </button>
+                                <br />
+                                <br />
+                                <button type="button"
+                                        class="btn btn-default"
+                                        data-toggle="modal"
+                                        data-target="#modal-overlay">
+                                    Launch Modal with Overlay
+                                </button>
+                                <div class="text-muted mt-3">
+                                    Instructions for how to use modals are available on the
+                                    <a href="https://getbootstrap.com/docs/4.4/components/modal/">
+                                        Bootstrap documentation
+                                    </a>
                                 </div>
                             </div>
-                            <div class="card card-success card-outline">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        <i class="fas fa-edit"></i>
-                                        SweetAlert2 Examples
-                                    </h3>
+                            <!-- /.card -->
+                        </div>
+                        <div class="card card-info card-outline">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-edit"></i>
+                                    Toasts Examples
+                                    <small>
+                                    built in AdminLTE
+                                    </small>
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                <button type="button" class="btn btn-default toastsDefaultDefault">
+                                    Launch Default Toast
+                                </button>
+                                <button type="button" class="btn btn-default toastsDefaultFull">
+                                    Launch Full Toast (with icon)
+                                </button>
+                                <button type="button" class="btn btn-default toastsDefaultFullImage">
+                                    Launch Full Toast (with image)
+                                </button>
+                                <button type="button" class="btn btn-default toastsDefaultAutohide">
+                                    Launch Default Toasts with autohide
+                                </button>
+                                <button type="button" class="btn btn-default toastsDefaultNotFixed">
+                                    Launch Default Toasts with not fixed
+                                </button>
+                                <br />
+                                <br />
+                                <button type="button" class="btn btn-default toastsDefaultTopLeft">
+                                    Launch Default Toast (topLeft)
+                                </button>
+                                <button type="button" class="btn btn-default toastsDefaultBottomRight">
+                                    Launch Default Toast (bottomRight)
+                                </button>
+                                <button type="button" class="btn btn-default toastsDefaultBottomLeft">
+                                    Launch Default Toast (bottomLeft)
+                                </button>
+                                <br />
+                                <br />
+                                <button type="button" class="btn btn-success toastsDefaultSuccess">
+                                    Launch Success Toast
+                                </button>
+                                <button type="button" class="btn btn-info toastsDefaultInfo">
+                                    Launch Info Toast
+                                </button>
+                                <button type="button" class="btn btn-warning toastsDefaultWarning">
+                                    Launch Warning Toast
+                                </button>
+                                <button type="button" class="btn btn-danger toastsDefaultDanger">
+                                    Launch Danger Toast
+                                </button>
+                                <button type="button" class="btn btn-default bg-maroon toastsDefaultMaroon">
+                                    Launch Maroon Toast
+                                </button>
+                                <div class="text-muted mt-3"></div>
+                            </div>
+                        </div>
+                        <div class="card card-success card-outline">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-edit"></i>
+                                    SweetAlert2 Examples
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                <button type="button" class="btn btn-success swalDefaultSuccess">
+                                    Launch Success Toast
+                                </button>
+                                <button type="button" class="btn btn-info swalDefaultInfo">
+                                    Launch Info Toast
+                                </button>
+                                <button type="button" class="btn btn-danger swalDefaultError">
+                                    Launch Error Toast
+                                </button>
+                                <button type="button" class="btn btn-warning swalDefaultWarning">
+                                    Launch Warning Toast
+                                </button>
+                                <button type="button" class="btn btn-default swalDefaultQuestion">
+                                    Launch Question Toast
+                                </button>
+                                <div class="text-muted mt-3">
+                                    For more examples look at
+                                    <a href="https://sweetalert2.github.io/">
+                                        https://sweetalert2.github.io/
+                                    </a>
                                 </div>
-                                <div class="card-body">
-                                    <button type="button" class="btn btn-success swalDefaultSuccess">
-                                        Launch Success Toast
-                                    </button>
-                                    <button type="button" class="btn btn-info swalDefaultInfo">
-                                        Launch Info Toast
-                                    </button>
-                                    <button type="button" class="btn btn-danger swalDefaultError">
-                                        Launch Error Toast
-                                    </button>
-                                    <button type="button" class="btn btn-warning swalDefaultWarning">
-                                        Launch Warning Toast
-                                    </button>
-                                    <button type="button" class="btn btn-default swalDefaultQuestion">
-                                        Launch Question Toast
-                                    </button>
-                                    <div class="text-muted mt-3">
-                                        For more examples look at
-                                        <a href="https://sweetalert2.github.io/">
-                                            https://sweetalert2.github.io/
-                                        </a>
-                                    </div>
+                            </div>
+                            <!-- /.card -->
+                        </div>
+                        <div class="card card-warning card-outline">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-edit"></i>
+                                    Toastr Examples
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                <button type="button" class="btn btn-success toastrDefaultSuccess">
+                                    Launch Success Toast
+                                </button>
+                                <button type="button" class="btn btn-info toastrDefaultInfo">
+                                    Launch Info Toast
+                                </button>
+                                <button type="button" class="btn btn-danger toastrDefaultError">
+                                    Launch Error Toast
+                                </button>
+                                <button type="button" class="btn btn-warning toastrDefaultWarning">
+                                    Launch Warning Toast
+                                </button>
+                                <div class="text-muted mt-3">
+                                    For more examples look at
+                                    <a href="https://codeseven.github.io/toastr/">
+                                        https://codeseven.github.io/toastr/
+                                    </a>
                                 </div>
-                                <!-- /.card -->
-                            </div>
-                            <div class="card card-warning card-outline">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        <i class="fas fa-edit"></i>
-                                        Toastr Examples
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    <button type="button" class="btn btn-success toastrDefaultSuccess">
-                                        Launch Success Toast
-                                    </button>
-                                    <button type="button" class="btn btn-info toastrDefaultInfo">
-                                        Launch Info Toast
-                                    </button>
-                                    <button type="button" class="btn btn-danger toastrDefaultError">
-                                        Launch Error Toast
-                                    </button>
-                                    <button type="button" class="btn btn-warning toastrDefaultWarning">
-                                        Launch Warning Toast
-                                    </button>
-                                    <div class="text-muted mt-3">
-                                        For more examples look at
-                                        <a href="https://codeseven.github.io/toastr/">
-                                            https://codeseven.github.io/toastr/
-                                        </a>
-                                    </div>
-                                </div>
-                                <!-- /.card -->
                             </div>
+                            <!-- /.card -->
                         </div>
-                        <!-- /.col -->
                     </div>
-                    <!-- ./row -->
+                    <!-- /.col -->
                 </div>
-                <!-- /.container-fluid -->
-                <div class="modal fade" id="modal-default">
-                    <div class="modal-dialog">
-                        <div class="modal-content">
-                            <div class="modal-header">
-                                <h4 class="modal-title">Default Modal</h4>
-                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                    <span aria-hidden="true">&times;</span>
-                                </button>
-                            </div>
-                            <div class="modal-body">
-                                <p>
-                                    One fine body&hellip;
-                                </p>
-                            </div>
-                            <div class="modal-footer justify-content-between">
-                                <button type="button" class="btn btn-default" data-dismiss="modal">
-                                    Close
-                                </button>
-                                <button type="button" class="btn btn-primary">
-                                    Save changes
-                                </button>
-                            </div>
+                <!-- ./row -->
+            </div>
+            <!-- /.container-fluid -->
+            <div class="modal fade" id="modal-default">
+                <div class="modal-dialog">
+                    <div class="modal-content">
+                        <div class="modal-header">
+                            <h4 class="modal-title">Default Modal</h4>
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">&times;</span>
+                            </button>
                         </div>
-                        <!-- /.modal-content -->
-                    </div>
-                    <!-- /.modal-dialog -->
-                </div>
-                <!-- /.modal -->
-                <div class="modal fade" id="modal-overlay">
-                    <div class="modal-dialog">
-                        <div class="modal-content">
-                            <div class="overlay d-flex justify-content-center align-items-center">
-                                <i class="fas fa-2x fa-sync fa-spin"></i>
-                            </div>
-                            <div class="modal-header">
-                                <h4 class="modal-title">Default Modal</h4>
-                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                    <span aria-hidden="true">&times;</span>
-                                </button>
-                            </div>
-                            <div class="modal-body">
-                                <p>
-                                    One fine body&hellip;
-                                </p>
-                            </div>
-                            <div class="modal-footer justify-content-between">
-                                <button type="button" class="btn btn-default" data-dismiss="modal">
-                                    Close
-                                </button>
-                                <button type="button" class="btn btn-primary">
-                                    Save changes
-                                </button>
-                            </div>
+                        <div class="modal-body">
+                            <p>
+                                One fine body&hellip;
+                            </p>
                         </div>
-                        <!-- /.modal-content -->
-                    </div>
-                    <!-- /.modal-dialog -->
-                </div>
-                <!-- /.modal -->
-                <div class="modal fade" id="modal-primary">
-                    <div class="modal-dialog">
-                        <div class="modal-content bg-primary">
-                            <div class="modal-header">
-                                <h4 class="modal-title">Primary Modal</h4>
-                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                    <span aria-hidden="true">&times;</span>
-                                </button>
-                            </div>
-                            <div class="modal-body">
-                                <p>
-                                    One fine body&hellip;
-                                </p>
-                            </div>
-                            <div class="modal-footer justify-content-between">
-                                <button type="button" class="btn btn-outline-light" data-dismiss="modal">
-                                    Close
-                                </button>
-                                <button type="button" class="btn btn-outline-light">
-                                    Save changes
-                                </button>
-                            </div>
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-default" data-dismiss="modal">
+                                Close
+                            </button>
+                            <button type="button" class="btn btn-primary">
+                                Save changes
+                            </button>
                         </div>
-                        <!-- /.modal-content -->
                     </div>
-                    <!-- /.modal-dialog -->
+                    <!-- /.modal-content -->
                 </div>
-                <!-- /.modal -->
-                <div class="modal fade" id="modal-secondary">
-                    <div class="modal-dialog">
-                        <div class="modal-content bg-secondary">
-                            <div class="modal-header">
-                                <h4 class="modal-title">Secondary Modal</h4>
-                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                    <span aria-hidden="true">&times;</span>
-                                </button>
-                            </div>
-                            <div class="modal-body">
-                                <p>
-                                    One fine body&hellip;
-                                </p>
-                            </div>
-                            <div class="modal-footer justify-content-between">
-                                <button type="button" class="btn btn-outline-light" data-dismiss="modal">
-                                    Close
-                                </button>
-                                <button type="button" class="btn btn-outline-light">
-                                    Save changes
-                                </button>
-                            </div>
+                <!-- /.modal-dialog -->
+            </div>
+            <!-- /.modal -->
+            <div class="modal fade" id="modal-overlay">
+                <div class="modal-dialog">
+                    <div class="modal-content">
+                        <div class="overlay d-flex justify-content-center align-items-center">
+                            <i class="fas fa-2x fa-sync fa-spin"></i>
                         </div>
-                        <!-- /.modal-content -->
-                    </div>
-                    <!-- /.modal-dialog -->
-                </div>
-                <!-- /.modal -->
-                <div class="modal fade" id="modal-info">
-                    <div class="modal-dialog">
-                        <div class="modal-content bg-info">
-                            <div class="modal-header">
-                                <h4 class="modal-title">Info Modal</h4>
-                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                    <span aria-hidden="true">
-                                        &times;
-                                    </span>
-                                </button>
-                            </div>
-                            <div class="modal-body">
-                                <p>
-                                    One fine body&hellip;
-                                </p>
-                            </div>
-                            <div class="modal-footer justify-content-between">
-                                <button type="button" class="btn btn-outline-light" data-dismiss="modal">
-                                    Close
-                                </button>
-                                <button type="button" class="btn btn-outline-light">
-                                    Save changes
-                                </button>
-                            </div>
+                        <div class="modal-header">
+                            <h4 class="modal-title">Default Modal</h4>
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">&times;</span>
+                            </button>
                         </div>
-                        <!-- /.modal-content -->
-                    </div>
-                    <!-- /.modal-dialog -->
-                </div>
-                <!-- /.modal -->
-                <div class="modal fade" id="modal-warning">
-                    <div class="modal-dialog">
-                        <div class="modal-content bg-warning">
-                            <div class="modal-header">
-                                <h4 class="modal-title">
-                                    Warning Modal
-                                </h4>
-                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                    <span aria-hidden="true">
-                                        &times;
-                                    </span>
-                                </button>
-                            </div>
-                            <div class="modal-body">
-                                <p>
-                                    One fine body&hellip;
-                                </p>
-                            </div>
-                            <div class="modal-footer justify-content-between">
-                                <button type="button" class="btn btn-outline-dark" data-dismiss="modal">
-                                    Close
-                                </button>
-                                <button type="button" class="btn btn-outline-dark">
-                                    Save changes
-                                </button>
-                            </div>
+                        <div class="modal-body">
+                            <p>
+                                One fine body&hellip;
+                            </p>
                         </div>
-                        <!-- /.modal-content -->
-                    </div>
-                    <!-- /.modal-dialog -->
-                </div>
-                <!-- /.modal -->
-                <div class="modal fade" id="modal-success">
-                    <div class="modal-dialog">
-                        <div class="modal-content bg-success">
-                            <div class="modal-header">
-                                <h4 class="modal-title">
-                                    Success Modal
-                                </h4>
-                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                    <span aria-hidden="true">
-                                        &times;
-                                    </span>
-                                </button>
-                            </div>
-                            <div class="modal-body">
-                                <p>
-                                    One fine body&hellip;
-                                </p>
-                            </div>
-                            <div class="modal-footer justify-content-between">
-                                <button type="button" class="btn btn-outline-light" data-dismiss="modal">
-                                    Close
-                                </button>
-                                <button type="button" class="btn btn-outline-light">
-                                    Save changes
-                                </button>
-                            </div>
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-default" data-dismiss="modal">
+                                Close
+                            </button>
+                            <button type="button" class="btn btn-primary">
+                                Save changes
+                            </button>
                         </div>
-                        <!-- /.modal-content -->
                     </div>
-                    <!-- /.modal-dialog -->
+                    <!-- /.modal-content -->
                 </div>
-                <!-- /.modal -->
-                <div class="modal fade" id="modal-danger">
-                    <div class="modal-dialog">
-                        <div class="modal-content bg-danger">
-                            <div class="modal-header">
-                                <h4 class="modal-title">
-                                    Danger Modal
-                                </h4>
-                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                    <span aria-hidden="true">
-                                        &times;
-                                    </span>
-                                </button>
-                            </div>
-                            <div class="modal-body">
-                                <p>
-                                    One fine body&hellip;
-                                </p>
-                            </div>
-                            <div class="modal-footer justify-content-between">
-                                <button type="button" class="btn btn-outline-light" data-dismiss="modal">
-                                    Close
-                                </button>
-                                <button type="button" class="btn btn-outline-light">
-                                    Save changes
-                                </button>
-                            </div>
+                <!-- /.modal-dialog -->
+            </div>
+            <!-- /.modal -->
+            <div class="modal fade" id="modal-primary">
+                <div class="modal-dialog">
+                    <div class="modal-content bg-primary">
+                        <div class="modal-header">
+                            <h4 class="modal-title">Primary Modal</h4>
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">&times;</span>
+                            </button>
                         </div>
-                        <!-- /.modal-content -->
-                    </div>
-                    <!-- /.modal-dialog -->
-                </div>
-                <!-- /.modal -->
-                <div class="modal fade" id="modal-sm">
-                    <div class="modal-dialog modal-sm">
-                        <div class="modal-content">
-                            <div class="modal-header">
-                                <h4 class="modal-title">
-                                    Small Modal
-                                </h4>
-                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                    <span aria-hidden="true">
-                                        &times;
-                                    </span>
-                                </button>
-                            </div>
-                            <div class="modal-body">
-                                <p>
-                                    One fine body&hellip;
-                                </p>
-                            </div>
-                            <div class="modal-footer justify-content-between">
-                                <button type="button" class="btn btn-default" data-dismiss="modal">
-                                    Close
-                                </button>
-                                <button type="button" class="btn btn-primary">
-                                    Save changes
-                                </button>
-                            </div>
+                        <div class="modal-body">
+                            <p>
+                                One fine body&hellip;
+                            </p>
                         </div>
-                        <!-- /.modal-content -->
-                    </div>
-                    <!-- /.modal-dialog -->
-                </div>
-                <!-- /.modal -->
-                <div class="modal fade" id="modal-lg">
-                    <div class="modal-dialog modal-lg">
-                        <div class="modal-content">
-                            <div class="modal-header">
-                                <h4 class="modal-title">
-                                    Large Modal
-                                </h4>
-                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                    <span aria-hidden="true">
-                                        &times;
-                                    </span>
-                                </button>
-                            </div>
-                            <div class="modal-body">
-                                <p>
-                                    One fine body&hellip;
-                                </p>
-                            </div>
-                            <div class="modal-footer justify-content-between">
-                                <button type="button" class="btn btn-default" data-dismiss="modal">
-                                    Close
-                                </button>
-                                <button type="button" class="btn btn-primary">
-                                    Save changes
-                                </button>
-                            </div>
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-outline-light" data-dismiss="modal">
+                                Close
+                            </button>
+                            <button type="button" class="btn btn-outline-light">
+                                Save changes
+                            </button>
                         </div>
-                        <!-- /.modal-content -->
                     </div>
-                    <!-- /.modal-dialog -->
+                    <!-- /.modal-content -->
                 </div>
-                <!-- /.modal -->
-                <div class="modal fade" id="modal-xl">
-                    <div class="modal-dialog modal-xl">
-                        <div class="modal-content">
-                            <div class="modal-header">
-                                <h4 class="modal-title">
-                                    Extra Large Modal
-                                </h4>
-                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                    <span aria-hidden="true">
-                                        &times;
-                                    </span>
-                                </button>
-                            </div>
-                            <div class="modal-body">
-                                <p>
-                                    One fine body&hellip;
-                                </p>
-                            </div>
-                            <div class="modal-footer justify-content-between">
-                                <button type="button" class="btn btn-default" data-dismiss="modal">
-                                    Close
-                                </button>
-                                <button type="button" class="btn btn-primary">
-                                    Save changes
-                                </button>
-                            </div>
+                <!-- /.modal-dialog -->
+            </div>
+            <!-- /.modal -->
+            <div class="modal fade" id="modal-secondary">
+                <div class="modal-dialog">
+                    <div class="modal-content bg-secondary">
+                        <div class="modal-header">
+                            <h4 class="modal-title">Secondary Modal</h4>
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">&times;</span>
+                            </button>
+                        </div>
+                        <div class="modal-body">
+                            <p>
+                                One fine body&hellip;
+                            </p>
+                        </div>
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-outline-light" data-dismiss="modal">
+                                Close
+                            </button>
+                            <button type="button" class="btn btn-outline-light">
+                                Save changes
+                            </button>
                         </div>
-                        <!-- /.modal-content -->
                     </div>
-                    <!-- /.modal-dialog -->
+                    <!-- /.modal-content -->
                 </div>
-                <!-- /.modal -->
-            </section>
-            <!-- /.content -->
-        </div>
-    {% endblock content %}
-    <!-- Specific Page JS goes HERE -->
-    {% block javascripts %}
-        <!-- jQuery -->
-        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-        <!-- Bootstrap 4 -->
-        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-        <!-- SweetAlert2 -->
-        <script src="/static/assets/plugins/sweetalert2/sweetalert2.min.js"></script>
-        <!-- Toastr -->
-        <script src="/static/assets/plugins/toastr/toastr.min.js"></script>
-        <!-- AdminLTE App -->
-        <script src="/static/assets/js/adminlte.min.js"></script>
-        <!-- AdminLTE for demo purposes -->
-        <script src="/static/assets/js/demo.js"></script>
-        <script>
+                <!-- /.modal-dialog -->
+            </div>
+            <!-- /.modal -->
+            <div class="modal fade" id="modal-info">
+                <div class="modal-dialog">
+                    <div class="modal-content bg-info">
+                        <div class="modal-header">
+                            <h4 class="modal-title">Info Modal</h4>
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">
+                                    &times;
+                                </span>
+                            </button>
+                        </div>
+                        <div class="modal-body">
+                            <p>
+                                One fine body&hellip;
+                            </p>
+                        </div>
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-outline-light" data-dismiss="modal">
+                                Close
+                            </button>
+                            <button type="button" class="btn btn-outline-light">
+                                Save changes
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.modal-content -->
+                </div>
+                <!-- /.modal-dialog -->
+            </div>
+            <!-- /.modal -->
+            <div class="modal fade" id="modal-warning">
+                <div class="modal-dialog">
+                    <div class="modal-content bg-warning">
+                        <div class="modal-header">
+                            <h4 class="modal-title">
+                                Warning Modal
+                            </h4>
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">
+                                    &times;
+                                </span>
+                            </button>
+                        </div>
+                        <div class="modal-body">
+                            <p>
+                                One fine body&hellip;
+                            </p>
+                        </div>
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-outline-dark" data-dismiss="modal">
+                                Close
+                            </button>
+                            <button type="button" class="btn btn-outline-dark">
+                                Save changes
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.modal-content -->
+                </div>
+                <!-- /.modal-dialog -->
+            </div>
+            <!-- /.modal -->
+            <div class="modal fade" id="modal-success">
+                <div class="modal-dialog">
+                    <div class="modal-content bg-success">
+                        <div class="modal-header">
+                            <h4 class="modal-title">
+                                Success Modal
+                            </h4>
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">
+                                    &times;
+                                </span>
+                            </button>
+                        </div>
+                        <div class="modal-body">
+                            <p>
+                                One fine body&hellip;
+                            </p>
+                        </div>
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-outline-light" data-dismiss="modal">
+                                Close
+                            </button>
+                            <button type="button" class="btn btn-outline-light">
+                                Save changes
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.modal-content -->
+                </div>
+                <!-- /.modal-dialog -->
+            </div>
+            <!-- /.modal -->
+            <div class="modal fade" id="modal-danger">
+                <div class="modal-dialog">
+                    <div class="modal-content bg-danger">
+                        <div class="modal-header">
+                            <h4 class="modal-title">
+                                Danger Modal
+                            </h4>
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">
+                                    &times;
+                                </span>
+                            </button>
+                        </div>
+                        <div class="modal-body">
+                            <p>
+                                One fine body&hellip;
+                            </p>
+                        </div>
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-outline-light" data-dismiss="modal">
+                                Close
+                            </button>
+                            <button type="button" class="btn btn-outline-light">
+                                Save changes
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.modal-content -->
+                </div>
+                <!-- /.modal-dialog -->
+            </div>
+            <!-- /.modal -->
+            <div class="modal fade" id="modal-sm">
+                <div class="modal-dialog modal-sm">
+                    <div class="modal-content">
+                        <div class="modal-header">
+                            <h4 class="modal-title">
+                                Small Modal
+                            </h4>
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">
+                                    &times;
+                                </span>
+                            </button>
+                        </div>
+                        <div class="modal-body">
+                            <p>
+                                One fine body&hellip;
+                            </p>
+                        </div>
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-default" data-dismiss="modal">
+                                Close
+                            </button>
+                            <button type="button" class="btn btn-primary">
+                                Save changes
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.modal-content -->
+                </div>
+                <!-- /.modal-dialog -->
+            </div>
+            <!-- /.modal -->
+            <div class="modal fade" id="modal-lg">
+                <div class="modal-dialog modal-lg">
+                    <div class="modal-content">
+                        <div class="modal-header">
+                            <h4 class="modal-title">
+                                Large Modal
+                            </h4>
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">
+                                    &times;
+                                </span>
+                            </button>
+                        </div>
+                        <div class="modal-body">
+                            <p>
+                                One fine body&hellip;
+                            </p>
+                        </div>
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-default" data-dismiss="modal">
+                                Close
+                            </button>
+                            <button type="button" class="btn btn-primary">
+                                Save changes
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.modal-content -->
+                </div>
+                <!-- /.modal-dialog -->
+            </div>
+            <!-- /.modal -->
+            <div class="modal fade" id="modal-xl">
+                <div class="modal-dialog modal-xl">
+                    <div class="modal-content">
+                        <div class="modal-header">
+                            <h4 class="modal-title">
+                                Extra Large Modal
+                            </h4>
+                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                <span aria-hidden="true">
+                                    &times;
+                                </span>
+                            </button>
+                        </div>
+                        <div class="modal-body">
+                            <p>
+                                One fine body&hellip;
+                            </p>
+                        </div>
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-default" data-dismiss="modal">
+                                Close
+                            </button>
+                            <button type="button" class="btn btn-primary">
+                                Save changes
+                            </button>
+                        </div>
+                    </div>
+                    <!-- /.modal-content -->
+                </div>
+                <!-- /.modal-dialog -->
+            </div>
+            <!-- /.modal -->
+        </section>
+        <!-- /.content -->
+    </div>
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- SweetAlert2 -->
+    <script src="/static/assets/plugins/sweetalert2/sweetalert2.min.js"></script>
+    <!-- Toastr -->
+    <script src="/static/assets/plugins/toastr/toastr.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+    <script>
     $(function() {
       var Toast = Swal.mixin({
         toast: true,
@@ -770,5 +770,5 @@
       });
     });
 
-        </script>
-    {% endblock javascripts %}
+    </script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/ui-navbar.html b/tests/jinja_adminlte/ui-navbar.html
index aa6408f..546f610 100644
--- a/tests/jinja_adminlte/ui-navbar.html
+++ b/tests/jinja_adminlte/ui-navbar.html
@@ -2,1115 +2,1097 @@
 {% block title %}UI Navbar {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- SweetAlert2 -->
-        <link rel="stylesheet" href="/static/assets/plugins/sweetalert2/sweetalert2.min.css">
-        <!-- Toastr -->
-        <link rel="stylesheet" href="/static/assets/plugins/toastr/toastr.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- SweetAlert2 -->
+    <link rel="stylesheet" href="/static/assets/plugins/sweetalert2/sweetalert2.min.css">
+    <!-- Toastr -->
+    <link rel="stylesheet" href="/static/assets/plugins/toastr/toastr.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>
+                            Navbar & Tabs
+                            <small>
+                            new
+                            </small>
+                        </h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
                                 Navbar & Tabs
-                                <small>
-                                new
-                                </small>
-                            </h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    Navbar & Tabs
-                                </li>
-                            </ol>
-                        </div>
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-md-12">
-                            <div class="card card-primary card-outline">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        <i class="fas fa-edit"></i>
-                                        Navbar Examples
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    <div class="row">
-                                        <div class="col-12 col-md-6">
-                                            <h4>
-                                                Default Navbar
-                                                <small>
-                                                (navbar-light)
-                                                </small>
-                                            </h4>
-                                            <nav class="navbar navbar-expand navbar-light">
-                                                <!-- Left navbar links -->
-                                                <ul class="navbar-nav">
-                                                    <li class="nav-item">
-                                                        <a class="nav-link"
-                                                           data-widget="pushmenu"
-                                                           href="#"
-                                                           role="button">
-                                                            <i class="fas fa-bars"></i>
-                                                        </a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">Home</a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">Contact</a>
-                                                    </li>
-                                                </ul>
-                                                <!-- SEARCH FORM -->
-                                                <form class="form-inline ml-3">
-                                                    <div class="input-group input-group-sm">
-                                                        <input class="form-control form-control-navbar"
-                                                               type="search"
-                                                               placeholder="Search"
-                                                               aria-label="Search">
-                                                        <div class="input-group-append">
-                                                            <button class="btn btn-navbar" type="submit">
-                                                                <i class="fas fa-search"></i>
-                                                            </button>
-                                                        </div>
-                                                    </div>
-                                                </form>
-                                            </nav>
-                                        </div>
-                                        <div class="col-12 col-md-6">
-                                            <h4>
-                                                Default Navbar
-                                                <small>
-                                                (navbar-white navbar-light)
-                                                </small>
-                                            </h4>
-                                            <nav class="navbar navbar-expand navbar-white navbar-light">
-                                                <!-- Left navbar links -->
-                                                <ul class="navbar-nav">
-                                                    <li class="nav-item">
-                                                        <a class="nav-link"
-                                                           data-widget="pushmenu"
-                                                           href="#"
-                                                           role="button">
-                                                            <i class="fas fa-bars"></i>
-                                                        </a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">Home</a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">Contact</a>
-                                                    </li>
-                                                </ul>
-                                                <!-- SEARCH FORM -->
-                                                <form class="form-inline ml-3">
-                                                    <div class="input-group input-group-sm">
-                                                        <input class="form-control form-control-navbar"
-                                                               type="search"
-                                                               placeholder="Search"
-                                                               aria-label="Search">
-                                                        <div class="input-group-append">
-                                                            <button class="btn btn-navbar" type="submit">
-                                                                <i class="fas fa-search"></i>
-                                                            </button>
-                                                        </div>
-                                                    </div>
-                                                </form>
-                                            </nav>
-                                        </div>
-                                    </div>
-                                    <div class="row">
-                                        <div class="col-12 col-md-6">
-                                            <h4 class="mt-4">
-                                                Primary Navbar
-                                                <small>
-                                                <b>
-                                                recommended
-                                                </b>
-                                                (navbar-primary navbar-dark)
-                                                </small>
-                                            </h4>
-                                            <nav class="navbar navbar-expand navbar-primary navbar-dark">
-                                                <!-- Left navbar links -->
-                                                <ul class="navbar-nav">
-                                                    <li class="nav-item">
-                                                        <a class="nav-link"
-                                                           data-widget="pushmenu"
-                                                           href="#"
-                                                           role="button">
-                                                            <i class="fas fa-bars"></i>
-                                                        </a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">Home</a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">Contact</a>
-                                                    </li>
-                                                </ul>
-                                                <!-- SEARCH FORM -->
-                                                <form class="form-inline ml-3">
-                                                    <div class="input-group input-group-sm">
-                                                        <input class="form-control form-control-navbar"
-                                                               type="search"
-                                                               placeholder="Search"
-                                                               aria-label="Search">
-                                                        <div class="input-group-append">
-                                                            <button class="btn btn-navbar" type="submit">
-                                                                <i class="fas fa-search"></i>
-                                                            </button>
-                                                        </div>
-                                                    </div>
-                                                </form>
-                                            </nav>
-                                        </div>
-                                        <div class="col-12 col-md-6">
-                                            <h4 class="mt-4">
-                                                Primary Navbar
-                                                <small>
-                                                (navbar-primary navbar-light)
-                                                </small>
-                                            </h4>
-                                            <nav class="navbar navbar-expand navbar-primary navbar-light">
-                                                <!-- Left navbar links -->
-                                                <ul class="navbar-nav">
-                                                    <li class="nav-item">
-                                                        <a class="nav-link"
-                                                           data-widget="pushmenu"
-                                                           href="#"
-                                                           role="button">
-                                                            <i class="fas fa-bars"></i>
-                                                        </a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">Home</a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">Contact</a>
-                                                    </li>
-                                                </ul>
-                                                <!-- SEARCH FORM -->
-                                                <form class="form-inline ml-3">
-                                                    <div class="input-group input-group-sm">
-                                                        <input class="form-control form-control-navbar"
-                                                               type="search"
-                                                               placeholder="Search"
-                                                               aria-label="Search">
-                                                        <div class="input-group-append">
-                                                            <button class="btn btn-navbar" type="submit">
-                                                                <i class="fas fa-search"></i>
-                                                            </button>
-                                                        </div>
-                                                    </div>
-                                                </form>
-                                            </nav>
-                                        </div>
-                                    </div>
-                                    <div class="row">
-                                        <div class="col-12 col-md-6">
-                                            <h4 class="mt-4">
-                                                Orange Navbar
-                                                <small>
-                                                <b>
-                                                recommended
-                                                </b>
-                                                (navbar-orange navbar-light)
-                                                </small>
-                                            </h4>
-                                            <nav class="navbar navbar-expand navbar-orange navbar-light">
-                                                <!-- Left navbar links -->
-                                                <ul class="navbar-nav">
-                                                    <li class="nav-item">
-                                                        <a class="nav-link"
-                                                           data-widget="pushmenu"
-                                                           href="#"
-                                                           role="button">
-                                                            <i class="fas fa-bars"></i>
-                                                        </a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">Home</a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">
-                                                            Contact
-                                                        </a>
-                                                    </li>
-                                                </ul>
-                                                <!-- SEARCH FORM -->
-                                                <form class="form-inline ml-3">
-                                                    <div class="input-group input-group-sm">
-                                                        <input class="form-control form-control-navbar"
-                                                               type="search"
-                                                               placeholder="Search"
-                                                               aria-label="Search">
-                                                        <div class="input-group-append">
-                                                            <button class="btn btn-navbar" type="submit">
-                                                                <i class="fas fa-search"></i>
-                                                            </button>
-                                                        </div>
-                                                    </div>
-                                                </form>
-                                            </nav>
-                                        </div>
-                                        <div class="col-12 col-md-6">
-                                            <h4 class="mt-4">
-                                                Orange Navbar
-                                                <small>
-                                                (navbar-orange navbar-dark)
-                                                </small>
-                                            </h4>
-                                            <nav class="navbar navbar-expand navbar-orange navbar-dark">
-                                                <!-- Left navbar links -->
-                                                <ul class="navbar-nav">
-                                                    <li class="nav-item">
-                                                        <a class="nav-link"
-                                                           data-widget="pushmenu"
-                                                           href="#"
-                                                           role="button">
-                                                            <i class="fas fa-bars"></i>
-                                                        </a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">
-                                                            Home
-                                                        </a>
-                                                    </li>
-                                                    <li class="nav-item d-none d-sm-inline-block">
-                                                        <a href="#" class="nav-link">
-                                                            Contact
-                                                        </a>
-                                                    </li>
-                                                </ul>
-                                                <!-- SEARCH FORM -->
-                                                <form class="form-inline ml-3">
-                                                    <div class="input-group input-group-sm">
-                                                        <input class="form-control form-control-navbar"
-                                                               type="search"
-                                                               placeholder="Search"
-                                                               aria-label="Search">
-                                                        <div class="input-group-append">
-                                                            <button class="btn btn-navbar" type="submit">
-                                                                <i class="fas fa-search"></i>
-                                                            </button>
-                                                        </div>
-                                                    </div>
-                                                </form>
-                                            </nav>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-md-12">
+                        <div class="card card-primary card-outline">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-edit"></i>
+                                    Navbar Examples
+                                </h3>
                             </div>
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- ./row -->
-                    <div class="row">
-                        <div class="col-12">
-                            <h4>
-                                Nav Tabs inside Card Header
-                                <small>
-                                card-tabs / card-outline-tabs
-                                </small>
-                            </h4>
-                        </div>
-                    </div>
-                    <!-- ./row -->
-                    <div class="row">
-                        <div class="col-12 col-sm-6">
-                            <div class="card card-primary card-tabs">
-                                <div class="card-header p-0 pt-1">
-                                    <ul class="nav nav-tabs" id="custom-tabs-one-tab" role="tablist">
-                                        <li class="nav-item">
-                                            <a class="nav-link active"
-                                               id="custom-tabs-one-home-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-one-home"
-                                               role="tab"
-                                               aria-controls="custom-tabs-one-home"
-                                               aria-selected="true">
-                                                Home
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-one-profile-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-one-profile"
-                                               role="tab"
-                                               aria-controls="custom-tabs-one-profile"
-                                               aria-selected="false">
-                                                Profile
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-one-messages-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-one-messages"
-                                               role="tab"
-                                               aria-controls="custom-tabs-one-messages"
-                                               aria-selected="false">
-                                                Messages
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-one-settings-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-one-settings"
-                                               role="tab"
-                                               aria-controls="custom-tabs-one-settings"
-                                               aria-selected="false">
-                                                Settings
-                                            </a>
-                                        </li>
-                                    </ul>
-                                </div>
-                                <div class="card-body">
-                                    <div class="tab-content" id="custom-tabs-one-tabContent">
-                                        <div class="tab-pane fade show active"
-                                             id="custom-tabs-one-home"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-one-home-tab">
-                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-one-profile"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-one-profile-tab">
-                                            Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-one-messages"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-one-messages-tab">
-                                            Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-one-settings"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-one-settings-tab">
-                                            Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card -->
-                            </div>
-                        </div>
-                        <div class="col-12 col-sm-6">
-                            <div class="card card-primary card-tabs">
-                                <div class="card-header p-0 pt-1">
-                                    <ul class="nav nav-tabs" id="custom-tabs-two-tab" role="tablist">
-                                        <li class="pt-2 px-3">
-                                            <h3 class="card-title">
-                                                Card Title
-                                            </h3>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link active"
-                                               id="custom-tabs-two-home-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-two-home"
-                                               role="tab"
-                                               aria-controls="custom-tabs-two-home"
-                                               aria-selected="true">
-                                                Home
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-two-profile-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-two-profile"
-                                               role="tab"
-                                               aria-controls="custom-tabs-two-profile"
-                                               aria-selected="false">
-                                                Profile
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-two-messages-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-two-messages"
-                                               role="tab"
-                                               aria-controls="custom-tabs-two-messages"
-                                               aria-selected="false">
-                                                Messages
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-two-settings-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-two-settings"
-                                               role="tab"
-                                               aria-controls="custom-tabs-two-settings"
-                                               aria-selected="false">
-                                                Settings
-                                            </a>
-                                        </li>
-                                    </ul>
-                                </div>
-                                <div class="card-body">
-                                    <div class="tab-content" id="custom-tabs-two-tabContent">
-                                        <div class="tab-pane fade show active"
-                                             id="custom-tabs-two-home"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-two-home-tab">
-                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-two-profile"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-two-profile-tab">
-                                            Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-two-messages"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-two-messages-tab">
-                                            Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-two-settings"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-two-settings-tab">
-                                            Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card -->
-                            </div>
-                        </div>
-                    </div>
-                    <div class="row">
-                        <div class="col-12 col-sm-6">
-                            <div class="card card-primary card-outline card-tabs">
-                                <div class="card-header p-0 pt-1 border-bottom-0">
-                                    <ul class="nav nav-tabs" id="custom-tabs-three-tab" role="tablist">
-                                        <li class="nav-item">
-                                            <a class="nav-link active"
-                                               id="custom-tabs-three-home-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-three-home"
-                                               role="tab"
-                                               aria-controls="custom-tabs-three-home"
-                                               aria-selected="true">
-                                                Home
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-three-profile-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-three-profile"
-                                               role="tab"
-                                               aria-controls="custom-tabs-three-profile"
-                                               aria-selected="false">
-                                                Profile
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-three-messages-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-three-messages"
-                                               role="tab"
-                                               aria-controls="custom-tabs-three-messages"
-                                               aria-selected="false">
-                                                Messages
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-three-settings-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-three-settings"
-                                               role="tab"
-                                               aria-controls="custom-tabs-three-settings"
-                                               aria-selected="false">
-                                                Settings
-                                            </a>
-                                        </li>
-                                    </ul>
-                                </div>
-                                <div class="card-body">
-                                    <div class="tab-content" id="custom-tabs-three-tabContent">
-                                        <div class="tab-pane fade show active"
-                                             id="custom-tabs-three-home"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-three-home-tab">
-                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-three-profile"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-three-profile-tab">
-                                            Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-three-messages"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-three-messages-tab">
-                                            Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-three-settings"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-three-settings-tab">
-                                            Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card -->
-                            </div>
-                        </div>
-                        <div class="col-12 col-sm-6">
-                            <div class="card card-primary card-outline card-outline-tabs">
-                                <div class="card-header p-0 border-bottom-0">
-                                    <ul class="nav nav-tabs" id="custom-tabs-four-tab" role="tablist">
-                                        <li class="nav-item">
-                                            <a class="nav-link active"
-                                               id="custom-tabs-four-home-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-four-home"
-                                               role="tab"
-                                               aria-controls="custom-tabs-four-home"
-                                               aria-selected="true">
-                                                Home
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-four-profile-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-four-profile"
-                                               role="tab"
-                                               aria-controls="custom-tabs-four-profile"
-                                               aria-selected="false">
-                                                Profile
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-four-messages-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-four-messages"
-                                               role="tab"
-                                               aria-controls="custom-tabs-four-messages"
-                                               aria-selected="false">
-                                                Messages
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-four-settings-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-four-settings"
-                                               role="tab"
-                                               aria-controls="custom-tabs-four-settings"
-                                               aria-selected="false">
-                                                Settings
-                                            </a>
-                                        </li>
-                                    </ul>
-                                </div>
-                                <div class="card-body">
-                                    <div class="tab-content" id="custom-tabs-four-tabContent">
-                                        <div class="tab-pane fade show active"
-                                             id="custom-tabs-four-home"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-four-home-tab">
-                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-four-profile"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-four-profile-tab">
-                                            Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-four-messages"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-four-messages-tab">
-                                            Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-four-settings"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-four-settings-tab">
-                                            Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card -->
-                            </div>
-                        </div>
-                    </div>
-                    <div class="row">
-                        <div class="col-12">
-                            <h4>Nav Tabs Overlay for loading</h4>
-                        </div>
-                    </div>
-                    <div class="row">
-                        <div class="col-md-12">
-                            <div class="card card-primary card-tabs">
-                                <div class="card-header p-0 pt-1">
-                                    <ul class="nav nav-tabs" id="custom-tabs-five-tab" role="tablist">
-                                        <li class="nav-item">
-                                            <a class="nav-link active"
-                                               id="custom-tabs-five-overlay-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-five-overlay"
-                                               role="tab"
-                                               aria-controls="custom-tabs-five-overlay"
-                                               aria-selected="true">
-                                                Overlay
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-five-overlay-dark-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-five-overlay-dark"
-                                               role="tab"
-                                               aria-controls="custom-tabs-five-overlay-dark"
-                                               aria-selected="false">
-                                                Overlay Dark
-                                            </a>
-                                        </li>
-                                        <li class="nav-item">
-                                            <a class="nav-link"
-                                               id="custom-tabs-five-normal-tab"
-                                               data-toggle="pill"
-                                               href="#custom-tabs-five-normal"
-                                               role="tab"
-                                               aria-controls="custom-tabs-five-normal"
-                                               aria-selected="false">
-                                                Normal Tab
-                                            </a>
-                                        </li>
-                                    </ul>
-                                </div>
-                                <div class="card-body">
-                                    <div class="tab-content" id="custom-tabs-five-tabContent">
-                                        <div class="tab-pane fade show active"
-                                             id="custom-tabs-five-overlay"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-five-overlay-tab">
-                                            <div class="overlay-wrapper">
-                                                <div class="overlay">
-                                                    <i class="fas fa-3x fa-sync-alt fa-spin"></i>
-                                                    <div class="text-bold pt-2">
-                                                        Loading...
+                            <div class="card-body">
+                                <div class="row">
+                                    <div class="col-12 col-md-6">
+                                        <h4>
+                                            Default Navbar
+                                            <small>
+                                            (navbar-light)
+                                            </small>
+                                        </h4>
+                                        <nav class="navbar navbar-expand navbar-light">
+                                            <!-- Left navbar links -->
+                                            <ul class="navbar-nav">
+                                                <li class="nav-item">
+                                                    <a class="nav-link" data-widget="pushmenu" href="#" role="button">
+                                                        <i class="fas fa-bars"></i>
+                                                    </a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">Home</a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">Contact</a>
+                                                </li>
+                                            </ul>
+                                            <!-- SEARCH FORM -->
+                                            <form class="form-inline ml-3">
+                                                <div class="input-group input-group-sm">
+                                                    <input class="form-control form-control-navbar"
+                                                           type="search"
+                                                           placeholder="Search"
+                                                           aria-label="Search">
+                                                    <div class="input-group-append">
+                                                        <button class="btn btn-navbar" type="submit">
+                                                            <i class="fas fa-search"></i>
+                                                        </button>
                                                     </div>
                                                 </div>
-                                                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
-                                            </div>
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-five-overlay-dark"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-five-overlay-dark-tab">
-                                            <div class="overlay-wrapper">
-                                                <div class="overlay dark">
-                                                    <i class="fas fa-3x fa-sync-alt fa-spin"></i>
-                                                    <div class="text-bold pt-2">
-                                                        Loading...
+                                            </form>
+                                        </nav>
+                                    </div>
+                                    <div class="col-12 col-md-6">
+                                        <h4>
+                                            Default Navbar
+                                            <small>
+                                            (navbar-white navbar-light)
+                                            </small>
+                                        </h4>
+                                        <nav class="navbar navbar-expand navbar-white navbar-light">
+                                            <!-- Left navbar links -->
+                                            <ul class="navbar-nav">
+                                                <li class="nav-item">
+                                                    <a class="nav-link" data-widget="pushmenu" href="#" role="button">
+                                                        <i class="fas fa-bars"></i>
+                                                    </a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">Home</a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">Contact</a>
+                                                </li>
+                                            </ul>
+                                            <!-- SEARCH FORM -->
+                                            <form class="form-inline ml-3">
+                                                <div class="input-group input-group-sm">
+                                                    <input class="form-control form-control-navbar"
+                                                           type="search"
+                                                           placeholder="Search"
+                                                           aria-label="Search">
+                                                    <div class="input-group-append">
+                                                        <button class="btn btn-navbar" type="submit">
+                                                            <i class="fas fa-search"></i>
+                                                        </button>
                                                     </div>
                                                 </div>
-                                                Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
-                                            </div>
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="custom-tabs-five-normal"
-                                             role="tabpanel"
-                                             aria-labelledby="custom-tabs-five-normal-tab">
-                                            Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
-                                        </div>
+                                            </form>
+                                        </nav>
+                                    </div>
+                                </div>
+                                <div class="row">
+                                    <div class="col-12 col-md-6">
+                                        <h4 class="mt-4">
+                                            Primary Navbar
+                                            <small>
+                                            <b>
+                                            recommended
+                                            </b>
+                                            (navbar-primary navbar-dark)
+                                            </small>
+                                        </h4>
+                                        <nav class="navbar navbar-expand navbar-primary navbar-dark">
+                                            <!-- Left navbar links -->
+                                            <ul class="navbar-nav">
+                                                <li class="nav-item">
+                                                    <a class="nav-link" data-widget="pushmenu" href="#" role="button">
+                                                        <i class="fas fa-bars"></i>
+                                                    </a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">Home</a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">Contact</a>
+                                                </li>
+                                            </ul>
+                                            <!-- SEARCH FORM -->
+                                            <form class="form-inline ml-3">
+                                                <div class="input-group input-group-sm">
+                                                    <input class="form-control form-control-navbar"
+                                                           type="search"
+                                                           placeholder="Search"
+                                                           aria-label="Search">
+                                                    <div class="input-group-append">
+                                                        <button class="btn btn-navbar" type="submit">
+                                                            <i class="fas fa-search"></i>
+                                                        </button>
+                                                    </div>
+                                                </div>
+                                            </form>
+                                        </nav>
+                                    </div>
+                                    <div class="col-12 col-md-6">
+                                        <h4 class="mt-4">
+                                            Primary Navbar
+                                            <small>
+                                            (navbar-primary navbar-light)
+                                            </small>
+                                        </h4>
+                                        <nav class="navbar navbar-expand navbar-primary navbar-light">
+                                            <!-- Left navbar links -->
+                                            <ul class="navbar-nav">
+                                                <li class="nav-item">
+                                                    <a class="nav-link" data-widget="pushmenu" href="#" role="button">
+                                                        <i class="fas fa-bars"></i>
+                                                    </a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">Home</a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">Contact</a>
+                                                </li>
+                                            </ul>
+                                            <!-- SEARCH FORM -->
+                                            <form class="form-inline ml-3">
+                                                <div class="input-group input-group-sm">
+                                                    <input class="form-control form-control-navbar"
+                                                           type="search"
+                                                           placeholder="Search"
+                                                           aria-label="Search">
+                                                    <div class="input-group-append">
+                                                        <button class="btn btn-navbar" type="submit">
+                                                            <i class="fas fa-search"></i>
+                                                        </button>
+                                                    </div>
+                                                </div>
+                                            </form>
+                                        </nav>
+                                    </div>
+                                </div>
+                                <div class="row">
+                                    <div class="col-12 col-md-6">
+                                        <h4 class="mt-4">
+                                            Orange Navbar
+                                            <small>
+                                            <b>
+                                            recommended
+                                            </b>
+                                            (navbar-orange navbar-light)
+                                            </small>
+                                        </h4>
+                                        <nav class="navbar navbar-expand navbar-orange navbar-light">
+                                            <!-- Left navbar links -->
+                                            <ul class="navbar-nav">
+                                                <li class="nav-item">
+                                                    <a class="nav-link" data-widget="pushmenu" href="#" role="button">
+                                                        <i class="fas fa-bars"></i>
+                                                    </a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">Home</a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">
+                                                        Contact
+                                                    </a>
+                                                </li>
+                                            </ul>
+                                            <!-- SEARCH FORM -->
+                                            <form class="form-inline ml-3">
+                                                <div class="input-group input-group-sm">
+                                                    <input class="form-control form-control-navbar"
+                                                           type="search"
+                                                           placeholder="Search"
+                                                           aria-label="Search">
+                                                    <div class="input-group-append">
+                                                        <button class="btn btn-navbar" type="submit">
+                                                            <i class="fas fa-search"></i>
+                                                        </button>
+                                                    </div>
+                                                </div>
+                                            </form>
+                                        </nav>
+                                    </div>
+                                    <div class="col-12 col-md-6">
+                                        <h4 class="mt-4">
+                                            Orange Navbar
+                                            <small>
+                                            (navbar-orange navbar-dark)
+                                            </small>
+                                        </h4>
+                                        <nav class="navbar navbar-expand navbar-orange navbar-dark">
+                                            <!-- Left navbar links -->
+                                            <ul class="navbar-nav">
+                                                <li class="nav-item">
+                                                    <a class="nav-link" data-widget="pushmenu" href="#" role="button">
+                                                        <i class="fas fa-bars"></i>
+                                                    </a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">
+                                                        Home
+                                                    </a>
+                                                </li>
+                                                <li class="nav-item d-none d-sm-inline-block">
+                                                    <a href="#" class="nav-link">
+                                                        Contact
+                                                    </a>
+                                                </li>
+                                            </ul>
+                                            <!-- SEARCH FORM -->
+                                            <form class="form-inline ml-3">
+                                                <div class="input-group input-group-sm">
+                                                    <input class="form-control form-control-navbar"
+                                                           type="search"
+                                                           placeholder="Search"
+                                                           aria-label="Search">
+                                                    <div class="input-group-append">
+                                                        <button class="btn btn-navbar" type="submit">
+                                                            <i class="fas fa-search"></i>
+                                                        </button>
+                                                    </div>
+                                                </div>
+                                            </form>
+                                        </nav>
                                     </div>
                                 </div>
-                                <!-- /.card -->
                             </div>
+                            <!-- /.card -->
                         </div>
                     </div>
-                    <!-- /.row -->
-                    <div class="card card-primary card-outline">
-                        <div class="card-header">
-                            <h3 class="card-title">
-                                <i class="fas fa-edit"></i>
-                                Vertical Tabs Examples
-                            </h3>
-                        </div>
-                        <div class="card-body">
-                            <h4>Left Sided</h4>
-                            <div class="row">
-                                <div class="col-5 col-sm-3">
-                                    <div class="nav flex-column nav-tabs h-100"
-                                         id="vert-tabs-tab"
-                                         role="tablist"
-                                         aria-orientation="vertical">
+                    <!-- /.col -->
+                </div>
+                <!-- ./row -->
+                <div class="row">
+                    <div class="col-12">
+                        <h4>
+                            Nav Tabs inside Card Header
+                            <small>
+                            card-tabs / card-outline-tabs
+                            </small>
+                        </h4>
+                    </div>
+                </div>
+                <!-- ./row -->
+                <div class="row">
+                    <div class="col-12 col-sm-6">
+                        <div class="card card-primary card-tabs">
+                            <div class="card-header p-0 pt-1">
+                                <ul class="nav nav-tabs" id="custom-tabs-one-tab" role="tablist">
+                                    <li class="nav-item">
                                         <a class="nav-link active"
-                                           id="vert-tabs-home-tab"
+                                           id="custom-tabs-one-home-tab"
                                            data-toggle="pill"
-                                           href="#vert-tabs-home"
+                                           href="#custom-tabs-one-home"
                                            role="tab"
-                                           aria-controls="vert-tabs-home"
+                                           aria-controls="custom-tabs-one-home"
                                            aria-selected="true">
                                             Home
                                         </a>
+                                    </li>
+                                    <li class="nav-item">
                                         <a class="nav-link"
-                                           id="vert-tabs-profile-tab"
+                                           id="custom-tabs-one-profile-tab"
                                            data-toggle="pill"
-                                           href="#vert-tabs-profile"
+                                           href="#custom-tabs-one-profile"
                                            role="tab"
-                                           aria-controls="vert-tabs-profile"
+                                           aria-controls="custom-tabs-one-profile"
                                            aria-selected="false">
                                             Profile
                                         </a>
+                                    </li>
+                                    <li class="nav-item">
                                         <a class="nav-link"
-                                           id="vert-tabs-messages-tab"
+                                           id="custom-tabs-one-messages-tab"
                                            data-toggle="pill"
-                                           href="#vert-tabs-messages"
+                                           href="#custom-tabs-one-messages"
                                            role="tab"
-                                           aria-controls="vert-tabs-messages"
+                                           aria-controls="custom-tabs-one-messages"
                                            aria-selected="false">
                                             Messages
                                         </a>
+                                    </li>
+                                    <li class="nav-item">
                                         <a class="nav-link"
-                                           id="vert-tabs-settings-tab"
+                                           id="custom-tabs-one-settings-tab"
                                            data-toggle="pill"
-                                           href="#vert-tabs-settings"
+                                           href="#custom-tabs-one-settings"
                                            role="tab"
-                                           aria-controls="vert-tabs-settings"
+                                           aria-controls="custom-tabs-one-settings"
                                            aria-selected="false">
                                             Settings
                                         </a>
+                                    </li>
+                                </ul>
+                            </div>
+                            <div class="card-body">
+                                <div class="tab-content" id="custom-tabs-one-tabContent">
+                                    <div class="tab-pane fade show active"
+                                         id="custom-tabs-one-home"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-one-home-tab">
+                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
                                     </div>
-                                </div>
-                                <div class="col-7 col-sm-9">
-                                    <div class="tab-content" id="vert-tabs-tabContent">
-                                        <div class="tab-pane text-left fade show active"
-                                             id="vert-tabs-home"
-                                             role="tabpanel"
-                                             aria-labelledby="vert-tabs-home-tab">
-                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="vert-tabs-profile"
-                                             role="tabpanel"
-                                             aria-labelledby="vert-tabs-profile-tab">
-                                            Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="vert-tabs-messages"
-                                             role="tabpanel"
-                                             aria-labelledby="vert-tabs-messages-tab">
-                                            Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="vert-tabs-settings"
-                                             role="tabpanel"
-                                             aria-labelledby="vert-tabs-settings-tab">
-                                            Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
-                                        </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-one-profile"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-one-profile-tab">
+                                        Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-one-messages"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-one-messages-tab">
+                                        Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-one-settings"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-one-settings-tab">
+                                        Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
                                     </div>
                                 </div>
                             </div>
-                            <h4 class="mt-4">
-                                Right Sided
-                                <small>
-                                (nav-tabs-right)
-                                </small>
-                            </h4>
-                            <div class="row">
-                                <div class="col-7 col-sm-9">
-                                    <div class="tab-content" id="vert-tabs-right-tabContent">
-                                        <div class="tab-pane fade show active"
-                                             id="vert-tabs-right-home"
-                                             role="tabpanel"
-                                             aria-labelledby="vert-tabs-right-home-tab">
-                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="vert-tabs-right-profile"
-                                             role="tabpanel"
-                                             aria-labelledby="vert-tabs-right-profile-tab">
-                                            Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="vert-tabs-right-messages"
-                                             role="tabpanel"
-                                             aria-labelledby="vert-tabs-right-messages-tab">
-                                            Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
-                                        </div>
-                                        <div class="tab-pane fade"
-                                             id="vert-tabs-right-settings"
-                                             role="tabpanel"
-                                             aria-labelledby="vert-tabs-right-settings-tab">
-                                            Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
-                                        </div>
-                                    </div>
-                                </div>
-                                <div class="col-5 col-sm-3">
-                                    <div class="nav flex-column nav-tabs nav-tabs-right h-100"
-                                         id="vert-tabs-right-tab"
-                                         role="tablist"
-                                         aria-orientation="vertical">
+                            <!-- /.card -->
+                        </div>
+                    </div>
+                    <div class="col-12 col-sm-6">
+                        <div class="card card-primary card-tabs">
+                            <div class="card-header p-0 pt-1">
+                                <ul class="nav nav-tabs" id="custom-tabs-two-tab" role="tablist">
+                                    <li class="pt-2 px-3">
+                                        <h3 class="card-title">
+                                            Card Title
+                                        </h3>
+                                    </li>
+                                    <li class="nav-item">
                                         <a class="nav-link active"
-                                           id="vert-tabs-right-home-tab"
+                                           id="custom-tabs-two-home-tab"
                                            data-toggle="pill"
-                                           href="#vert-tabs-right-home"
+                                           href="#custom-tabs-two-home"
                                            role="tab"
-                                           aria-controls="vert-tabs-right-home"
+                                           aria-controls="custom-tabs-two-home"
                                            aria-selected="true">
                                             Home
                                         </a>
+                                    </li>
+                                    <li class="nav-item">
                                         <a class="nav-link"
-                                           id="vert-tabs-right-profile-tab"
+                                           id="custom-tabs-two-profile-tab"
                                            data-toggle="pill"
-                                           href="#vert-tabs-right-profile"
+                                           href="#custom-tabs-two-profile"
                                            role="tab"
-                                           aria-controls="vert-tabs-right-profile"
+                                           aria-controls="custom-tabs-two-profile"
                                            aria-selected="false">
                                             Profile
                                         </a>
+                                    </li>
+                                    <li class="nav-item">
                                         <a class="nav-link"
-                                           id="vert-tabs-right-messages-tab"
+                                           id="custom-tabs-two-messages-tab"
                                            data-toggle="pill"
-                                           href="#vert-tabs-right-messages"
+                                           href="#custom-tabs-two-messages"
                                            role="tab"
-                                           aria-controls="vert-tabs-right-messages"
+                                           aria-controls="custom-tabs-two-messages"
                                            aria-selected="false">
                                             Messages
                                         </a>
+                                    </li>
+                                    <li class="nav-item">
                                         <a class="nav-link"
-                                           id="vert-tabs-right-settings-tab"
+                                           id="custom-tabs-two-settings-tab"
                                            data-toggle="pill"
-                                           href="#vert-tabs-right-settings"
+                                           href="#custom-tabs-two-settings"
                                            role="tab"
-                                           aria-controls="vert-tabs-right-settings"
+                                           aria-controls="custom-tabs-two-settings"
                                            aria-selected="false">
                                             Settings
                                         </a>
+                                    </li>
+                                </ul>
+                            </div>
+                            <div class="card-body">
+                                <div class="tab-content" id="custom-tabs-two-tabContent">
+                                    <div class="tab-pane fade show active"
+                                         id="custom-tabs-two-home"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-two-home-tab">
+                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-two-profile"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-two-profile-tab">
+                                        Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-two-messages"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-two-messages-tab">
+                                        Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-two-settings"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-two-settings-tab">
+                                        Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card -->
+                        </div>
+                    </div>
+                </div>
+                <div class="row">
+                    <div class="col-12 col-sm-6">
+                        <div class="card card-primary card-outline card-tabs">
+                            <div class="card-header p-0 pt-1 border-bottom-0">
+                                <ul class="nav nav-tabs" id="custom-tabs-three-tab" role="tablist">
+                                    <li class="nav-item">
+                                        <a class="nav-link active"
+                                           id="custom-tabs-three-home-tab"
+                                           data-toggle="pill"
+                                           href="#custom-tabs-three-home"
+                                           role="tab"
+                                           aria-controls="custom-tabs-three-home"
+                                           aria-selected="true">
+                                            Home
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link"
+                                           id="custom-tabs-three-profile-tab"
+                                           data-toggle="pill"
+                                           href="#custom-tabs-three-profile"
+                                           role="tab"
+                                           aria-controls="custom-tabs-three-profile"
+                                           aria-selected="false">
+                                            Profile
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link"
+                                           id="custom-tabs-three-messages-tab"
+                                           data-toggle="pill"
+                                           href="#custom-tabs-three-messages"
+                                           role="tab"
+                                           aria-controls="custom-tabs-three-messages"
+                                           aria-selected="false">
+                                            Messages
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link"
+                                           id="custom-tabs-three-settings-tab"
+                                           data-toggle="pill"
+                                           href="#custom-tabs-three-settings"
+                                           role="tab"
+                                           aria-controls="custom-tabs-three-settings"
+                                           aria-selected="false">
+                                            Settings
+                                        </a>
+                                    </li>
+                                </ul>
+                            </div>
+                            <div class="card-body">
+                                <div class="tab-content" id="custom-tabs-three-tabContent">
+                                    <div class="tab-pane fade show active"
+                                         id="custom-tabs-three-home"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-three-home-tab">
+                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-three-profile"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-three-profile-tab">
+                                        Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-three-messages"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-three-messages-tab">
+                                        Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-three-settings"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-three-settings-tab">
+                                        Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card -->
+                        </div>
+                    </div>
+                    <div class="col-12 col-sm-6">
+                        <div class="card card-primary card-outline card-outline-tabs">
+                            <div class="card-header p-0 border-bottom-0">
+                                <ul class="nav nav-tabs" id="custom-tabs-four-tab" role="tablist">
+                                    <li class="nav-item">
+                                        <a class="nav-link active"
+                                           id="custom-tabs-four-home-tab"
+                                           data-toggle="pill"
+                                           href="#custom-tabs-four-home"
+                                           role="tab"
+                                           aria-controls="custom-tabs-four-home"
+                                           aria-selected="true">
+                                            Home
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link"
+                                           id="custom-tabs-four-profile-tab"
+                                           data-toggle="pill"
+                                           href="#custom-tabs-four-profile"
+                                           role="tab"
+                                           aria-controls="custom-tabs-four-profile"
+                                           aria-selected="false">
+                                            Profile
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link"
+                                           id="custom-tabs-four-messages-tab"
+                                           data-toggle="pill"
+                                           href="#custom-tabs-four-messages"
+                                           role="tab"
+                                           aria-controls="custom-tabs-four-messages"
+                                           aria-selected="false">
+                                            Messages
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link"
+                                           id="custom-tabs-four-settings-tab"
+                                           data-toggle="pill"
+                                           href="#custom-tabs-four-settings"
+                                           role="tab"
+                                           aria-controls="custom-tabs-four-settings"
+                                           aria-selected="false">
+                                            Settings
+                                        </a>
+                                    </li>
+                                </ul>
+                            </div>
+                            <div class="card-body">
+                                <div class="tab-content" id="custom-tabs-four-tabContent">
+                                    <div class="tab-pane fade show active"
+                                         id="custom-tabs-four-home"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-four-home-tab">
+                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-four-profile"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-four-profile-tab">
+                                        Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-four-messages"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-four-messages-tab">
+                                        Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-four-settings"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-four-settings-tab">
+                                        Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card -->
+                        </div>
+                    </div>
+                </div>
+                <div class="row">
+                    <div class="col-12">
+                        <h4>Nav Tabs Overlay for loading</h4>
+                    </div>
+                </div>
+                <div class="row">
+                    <div class="col-md-12">
+                        <div class="card card-primary card-tabs">
+                            <div class="card-header p-0 pt-1">
+                                <ul class="nav nav-tabs" id="custom-tabs-five-tab" role="tablist">
+                                    <li class="nav-item">
+                                        <a class="nav-link active"
+                                           id="custom-tabs-five-overlay-tab"
+                                           data-toggle="pill"
+                                           href="#custom-tabs-five-overlay"
+                                           role="tab"
+                                           aria-controls="custom-tabs-five-overlay"
+                                           aria-selected="true">
+                                            Overlay
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link"
+                                           id="custom-tabs-five-overlay-dark-tab"
+                                           data-toggle="pill"
+                                           href="#custom-tabs-five-overlay-dark"
+                                           role="tab"
+                                           aria-controls="custom-tabs-five-overlay-dark"
+                                           aria-selected="false">
+                                            Overlay Dark
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a class="nav-link"
+                                           id="custom-tabs-five-normal-tab"
+                                           data-toggle="pill"
+                                           href="#custom-tabs-five-normal"
+                                           role="tab"
+                                           aria-controls="custom-tabs-five-normal"
+                                           aria-selected="false">
+                                            Normal Tab
+                                        </a>
+                                    </li>
+                                </ul>
+                            </div>
+                            <div class="card-body">
+                                <div class="tab-content" id="custom-tabs-five-tabContent">
+                                    <div class="tab-pane fade show active"
+                                         id="custom-tabs-five-overlay"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-five-overlay-tab">
+                                        <div class="overlay-wrapper">
+                                            <div class="overlay">
+                                                <i class="fas fa-3x fa-sync-alt fa-spin"></i>
+                                                <div class="text-bold pt-2">
+                                                    Loading...
+                                                </div>
+                                            </div>
+                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
+                                        </div>
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-five-overlay-dark"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-five-overlay-dark-tab">
+                                        <div class="overlay-wrapper">
+                                            <div class="overlay dark">
+                                                <i class="fas fa-3x fa-sync-alt fa-spin"></i>
+                                                <div class="text-bold pt-2">
+                                                    Loading...
+                                                </div>
+                                            </div>
+                                            Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
+                                        </div>
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="custom-tabs-five-normal"
+                                         role="tabpanel"
+                                         aria-labelledby="custom-tabs-five-normal-tab">
+                                        Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card -->
+                        </div>
+                    </div>
+                </div>
+                <!-- /.row -->
+                <div class="card card-primary card-outline">
+                    <div class="card-header">
+                        <h3 class="card-title">
+                            <i class="fas fa-edit"></i>
+                            Vertical Tabs Examples
+                        </h3>
+                    </div>
+                    <div class="card-body">
+                        <h4>Left Sided</h4>
+                        <div class="row">
+                            <div class="col-5 col-sm-3">
+                                <div class="nav flex-column nav-tabs h-100"
+                                     id="vert-tabs-tab"
+                                     role="tablist"
+                                     aria-orientation="vertical">
+                                    <a class="nav-link active"
+                                       id="vert-tabs-home-tab"
+                                       data-toggle="pill"
+                                       href="#vert-tabs-home"
+                                       role="tab"
+                                       aria-controls="vert-tabs-home"
+                                       aria-selected="true">
+                                        Home
+                                    </a>
+                                    <a class="nav-link"
+                                       id="vert-tabs-profile-tab"
+                                       data-toggle="pill"
+                                       href="#vert-tabs-profile"
+                                       role="tab"
+                                       aria-controls="vert-tabs-profile"
+                                       aria-selected="false">
+                                        Profile
+                                    </a>
+                                    <a class="nav-link"
+                                       id="vert-tabs-messages-tab"
+                                       data-toggle="pill"
+                                       href="#vert-tabs-messages"
+                                       role="tab"
+                                       aria-controls="vert-tabs-messages"
+                                       aria-selected="false">
+                                        Messages
+                                    </a>
+                                    <a class="nav-link"
+                                       id="vert-tabs-settings-tab"
+                                       data-toggle="pill"
+                                       href="#vert-tabs-settings"
+                                       role="tab"
+                                       aria-controls="vert-tabs-settings"
+                                       aria-selected="false">
+                                        Settings
+                                    </a>
+                                </div>
+                            </div>
+                            <div class="col-7 col-sm-9">
+                                <div class="tab-content" id="vert-tabs-tabContent">
+                                    <div class="tab-pane text-left fade show active"
+                                         id="vert-tabs-home"
+                                         role="tabpanel"
+                                         aria-labelledby="vert-tabs-home-tab">
+                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="vert-tabs-profile"
+                                         role="tabpanel"
+                                         aria-labelledby="vert-tabs-profile-tab">
+                                        Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="vert-tabs-messages"
+                                         role="tabpanel"
+                                         aria-labelledby="vert-tabs-messages-tab">
+                                        Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="vert-tabs-settings"
+                                         role="tabpanel"
+                                         aria-labelledby="vert-tabs-settings-tab">
+                                        Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
                                     </div>
                                 </div>
                             </div>
                         </div>
-                        <!-- /.card -->
-                    </div>
-                    <!-- /.card -->
-                    <div class="card card-primary card-outline">
-                        <div class="card-header">
-                            <h3 class="card-title">
-                                <i class="fas fa-edit"></i>
-                                Tabs Custom Content Examples
-                            </h3>
-                        </div>
-                        <div class="card-body">
-                            <h4>Custom Content Below</h4>
-                            <ul class="nav nav-tabs" id="custom-content-below-tab" role="tablist">
-                                <li class="nav-item">
+                        <h4 class="mt-4">
+                            Right Sided
+                            <small>
+                            (nav-tabs-right)
+                            </small>
+                        </h4>
+                        <div class="row">
+                            <div class="col-7 col-sm-9">
+                                <div class="tab-content" id="vert-tabs-right-tabContent">
+                                    <div class="tab-pane fade show active"
+                                         id="vert-tabs-right-home"
+                                         role="tabpanel"
+                                         aria-labelledby="vert-tabs-right-home-tab">
+                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="vert-tabs-right-profile"
+                                         role="tabpanel"
+                                         aria-labelledby="vert-tabs-right-profile-tab">
+                                        Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="vert-tabs-right-messages"
+                                         role="tabpanel"
+                                         aria-labelledby="vert-tabs-right-messages-tab">
+                                        Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
+                                    </div>
+                                    <div class="tab-pane fade"
+                                         id="vert-tabs-right-settings"
+                                         role="tabpanel"
+                                         aria-labelledby="vert-tabs-right-settings-tab">
+                                        Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-5 col-sm-3">
+                                <div class="nav flex-column nav-tabs nav-tabs-right h-100"
+                                     id="vert-tabs-right-tab"
+                                     role="tablist"
+                                     aria-orientation="vertical">
                                     <a class="nav-link active"
-                                       id="custom-content-below-home-tab"
+                                       id="vert-tabs-right-home-tab"
                                        data-toggle="pill"
-                                       href="#custom-content-below-home"
+                                       href="#vert-tabs-right-home"
                                        role="tab"
-                                       aria-controls="custom-content-below-home"
+                                       aria-controls="vert-tabs-right-home"
                                        aria-selected="true">
                                         Home
                                     </a>
-                                </li>
-                                <li class="nav-item">
                                     <a class="nav-link"
-                                       id="custom-content-below-profile-tab"
+                                       id="vert-tabs-right-profile-tab"
                                        data-toggle="pill"
-                                       href="#custom-content-below-profile"
+                                       href="#vert-tabs-right-profile"
                                        role="tab"
-                                       aria-controls="custom-content-below-profile"
+                                       aria-controls="vert-tabs-right-profile"
                                        aria-selected="false">
                                         Profile
                                     </a>
-                                </li>
-                                <li class="nav-item">
                                     <a class="nav-link"
-                                       id="custom-content-below-messages-tab"
+                                       id="vert-tabs-right-messages-tab"
                                        data-toggle="pill"
-                                       href="#custom-content-below-messages"
+                                       href="#vert-tabs-right-messages"
                                        role="tab"
-                                       aria-controls="custom-content-below-messages"
+                                       aria-controls="vert-tabs-right-messages"
                                        aria-selected="false">
                                         Messages
                                     </a>
-                                </li>
-                                <li class="nav-item">
                                     <a class="nav-link"
-                                       id="custom-content-below-settings-tab"
+                                       id="vert-tabs-right-settings-tab"
                                        data-toggle="pill"
-                                       href="#custom-content-below-settings"
+                                       href="#vert-tabs-right-settings"
                                        role="tab"
-                                       aria-controls="custom-content-below-settings"
+                                       aria-controls="vert-tabs-right-settings"
                                        aria-selected="false">
                                         Settings
                                     </a>
-                                </li>
-                            </ul>
-                            <div class="tab-content" id="custom-content-below-tabContent">
-                                <div class="tab-pane fade show active"
-                                     id="custom-content-below-home"
-                                     role="tabpanel"
-                                     aria-labelledby="custom-content-below-home-tab">
-                                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
-                                </div>
-                                <div class="tab-pane fade"
-                                     id="custom-content-below-profile"
-                                     role="tabpanel"
-                                     aria-labelledby="custom-content-below-profile-tab">
-                                    Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
-                                </div>
-                                <div class="tab-pane fade"
-                                     id="custom-content-below-messages"
-                                     role="tabpanel"
-                                     aria-labelledby="custom-content-below-messages-tab">
-                                    Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
-                                </div>
-                                <div class="tab-pane fade"
-                                     id="custom-content-below-settings"
-                                     role="tabpanel"
-                                     aria-labelledby="custom-content-below-settings-tab">
-                                    Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
-                                </div>
-                            </div>
-                            <div class="tab-custom-content">
-                                <p class="lead mb-0">
-                                    Custom Content goes here
-                                </p>
-                            </div>
-                            <h4 class="mt-5 ">
-                                Custom Content Above
-                            </h4>
-                            <ul class="nav nav-tabs" id="custom-content-above-tab" role="tablist">
-                                <li class="nav-item">
-                                    <a class="nav-link active"
-                                       id="custom-content-above-home-tab"
-                                       data-toggle="pill"
-                                       href="#custom-content-above-home"
-                                       role="tab"
-                                       aria-controls="custom-content-above-home"
-                                       aria-selected="true">
-                                        Home
-                                    </a>
-                                </li>
-                                <li class="nav-item">
-                                    <a class="nav-link"
-                                       id="custom-content-above-profile-tab"
-                                       data-toggle="pill"
-                                       href="#custom-content-above-profile"
-                                       role="tab"
-                                       aria-controls="custom-content-above-profile"
-                                       aria-selected="false">
-                                        Profile
-                                    </a>
-                                </li>
-                                <li class="nav-item">
-                                    <a class="nav-link"
-                                       id="custom-content-above-messages-tab"
-                                       data-toggle="pill"
-                                       href="#custom-content-above-messages"
-                                       role="tab"
-                                       aria-controls="custom-content-above-messages"
-                                       aria-selected="false">
-                                        Messages
-                                    </a>
-                                </li>
-                                <li class="nav-item">
-                                    <a class="nav-link"
-                                       id="custom-content-above-settings-tab"
-                                       data-toggle="pill"
-                                       href="#custom-content-above-settings"
-                                       role="tab"
-                                       aria-controls="custom-content-above-settings"
-                                       aria-selected="false">
-                                        Settings
-                                    </a>
-                                </li>
-                            </ul>
-                            <div class="tab-custom-content">
-                                <p class="lead mb-0">
-                                    Custom Content goes here
-                                </p>
-                            </div>
-                            <div class="tab-content" id="custom-content-above-tabContent">
-                                <div class="tab-pane fade show active"
-                                     id="custom-content-above-home"
-                                     role="tabpanel"
-                                     aria-labelledby="custom-content-above-home-tab">
-                                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
-                                </div>
-                                <div class="tab-pane fade"
-                                     id="custom-content-above-profile"
-                                     role="tabpanel"
-                                     aria-labelledby="custom-content-above-profile-tab">
-                                    Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
-                                </div>
-                                <div class="tab-pane fade"
-                                     id="custom-content-above-messages"
-                                     role="tabpanel"
-                                     aria-labelledby="custom-content-above-messages-tab">
-                                    Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
-                                </div>
-                                <div class="tab-pane fade"
-                                     id="custom-content-above-settings"
-                                     role="tabpanel"
-                                     aria-labelledby="custom-content-above-settings-tab">
-                                    Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
                                 </div>
                             </div>
                         </div>
-                        <!-- /.card -->
                     </div>
                     <!-- /.card -->
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- /.content -->
-        </div>
-        <!-- /.content-wrapper -->
-    {% endblock content %}
-    <!-- Specific Page JS goes HERE -->
-    {% block javascripts %}
-        <!-- jQuery -->
-        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-        <!-- Bootstrap 4 -->
-        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-        <!-- AdminLTE App -->
-        <script src="/static/assets/js/adminlte.min.js"></script>
-        <!-- AdminLTE for demo purposes -->
-        <script src="/static/assets/js/demo.js"></script>
-    {% endblock javascripts %}
+                <!-- /.card -->
+                <div class="card card-primary card-outline">
+                    <div class="card-header">
+                        <h3 class="card-title">
+                            <i class="fas fa-edit"></i>
+                            Tabs Custom Content Examples
+                        </h3>
+                    </div>
+                    <div class="card-body">
+                        <h4>Custom Content Below</h4>
+                        <ul class="nav nav-tabs" id="custom-content-below-tab" role="tablist">
+                            <li class="nav-item">
+                                <a class="nav-link active"
+                                   id="custom-content-below-home-tab"
+                                   data-toggle="pill"
+                                   href="#custom-content-below-home"
+                                   role="tab"
+                                   aria-controls="custom-content-below-home"
+                                   aria-selected="true">
+                                    Home
+                                </a>
+                            </li>
+                            <li class="nav-item">
+                                <a class="nav-link"
+                                   id="custom-content-below-profile-tab"
+                                   data-toggle="pill"
+                                   href="#custom-content-below-profile"
+                                   role="tab"
+                                   aria-controls="custom-content-below-profile"
+                                   aria-selected="false">
+                                    Profile
+                                </a>
+                            </li>
+                            <li class="nav-item">
+                                <a class="nav-link"
+                                   id="custom-content-below-messages-tab"
+                                   data-toggle="pill"
+                                   href="#custom-content-below-messages"
+                                   role="tab"
+                                   aria-controls="custom-content-below-messages"
+                                   aria-selected="false">
+                                    Messages
+                                </a>
+                            </li>
+                            <li class="nav-item">
+                                <a class="nav-link"
+                                   id="custom-content-below-settings-tab"
+                                   data-toggle="pill"
+                                   href="#custom-content-below-settings"
+                                   role="tab"
+                                   aria-controls="custom-content-below-settings"
+                                   aria-selected="false">
+                                    Settings
+                                </a>
+                            </li>
+                        </ul>
+                        <div class="tab-content" id="custom-content-below-tabContent">
+                            <div class="tab-pane fade show active"
+                                 id="custom-content-below-home"
+                                 role="tabpanel"
+                                 aria-labelledby="custom-content-below-home-tab">
+                                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
+                            </div>
+                            <div class="tab-pane fade"
+                                 id="custom-content-below-profile"
+                                 role="tabpanel"
+                                 aria-labelledby="custom-content-below-profile-tab">
+                                Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
+                            </div>
+                            <div class="tab-pane fade"
+                                 id="custom-content-below-messages"
+                                 role="tabpanel"
+                                 aria-labelledby="custom-content-below-messages-tab">
+                                Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
+                            </div>
+                            <div class="tab-pane fade"
+                                 id="custom-content-below-settings"
+                                 role="tabpanel"
+                                 aria-labelledby="custom-content-below-settings-tab">
+                                Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
+                            </div>
+                        </div>
+                        <div class="tab-custom-content">
+                            <p class="lead mb-0">
+                                Custom Content goes here
+                            </p>
+                        </div>
+                        <h4 class="mt-5 ">
+                            Custom Content Above
+                        </h4>
+                        <ul class="nav nav-tabs" id="custom-content-above-tab" role="tablist">
+                            <li class="nav-item">
+                                <a class="nav-link active"
+                                   id="custom-content-above-home-tab"
+                                   data-toggle="pill"
+                                   href="#custom-content-above-home"
+                                   role="tab"
+                                   aria-controls="custom-content-above-home"
+                                   aria-selected="true">
+                                    Home
+                                </a>
+                            </li>
+                            <li class="nav-item">
+                                <a class="nav-link"
+                                   id="custom-content-above-profile-tab"
+                                   data-toggle="pill"
+                                   href="#custom-content-above-profile"
+                                   role="tab"
+                                   aria-controls="custom-content-above-profile"
+                                   aria-selected="false">
+                                    Profile
+                                </a>
+                            </li>
+                            <li class="nav-item">
+                                <a class="nav-link"
+                                   id="custom-content-above-messages-tab"
+                                   data-toggle="pill"
+                                   href="#custom-content-above-messages"
+                                   role="tab"
+                                   aria-controls="custom-content-above-messages"
+                                   aria-selected="false">
+                                    Messages
+                                </a>
+                            </li>
+                            <li class="nav-item">
+                                <a class="nav-link"
+                                   id="custom-content-above-settings-tab"
+                                   data-toggle="pill"
+                                   href="#custom-content-above-settings"
+                                   role="tab"
+                                   aria-controls="custom-content-above-settings"
+                                   aria-selected="false">
+                                    Settings
+                                </a>
+                            </li>
+                        </ul>
+                        <div class="tab-custom-content">
+                            <p class="lead mb-0">
+                                Custom Content goes here
+                            </p>
+                        </div>
+                        <div class="tab-content" id="custom-content-above-tabContent">
+                            <div class="tab-pane fade show active"
+                                 id="custom-content-above-home"
+                                 role="tabpanel"
+                                 aria-labelledby="custom-content-above-home-tab">
+                                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur.
+                            </div>
+                            <div class="tab-pane fade"
+                                 id="custom-content-above-profile"
+                                 role="tabpanel"
+                                 aria-labelledby="custom-content-above-profile-tab">
+                                Mauris tincidunt mi at erat gravida, eget tristique urna bibendum. Mauris pharetra purus ut ligula tempor, et vulputate metus facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sollicitudin, nisi a luctus interdum, nisl ligula placerat mi, quis posuere purus ligula eu lectus. Donec nunc tellus, elementum sit amet ultricies at, posuere nec nunc. Nunc euismod pellentesque diam.
+                            </div>
+                            <div class="tab-pane fade"
+                                 id="custom-content-above-messages"
+                                 role="tabpanel"
+                                 aria-labelledby="custom-content-above-messages-tab">
+                                Morbi turpis dolor, vulputate vitae felis non, tincidunt congue mauris. Phasellus volutpat augue id mi placerat mollis. Vivamus faucibus eu massa eget condimentum. Fusce nec hendrerit sem, ac tristique nulla. Integer vestibulum orci odio. Cras nec augue ipsum. Suspendisse ut velit condimentum, mattis urna a, malesuada nunc. Curabitur eleifend facilisis velit finibus tristique. Nam vulputate, eros non luctus efficitur, ipsum odio volutpat massa, sit amet sollicitudin est libero sed ipsum. Nulla lacinia, ex vitae gravida fermentum, lectus ipsum gravida arcu, id fermentum metus arcu vel metus. Curabitur eget sem eu risus tincidunt eleifend ac ornare magna.
+                            </div>
+                            <div class="tab-pane fade"
+                                 id="custom-content-above-settings"
+                                 role="tabpanel"
+                                 aria-labelledby="custom-content-above-settings-tab">
+                                Pellentesque vestibulum commodo nibh nec blandit. Maecenas neque magna, iaculis tempus turpis ac, ornare sodales tellus. Mauris eget blandit dolor. Quisque tincidunt venenatis vulputate. Morbi euismod molestie tristique. Vestibulum consectetur dolor a vestibulum pharetra. Donec interdum placerat urna nec pharetra. Etiam eget dapibus orci, eget aliquet urna. Nunc at consequat diam. Nunc et felis ut nisl commodo dignissim. In hac habitasse platea dictumst. Praesent imperdiet accumsan ex sit amet facilisis.
+                            </div>
+                        </div>
+                    </div>
+                    <!-- /.card -->
+                </div>
+                <!-- /.card -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/ui-ribbons.html b/tests/jinja_adminlte/ui-ribbons.html
index c2ecca8..c8ff433 100644
--- a/tests/jinja_adminlte/ui-ribbons.html
+++ b/tests/jinja_adminlte/ui-ribbons.html
@@ -2,213 +2,207 @@
 {% block title %}UI Ribbons {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>Ribbons</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    Ribbons
-                                </li>
-                            </ol>
-                        </div>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>Ribbons</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                Ribbons
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-12">
-                            <div class="card card-primary">
-                                <div class="card-header">
-                                    <h3 class="card-title">Ribbons</h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <div class="row">
-                                        <div class="col-sm-4">
-                                            <div class="position-relative p-3 bg-gray" style="height: 180px">
-                                                <div class="ribbon-wrapper">
-                                                    <div class="ribbon bg-primary">
-                                                        Ribbon
-                                                    </div>
-                                                </div>
-                                                Ribbon Default
-                                                <br />
-                                                <small>
-                                                .ribbon-wrapper.ribbon-lg .ribbon
-                                                </small>
-                                            </div>
-                                        </div>
-                                        <div class="col-sm-4">
-                                            <div class="position-relative p-3 bg-gray" style="height: 180px">
-                                                <div class="ribbon-wrapper ribbon-lg">
-                                                    <div class="ribbon bg-info">
-                                                        Ribbon Large
-                                                    </div>
-                                                </div>
-                                                Ribbon Large
-                                                <br />
-                                                <small>
-                                                .ribbon-wrapper.ribbon-lg .ribbon
-                                                </small>
-                                            </div>
-                                        </div>
-                                        <div class="col-sm-4">
-                                            <div class="position-relative p-3 bg-gray" style="height: 180px">
-                                                <div class="ribbon-wrapper ribbon-xl">
-                                                    <div class="ribbon bg-secondary">
-                                                        Ribbon Extra Large
-                                                    </div>
-                                                </div>
-                                                Ribbon Extra Large
-                                                <br />
-                                                <small>
-                                                .ribbon-wrapper.ribbon-xl .ribbon
-                                                </small>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="row mt-4">
-                                        <div class="col-sm-4">
-                                            <div class="position-relative p-3 bg-gray" style="height: 180px">
-                                                <div class="ribbon-wrapper ribbon-lg">
-                                                    <div class="ribbon bg-success text-lg">
-                                                        Ribbon
-                                                    </div>
-                                                </div>
-                                                Ribbon Large
-                                                <br />
-                                                with Large Text
-                                                <br />
-                                                <small>
-                                                .ribbon-wrapper.ribbon-lg .ribbon.text-lg
-                                                </small>
-                                            </div>
-                                        </div>
-                                        <div class="col-sm-4">
-                                            <div class="position-relative p-3 bg-gray" style="height: 180px">
-                                                <div class="ribbon-wrapper ribbon-xl">
-                                                    <div class="ribbon bg-warning text-lg">
-                                                        Ribbon
-                                                    </div>
-                                                </div>
-                                                Ribbon Extra Large
-                                                <br />
-                                                with Large Text
-                                                <br />
-                                                <small>
-                                                .ribbon-wrapper.ribbon-xl .ribbon.text-lg
-                                                </small>
-                                            </div>
-                                        </div>
-                                        <div class="col-sm-4">
-                                            <div class="position-relative p-3 bg-gray" style="height: 180px">
-                                                <div class="ribbon-wrapper ribbon-xl">
-                                                    <div class="ribbon bg-danger text-xl">
-                                                        Ribbon
-                                                    </div>
-                                                </div>
-                                                Ribbon Extra Large
-                                                <br />
-                                                with Extra Large Text
-                                                <br />
-                                                <small>
-                                                .ribbon-wrapper.ribbon-xl .ribbon.text-xl
-                                                </small>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="row mt-4">
-                                        <div class="col-sm-4">
-                                            <div class="position-relative">
-                                                <img src="/static/assets/img/photo1.png"
-                                                     alt="Photo 1"
-                                                     class="img-fluid">
-                                                    <div class="ribbon-wrapper ribbon-lg">
-                                                        <div class="ribbon bg-success text-lg">
-                                                            Ribbon
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <div class="col-sm-4">
-                                                <div class="position-relative">
-                                                    <img src="/static/assets/img/photo2.png"
-                                                         alt="Photo 2"
-                                                         class="img-fluid">
-                                                        <div class="ribbon-wrapper ribbon-xl">
-                                                            <div class="ribbon bg-warning text-lg">
-                                                                Ribbon
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                                <div class="col-sm-4">
-                                                    <div class="position-relative" style="min-height: 180px;">
-                                                        <img src="/static/assets/img/photo3.jpg"
-                                                             alt="Photo 3"
-                                                             class="img-fluid">
-                                                            <div class="ribbon-wrapper ribbon-xl">
-                                                                <div class="ribbon bg-danger text-xl">
-                                                                    Ribbon
-                                                                </div>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <!-- /.card-body -->
-                                        </div>
-                                        <!-- /.card -->
-                                    </div>
-                                    <!-- /.col -->
-                                </div>
-                                <!-- /.row -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-12">
+                        <div class="card card-primary">
+                            <div class="card-header">
+                                <h3 class="card-title">Ribbons</h3>
                             </div>
-                            <!-- /.container-fluid -->
-                        </section>
-                        <!-- /.content -->
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <div class="row">
+                                    <div class="col-sm-4">
+                                        <div class="position-relative p-3 bg-gray" style="height: 180px">
+                                            <div class="ribbon-wrapper">
+                                                <div class="ribbon bg-primary">
+                                                    Ribbon
+                                                </div>
+                                            </div>
+                                            Ribbon Default
+                                            <br />
+                                            <small>
+                                            .ribbon-wrapper.ribbon-lg .ribbon
+                                            </small>
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-4">
+                                        <div class="position-relative p-3 bg-gray" style="height: 180px">
+                                            <div class="ribbon-wrapper ribbon-lg">
+                                                <div class="ribbon bg-info">
+                                                    Ribbon Large
+                                                </div>
+                                            </div>
+                                            Ribbon Large
+                                            <br />
+                                            <small>
+                                            .ribbon-wrapper.ribbon-lg .ribbon
+                                            </small>
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-4">
+                                        <div class="position-relative p-3 bg-gray" style="height: 180px">
+                                            <div class="ribbon-wrapper ribbon-xl">
+                                                <div class="ribbon bg-secondary">
+                                                    Ribbon Extra Large
+                                                </div>
+                                            </div>
+                                            Ribbon Extra Large
+                                            <br />
+                                            <small>
+                                            .ribbon-wrapper.ribbon-xl .ribbon
+                                            </small>
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="row mt-4">
+                                    <div class="col-sm-4">
+                                        <div class="position-relative p-3 bg-gray" style="height: 180px">
+                                            <div class="ribbon-wrapper ribbon-lg">
+                                                <div class="ribbon bg-success text-lg">
+                                                    Ribbon
+                                                </div>
+                                            </div>
+                                            Ribbon Large
+                                            <br />
+                                            with Large Text
+                                            <br />
+                                            <small>
+                                            .ribbon-wrapper.ribbon-lg .ribbon.text-lg
+                                            </small>
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-4">
+                                        <div class="position-relative p-3 bg-gray" style="height: 180px">
+                                            <div class="ribbon-wrapper ribbon-xl">
+                                                <div class="ribbon bg-warning text-lg">
+                                                    Ribbon
+                                                </div>
+                                            </div>
+                                            Ribbon Extra Large
+                                            <br />
+                                            with Large Text
+                                            <br />
+                                            <small>
+                                            .ribbon-wrapper.ribbon-xl .ribbon.text-lg
+                                            </small>
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-4">
+                                        <div class="position-relative p-3 bg-gray" style="height: 180px">
+                                            <div class="ribbon-wrapper ribbon-xl">
+                                                <div class="ribbon bg-danger text-xl">
+                                                    Ribbon
+                                                </div>
+                                            </div>
+                                            Ribbon Extra Large
+                                            <br />
+                                            with Extra Large Text
+                                            <br />
+                                            <small>
+                                            .ribbon-wrapper.ribbon-xl .ribbon.text-xl
+                                            </small>
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="row mt-4">
+                                    <div class="col-sm-4">
+                                        <div class="position-relative">
+                                            <img src="/static/assets/img/photo1.png" alt="Photo 1" class="img-fluid">
+                                            <div class="ribbon-wrapper ribbon-lg">
+                                                <div class="ribbon bg-success text-lg">
+                                                    Ribbon
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-4">
+                                        <div class="position-relative">
+                                            <img src="/static/assets/img/photo2.png" alt="Photo 2" class="img-fluid">
+                                            <div class="ribbon-wrapper ribbon-xl">
+                                                <div class="ribbon bg-warning text-lg">
+                                                    Ribbon
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-4">
+                                        <div class="position-relative" style="min-height: 180px;">
+                                            <img src="/static/assets/img/photo3.jpg" alt="Photo 3" class="img-fluid">
+                                            <div class="ribbon-wrapper ribbon-xl">
+                                                <div class="ribbon bg-danger text-xl">
+                                                    Ribbon
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
                     </div>
-                    <!-- /.content-wrapper -->
-                {% endblock content %}
-                <!-- Specific Page JS goes HERE -->
-                {% block javascripts %}
-                    <!-- jQuery -->
-                    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                    <!-- Bootstrap 4 -->
-                    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                    <!-- AdminLTE App -->
-                    <script src="/static/assets/js/adminlte.min.js"></script>
-                    <!-- AdminLTE for demo purposes -->
-                    <script src="/static/assets/js/demo.js"></script>
-                    <!-- Ion Slider -->
-                    <script src="/static/assets/plugins/ion-rangeslider/js/ion.rangeSlider.min.js"></script>
-                    <!-- Bootstrap slider -->
-                    <script src="/static/assets/plugins/bootstrap-slider/bootstrap-slider.min.js"></script>
-                    <script>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+    <!-- Ion Slider -->
+    <script src="/static/assets/plugins/ion-rangeslider/js/ion.rangeSlider.min.js"></script>
+    <!-- Bootstrap slider -->
+    <script src="/static/assets/plugins/bootstrap-slider/bootstrap-slider.min.js"></script>
+    <script>
     $(function () {
       /* BOOTSTRAP SLIDER */
       $('.slider').bootstrapSlider()
@@ -273,5 +267,5 @@
         }
       })
     })
-                    </script>
-                {% endblock javascripts %}
+    </script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/ui-sliders.html b/tests/jinja_adminlte/ui-sliders.html
index 1897d16..8475f89 100644
--- a/tests/jinja_adminlte/ui-sliders.html
+++ b/tests/jinja_adminlte/ui-sliders.html
@@ -2,299 +2,299 @@
 {% block title %}UI Sliders {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- Ion Slider -->
-        <link rel="stylesheet" href="/static/assets/plugins/ion-rangeslider/css/ion.rangeSlider.min.css">
-        <!-- bootstrap slider -->
-        <link rel="stylesheet" href="/static/assets/plugins/bootstrap-slider/css/bootstrap-slider.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>Sliders</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    Sliders
-                                </li>
-                            </ol>
-                        </div>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- Ion Slider -->
+    <link rel="stylesheet" href="/static/assets/plugins/ion-rangeslider/css/ion.rangeSlider.min.css">
+    <!-- bootstrap slider -->
+    <link rel="stylesheet" href="/static/assets/plugins/bootstrap-slider/css/bootstrap-slider.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>Sliders</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                Sliders
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="col-12">
-                            <div class="card card-primary">
-                                <div class="card-header">
-                                    <h3 class="card-title">Ion Slider</h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <div class="row margin">
-                                        <div class="col-sm-6">
-                                            <input id="range_1" type="text" name="range_1" value="">
-                                        </div>
-                                        <div class="col-sm-6">
-                                            <input id="range_2"
-                                                   type="text"
-                                                   name="range_2"
-                                                   value="1000;100000"
-                                                   data-type="double"
-                                                   data-step="500"
-                                                   data-postfix=" &euro;"
-                                                   data-from="30000"
-                                                   data-to="90000"
-                                                   data-hasgrid="true">
-                                        </div>
-                                    </div>
-                                    <div class="row margin">
-                                        <div class="col-sm-6">
-                                            <input id="range_5" type="text" name="range_5" value="">
-                                        </div>
-                                        <div class="col-sm-6">
-                                            <input id="range_6" type="text" name="range_6" value="">
-                                        </div>
-                                    </div>
-                                    <div class="row margin">
-                                        <div class="col-sm-12">
-                                            <input id="range_4" type="text" name="range_4" value="10000;100000">
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- /.card-body -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-12">
+                        <div class="card card-primary">
+                            <div class="card-header">
+                                <h3 class="card-title">Ion Slider</h3>
                             </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- /.row -->
-                    <div class="row">
-                        <div class="col-12">
-                            <div class="card card-primary">
-                                <div class="card-header">
-                                    <h3 class="card-title">Bootstrap Slider</h3>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <div class="row margin">
-                                        <div class="col-sm-6">
-                                            <div class="slider-red">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="horizontal"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                            <p>
-                                                .slider-red input.slider
-                                            </p>
-                                            <div class="slider-blue">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="horizontal"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                            <p>
-                                                .slider-blue input.slider
-                                            </p>
-                                            <div class="slider-green">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="horizontal"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                            <p>
-                                                .slider-green input.slider
-                                            </p>
-                                            <div class="slider-yellow">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="horizontal"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                            <p>
-                                                .slider-yellow input.slider
-                                            </p>
-                                            <div class="slider-teal">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="horizontal"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                            <p>
-                                                .slider-teal input.slider
-                                            </p>
-                                            <div class="slider-purple">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="horizontal"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                            <p>
-                                                .slider-purple input.slider
-                                            </p>
-                                        </div>
-                                        <div class="col-sm-6 d-flex justify-content-center">
-                                            <div class="slider-red mx-3">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="vertical"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                            <div class="slider-blue mx-3">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="vertical"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                            <div class="slider-green mx-3">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="vertical"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                            <div class="slider-yellow mx-3">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="vertical"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                            <div class="slider-teal mx-3">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="vertical"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                            <div class="slider-purple mx-3">
-                                                <input type="text"
-                                                       value=""
-                                                       class="slider form-control"
-                                                       data-slider-min="-200"
-                                                       data-slider-max="200"
-                                                       data-slider-step="5"
-                                                       data-slider-value="[-100,100]"
-                                                       data-slider-orientation="vertical"
-                                                       data-slider-selection="before"
-                                                       data-slider-tooltip="show">
-                                            </div>
-                                        </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <div class="row margin">
+                                    <div class="col-sm-6">
+                                        <input id="range_1" type="text" name="range_1" value="">
+                                    </div>
+                                    <div class="col-sm-6">
+                                        <input id="range_2"
+                                               type="text"
+                                               name="range_2"
+                                               value="1000;100000"
+                                               data-type="double"
+                                               data-step="500"
+                                               data-postfix=" &euro;"
+                                               data-from="30000"
+                                               data-to="90000"
+                                               data-hasgrid="true">
+                                    </div>
+                                </div>
+                                <div class="row margin">
+                                    <div class="col-sm-6">
+                                        <input id="range_5" type="text" name="range_5" value="">
+                                    </div>
+                                    <div class="col-sm-6">
+                                        <input id="range_6" type="text" name="range_6" value="">
+                                    </div>
+                                </div>
+                                <div class="row margin">
+                                    <div class="col-sm-12">
+                                        <input id="range_4" type="text" name="range_4" value="10000;100000">
                                     </div>
                                 </div>
-                                <!-- /.card-body -->
                             </div>
-                            <!-- /.card -->
+                            <!-- /.card-body -->
                         </div>
-                        <!-- /.col -->
+                        <!-- /.card -->
                     </div>
-                    <!-- /.row -->
+                    <!-- /.col -->
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- /.content -->
-        </div>
-        <!-- /.content-wrapper -->
-    {% endblock content %}
-    <!-- Specific Page JS goes HERE -->
-    {% block javascripts %}
-        <!-- jQuery -->
-        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-        <!-- Bootstrap 4 -->
-        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-        <!-- AdminLTE App -->
-        <script src="/static/assets/js/adminlte.min.js"></script>
-        <!-- AdminLTE for demo purposes -->
-        <script src="/static/assets/js/demo.js"></script>
-        <!-- Ion Slider -->
-        <script src="/static/assets/plugins/ion-rangeslider/js/ion.rangeSlider.min.js"></script>
-        <!-- Bootstrap slider -->
-        <script src="/static/assets/plugins/bootstrap-slider/bootstrap-slider.min.js"></script>
-        <script>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-12">
+                        <div class="card card-primary">
+                            <div class="card-header">
+                                <h3 class="card-title">Bootstrap Slider</h3>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <div class="row margin">
+                                    <div class="col-sm-6">
+                                        <div class="slider-red">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="horizontal"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                        <p>
+                                            .slider-red input.slider
+                                        </p>
+                                        <div class="slider-blue">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="horizontal"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                        <p>
+                                            .slider-blue input.slider
+                                        </p>
+                                        <div class="slider-green">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="horizontal"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                        <p>
+                                            .slider-green input.slider
+                                        </p>
+                                        <div class="slider-yellow">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="horizontal"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                        <p>
+                                            .slider-yellow input.slider
+                                        </p>
+                                        <div class="slider-teal">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="horizontal"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                        <p>
+                                            .slider-teal input.slider
+                                        </p>
+                                        <div class="slider-purple">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="horizontal"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                        <p>
+                                            .slider-purple input.slider
+                                        </p>
+                                    </div>
+                                    <div class="col-sm-6 d-flex justify-content-center">
+                                        <div class="slider-red mx-3">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="vertical"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                        <div class="slider-blue mx-3">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="vertical"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                        <div class="slider-green mx-3">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="vertical"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                        <div class="slider-yellow mx-3">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="vertical"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                        <div class="slider-teal mx-3">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="vertical"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                        <div class="slider-purple mx-3">
+                                            <input type="text"
+                                                   value=""
+                                                   class="slider form-control"
+                                                   data-slider-min="-200"
+                                                   data-slider-max="200"
+                                                   data-slider-step="5"
+                                                   data-slider-value="[-100,100]"
+                                                   data-slider-orientation="vertical"
+                                                   data-slider-selection="before"
+                                                   data-slider-tooltip="show">
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+    <!-- Ion Slider -->
+    <script src="/static/assets/plugins/ion-rangeslider/js/ion.rangeSlider.min.js"></script>
+    <!-- Bootstrap slider -->
+    <script src="/static/assets/plugins/bootstrap-slider/bootstrap-slider.min.js"></script>
+    <script>
     $(function () {
       /* BOOTSTRAP SLIDER */
       $('.slider').bootstrapSlider()
@@ -359,5 +359,5 @@
         }
       })
     })
-        </script>
-    {% endblock javascripts %}
+    </script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/ui-timeline.html b/tests/jinja_adminlte/ui-timeline.html
index afafa18..bdd4dd4 100644
--- a/tests/jinja_adminlte/ui-timeline.html
+++ b/tests/jinja_adminlte/ui-timeline.html
@@ -2,193 +2,193 @@
 {% block title %}UI Timeline {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>Timeline</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    Timeline
-                                </li>
-                            </ol>
-                        </div>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>Timeline</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                Timeline
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <!-- Timelime example -->
-                    <div class="row">
-                        <div class="col-md-12">
-                            <!-- The time line -->
-                            <div class="timeline">
-                                <!-- timeline time label -->
-                                <div class="time-label">
-                                    <span class="bg-red">10 Feb. 2014</span>
-                                </div>
-                                <!-- /.timeline-label -->
-                                <!-- timeline item -->
-                                <div>
-                                    <i class="fas fa-envelope bg-blue"></i>
-                                    <div class="timeline-item">
-                                        <span class="time">
-                                            <i class="fas fa-clock"></i>
-                                            12:05
-                                        </span>
-                                        <h3 class="timeline-header">
-                                            <a href="#">Support Team</a>
-                                            sent you an email
-                                        </h3>
-                                        <div class="timeline-body">
-                                            Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles,
-                                            weebly ning heekya handango imeem plugg dopplr jibjab, movity
-                                            jajah plickers sifteo edmodo ifttt zimbra. Babblely odeo kaboodle
-                                            quora plaxo ideeli hulu weebly balihoo...
-                                        </div>
-                                        <div class="timeline-footer">
-                                            <a class="btn btn-primary btn-sm">Read more</a>
-                                            <a class="btn btn-danger btn-sm">Delete</a>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- END timeline item -->
-                                <!-- timeline item -->
-                                <div>
-                                    <i class="fas fa-user bg-green"></i>
-                                    <div class="timeline-item">
-                                        <span class="time">
-                                            <i class="fas fa-clock"></i>
-                                            5 mins ago
-                                        </span>
-                                        <h3 class="timeline-header no-border">
-                                            <a href="#">Sarah Young</a>
-                                            accepted your friend request
-                                        </h3>
-                                    </div>
-                                </div>
-                                <!-- END timeline item -->
-                                <!-- timeline item -->
-                                <div>
-                                    <i class="fas fa-comments bg-yellow"></i>
-                                    <div class="timeline-item">
-                                        <span class="time">
-                                            <i class="fas fa-clock"></i>
-                                            27 mins ago
-                                        </span>
-                                        <h3 class="timeline-header">
-                                            <a href="#">Jay White</a>
-                                            commented on your post
-                                        </h3>
-                                        <div class="timeline-body">
-                                            Take me to your leader!
-                                            Switzerland is small and neutral!
-                                            We are more like Germany, ambitious and misunderstood!
-                                        </div>
-                                        <div class="timeline-footer">
-                                            <a class="btn btn-warning btn-sm">View comment</a>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- END timeline item -->
-                                <!-- timeline time label -->
-                                <div class="time-label">
-                                    <span class="bg-green">3 Jan. 2014</span>
-                                </div>
-                                <!-- /.timeline-label -->
-                                <!-- timeline item -->
-                                <div>
-                                    <i class="fa fa-camera bg-purple"></i>
-                                    <div class="timeline-item">
-                                        <span class="time">
-                                            <i class="fas fa-clock"></i>
-                                            2 days ago
-                                        </span>
-                                        <h3 class="timeline-header">
-                                            <a href="#">Mina Lee</a>
-                                            uploaded new photos
-                                        </h3>
-                                        <div class="timeline-body">
-                                            <img src="https://placehold.it/150x100" alt="...">
-                                                <img src="https://placehold.it/150x100" alt="...">
-                                                    <img src="https://placehold.it/150x100" alt="...">
-                                                        <img src="https://placehold.it/150x100" alt="...">
-                                                            <img src="https://placehold.it/150x100" alt="...">
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <!-- END timeline item -->
-                                                    <!-- timeline item -->
-                                                    <div>
-                                                        <i class="fas fa-video bg-maroon"></i>
-                                                        <div class="timeline-item">
-                                                            <span class="time">
-                                                                <i class="fas fa-clock"></i>
-                                                                5 days ago
-                                                            </span>
-                                                            <h3 class="timeline-header">
-                                                                <a href="#">
-                                                                    Mr. Doe
-                                                                </a>
-                                                                shared a video
-                                                            </h3>
-                                                            <div class="timeline-body">
-                                                                <div class="embed-responsive embed-responsive-16by9">
-                                                                    <iframe class="embed-responsive-item"
-                                                                            src="https://www.youtube.com/embed/tMWkeBIohBs"></iframe>
-                                                                </div>
-                                                            </div>
-                                                            <div class="timeline-footer">
-                                                                <a href="#" class="btn btn-sm bg-maroon">
-                                                                    See comments
-                                                                </a>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <!-- END timeline item -->
-                                                    <div>
-                                                        <i class="fas fa-clock bg-gray"></i>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <!-- /.col -->
-                                        </div>
-                                    </div>
-                                    <!-- /.timeline -->
-                                </section>
-                                <!-- /.content -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <!-- Timelime example -->
+                <div class="row">
+                    <div class="col-md-12">
+                        <!-- The time line -->
+                        <div class="timeline">
+                            <!-- timeline time label -->
+                            <div class="time-label">
+                                <span class="bg-red">10 Feb. 2014</span>
                             </div>
-                            <!-- /.content-wrapper -->
-                        {% endblock content %}
-                        <!-- Specific Page JS goes HERE -->
-                        {% block javascripts %}
-                            <!-- jQuery -->
-                            <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                            <!-- Bootstrap 4 -->
-                            <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                            <!-- AdminLTE App -->
-                            <script src="/static/assets/js/adminlte.min.js"></script>
-                            <!-- AdminLTE for demo purposes -->
-                            <script src="/static/assets/js/demo.js"></script>
-                        {% endblock javascripts %}
+                            <!-- /.timeline-label -->
+                            <!-- timeline item -->
+                            <div>
+                                <i class="fas fa-envelope bg-blue"></i>
+                                <div class="timeline-item">
+                                    <span class="time">
+                                        <i class="fas fa-clock"></i>
+                                        12:05
+                                    </span>
+                                    <h3 class="timeline-header">
+                                        <a href="#">Support Team</a>
+                                        sent you an email
+                                    </h3>
+                                    <div class="timeline-body">
+                                        Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles,
+                                        weebly ning heekya handango imeem plugg dopplr jibjab, movity
+                                        jajah plickers sifteo edmodo ifttt zimbra. Babblely odeo kaboodle
+                                        quora plaxo ideeli hulu weebly balihoo...
+                                    </div>
+                                    <div class="timeline-footer">
+                                        <a class="btn btn-primary btn-sm">Read more</a>
+                                        <a class="btn btn-danger btn-sm">Delete</a>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- END timeline item -->
+                            <!-- timeline item -->
+                            <div>
+                                <i class="fas fa-user bg-green"></i>
+                                <div class="timeline-item">
+                                    <span class="time">
+                                        <i class="fas fa-clock"></i>
+                                        5 mins ago
+                                    </span>
+                                    <h3 class="timeline-header no-border">
+                                        <a href="#">Sarah Young</a>
+                                        accepted your friend request
+                                    </h3>
+                                </div>
+                            </div>
+                            <!-- END timeline item -->
+                            <!-- timeline item -->
+                            <div>
+                                <i class="fas fa-comments bg-yellow"></i>
+                                <div class="timeline-item">
+                                    <span class="time">
+                                        <i class="fas fa-clock"></i>
+                                        27 mins ago
+                                    </span>
+                                    <h3 class="timeline-header">
+                                        <a href="#">Jay White</a>
+                                        commented on your post
+                                    </h3>
+                                    <div class="timeline-body">
+                                        Take me to your leader!
+                                        Switzerland is small and neutral!
+                                        We are more like Germany, ambitious and misunderstood!
+                                    </div>
+                                    <div class="timeline-footer">
+                                        <a class="btn btn-warning btn-sm">View comment</a>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- END timeline item -->
+                            <!-- timeline time label -->
+                            <div class="time-label">
+                                <span class="bg-green">3 Jan. 2014</span>
+                            </div>
+                            <!-- /.timeline-label -->
+                            <!-- timeline item -->
+                            <div>
+                                <i class="fa fa-camera bg-purple"></i>
+                                <div class="timeline-item">
+                                    <span class="time">
+                                        <i class="fas fa-clock"></i>
+                                        2 days ago
+                                    </span>
+                                    <h3 class="timeline-header">
+                                        <a href="#">Mina Lee</a>
+                                        uploaded new photos
+                                    </h3>
+                                    <div class="timeline-body">
+                                        <img src="https://placehold.it/150x100" alt="...">
+                                        <img src="https://placehold.it/150x100" alt="...">
+                                        <img src="https://placehold.it/150x100" alt="...">
+                                        <img src="https://placehold.it/150x100" alt="...">
+                                        <img src="https://placehold.it/150x100" alt="...">
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- END timeline item -->
+                            <!-- timeline item -->
+                            <div>
+                                <i class="fas fa-video bg-maroon"></i>
+                                <div class="timeline-item">
+                                    <span class="time">
+                                        <i class="fas fa-clock"></i>
+                                        5 days ago
+                                    </span>
+                                    <h3 class="timeline-header">
+                                        <a href="#">
+                                            Mr. Doe
+                                        </a>
+                                        shared a video
+                                    </h3>
+                                    <div class="timeline-body">
+                                        <div class="embed-responsive embed-responsive-16by9">
+                                            <iframe class="embed-responsive-item"
+                                                    src="https://www.youtube.com/embed/tMWkeBIohBs"></iframe>
+                                        </div>
+                                    </div>
+                                    <div class="timeline-footer">
+                                        <a href="#" class="btn btn-sm bg-maroon">
+                                            See comments
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- END timeline item -->
+                            <div>
+                                <i class="fas fa-clock bg-gray"></i>
+                            </div>
+                        </div>
+                    </div>
+                    <!-- /.col -->
+                </div>
+            </div>
+            <!-- /.timeline -->
+        </section>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}
diff --git a/tests/jinja_adminlte/widgets.html b/tests/jinja_adminlte/widgets.html
index 8b94fc1..e03e431 100644
--- a/tests/jinja_adminlte/widgets.html
+++ b/tests/jinja_adminlte/widgets.html
@@ -2,2912 +2,2834 @@
 {% block title %}Widgets {% endblock %}
 <!-- Element injected in the BODY element -->
 {% block body_class %}{% endblock body_class %}
-    <!-- Specific Page CSS goes HERE -->
-    {% block stylesheets %}
-        <!-- Google Font: Source Sans Pro -->
-        <link rel="stylesheet"
-              href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
-        <!-- Font Awesome -->
-        <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
-        <!-- Ionicons -->
-        <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
-        <!-- Theme style -->
-        <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
-    {% endblock stylesheets %}
-    {% block content %}
-        <!-- Content Wrapper. Contains page content -->
-        <div class="content-wrapper">
-            <!-- Content Header (Page header) -->
-            <section class="content-header">
-                <div class="container-fluid">
-                    <div class="row mb-2">
-                        <div class="col-sm-6">
-                            <h1>Widgets</h1>
-                        </div>
-                        <div class="col-sm-6">
-                            <ol class="breadcrumb float-sm-right">
-                                <li class="breadcrumb-item">
-                                    <a href="#">Home</a>
-                                </li>
-                                <li class="breadcrumb-item active">
-                                    Widgets
-                                </li>
-                            </ol>
-                        </div>
+<!-- Specific Page CSS goes HERE -->
+{% block stylesheets %}
+    <!-- Google Font: Source Sans Pro -->
+    <link rel="stylesheet"
+          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="/static/assets/plugins/fontawesome-free/css/all.min.css">
+    <!-- Ionicons -->
+    <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="/static/assets/css/adminlte.min.css">
+{% endblock stylesheets %}
+{% block content %}
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>Widgets</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item">
+                                <a href="#">Home</a>
+                            </li>
+                            <li class="breadcrumb-item active">
+                                Widgets
+                            </li>
+                        </ol>
                     </div>
                 </div>
-                <!-- /.container-fluid -->
-            </section>
-            <!-- Main content -->
-            <section class="content">
-                <div class="container-fluid">
-                    <h5 class="mb-2">Info Box</h5>
-                    <div class="row">
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box">
-                                <span class="info-box-icon bg-info">
-                                    <i class="far fa-envelope"></i>
-                                </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">Messages</span>
-                                    <span class="info-box-number">1,410</span>
-                                </div>
-                                <!-- /.info-box-content -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <h5 class="mb-2">Info Box</h5>
+                <div class="row">
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box">
+                            <span class="info-box-icon bg-info">
+                                <i class="far fa-envelope"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">Messages</span>
+                                <span class="info-box-number">1,410</span>
                             </div>
-                            <!-- /.info-box -->
+                            <!-- /.info-box-content -->
                         </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box">
-                                <span class="info-box-icon bg-success">
-                                    <i class="far fa-flag"></i>
-                                </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">Bookmarks</span>
-                                    <span class="info-box-number">410</span>
-                                </div>
-                                <!-- /.info-box-content -->
-                            </div>
-                            <!-- /.info-box -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box">
-                                <span class="info-box-icon bg-warning">
-                                    <i class="far fa-copy"></i>
-                                </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">Uploads</span>
-                                    <span class="info-box-number">13,648</span>
-                                </div>
-                                <!-- /.info-box-content -->
-                            </div>
-                            <!-- /.info-box -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box">
-                                <span class="info-box-icon bg-danger">
-                                    <i class="far fa-star"></i>
-                                </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">Likes</span>
-                                    <span class="info-box-number">93,139</span>
-                                </div>
-                                <!-- /.info-box-content -->
-                            </div>
-                            <!-- /.info-box -->
-                        </div>
-                        <!-- /.col -->
+                        <!-- /.info-box -->
                     </div>
-                    <!-- /.row -->
-                    <!-- =========================================================== -->
-                    <h5 class="mb-2">
-                        Info Box With Custom Shadows
-                        <small>
-                        <i>
-                        Using Bootstrap's Shadow Utility
-                        </i>
-                        </small>
-                    </h5>
-                    <div class="row">
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box shadow-none">
-                                <span class="info-box-icon bg-info">
-                                    <i class="far fa-envelope"></i>
-                                </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Custom Shadows - None
-                                    </span>
-                                    <span class="info-box-number"></span>
-                                </div>
-                                <!-- /.info-box-content -->
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box">
+                            <span class="info-box-icon bg-success">
+                                <i class="far fa-flag"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">Bookmarks</span>
+                                <span class="info-box-number">410</span>
                             </div>
-                            <!-- /.info-box -->
+                            <!-- /.info-box-content -->
                         </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box shadow-sm">
-                                <span class="info-box-icon bg-success">
-                                    <i class="far fa-flag"></i>
-                                </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Custom Shadows - Small
-                                    </span>
-                                    <span class="info-box-number"></span>
-                                </div>
-                                <!-- /.info-box-content -->
-                            </div>
-                            <!-- /.info-box -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box shadow">
-                                <span class="info-box-icon bg-warning">
-                                    <i class="far fa-copy"></i>
-                                </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Custom Shadows - Regular
-                                    </span>
-                                    <span class="info-box-number"></span>
-                                </div>
-                                <!-- /.info-box-content -->
-                            </div>
-                            <!-- /.info-box -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box shadow-lg">
-                                <span class="info-box-icon bg-danger">
-                                    <i class="far fa-star"></i>
-                                </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Custom Shadows - Large
-                                    </span>
-                                    <span class="info-box-number"></span>
-                                </div>
-                                <!-- /.info-box-content -->
-                            </div>
-                            <!-- /.info-box -->
-                        </div>
-                        <!-- /.col -->
+                        <!-- /.info-box -->
                     </div>
-                    <!-- /.row -->
-                    <!-- =========================================================== -->
-                    <h5 class="mt-4 mb-2">
-                        Info Box With
-                        <code>
-                        bg-*
-                        </code>
-                    </h5>
-                    <div class="row">
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box bg-info">
-                                <span class="info-box-icon">
-                                    <i class="far fa-bookmark"></i>
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box">
+                            <span class="info-box-icon bg-warning">
+                                <i class="far fa-copy"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">Uploads</span>
+                                <span class="info-box-number">13,648</span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box">
+                            <span class="info-box-icon bg-danger">
+                                <i class="far fa-star"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">Likes</span>
+                                <span class="info-box-number">93,139</span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- =========================================================== -->
+                <h5 class="mb-2">
+                    Info Box With Custom Shadows
+                    <small>
+                    <i>
+                    Using Bootstrap's Shadow Utility
+                    </i>
+                    </small>
+                </h5>
+                <div class="row">
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box shadow-none">
+                            <span class="info-box-icon bg-info">
+                                <i class="far fa-envelope"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Custom Shadows - None
                                 </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Bookmarks
-                                    </span>
-                                    <span class="info-box-number">
-                                        41,410
-                                    </span>
-                                    <div class="progress">
-                                        <div class="progress-bar" style="width: 70%"></div>
-                                    </div>
-                                    <span class="progress-description">
-                                        70% Increase in 30 Days
-                                    </span>
-                                </div>
-                                <!-- /.info-box-content -->
+                                <span class="info-box-number"></span>
                             </div>
-                            <!-- /.info-box -->
+                            <!-- /.info-box-content -->
                         </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box bg-success">
-                                <span class="info-box-icon">
-                                    <i class="far fa-thumbs-up"></i>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box shadow-sm">
+                            <span class="info-box-icon bg-success">
+                                <i class="far fa-flag"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Custom Shadows - Small
                                 </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Likes
-                                    </span>
-                                    <span class="info-box-number">
-                                        41,410
-                                    </span>
-                                    <div class="progress">
-                                        <div class="progress-bar" style="width: 70%"></div>
-                                    </div>
-                                    <span class="progress-description">
-                                        70% Increase in 30 Days
-                                    </span>
-                                </div>
-                                <!-- /.info-box-content -->
+                                <span class="info-box-number"></span>
                             </div>
-                            <!-- /.info-box -->
+                            <!-- /.info-box-content -->
                         </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box bg-warning">
-                                <span class="info-box-icon">
-                                    <i class="far fa-calendar-alt"></i>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box shadow">
+                            <span class="info-box-icon bg-warning">
+                                <i class="far fa-copy"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Custom Shadows - Regular
                                 </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Events
-                                    </span>
-                                    <span class="info-box-number">
-                                        41,410
-                                    </span>
-                                    <div class="progress">
-                                        <div class="progress-bar" style="width: 70%"></div>
-                                    </div>
-                                    <span class="progress-description">
-                                        70% Increase in 30 Days
-                                    </span>
-                                </div>
-                                <!-- /.info-box-content -->
+                                <span class="info-box-number"></span>
                             </div>
-                            <!-- /.info-box -->
+                            <!-- /.info-box-content -->
                         </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box bg-danger">
-                                <span class="info-box-icon">
-                                    <i class="fas fa-comments"></i>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box shadow-lg">
+                            <span class="info-box-icon bg-danger">
+                                <i class="far fa-star"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Custom Shadows - Large
                                 </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Comments
-                                    </span>
-                                    <span class="info-box-number">
-                                        41,410
-                                    </span>
-                                    <div class="progress">
-                                        <div class="progress-bar" style="width: 70%"></div>
-                                    </div>
-                                    <span class="progress-description">
-                                        70% Increase in 30 Days
-                                    </span>
-                                </div>
-                                <!-- /.info-box-content -->
+                                <span class="info-box-number"></span>
                             </div>
-                            <!-- /.info-box -->
+                            <!-- /.info-box-content -->
                         </div>
-                        <!-- /.col -->
+                        <!-- /.info-box -->
                     </div>
-                    <!-- /.row -->
-                    <!-- =========================================================== -->
-                    <h5 class="mt-4 mb-2">
-                        Info Box With
-                        <code>
-                        bg-gradient-*
-                        </code>
-                    </h5>
-                    <div class="row">
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box bg-gradient-info">
-                                <span class="info-box-icon">
-                                    <i class="far fa-bookmark"></i>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- =========================================================== -->
+                <h5 class="mt-4 mb-2">
+                    Info Box With
+                    <code>
+                    bg-*
+                    </code>
+                </h5>
+                <div class="row">
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box bg-info">
+                            <span class="info-box-icon">
+                                <i class="far fa-bookmark"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Bookmarks
                                 </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Bookmarks
-                                    </span>
-                                    <span class="info-box-number">
-                                        41,410
-                                    </span>
-                                    <div class="progress">
-                                        <div class="progress-bar" style="width: 70%"></div>
-                                    </div>
-                                    <span class="progress-description">
-                                        70% Increase in 30 Days
-                                    </span>
-                                </div>
-                                <!-- /.info-box-content -->
-                            </div>
-                            <!-- /.info-box -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box bg-gradient-success">
-                                <span class="info-box-icon">
-                                    <i class="far fa-thumbs-up"></i>
+                                <span class="info-box-number">
+                                    41,410
                                 </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Likes
-                                    </span>
-                                    <span class="info-box-number">
-                                        41,410
-                                    </span>
-                                    <div class="progress">
-                                        <div class="progress-bar" style="width: 70%"></div>
-                                    </div>
-                                    <span class="progress-description">
-                                        70% Increase in 30 Days
-                                    </span>
+                                <div class="progress">
+                                    <div class="progress-bar" style="width: 70%"></div>
                                 </div>
-                                <!-- /.info-box-content -->
-                            </div>
-                            <!-- /.info-box -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box bg-gradient-warning">
-                                <span class="info-box-icon">
-                                    <i class="far fa-calendar-alt"></i>
+                                <span class="progress-description">
+                                    70% Increase in 30 Days
                                 </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Events
-                                    </span>
-                                    <span class="info-box-number">
-                                        41,410
-                                    </span>
-                                    <div class="progress">
-                                        <div class="progress-bar" style="width: 70%"></div>
-                                    </div>
-                                    <span class="progress-description">
-                                        70% Increase in 30 Days
-                                    </span>
-                                </div>
-                                <!-- /.info-box-content -->
                             </div>
-                            <!-- /.info-box -->
+                            <!-- /.info-box-content -->
                         </div>
-                        <!-- /.col -->
-                        <div class="col-md-3 col-sm-6 col-12">
-                            <div class="info-box bg-gradient-danger">
-                                <span class="info-box-icon">
-                                    <i class="fas fa-comments"></i>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box bg-success">
+                            <span class="info-box-icon">
+                                <i class="far fa-thumbs-up"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Likes
                                 </span>
-                                <div class="info-box-content">
-                                    <span class="info-box-text">
-                                        Comments
-                                    </span>
-                                    <span class="info-box-number">
-                                        41,410
-                                    </span>
-                                    <div class="progress">
-                                        <div class="progress-bar" style="width: 70%"></div>
-                                    </div>
-                                    <span class="progress-description">
-                                        70% Increase in 30 Days
+                                <span class="info-box-number">
+                                    41,410
+                                </span>
+                                <div class="progress">
+                                    <div class="progress-bar" style="width: 70%"></div>
+                                </div>
+                                <span class="progress-description">
+                                    70% Increase in 30 Days
+                                </span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box bg-warning">
+                            <span class="info-box-icon">
+                                <i class="far fa-calendar-alt"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Events
+                                </span>
+                                <span class="info-box-number">
+                                    41,410
+                                </span>
+                                <div class="progress">
+                                    <div class="progress-bar" style="width: 70%"></div>
+                                </div>
+                                <span class="progress-description">
+                                    70% Increase in 30 Days
+                                </span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box bg-danger">
+                            <span class="info-box-icon">
+                                <i class="fas fa-comments"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Comments
+                                </span>
+                                <span class="info-box-number">
+                                    41,410
+                                </span>
+                                <div class="progress">
+                                    <div class="progress-bar" style="width: 70%"></div>
+                                </div>
+                                <span class="progress-description">
+                                    70% Increase in 30 Days
+                                </span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- =========================================================== -->
+                <h5 class="mt-4 mb-2">
+                    Info Box With
+                    <code>
+                    bg-gradient-*
+                    </code>
+                </h5>
+                <div class="row">
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box bg-gradient-info">
+                            <span class="info-box-icon">
+                                <i class="far fa-bookmark"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Bookmarks
+                                </span>
+                                <span class="info-box-number">
+                                    41,410
+                                </span>
+                                <div class="progress">
+                                    <div class="progress-bar" style="width: 70%"></div>
+                                </div>
+                                <span class="progress-description">
+                                    70% Increase in 30 Days
+                                </span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box bg-gradient-success">
+                            <span class="info-box-icon">
+                                <i class="far fa-thumbs-up"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Likes
+                                </span>
+                                <span class="info-box-number">
+                                    41,410
+                                </span>
+                                <div class="progress">
+                                    <div class="progress-bar" style="width: 70%"></div>
+                                </div>
+                                <span class="progress-description">
+                                    70% Increase in 30 Days
+                                </span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box bg-gradient-warning">
+                            <span class="info-box-icon">
+                                <i class="far fa-calendar-alt"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Events
+                                </span>
+                                <span class="info-box-number">
+                                    41,410
+                                </span>
+                                <div class="progress">
+                                    <div class="progress-bar" style="width: 70%"></div>
+                                </div>
+                                <span class="progress-description">
+                                    70% Increase in 30 Days
+                                </span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3 col-sm-6 col-12">
+                        <div class="info-box bg-gradient-danger">
+                            <span class="info-box-icon">
+                                <i class="fas fa-comments"></i>
+                            </span>
+                            <div class="info-box-content">
+                                <span class="info-box-text">
+                                    Comments
+                                </span>
+                                <span class="info-box-number">
+                                    41,410
+                                </span>
+                                <div class="progress">
+                                    <div class="progress-bar" style="width: 70%"></div>
+                                </div>
+                                <span class="progress-description">
+                                    70% Increase in 30 Days
+                                </span>
+                            </div>
+                            <!-- /.info-box-content -->
+                        </div>
+                        <!-- /.info-box -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- =========================================================== -->
+                <!-- Small Box (Stat card) -->
+                <h5 class="mb-2 mt-4">
+                    Small Box
+                </h5>
+                <div class="row">
+                    <div class="col-lg-3 col-6">
+                        <!-- small card -->
+                        <div class="small-box bg-info">
+                            <div class="inner">
+                                <h3>150</h3>
+                                <p>
+                                    New Orders
+                                </p>
+                            </div>
+                            <div class="icon">
+                                <i class="fas fa-shopping-cart"></i>
+                            </div>
+                            <a href="#" class="small-box-footer">
+                                More info
+                                <i class="fas fa-arrow-circle-right"></i>
+                            </a>
+                        </div>
+                    </div>
+                    <!-- ./col -->
+                    <div class="col-lg-3 col-6">
+                        <!-- small card -->
+                        <div class="small-box bg-success">
+                            <div class="inner">
+                                <h3>
+                                    53
+                                    <sup style="font-size: 20px">
+                                    %
+                                    </sup>
+                                </h3>
+                                <p>
+                                    Bounce Rate
+                                </p>
+                            </div>
+                            <div class="icon">
+                                <i class="ion ion-stats-bars"></i>
+                            </div>
+                            <a href="#" class="small-box-footer">
+                                More info
+                                <i class="fas fa-arrow-circle-right"></i>
+                            </a>
+                        </div>
+                    </div>
+                    <!-- ./col -->
+                    <div class="col-lg-3 col-6">
+                        <!-- small card -->
+                        <div class="small-box bg-warning">
+                            <div class="inner">
+                                <h3>44</h3>
+                                <p>
+                                    User Registrations
+                                </p>
+                            </div>
+                            <div class="icon">
+                                <i class="fas fa-user-plus"></i>
+                            </div>
+                            <a href="#" class="small-box-footer">
+                                More info
+                                <i class="fas fa-arrow-circle-right"></i>
+                            </a>
+                        </div>
+                    </div>
+                    <!-- ./col -->
+                    <div class="col-lg-3 col-6">
+                        <!-- small card -->
+                        <div class="small-box bg-danger">
+                            <div class="inner">
+                                <h3>65</h3>
+                                <p>
+                                    Unique Visitors
+                                </p>
+                            </div>
+                            <div class="icon">
+                                <i class="fas fa-chart-pie"></i>
+                            </div>
+                            <a href="#" class="small-box-footer">
+                                More info
+                                <i class="fas fa-arrow-circle-right"></i>
+                            </a>
+                        </div>
+                    </div>
+                    <!-- ./col -->
+                </div>
+                <!-- /.row -->
+                <!-- Small Box (Stat card) -->
+                <div class="row">
+                    <div class="col-lg-3 col-6">
+                        <!-- small card -->
+                        <div class="small-box bg-info">
+                            <!-- Loading (remove the following to stop the loading)-->
+                            <div class="overlay">
+                                <i class="fas fa-3x fa-sync-alt"></i>
+                            </div>
+                            <!-- end loading -->
+                            <div class="inner">
+                                <h3>150</h3>
+                                <p>
+                                    New Orders
+                                </p>
+                            </div>
+                            <div class="icon">
+                                <i class="fas fa-shopping-cart"></i>
+                            </div>
+                            <a href="#" class="small-box-footer">
+                                More info
+                                <i class="fas fa-arrow-circle-right"></i>
+                            </a>
+                        </div>
+                    </div>
+                    <!-- ./col -->
+                    <div class="col-lg-3 col-6">
+                        <!-- small card -->
+                        <div class="small-box bg-success">
+                            <!-- Loading (remove the following to stop the loading)-->
+                            <div class="overlay dark">
+                                <i class="fas fa-3x fa-sync-alt"></i>
+                            </div>
+                            <!-- end loading -->
+                            <div class="inner">
+                                <h3>
+                                    53
+                                    <sup style="font-size: 20px">
+                                    %
+                                    </sup>
+                                </h3>
+                                <p>
+                                    Bounce Rate
+                                </p>
+                            </div>
+                            <div class="icon">
+                                <i class="ion ion-stats-bars"></i>
+                            </div>
+                            <a href="#" class="small-box-footer">
+                                More info
+                                <i class="fas fa-arrow-circle-right"></i>
+                            </a>
+                        </div>
+                    </div>
+                    <!-- ./col -->
+                </div>
+                <!-- /.row -->
+                <!-- =========================================================== -->
+                <h4 class="mb-2 mt-4">
+                    Cards
+                </h4>
+                <h5 class="mb-2">
+                    Abilities
+                </h5>
+                <div class="row">
+                    <div class="col-md-3">
+                        <div class="card card-primary collapsed-card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Expandable
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-plus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-success">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Collapsable
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-warning">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Removable
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-danger">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Maximizable
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="maximize">
+                                        <i class="fas fa-expand"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-md-3">
+                        <div class="card card-primary">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Card Refresh
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button"
+                                            class="btn btn-tool"
+                                            data-card-widget="card-refresh"
+                                            data-source="widgets.html"
+                                            data-source-selector="#card-refresh-content">
+                                        <i class="fas fa-sync-alt"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                        <div class="d-none" id="card-refresh-content">
+                            The body of the card after card refresh
+                        </div>
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-success">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    All together
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button"
+                                            class="btn btn-tool"
+                                            data-card-widget="card-refresh"
+                                            data-source="widgets.html"
+                                            data-source-selector="#card-refresh-content"
+                                            data-load-on-init="false">
+                                        <i class="fas fa-sync-alt"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="maximize">
+                                        <i class="fas fa-expand"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-warning">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Loading state
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                            <!-- Loading (remove the following to stop the loading)-->
+                            <div class="overlay">
+                                <i class="fas fa-2x fa-sync-alt"></i>
+                            </div>
+                            <!-- end loading -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-danger">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Loading state (dark)
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                            <!-- Loading (remove the following to stop the loading)-->
+                            <div class="overlay dark">
+                                <i class="fas fa-2x fa-sync-alt"></i>
+                            </div>
+                            <!-- end loading -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- =========================================================== -->
+                <h5 class="mb-2">
+                    Custom Shadows Variations
+                    <small>
+                    <i>
+                    Using Bootstrap's Shadow Utility
+                    </i>
+                    </small>
+                </h5>
+                <div class="row">
+                    <div class="col-md-3">
+                        <div class="card card-primary shadow-none">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Shadow - None
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-success shadow-sm">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Shadow - Small
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-warning shadow">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Shadow - Regular
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-danger shadow-lg">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Shadow - Large
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="maximize">
+                                        <i class="fas fa-expand"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- =========================================================== -->
+                <h5 class="mb-2">
+                    Colors Variations
+                </h5>
+                <div class="row">
+                    <div class="col-md-3">
+                        <div class="card card-primary">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Primary
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-success">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Success
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-warning">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Warning
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-danger">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Danger
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-md-3">
+                        <div class="card card-outline card-primary">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Primary Outline
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-outline card-success">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Success Outline
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-outline card-warning">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Warning Outline
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card card-outline card-danger">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Danger Outline
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-md-3">
+                        <div class="card bg-primary">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Primary
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card bg-success">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Success
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card bg-warning">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Warning
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card bg-danger">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Danger
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-md-3">
+                        <div class="card bg-gradient-primary">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Primary Gradient
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card bg-gradient-success">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Success Gradient
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card bg-gradient-warning">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Warning Gradient
+                                </h3>
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <div class="card bg-gradient-danger">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Danger Gradient
+                                </h3>
+                            </div>
+                            <div class="card-body">
+                                The body of the card
+                            </div>
+                            <!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- =========================================================== -->
+                <!-- Direct Chat -->
+                <h4 class="mt-4 mb-2">
+                    Direct Chat
+                </h4>
+                <div class="row">
+                    <div class="col-md-3">
+                        <!-- DIRECT CHAT PRIMARY -->
+                        <div class="card card-prirary cardutline direct-chat direct-chat-primary">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Direct Chat
+                                </h3>
+                                <div class="card-tools">
+                                    <span title="3 New Messages" class="badge bg-primary">
+                                        3
                                     </span>
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button"
+                                            class="btn btn-tool"
+                                            title="Contacts"
+                                            data-widget="chat-pane-toggle">
+                                        <i class="fas fa-comments"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
                                 </div>
-                                <!-- /.info-box-content -->
                             </div>
-                            <!-- /.info-box -->
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- /.row -->
-                    <!-- =========================================================== -->
-                    <!-- Small Box (Stat card) -->
-                    <h5 class="mb-2 mt-4">
-                        Small Box
-                    </h5>
-                    <div class="row">
-                        <div class="col-lg-3 col-6">
-                            <!-- small card -->
-                            <div class="small-box bg-info">
-                                <div class="inner">
-                                    <h3>150</h3>
-                                    <p>
-                                        New Orders
-                                    </p>
-                                </div>
-                                <div class="icon">
-                                    <i class="fas fa-shopping-cart"></i>
-                                </div>
-                                <a href="#" class="small-box-footer">
-                                    More info
-                                    <i class="fas fa-arrow-circle-right"></i>
-                                </a>
-                            </div>
-                        </div>
-                        <!-- ./col -->
-                        <div class="col-lg-3 col-6">
-                            <!-- small card -->
-                            <div class="small-box bg-success">
-                                <div class="inner">
-                                    <h3>
-                                        53
-                                        <sup style="font-size: 20px">
-                                        %
-                                        </sup>
-                                    </h3>
-                                    <p>
-                                        Bounce Rate
-                                    </p>
-                                </div>
-                                <div class="icon">
-                                    <i class="ion ion-stats-bars"></i>
-                                </div>
-                                <a href="#" class="small-box-footer">
-                                    More info
-                                    <i class="fas fa-arrow-circle-right"></i>
-                                </a>
-                            </div>
-                        </div>
-                        <!-- ./col -->
-                        <div class="col-lg-3 col-6">
-                            <!-- small card -->
-                            <div class="small-box bg-warning">
-                                <div class="inner">
-                                    <h3>44</h3>
-                                    <p>
-                                        User Registrations
-                                    </p>
-                                </div>
-                                <div class="icon">
-                                    <i class="fas fa-user-plus"></i>
-                                </div>
-                                <a href="#" class="small-box-footer">
-                                    More info
-                                    <i class="fas fa-arrow-circle-right"></i>
-                                </a>
-                            </div>
-                        </div>
-                        <!-- ./col -->
-                        <div class="col-lg-3 col-6">
-                            <!-- small card -->
-                            <div class="small-box bg-danger">
-                                <div class="inner">
-                                    <h3>65</h3>
-                                    <p>
-                                        Unique Visitors
-                                    </p>
-                                </div>
-                                <div class="icon">
-                                    <i class="fas fa-chart-pie"></i>
-                                </div>
-                                <a href="#" class="small-box-footer">
-                                    More info
-                                    <i class="fas fa-arrow-circle-right"></i>
-                                </a>
-                            </div>
-                        </div>
-                        <!-- ./col -->
-                    </div>
-                    <!-- /.row -->
-                    <!-- Small Box (Stat card) -->
-                    <div class="row">
-                        <div class="col-lg-3 col-6">
-                            <!-- small card -->
-                            <div class="small-box bg-info">
-                                <!-- Loading (remove the following to stop the loading)-->
-                                <div class="overlay">
-                                    <i class="fas fa-3x fa-sync-alt"></i>
-                                </div>
-                                <!-- end loading -->
-                                <div class="inner">
-                                    <h3>150</h3>
-                                    <p>
-                                        New Orders
-                                    </p>
-                                </div>
-                                <div class="icon">
-                                    <i class="fas fa-shopping-cart"></i>
-                                </div>
-                                <a href="#" class="small-box-footer">
-                                    More info
-                                    <i class="fas fa-arrow-circle-right"></i>
-                                </a>
-                            </div>
-                        </div>
-                        <!-- ./col -->
-                        <div class="col-lg-3 col-6">
-                            <!-- small card -->
-                            <div class="small-box bg-success">
-                                <!-- Loading (remove the following to stop the loading)-->
-                                <div class="overlay dark">
-                                    <i class="fas fa-3x fa-sync-alt"></i>
-                                </div>
-                                <!-- end loading -->
-                                <div class="inner">
-                                    <h3>
-                                        53
-                                        <sup style="font-size: 20px">
-                                        %
-                                        </sup>
-                                    </h3>
-                                    <p>
-                                        Bounce Rate
-                                    </p>
-                                </div>
-                                <div class="icon">
-                                    <i class="ion ion-stats-bars"></i>
-                                </div>
-                                <a href="#" class="small-box-footer">
-                                    More info
-                                    <i class="fas fa-arrow-circle-right"></i>
-                                </a>
-                            </div>
-                        </div>
-                        <!-- ./col -->
-                    </div>
-                    <!-- /.row -->
-                    <!-- =========================================================== -->
-                    <h4 class="mb-2 mt-4">
-                        Cards
-                    </h4>
-                    <h5 class="mb-2">
-                        Abilities
-                    </h5>
-                    <div class="row">
-                        <div class="col-md-3">
-                            <div class="card card-primary collapsed-card">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Expandable
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-plus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-success">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Collapsable
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-warning">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Removable
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="remove">
-                                            <i class="fas fa-times"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-danger">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Maximizable
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="maximize">
-                                            <i class="fas fa-expand"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- /.row -->
-                    <div class="row">
-                        <div class="col-md-3">
-                            <div class="card card-primary">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Card Refresh
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button"
-                                                class="btn btn-tool"
-                                                data-card-widget="card-refresh"
-                                                data-source="widgets.html"
-                                                data-source-selector="#card-refresh-content">
-                                            <i class="fas fa-sync-alt"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                            <div class="d-none" id="card-refresh-content">
-                                The body of the card after card refresh
-                            </div>
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-success">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        All together
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button"
-                                                class="btn btn-tool"
-                                                data-card-widget="card-refresh"
-                                                data-source="widgets.html"
-                                                data-source-selector="#card-refresh-content"
-                                                data-load-on-init="false">
-                                            <i class="fas fa-sync-alt"></i>
-                                        </button>
-                                        <button type="button" class="btn btn-tool" data-card-widget="maximize">
-                                            <i class="fas fa-expand"></i>
-                                        </button>
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                        <button type="button" class="btn btn-tool" data-card-widget="remove">
-                                            <i class="fas fa-times"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-warning">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Loading state
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                                <!-- Loading (remove the following to stop the loading)-->
-                                <div class="overlay">
-                                    <i class="fas fa-2x fa-sync-alt"></i>
-                                </div>
-                                <!-- end loading -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-danger">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Loading state (dark)
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                                <!-- Loading (remove the following to stop the loading)-->
-                                <div class="overlay dark">
-                                    <i class="fas fa-2x fa-sync-alt"></i>
-                                </div>
-                                <!-- end loading -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- /.row -->
-                    <!-- =========================================================== -->
-                    <h5 class="mb-2">
-                        Custom Shadows Variations
-                        <small>
-                        <i>
-                        Using Bootstrap's Shadow Utility
-                        </i>
-                        </small>
-                    </h5>
-                    <div class="row">
-                        <div class="col-md-3">
-                            <div class="card card-primary shadow-none">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Shadow - None
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-success shadow-sm">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Shadow - Small
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-warning shadow">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Shadow - Regular
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="remove">
-                                            <i class="fas fa-times"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-danger shadow-lg">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Shadow - Large
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="maximize">
-                                            <i class="fas fa-expand"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- /.row -->
-                    <!-- =========================================================== -->
-                    <h5 class="mb-2">
-                        Colors Variations
-                    </h5>
-                    <div class="row">
-                        <div class="col-md-3">
-                            <div class="card card-primary">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Primary
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-success">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Success
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="remove">
-                                            <i class="fas fa-times"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-warning">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Warning
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-danger">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Danger
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- /.row -->
-                    <div class="row">
-                        <div class="col-md-3">
-                            <div class="card card-outline card-primary">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Primary Outline
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-outline card-success">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Success Outline
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="remove">
-                                            <i class="fas fa-times"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-outline card-warning">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Warning Outline
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card card-outline card-danger">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Danger Outline
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- /.row -->
-                    <div class="row">
-                        <div class="col-md-3">
-                            <div class="card bg-primary">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Primary
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card bg-success">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Success
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="remove">
-                                            <i class="fas fa-times"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card bg-warning">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Warning
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card bg-danger">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Danger
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- /.row -->
-                    <div class="row">
-                        <div class="col-md-3">
-                            <div class="card bg-gradient-primary">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Primary Gradient
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card bg-gradient-success">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Success Gradient
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="remove">
-                                            <i class="fas fa-times"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card bg-gradient-warning">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Warning Gradient
-                                    </h3>
-                                    <div class="card-tools">
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                    </div>
-                                    <!-- /.card-tools -->
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                        <div class="col-md-3">
-                            <div class="card bg-gradient-danger">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Danger Gradient
-                                    </h3>
-                                </div>
-                                <div class="card-body">
-                                    The body of the card
-                                </div>
-                                <!-- /.card-body -->
-                            </div>
-                            <!-- /.card -->
-                        </div>
-                        <!-- /.col -->
-                    </div>
-                    <!-- /.row -->
-                    <!-- =========================================================== -->
-                    <!-- Direct Chat -->
-                    <h4 class="mt-4 mb-2">
-                        Direct Chat
-                    </h4>
-                    <div class="row">
-                        <div class="col-md-3">
-                            <!-- DIRECT CHAT PRIMARY -->
-                            <div class="card card-prirary cardutline direct-chat direct-chat-primary">
-                                <div class="card-header">
-                                    <h3 class="card-title">
-                                        Direct Chat
-                                    </h3>
-                                    <div class="card-tools">
-                                        <span title="3 New Messages" class="badge bg-primary">
-                                            3
-                                        </span>
-                                        <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                                            <i class="fas fa-minus"></i>
-                                        </button>
-                                        <button type="button"
-                                                class="btn btn-tool"
-                                                title="Contacts"
-                                                data-widget="chat-pane-toggle">
-                                            <i class="fas fa-comments"></i>
-                                        </button>
-                                        <button type="button" class="btn btn-tool" data-card-widget="remove">
-                                            <i class="fas fa-times"></i>
-                                        </button>
-                                    </div>
-                                </div>
-                                <!-- /.card-header -->
-                                <div class="card-body">
-                                    <!-- Conversations are loaded here -->
-                                    <div class="direct-chat-messages">
-                                        <!-- Message. Default to the left -->
-                                        <div class="direct-chat-msg">
-                                            <div class="direct-chat-infos clearfix">
-                                                <span class="direct-chat-name float-left">
-                                                    Alexander Pierce
-                                                </span>
-                                                <span class="direct-chat-timestamp float-right">
-                                                    23 Jan 2:00 pm
-                                                </span>
-                                            </div>
-                                            <!-- /.direct-chat-infos -->
-                                            <img class="direct-chat-img"
-                                                 src="/static/assets/img/user1-128x128.jpg"
-                                                 alt="Message User Image">
-                                                <!-- /.direct-chat-img -->
-                                                <div class="direct-chat-text">
-                                                    Is this template really for free? That's unbelievable!
-                                                </div>
-                                                <!-- /.direct-chat-text -->
-                                            </div>
-                                            <!-- /.direct-chat-msg -->
-                                            <!-- Message to the right -->
-                                            <div class="direct-chat-msg right">
-                                                <div class="direct-chat-infos clearfix">
-                                                    <span class="direct-chat-name float-right">
-                                                        Sarah Bullock
-                                                    </span>
-                                                    <span class="direct-chat-timestamp float-left">
-                                                        23 Jan 2:05 pm
-                                                    </span>
-                                                </div>
-                                                <!-- /.direct-chat-infos -->
-                                                <img class="direct-chat-img"
-                                                     src="/static/assets/img/user3-128x128.jpg"
-                                                     alt="Message User Image">
-                                                    <!-- /.direct-chat-img -->
-                                                    <div class="direct-chat-text">
-                                                        You better believe it!
-                                                    </div>
-                                                    <!-- /.direct-chat-text -->
-                                                </div>
-                                                <!-- /.direct-chat-msg -->
-                                            </div>
-                                            <!--/.direct-chat-messages-->
-                                            <!-- Contacts are loaded here -->
-                                            <div class="direct-chat-contacts">
-                                                <ul class="contacts-list">
-                                                    <li>
-                                                        <a href="#">
-                                                            <img class="contacts-list-img"
-                                                                 src="/static/assets/img/user1-128x128.jpg"
-                                                                 alt="User Avatar">
-                                                                <div class="contacts-list-info">
-                                                                    <span class="contacts-list-name">
-                                                                        Count Dracula
-                                                                        <small class="contacts-list-date float-right">
-                                                                        2/28/2015
-                                                                        </small>
-                                                                    </span>
-                                                                    <span class="contacts-list-msg">
-                                                                        How have you been? I was...
-                                                                    </span>
-                                                                </div>
-                                                                <!-- /.contacts-list-info -->
-                                                            </a>
-                                                        </li>
-                                                        <!-- End Contact Item -->
-                                                    </ul>
-                                                    <!-- /.contatcts-list -->
-                                                </div>
-                                                <!-- /.direct-chat-pane -->
-                                            </div>
-                                            <!-- /.card-body -->
-                                            <div class="card-footer">
-                                                <form action="#" method="post">
-                                                    <div class="input-group">
-                                                        <input type="text"
-                                                               name="message"
-                                                               placeholder="Type Message ..."
-                                                               class="form-control">
-                                                        <span class="input-group-append">
-                                                            <button type="submit" class="btn btn-primary">
-                                                                Send
-                                                            </button>
-                                                        </span>
-                                                    </div>
-                                                </form>
-                                            </div>
-                                            <!-- /.card-footer-->
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <!-- Conversations are loaded here -->
+                                <div class="direct-chat-messages">
+                                    <!-- Message. Default to the left -->
+                                    <div class="direct-chat-msg">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-left">
+                                                Alexander Pierce
+                                            </span>
+                                            <span class="direct-chat-timestamp float-right">
+                                                23 Jan 2:00 pm
+                                            </span>
                                         </div>
-                                        <!--/.direct-chat -->
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user1-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            Is this template really for free? That's unbelievable!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                    <!-- Message to the right -->
+                                    <div class="direct-chat-msg right">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-right">
+                                                Sarah Bullock
+                                            </span>
+                                            <span class="direct-chat-timestamp float-left">
+                                                23 Jan 2:05 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user3-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            You better believe it!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                </div>
+                                <!--/.direct-chat-messages-->
+                                <!-- Contacts are loaded here -->
+                                <div class="direct-chat-contacts">
+                                    <ul class="contacts-list">
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user1-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Count Dracula
+                                                        <small class="contacts-list-date float-right">
+                                                        2/28/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">
+                                                        How have you been? I was...
+                                                    </span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                    </ul>
+                                    <!-- /.contatcts-list -->
+                                </div>
+                                <!-- /.direct-chat-pane -->
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer">
+                                <form action="#" method="post">
+                                    <div class="input-group">
+                                        <input type="text"
+                                               name="message"
+                                               placeholder="Type Message ..."
+                                               class="form-control">
+                                        <span class="input-group-append">
+                                            <button type="submit" class="btn btn-primary">
+                                                Send
+                                            </button>
+                                        </span>
+                                    </div>
+                                </form>
+                            </div>
+                            <!-- /.card-footer-->
+                        </div>
+                        <!--/.direct-chat -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <!-- DIRECT CHAT SUCCESS -->
+                        <div class="card card-sucress cardutline direct-chat direct-chat-success">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Direct Chat
+                                </h3>
+                                <div class="card-tools">
+                                    <span title="3 New Messages" class="badge bg-success">
+                                        3
+                                    </span>
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button"
+                                            class="btn btn-tool"
+                                            title="Contacts"
+                                            data-widget="chat-pane-toggle">
+                                        <i class="fas fa-comments"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <!-- Conversations are loaded here -->
+                                <div class="direct-chat-messages">
+                                    <!-- Message. Default to the left -->
+                                    <div class="direct-chat-msg">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-left">
+                                                Alexander Pierce
+                                            </span>
+                                            <span class="direct-chat-timestamp float-right">
+                                                23 Jan 2:00 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user1-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            Is this template really for free? That's unbelievable!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                    <!-- Message to the right -->
+                                    <div class="direct-chat-msg right">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-right">
+                                                Sarah Bullock
+                                            </span>
+                                            <span class="direct-chat-timestamp float-left">
+                                                23 Jan 2:05 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user3-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            You better believe it!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                </div>
+                                <!--/.direct-chat-messages-->
+                                <!-- Contacts are loaded here -->
+                                <div class="direct-chat-contacts">
+                                    <ul class="contacts-list">
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user1-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Count Dracula
+                                                        <small class="contacts-list-date float-right">
+                                                        2/28/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">
+                                                        How have you been? I was...
+                                                    </span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                    </ul>
+                                    <!-- /.contatcts-list -->
+                                </div>
+                                <!-- /.direct-chat-pane -->
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer">
+                                <form action="#" method="post">
+                                    <div class="input-group">
+                                        <input type="text"
+                                               name="message"
+                                               placeholder="Type Message ..."
+                                               class="form-control">
+                                        <span class="input-group-append">
+                                            <button type="submit" class="btn btn-success">
+                                                Send
+                                            </button>
+                                        </span>
+                                    </div>
+                                </form>
+                            </div>
+                            <!-- /.card-footer-->
+                        </div>
+                        <!--/.direct-chat -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <!-- DIRECT CHAT WARNING -->
+                        <div class="card card-warning direct-chat direct-chat-warning">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Direct Chat
+                                </h3>
+                                <div class="card-tools">
+                                    <span title="3 New Messages" class="badge bg-danger">
+                                        3
+                                    </span>
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button"
+                                            class="btn btn-tool"
+                                            title="Contacts"
+                                            data-widget="chat-pane-toggle">
+                                        <i class="fas fa-comments"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <!-- Conversations are loaded here -->
+                                <div class="direct-chat-messages">
+                                    <!-- Message. Default to the left -->
+                                    <div class="direct-chat-msg">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-left">
+                                                Alexander Pierce
+                                            </span>
+                                            <span class="direct-chat-timestamp float-right">
+                                                23 Jan 2:00 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user1-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            Is this template really for free? That's unbelievable!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                    <!-- Message to the right -->
+                                    <div class="direct-chat-msg right">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-right">
+                                                Sarah Bullock
+                                            </span>
+                                            <span class="direct-chat-timestamp float-left">
+                                                23 Jan 2:05 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user3-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            You better believe it!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                </div>
+                                <!--/.direct-chat-messages-->
+                                <!-- Contacts are loaded here -->
+                                <div class="direct-chat-contacts">
+                                    <ul class="contacts-list">
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user1-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Count Dracula
+                                                        <small class="contacts-list-date float-right">
+                                                        2/28/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">
+                                                        How have you been? I was...
+                                                    </span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                    </ul>
+                                    <!-- /.contatcts-list -->
+                                </div>
+                                <!-- /.direct-chat-pane -->
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer">
+                                <form action="#" method="post">
+                                    <div class="input-group">
+                                        <input type="text"
+                                               name="message"
+                                               placeholder="Type Message ..."
+                                               class="form-control">
+                                        <span class="input-group-append">
+                                            <button type="submit" class="btn btn-warning">
+                                                Send
+                                            </button>
+                                        </span>
+                                    </div>
+                                </form>
+                            </div>
+                            <!-- /.card-footer-->
+                        </div>
+                        <!--/.direct-chat -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <!-- DIRECT CHAT DANGER -->
+                        <div class="card card-danger direct-chat direct-chat-danger">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Direct Chat
+                                </h3>
+                                <div class="card-tools">
+                                    <span title="3 New Messages" class="badge">
+                                        3
+                                    </span>
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button"
+                                            class="btn btn-tool"
+                                            title="Contacts"
+                                            data-widget="chat-pane-toggle">
+                                        <i class="fas fa-comments"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <!-- Conversations are loaded here -->
+                                <div class="direct-chat-messages">
+                                    <!-- Message. Default to the left -->
+                                    <div class="direct-chat-msg">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-left">
+                                                Alexander Pierce
+                                            </span>
+                                            <span class="direct-chat-timestamp float-right">
+                                                23 Jan 2:00 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user1-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            Is this template really for free? That's unbelievable!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                    <!-- Message to the right -->
+                                    <div class="direct-chat-msg right">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-right">
+                                                Sarah Bullock
+                                            </span>
+                                            <span class="direct-chat-timestamp float-left">
+                                                23 Jan 2:05 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user3-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            You better believe it!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                </div>
+                                <!--/.direct-chat-messages-->
+                                <!-- Contacts are loaded here -->
+                                <div class="direct-chat-contacts">
+                                    <ul class="contacts-list">
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user1-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Count Dracula
+                                                        <small class="contacts-list-date float-right">
+                                                        2/28/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">
+                                                        How have you been? I was...
+                                                    </span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                    </ul>
+                                    <!-- /.contatcts-list -->
+                                </div>
+                                <!-- /.direct-chat-pane -->
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer">
+                                <form action="#" method="post">
+                                    <div class="input-group">
+                                        <input type="text"
+                                               name="message"
+                                               placeholder="Type Message ..."
+                                               class="form-control">
+                                        <span class="input-group-append">
+                                            <button type="submit" class="btn btn-danger">
+                                                Send
+                                            </button>
+                                        </span>
+                                    </div>
+                                </form>
+                            </div>
+                            <!-- /.card-footer-->
+                        </div>
+                        <!--/.direct-chat -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- =========================================================== -->
+                <h5 class="mb-2">
+                    Custom Shadows Variations
+                    <small>
+                    <i>
+                    Using Bootstrap's Shadow Utility
+                    </i>
+                    </small>
+                </h5>
+                <div class="row">
+                    <div class="col-md-3">
+                        <!-- DIRECT CHAT PRIMARY -->
+                        <div class="card card-prirary cardutline direct-chat direct-chat-primary shadow-none">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Shadow - None
+                                </h3>
+                                <div class="card-tools">
+                                    <span title="3 New Messages" class="badge bg-primary">
+                                        3
+                                    </span>
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button"
+                                            class="btn btn-tool"
+                                            title="Contacts"
+                                            data-widget="chat-pane-toggle">
+                                        <i class="fas fa-comments"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <!-- Conversations are loaded here -->
+                                <div class="direct-chat-messages">
+                                    <!-- Message. Default to the left -->
+                                    <div class="direct-chat-msg">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-left">
+                                                Alexander Pierce
+                                            </span>
+                                            <span class="direct-chat-timestamp float-right">
+                                                23 Jan 2:00 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user1-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            Is this template really for free? That's unbelievable!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                    <!-- Message to the right -->
+                                    <div class="direct-chat-msg right">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-right">
+                                                Sarah Bullock
+                                            </span>
+                                            <span class="direct-chat-timestamp float-left">
+                                                23 Jan 2:05 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user3-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            You better believe it!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                </div>
+                                <!--/.direct-chat-messages-->
+                                <!-- Contacts are loaded here -->
+                                <div class="direct-chat-contacts">
+                                    <ul class="contacts-list">
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user1-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Count Dracula
+                                                        <small class="contacts-list-date float-right">
+                                                        2/28/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">
+                                                        How have you been? I was...
+                                                    </span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                    </ul>
+                                    <!-- /.contatcts-list -->
+                                </div>
+                                <!-- /.direct-chat-pane -->
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer">
+                                <form action="#" method="post">
+                                    <div class="input-group">
+                                        <input type="text"
+                                               name="message"
+                                               placeholder="Type Message ..."
+                                               class="form-control">
+                                        <span class="input-group-append">
+                                            <button type="submit" class="btn btn-primary">
+                                                Send
+                                            </button>
+                                        </span>
+                                    </div>
+                                </form>
+                            </div>
+                            <!-- /.card-footer-->
+                        </div>
+                        <!--/.direct-chat -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <!-- DIRECT CHAT SUCCESS -->
+                        <div class="card card-sucress cardutline direct-chat direct-chat-success shadow-sm">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Shadow - Small
+                                </h3>
+                                <div class="card-tools">
+                                    <span title="3 New Messages" class="badge bg-success">
+                                        3
+                                    </span>
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button"
+                                            class="btn btn-tool"
+                                            title="Contacts"
+                                            data-widget="chat-pane-toggle">
+                                        <i class="fas fa-comments"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <!-- Conversations are loaded here -->
+                                <div class="direct-chat-messages">
+                                    <!-- Message. Default to the left -->
+                                    <div class="direct-chat-msg">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-left">
+                                                Alexander Pierce
+                                            </span>
+                                            <span class="direct-chat-timestamp float-right">
+                                                23 Jan 2:00 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user1-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            Is this template really for free? That's unbelievable!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                    <!-- Message to the right -->
+                                    <div class="direct-chat-msg right">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-right">
+                                                Sarah Bullock
+                                            </span>
+                                            <span class="direct-chat-timestamp float-left">
+                                                23 Jan 2:05 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user3-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            You better believe it!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                </div>
+                                <!--/.direct-chat-messages-->
+                                <!-- Contacts are loaded here -->
+                                <div class="direct-chat-contacts">
+                                    <ul class="contacts-list">
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user1-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Count Dracula
+                                                        <small class="contacts-list-date float-right">
+                                                        2/28/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">
+                                                        How have you been? I was...
+                                                    </span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                    </ul>
+                                    <!-- /.contatcts-list -->
+                                </div>
+                                <!-- /.direct-chat-pane -->
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer">
+                                <form action="#" method="post">
+                                    <div class="input-group">
+                                        <input type="text"
+                                               name="message"
+                                               placeholder="Type Message ..."
+                                               class="form-control">
+                                        <span class="input-group-append">
+                                            <button type="submit" class="btn btn-success">
+                                                Send
+                                            </button>
+                                        </span>
+                                    </div>
+                                </form>
+                            </div>
+                            <!-- /.card-footer-->
+                        </div>
+                        <!--/.direct-chat -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <!-- DIRECT CHAT WARNING -->
+                        <div class="card card-warning direct-chat direct-chat-warning shadow">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Shadow - Regular
+                                </h3>
+                                <div class="card-tools">
+                                    <span title="3 New Messages" class="badge bg-danger">
+                                        3
+                                    </span>
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button"
+                                            class="btn btn-tool"
+                                            title="Contacts"
+                                            data-widget="chat-pane-toggle">
+                                        <i class="fas fa-comments"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <!-- Conversations are loaded here -->
+                                <div class="direct-chat-messages">
+                                    <!-- Message. Default to the left -->
+                                    <div class="direct-chat-msg">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-left">
+                                                Alexander Pierce
+                                            </span>
+                                            <span class="direct-chat-timestamp float-right">
+                                                23 Jan 2:00 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user1-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            Is this template really for free? That's unbelievable!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                    <!-- Message to the right -->
+                                    <div class="direct-chat-msg right">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-right">
+                                                Sarah Bullock
+                                            </span>
+                                            <span class="direct-chat-timestamp float-left">
+                                                23 Jan 2:05 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user3-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            You better believe it!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                </div>
+                                <!--/.direct-chat-messages-->
+                                <!-- Contacts are loaded here -->
+                                <div class="direct-chat-contacts">
+                                    <ul class="contacts-list">
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user1-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Count Dracula
+                                                        <small class="contacts-list-date float-right">
+                                                        2/28/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">
+                                                        How have you been? I was...
+                                                    </span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                    </ul>
+                                    <!-- /.contatcts-list -->
+                                </div>
+                                <!-- /.direct-chat-pane -->
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer">
+                                <form action="#" method="post">
+                                    <div class="input-group">
+                                        <input type="text"
+                                               name="message"
+                                               placeholder="Type Message ..."
+                                               class="form-control">
+                                        <span class="input-group-append">
+                                            <button type="submit" class="btn btn-warning">
+                                                Send
+                                            </button>
+                                        </span>
+                                    </div>
+                                </form>
+                            </div>
+                            <!-- /.card-footer-->
+                        </div>
+                        <!--/.direct-chat -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-3">
+                        <!-- DIRECT CHAT DANGER -->
+                        <div class="card card-danger direct-chat direct-chat-danger shadow-lg">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    Shadow - Large
+                                </h3>
+                                <div class="card-tools">
+                                    <span title="3 New Messages" class="badge">
+                                        3
+                                    </span>
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button"
+                                            class="btn btn-tool"
+                                            title="Contacts"
+                                            data-widget="chat-pane-toggle">
+                                        <i class="fas fa-comments"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <!-- Conversations are loaded here -->
+                                <div class="direct-chat-messages">
+                                    <!-- Message. Default to the left -->
+                                    <div class="direct-chat-msg">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-left">
+                                                Alexander Pierce
+                                            </span>
+                                            <span class="direct-chat-timestamp float-right">
+                                                23 Jan 2:00 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user1-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            Is this template really for free? That's unbelievable!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                    <!-- Message to the right -->
+                                    <div class="direct-chat-msg right">
+                                        <div class="direct-chat-infos clearfix">
+                                            <span class="direct-chat-name float-right">
+                                                Sarah Bullock
+                                            </span>
+                                            <span class="direct-chat-timestamp float-left">
+                                                23 Jan 2:05 pm
+                                            </span>
+                                        </div>
+                                        <!-- /.direct-chat-infos -->
+                                        <img class="direct-chat-img"
+                                             src="/static/assets/img/user3-128x128.jpg"
+                                             alt="Message User Image">
+                                        <!-- /.direct-chat-img -->
+                                        <div class="direct-chat-text">
+                                            You better believe it!
+                                        </div>
+                                        <!-- /.direct-chat-text -->
+                                    </div>
+                                    <!-- /.direct-chat-msg -->
+                                </div>
+                                <!--/.direct-chat-messages-->
+                                <!-- Contacts are loaded here -->
+                                <div class="direct-chat-contacts">
+                                    <ul class="contacts-list">
+                                        <li>
+                                            <a href="#">
+                                                <img class="contacts-list-img"
+                                                     src="/static/assets/img/user1-128x128.jpg"
+                                                     alt="User Avatar">
+                                                <div class="contacts-list-info">
+                                                    <span class="contacts-list-name">
+                                                        Count Dracula
+                                                        <small class="contacts-list-date float-right">
+                                                        2/28/2015
+                                                        </small>
+                                                    </span>
+                                                    <span class="contacts-list-msg">
+                                                        How have you been? I was...
+                                                    </span>
+                                                </div>
+                                                <!-- /.contacts-list-info -->
+                                            </a>
+                                        </li>
+                                        <!-- End Contact Item -->
+                                    </ul>
+                                    <!-- /.contatcts-list -->
+                                </div>
+                                <!-- /.direct-chat-pane -->
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer">
+                                <form action="#" method="post">
+                                    <div class="input-group">
+                                        <input type="text"
+                                               name="message"
+                                               placeholder="Type Message ..."
+                                               class="form-control">
+                                        <span class="input-group-append">
+                                            <button type="submit" class="btn btn-danger">
+                                                Send
+                                            </button>
+                                        </span>
+                                    </div>
+                                </form>
+                            </div>
+                            <!-- /.card-footer-->
+                        </div>
+                        <!--/.direct-chat -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <h3 class="mt-4 mb-4">
+                    Social Widgets
+                </h3>
+                <div class="row">
+                    <div class="col-md-4">
+                        <!-- Widget: user widget style 2 -->
+                        <div class="card card-widget widget-user-2">
+                            <!-- Add the bg color to the header using any of the bg-* classes -->
+                            <div class="widget-user-header bg-warning">
+                                <div class="widget-user-image">
+                                    <img class="img-circle elevation-2"
+                                         src="/static/assets/img/user7-128x128.jpg"
+                                         alt="User Avatar">
+                                </div>
+                                <!-- /.widget-user-image -->
+                                <h3 class="widget-user-username">
+                                    Nadia Carmichael
+                                </h3>
+                                <h5 class="widget-user-desc">
+                                    Lead Developer
+                                </h5>
+                            </div>
+                            <div class="card-footer p-0">
+                                <ul class="nav flex-column">
+                                    <li class="nav-item">
+                                        <a href="#" class="nav-link">
+                                            Projects
+                                            <span class="float-right badge bg-primary">
+                                                31
+                                            </span>
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a href="#" class="nav-link">
+                                            Tasks
+                                            <span class="float-right badge bg-info">
+                                                5
+                                            </span>
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a href="#" class="nav-link">
+                                            Completed Projects
+                                            <span class="float-right badge bg-success">
+                                                12
+                                            </span>
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a href="#" class="nav-link">
+                                            Followers
+                                            <span class="float-right badge bg-danger">
+                                                842
+                                            </span>
+                                        </a>
+                                    </li>
+                                </ul>
+                            </div>
+                        </div>
+                        <!-- /.widget-user -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-4">
+                        <!-- Widget: user widget style 1 -->
+                        <div class="card card-widget widget-user">
+                            <!-- Add the bg color to the header using any of the bg-* classes -->
+                            <div class="widget-user-header bg-info">
+                                <h3 class="widget-user-username">
+                                    Alexander Pierce
+                                </h3>
+                                <h5 class="widget-user-desc">
+                                    Founder & CEO
+                                </h5>
+                            </div>
+                            <div class="widget-user-image">
+                                <img class="img-circle elevation-2"
+                                     src="/static/assets/img/user1-128x128.jpg"
+                                     alt="User Avatar">
+                            </div>
+                            <div class="card-footer">
+                                <div class="row">
+                                    <div class="col-sm-4 border-right">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                3,200
+                                            </h5>
+                                            <span class="description-text">
+                                                SALES
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
                                     </div>
                                     <!-- /.col -->
-                                    <div class="col-md-3">
-                                        <!-- DIRECT CHAT SUCCESS -->
-                                        <div class="card card-sucress cardutline direct-chat direct-chat-success">
-                                            <div class="card-header">
-                                                <h3 class="card-title">
-                                                    Direct Chat
-                                                </h3>
-                                                <div class="card-tools">
-                                                    <span title="3 New Messages" class="badge bg-success">
-                                                        3
-                                                    </span>
-                                                    <button type="button"
-                                                            class="btn btn-tool"
-                                                            data-card-widget="collapse">
-                                                        <i class="fas fa-minus"></i>
-                                                    </button>
-                                                    <button type="button"
-                                                            class="btn btn-tool"
-                                                            title="Contacts"
-                                                            data-widget="chat-pane-toggle">
-                                                        <i class="fas fa-comments"></i>
-                                                    </button>
-                                                    <button type="button"
-                                                            class="btn btn-tool"
-                                                            data-card-widget="remove">
-                                                        <i class="fas fa-times"></i>
-                                                    </button>
-                                                </div>
-                                            </div>
-                                            <!-- /.card-header -->
-                                            <div class="card-body">
-                                                <!-- Conversations are loaded here -->
-                                                <div class="direct-chat-messages">
-                                                    <!-- Message. Default to the left -->
-                                                    <div class="direct-chat-msg">
-                                                        <div class="direct-chat-infos clearfix">
-                                                            <span class="direct-chat-name float-left">
-                                                                Alexander Pierce
-                                                            </span>
-                                                            <span class="direct-chat-timestamp float-right">
-                                                                23 Jan 2:00 pm
-                                                            </span>
-                                                        </div>
-                                                        <!-- /.direct-chat-infos -->
-                                                        <img class="direct-chat-img"
-                                                             src="/static/assets/img/user1-128x128.jpg"
-                                                             alt="Message User Image">
-                                                            <!-- /.direct-chat-img -->
-                                                            <div class="direct-chat-text">
-                                                                Is this template really for free? That's unbelievable!
-                                                            </div>
-                                                            <!-- /.direct-chat-text -->
-                                                        </div>
-                                                        <!-- /.direct-chat-msg -->
-                                                        <!-- Message to the right -->
-                                                        <div class="direct-chat-msg right">
-                                                            <div class="direct-chat-infos clearfix">
-                                                                <span class="direct-chat-name float-right">
-                                                                    Sarah Bullock
-                                                                </span>
-                                                                <span class="direct-chat-timestamp float-left">
-                                                                    23 Jan 2:05 pm
-                                                                </span>
-                                                            </div>
-                                                            <!-- /.direct-chat-infos -->
-                                                            <img class="direct-chat-img"
-                                                                 src="/static/assets/img/user3-128x128.jpg"
-                                                                 alt="Message User Image">
-                                                                <!-- /.direct-chat-img -->
-                                                                <div class="direct-chat-text">
-                                                                    You better believe it!
-                                                                </div>
-                                                                <!-- /.direct-chat-text -->
-                                                            </div>
-                                                            <!-- /.direct-chat-msg -->
-                                                        </div>
-                                                        <!--/.direct-chat-messages-->
-                                                        <!-- Contacts are loaded here -->
-                                                        <div class="direct-chat-contacts">
-                                                            <ul class="contacts-list">
-                                                                <li>
-                                                                    <a href="#">
-                                                                        <img class="contacts-list-img"
-                                                                             src="/static/assets/img/user1-128x128.jpg"
-                                                                             alt="User Avatar">
-                                                                            <div class="contacts-list-info">
-                                                                                <span class="contacts-list-name">
-                                                                                    Count Dracula
-                                                                                    <small class="contacts-list-date float-right">
-                                                                                    2/28/2015
-                                                                                    </small>
-                                                                                </span>
-                                                                                <span class="contacts-list-msg">
-                                                                                    How have you been? I was...
-                                                                                </span>
-                                                                            </div>
-                                                                            <!-- /.contacts-list-info -->
-                                                                        </a>
-                                                                    </li>
-                                                                    <!-- End Contact Item -->
-                                                                </ul>
-                                                                <!-- /.contatcts-list -->
-                                                            </div>
-                                                            <!-- /.direct-chat-pane -->
-                                                        </div>
-                                                        <!-- /.card-body -->
-                                                        <div class="card-footer">
-                                                            <form action="#" method="post">
-                                                                <div class="input-group">
-                                                                    <input type="text"
-                                                                           name="message"
-                                                                           placeholder="Type Message ..."
-                                                                           class="form-control">
-                                                                    <span class="input-group-append">
-                                                                        <button type="submit" class="btn btn-success">
-                                                                            Send
-                                                                        </button>
-                                                                    </span>
-                                                                </div>
-                                                            </form>
-                                                        </div>
-                                                        <!-- /.card-footer-->
-                                                    </div>
-                                                    <!--/.direct-chat -->
-                                                </div>
-                                                <!-- /.col -->
-                                                <div class="col-md-3">
-                                                    <!-- DIRECT CHAT WARNING -->
-                                                    <div class="card card-warning direct-chat direct-chat-warning">
-                                                        <div class="card-header">
-                                                            <h3 class="card-title">
-                                                                Direct Chat
-                                                            </h3>
-                                                            <div class="card-tools">
-                                                                <span title="3 New Messages" class="badge bg-danger">
-                                                                    3
-                                                                </span>
-                                                                <button type="button"
-                                                                        class="btn btn-tool"
-                                                                        data-card-widget="collapse">
-                                                                    <i class="fas fa-minus"></i>
-                                                                </button>
-                                                                <button type="button"
-                                                                        class="btn btn-tool"
-                                                                        title="Contacts"
-                                                                        data-widget="chat-pane-toggle">
-                                                                    <i class="fas fa-comments"></i>
-                                                                </button>
-                                                                <button type="button"
-                                                                        class="btn btn-tool"
-                                                                        data-card-widget="remove">
-                                                                    <i class="fas fa-times"></i>
-                                                                </button>
-                                                            </div>
-                                                        </div>
-                                                        <!-- /.card-header -->
-                                                        <div class="card-body">
-                                                            <!-- Conversations are loaded here -->
-                                                            <div class="direct-chat-messages">
-                                                                <!-- Message. Default to the left -->
-                                                                <div class="direct-chat-msg">
-                                                                    <div class="direct-chat-infos clearfix">
-                                                                        <span class="direct-chat-name float-left">
-                                                                            Alexander Pierce
-                                                                        </span>
-                                                                        <span class="direct-chat-timestamp float-right">
-                                                                            23 Jan 2:00 pm
-                                                                        </span>
-                                                                    </div>
-                                                                    <!-- /.direct-chat-infos -->
-                                                                    <img class="direct-chat-img"
-                                                                         src="/static/assets/img/user1-128x128.jpg"
-                                                                         alt="Message User Image">
-                                                                        <!-- /.direct-chat-img -->
-                                                                        <div class="direct-chat-text">
-                                                                            Is this template really for free? That's unbelievable!
-                                                                        </div>
-                                                                        <!-- /.direct-chat-text -->
-                                                                    </div>
-                                                                    <!-- /.direct-chat-msg -->
-                                                                    <!-- Message to the right -->
-                                                                    <div class="direct-chat-msg right">
-                                                                        <div class="direct-chat-infos clearfix">
-                                                                            <span class="direct-chat-name float-right">
-                                                                                Sarah Bullock
-                                                                            </span>
-                                                                            <span class="direct-chat-timestamp float-left">
-                                                                                23 Jan 2:05 pm
-                                                                            </span>
-                                                                        </div>
-                                                                        <!-- /.direct-chat-infos -->
-                                                                        <img class="direct-chat-img"
-                                                                             src="/static/assets/img/user3-128x128.jpg"
-                                                                             alt="Message User Image">
-                                                                            <!-- /.direct-chat-img -->
-                                                                            <div class="direct-chat-text">
-                                                                                You better believe it!
-                                                                            </div>
-                                                                            <!-- /.direct-chat-text -->
-                                                                        </div>
-                                                                        <!-- /.direct-chat-msg -->
-                                                                    </div>
-                                                                    <!--/.direct-chat-messages-->
-                                                                    <!-- Contacts are loaded here -->
-                                                                    <div class="direct-chat-contacts">
-                                                                        <ul class="contacts-list">
-                                                                            <li>
-                                                                                <a href="#">
-                                                                                    <img class="contacts-list-img"
-                                                                                         src="/static/assets/img/user1-128x128.jpg"
-                                                                                         alt="User Avatar">
-                                                                                        <div class="contacts-list-info">
-                                                                                            <span class="contacts-list-name">
-                                                                                                Count Dracula
-                                                                                                <small class="contacts-list-date float-right">
-                                                                                                2/28/2015
-                                                                                                </small>
-                                                                                            </span>
-                                                                                            <span class="contacts-list-msg">
-                                                                                                How have you been? I was...
-                                                                                            </span>
-                                                                                        </div>
-                                                                                        <!-- /.contacts-list-info -->
-                                                                                    </a>
-                                                                                </li>
-                                                                                <!-- End Contact Item -->
-                                                                            </ul>
-                                                                            <!-- /.contatcts-list -->
-                                                                        </div>
-                                                                        <!-- /.direct-chat-pane -->
-                                                                    </div>
-                                                                    <!-- /.card-body -->
-                                                                    <div class="card-footer">
-                                                                        <form action="#" method="post">
-                                                                            <div class="input-group">
-                                                                                <input type="text"
-                                                                                       name="message"
-                                                                                       placeholder="Type Message ..."
-                                                                                       class="form-control">
-                                                                                <span class="input-group-append">
-                                                                                    <button type="submit"
-                                                                                            class="btn btn-warning">
-                                                                                        Send
-                                                                                    </button>
-                                                                                </span>
-                                                                            </div>
-                                                                        </form>
-                                                                    </div>
-                                                                    <!-- /.card-footer-->
-                                                                </div>
-                                                                <!--/.direct-chat -->
-                                                            </div>
-                                                            <!-- /.col -->
-                                                            <div class="col-md-3">
-                                                                <!-- DIRECT CHAT DANGER -->
-                                                                <div class="card card-danger direct-chat direct-chat-danger">
-                                                                    <div class="card-header">
-                                                                        <h3 class="card-title">
-                                                                            Direct Chat
-                                                                        </h3>
-                                                                        <div class="card-tools">
-                                                                            <span title="3 New Messages" class="badge">
-                                                                                3
-                                                                            </span>
-                                                                            <button type="button"
-                                                                                    class="btn btn-tool"
-                                                                                    data-card-widget="collapse">
-                                                                                <i class="fas fa-minus"></i>
-                                                                            </button>
-                                                                            <button type="button"
-                                                                                    class="btn btn-tool"
-                                                                                    title="Contacts"
-                                                                                    data-widget="chat-pane-toggle">
-                                                                                <i class="fas fa-comments"></i>
-                                                                            </button>
-                                                                            <button type="button"
-                                                                                    class="btn btn-tool"
-                                                                                    data-card-widget="remove">
-                                                                                <i class="fas fa-times"></i>
-                                                                            </button>
-                                                                        </div>
-                                                                    </div>
-                                                                    <!-- /.card-header -->
-                                                                    <div class="card-body">
-                                                                        <!-- Conversations are loaded here -->
-                                                                        <div class="direct-chat-messages">
-                                                                            <!-- Message. Default to the left -->
-                                                                            <div class="direct-chat-msg">
-                                                                                <div class="direct-chat-infos clearfix">
-                                                                                    <span class="direct-chat-name float-left">
-                                                                                        Alexander Pierce
-                                                                                    </span>
-                                                                                    <span class="direct-chat-timestamp float-right">
-                                                                                        23 Jan 2:00 pm
-                                                                                    </span>
-                                                                                </div>
-                                                                                <!-- /.direct-chat-infos -->
-                                                                                <img class="direct-chat-img"
-                                                                                     src="/static/assets/img/user1-128x128.jpg"
-                                                                                     alt="Message User Image">
-                                                                                    <!-- /.direct-chat-img -->
-                                                                                    <div class="direct-chat-text">
-                                                                                        Is this template really for free? That's unbelievable!
-                                                                                    </div>
-                                                                                    <!-- /.direct-chat-text -->
-                                                                                </div>
-                                                                                <!-- /.direct-chat-msg -->
-                                                                                <!-- Message to the right -->
-                                                                                <div class="direct-chat-msg right">
-                                                                                    <div class="direct-chat-infos clearfix">
-                                                                                        <span class="direct-chat-name float-right">
-                                                                                            Sarah Bullock
-                                                                                        </span>
-                                                                                        <span class="direct-chat-timestamp float-left">
-                                                                                            23 Jan 2:05 pm
-                                                                                        </span>
-                                                                                    </div>
-                                                                                    <!-- /.direct-chat-infos -->
-                                                                                    <img class="direct-chat-img"
-                                                                                         src="/static/assets/img/user3-128x128.jpg"
-                                                                                         alt="Message User Image">
-                                                                                        <!-- /.direct-chat-img -->
-                                                                                        <div class="direct-chat-text">
-                                                                                            You better believe it!
-                                                                                        </div>
-                                                                                        <!-- /.direct-chat-text -->
-                                                                                    </div>
-                                                                                    <!-- /.direct-chat-msg -->
-                                                                                </div>
-                                                                                <!--/.direct-chat-messages-->
-                                                                                <!-- Contacts are loaded here -->
-                                                                                <div class="direct-chat-contacts">
-                                                                                    <ul class="contacts-list">
-                                                                                        <li>
-                                                                                            <a href="#">
-                                                                                                <img class="contacts-list-img"
-                                                                                                     src="/static/assets/img/user1-128x128.jpg"
-                                                                                                     alt="User Avatar">
-                                                                                                    <div class="contacts-list-info">
-                                                                                                        <span class="contacts-list-name">
-                                                                                                            Count Dracula
-                                                                                                            <small class="contacts-list-date float-right">
-                                                                                                            2/28/2015
-                                                                                                            </small>
-                                                                                                        </span>
-                                                                                                        <span class="contacts-list-msg">
-                                                                                                            How have you been? I was...
-                                                                                                        </span>
-                                                                                                    </div>
-                                                                                                    <!-- /.contacts-list-info -->
-                                                                                                </a>
-                                                                                            </li>
-                                                                                            <!-- End Contact Item -->
-                                                                                        </ul>
-                                                                                        <!-- /.contatcts-list -->
-                                                                                    </div>
-                                                                                    <!-- /.direct-chat-pane -->
-                                                                                </div>
-                                                                                <!-- /.card-body -->
-                                                                                <div class="card-footer">
-                                                                                    <form action="#" method="post">
-                                                                                        <div class="input-group">
-                                                                                            <input type="text"
-                                                                                                   name="message"
-                                                                                                   placeholder="Type Message ..."
-                                                                                                   class="form-control">
-                                                                                            <span class="input-group-append">
-                                                                                                <button type="submit"
-                                                                                                        class="btn btn-danger">
-                                                                                                    Send
-                                                                                                </button>
-                                                                                            </span>
-                                                                                        </div>
-                                                                                    </form>
-                                                                                </div>
-                                                                                <!-- /.card-footer-->
-                                                                            </div>
-                                                                            <!--/.direct-chat -->
-                                                                        </div>
-                                                                        <!-- /.col -->
-                                                                    </div>
-                                                                    <!-- /.row -->
-                                                                    <!-- =========================================================== -->
-                                                                    <h5 class="mb-2">
-                                                                        Custom Shadows Variations
-                                                                        <small>
-                                                                        <i>
-                                                                        Using Bootstrap's Shadow Utility
-                                                                        </i>
-                                                                        </small>
-                                                                    </h5>
-                                                                    <div class="row">
-                                                                        <div class="col-md-3">
-                                                                            <!-- DIRECT CHAT PRIMARY -->
-                                                                            <div class="card card-prirary cardutline direct-chat direct-chat-primary shadow-none">
-                                                                                <div class="card-header">
-                                                                                    <h3 class="card-title">
-                                                                                        Shadow - None
-                                                                                    </h3>
-                                                                                    <div class="card-tools">
-                                                                                        <span title="3 New Messages"
-                                                                                              class="badge bg-primary">
-                                                                                            3
-                                                                                        </span>
-                                                                                        <button type="button"
-                                                                                                class="btn btn-tool"
-                                                                                                data-card-widget="collapse">
-                                                                                            <i class="fas fa-minus"></i>
-                                                                                        </button>
-                                                                                        <button type="button"
-                                                                                                class="btn btn-tool"
-                                                                                                title="Contacts"
-                                                                                                data-widget="chat-pane-toggle">
-                                                                                            <i class="fas fa-comments"></i>
-                                                                                        </button>
-                                                                                        <button type="button"
-                                                                                                class="btn btn-tool"
-                                                                                                data-card-widget="remove">
-                                                                                            <i class="fas fa-times"></i>
-                                                                                        </button>
-                                                                                    </div>
-                                                                                </div>
-                                                                                <!-- /.card-header -->
-                                                                                <div class="card-body">
-                                                                                    <!-- Conversations are loaded here -->
-                                                                                    <div class="direct-chat-messages">
-                                                                                        <!-- Message. Default to the left -->
-                                                                                        <div class="direct-chat-msg">
-                                                                                            <div class="direct-chat-infos clearfix">
-                                                                                                <span class="direct-chat-name float-left">
-                                                                                                    Alexander Pierce
-                                                                                                </span>
-                                                                                                <span class="direct-chat-timestamp float-right">
-                                                                                                    23 Jan 2:00 pm
-                                                                                                </span>
-                                                                                            </div>
-                                                                                            <!-- /.direct-chat-infos -->
-                                                                                            <img class="direct-chat-img"
-                                                                                                 src="/static/assets/img/user1-128x128.jpg"
-                                                                                                 alt="Message User Image">
-                                                                                                <!-- /.direct-chat-img -->
-                                                                                                <div class="direct-chat-text">
-                                                                                                    Is this template really for free? That's unbelievable!
-                                                                                                </div>
-                                                                                                <!-- /.direct-chat-text -->
-                                                                                            </div>
-                                                                                            <!-- /.direct-chat-msg -->
-                                                                                            <!-- Message to the right -->
-                                                                                            <div class="direct-chat-msg right">
-                                                                                                <div class="direct-chat-infos clearfix">
-                                                                                                    <span class="direct-chat-name float-right">
-                                                                                                        Sarah Bullock
-                                                                                                    </span>
-                                                                                                    <span class="direct-chat-timestamp float-left">
-                                                                                                        23 Jan 2:05 pm
-                                                                                                    </span>
-                                                                                                </div>
-                                                                                                <!-- /.direct-chat-infos -->
-                                                                                                <img class="direct-chat-img"
-                                                                                                     src="/static/assets/img/user3-128x128.jpg"
-                                                                                                     alt="Message User Image">
-                                                                                                    <!-- /.direct-chat-img -->
-                                                                                                    <div class="direct-chat-text">
-                                                                                                        You better believe it!
-                                                                                                    </div>
-                                                                                                    <!-- /.direct-chat-text -->
-                                                                                                </div>
-                                                                                                <!-- /.direct-chat-msg -->
-                                                                                            </div>
-                                                                                            <!--/.direct-chat-messages-->
-                                                                                            <!-- Contacts are loaded here -->
-                                                                                            <div class="direct-chat-contacts">
-                                                                                                <ul class="contacts-list">
-                                                                                                    <li>
-                                                                                                        <a href="#">
-                                                                                                            <img class="contacts-list-img"
-                                                                                                                 src="/static/assets/img/user1-128x128.jpg"
-                                                                                                                 alt="User Avatar">
-                                                                                                                <div class="contacts-list-info">
-                                                                                                                    <span class="contacts-list-name">
-                                                                                                                        Count Dracula
-                                                                                                                        <small class="contacts-list-date float-right">
-                                                                                                                        2/28/2015
-                                                                                                                        </small>
-                                                                                                                    </span>
-                                                                                                                    <span class="contacts-list-msg">
-                                                                                                                        How have you been? I was...
-                                                                                                                    </span>
-                                                                                                                </div>
-                                                                                                                <!-- /.contacts-list-info -->
-                                                                                                            </a>
-                                                                                                        </li>
-                                                                                                        <!-- End Contact Item -->
-                                                                                                    </ul>
-                                                                                                    <!-- /.contatcts-list -->
-                                                                                                </div>
-                                                                                                <!-- /.direct-chat-pane -->
-                                                                                            </div>
-                                                                                            <!-- /.card-body -->
-                                                                                            <div class="card-footer">
-                                                                                                <form action="#"
-                                                                                                      method="post">
-                                                                                                    <div class="input-group">
-                                                                                                        <input type="text"
-                                                                                                               name="message"
-                                                                                                               placeholder="Type Message ..."
-                                                                                                               class="form-control">
-                                                                                                        <span class="input-group-append">
-                                                                                                            <button type="submit"
-                                                                                                                    class="btn btn-primary">
-                                                                                                                Send
-                                                                                                            </button>
-                                                                                                        </span>
-                                                                                                    </div>
-                                                                                                </form>
-                                                                                            </div>
-                                                                                            <!-- /.card-footer-->
-                                                                                        </div>
-                                                                                        <!--/.direct-chat -->
-                                                                                    </div>
-                                                                                    <!-- /.col -->
-                                                                                    <div class="col-md-3">
-                                                                                        <!-- DIRECT CHAT SUCCESS -->
-                                                                                        <div class="card card-sucress cardutline direct-chat direct-chat-success shadow-sm">
-                                                                                            <div class="card-header">
-                                                                                                <h3 class="card-title">
-                                                                                                    Shadow - Small
-                                                                                                </h3>
-                                                                                                <div class="card-tools">
-                                                                                                    <span title="3 New Messages"
-                                                                                                          class="badge bg-success">
-                                                                                                        3
-                                                                                                    </span>
-                                                                                                    <button type="button"
-                                                                                                            class="btn btn-tool"
-                                                                                                            data-card-widget="collapse">
-                                                                                                        <i class="fas fa-minus"></i>
-                                                                                                    </button>
-                                                                                                    <button type="button"
-                                                                                                            class="btn btn-tool"
-                                                                                                            title="Contacts"
-                                                                                                            data-widget="chat-pane-toggle">
-                                                                                                        <i class="fas fa-comments"></i>
-                                                                                                    </button>
-                                                                                                    <button type="button"
-                                                                                                            class="btn btn-tool"
-                                                                                                            data-card-widget="remove">
-                                                                                                        <i class="fas fa-times"></i>
-                                                                                                    </button>
-                                                                                                </div>
-                                                                                            </div>
-                                                                                            <!-- /.card-header -->
-                                                                                            <div class="card-body">
-                                                                                                <!-- Conversations are loaded here -->
-                                                                                                <div class="direct-chat-messages">
-                                                                                                    <!-- Message. Default to the left -->
-                                                                                                    <div class="direct-chat-msg">
-                                                                                                        <div class="direct-chat-infos clearfix">
-                                                                                                            <span class="direct-chat-name float-left">
-                                                                                                                Alexander Pierce
-                                                                                                            </span>
-                                                                                                            <span class="direct-chat-timestamp float-right">
-                                                                                                                23 Jan 2:00 pm
-                                                                                                            </span>
-                                                                                                        </div>
-                                                                                                        <!-- /.direct-chat-infos -->
-                                                                                                        <img class="direct-chat-img"
-                                                                                                             src="/static/assets/img/user1-128x128.jpg"
-                                                                                                             alt="Message User Image">
-                                                                                                            <!-- /.direct-chat-img -->
-                                                                                                            <div class="direct-chat-text">
-                                                                                                                Is this template really for free? That's unbelievable!
-                                                                                                            </div>
-                                                                                                            <!-- /.direct-chat-text -->
-                                                                                                        </div>
-                                                                                                        <!-- /.direct-chat-msg -->
-                                                                                                        <!-- Message to the right -->
-                                                                                                        <div class="direct-chat-msg right">
-                                                                                                            <div class="direct-chat-infos clearfix">
-                                                                                                                <span class="direct-chat-name float-right">
-                                                                                                                    Sarah Bullock
-                                                                                                                </span>
-                                                                                                                <span class="direct-chat-timestamp float-left">
-                                                                                                                    23 Jan 2:05 pm
-                                                                                                                </span>
-                                                                                                            </div>
-                                                                                                            <!-- /.direct-chat-infos -->
-                                                                                                            <img class="direct-chat-img"
-                                                                                                                 src="/static/assets/img/user3-128x128.jpg"
-                                                                                                                 alt="Message User Image">
-                                                                                                                <!-- /.direct-chat-img -->
-                                                                                                                <div class="direct-chat-text">
-                                                                                                                    You better believe it!
-                                                                                                                </div>
-                                                                                                                <!-- /.direct-chat-text -->
-                                                                                                            </div>
-                                                                                                            <!-- /.direct-chat-msg -->
-                                                                                                        </div>
-                                                                                                        <!--/.direct-chat-messages-->
-                                                                                                        <!-- Contacts are loaded here -->
-                                                                                                        <div class="direct-chat-contacts">
-                                                                                                            <ul class="contacts-list">
-                                                                                                                <li>
-                                                                                                                    <a href="#">
-                                                                                                                        <img class="contacts-list-img"
-                                                                                                                             src="/static/assets/img/user1-128x128.jpg"
-                                                                                                                             alt="User Avatar">
-                                                                                                                            <div class="contacts-list-info">
-                                                                                                                                <span class="contacts-list-name">
-                                                                                                                                    Count Dracula
-                                                                                                                                    <small class="contacts-list-date float-right">
-                                                                                                                                    2/28/2015
-                                                                                                                                    </small>
-                                                                                                                                </span>
-                                                                                                                                <span class="contacts-list-msg">
-                                                                                                                                    How have you been? I was...
-                                                                                                                                </span>
-                                                                                                                            </div>
-                                                                                                                            <!-- /.contacts-list-info -->
-                                                                                                                        </a>
-                                                                                                                    </li>
-                                                                                                                    <!-- End Contact Item -->
-                                                                                                                </ul>
-                                                                                                                <!-- /.contatcts-list -->
-                                                                                                            </div>
-                                                                                                            <!-- /.direct-chat-pane -->
-                                                                                                        </div>
-                                                                                                        <!-- /.card-body -->
-                                                                                                        <div class="card-footer">
-                                                                                                            <form action="#"
-                                                                                                                  method="post">
-                                                                                                                <div class="input-group">
-                                                                                                                    <input type="text"
-                                                                                                                           name="message"
-                                                                                                                           placeholder="Type Message ..."
-                                                                                                                           class="form-control">
-                                                                                                                    <span class="input-group-append">
-                                                                                                                        <button type="submit"
-                                                                                                                                class="btn btn-success">
-                                                                                                                            Send
-                                                                                                                        </button>
-                                                                                                                    </span>
-                                                                                                                </div>
-                                                                                                            </form>
-                                                                                                        </div>
-                                                                                                        <!-- /.card-footer-->
-                                                                                                    </div>
-                                                                                                    <!--/.direct-chat -->
-                                                                                                </div>
-                                                                                                <!-- /.col -->
-                                                                                                <div class="col-md-3">
-                                                                                                    <!-- DIRECT CHAT WARNING -->
-                                                                                                    <div class="card card-warning direct-chat direct-chat-warning shadow">
-                                                                                                        <div class="card-header">
-                                                                                                            <h3 class="card-title">
-                                                                                                                Shadow - Regular
-                                                                                                            </h3>
-                                                                                                            <div class="card-tools">
-                                                                                                                <span title="3 New Messages"
-                                                                                                                      class="badge bg-danger">
-                                                                                                                    3
-                                                                                                                </span>
-                                                                                                                <button type="button"
-                                                                                                                        class="btn btn-tool"
-                                                                                                                        data-card-widget="collapse">
-                                                                                                                    <i class="fas fa-minus"></i>
-                                                                                                                </button>
-                                                                                                                <button type="button"
-                                                                                                                        class="btn btn-tool"
-                                                                                                                        title="Contacts"
-                                                                                                                        data-widget="chat-pane-toggle">
-                                                                                                                    <i class="fas fa-comments"></i>
-                                                                                                                </button>
-                                                                                                                <button type="button"
-                                                                                                                        class="btn btn-tool"
-                                                                                                                        data-card-widget="remove">
-                                                                                                                    <i class="fas fa-times"></i>
-                                                                                                                </button>
-                                                                                                            </div>
-                                                                                                        </div>
-                                                                                                        <!-- /.card-header -->
-                                                                                                        <div class="card-body">
-                                                                                                            <!-- Conversations are loaded here -->
-                                                                                                            <div class="direct-chat-messages">
-                                                                                                                <!-- Message. Default to the left -->
-                                                                                                                <div class="direct-chat-msg">
-                                                                                                                    <div class="direct-chat-infos clearfix">
-                                                                                                                        <span class="direct-chat-name float-left">
-                                                                                                                            Alexander Pierce
-                                                                                                                        </span>
-                                                                                                                        <span class="direct-chat-timestamp float-right">
-                                                                                                                            23 Jan 2:00 pm
-                                                                                                                        </span>
-                                                                                                                    </div>
-                                                                                                                    <!-- /.direct-chat-infos -->
-                                                                                                                    <img class="direct-chat-img"
-                                                                                                                         src="/static/assets/img/user1-128x128.jpg"
-                                                                                                                         alt="Message User Image">
-                                                                                                                        <!-- /.direct-chat-img -->
-                                                                                                                        <div class="direct-chat-text">
-                                                                                                                            Is this template really for free? That's unbelievable!
-                                                                                                                        </div>
-                                                                                                                        <!-- /.direct-chat-text -->
-                                                                                                                    </div>
-                                                                                                                    <!-- /.direct-chat-msg -->
-                                                                                                                    <!-- Message to the right -->
-                                                                                                                    <div class="direct-chat-msg right">
-                                                                                                                        <div class="direct-chat-infos clearfix">
-                                                                                                                            <span class="direct-chat-name float-right">
-                                                                                                                                Sarah Bullock
-                                                                                                                            </span>
-                                                                                                                            <span class="direct-chat-timestamp float-left">
-                                                                                                                                23 Jan 2:05 pm
-                                                                                                                            </span>
-                                                                                                                        </div>
-                                                                                                                        <!-- /.direct-chat-infos -->
-                                                                                                                        <img class="direct-chat-img"
-                                                                                                                             src="/static/assets/img/user3-128x128.jpg"
-                                                                                                                             alt="Message User Image">
-                                                                                                                            <!-- /.direct-chat-img -->
-                                                                                                                            <div class="direct-chat-text">
-                                                                                                                                You better believe it!
-                                                                                                                            </div>
-                                                                                                                            <!-- /.direct-chat-text -->
-                                                                                                                        </div>
-                                                                                                                        <!-- /.direct-chat-msg -->
-                                                                                                                    </div>
-                                                                                                                    <!--/.direct-chat-messages-->
-                                                                                                                    <!-- Contacts are loaded here -->
-                                                                                                                    <div class="direct-chat-contacts">
-                                                                                                                        <ul class="contacts-list">
-                                                                                                                            <li>
-                                                                                                                                <a href="#">
-                                                                                                                                    <img class="contacts-list-img"
-                                                                                                                                         src="/static/assets/img/user1-128x128.jpg"
-                                                                                                                                         alt="User Avatar">
-                                                                                                                                        <div class="contacts-list-info">
-                                                                                                                                            <span class="contacts-list-name">
-                                                                                                                                                Count Dracula
-                                                                                                                                                <small class="contacts-list-date float-right">
-                                                                                                                                                2/28/2015
-                                                                                                                                                </small>
-                                                                                                                                            </span>
-                                                                                                                                            <span class="contacts-list-msg">
-                                                                                                                                                How have you been? I was...
-                                                                                                                                            </span>
-                                                                                                                                        </div>
-                                                                                                                                        <!-- /.contacts-list-info -->
-                                                                                                                                    </a>
-                                                                                                                                </li>
-                                                                                                                                <!-- End Contact Item -->
-                                                                                                                            </ul>
-                                                                                                                            <!-- /.contatcts-list -->
-                                                                                                                        </div>
-                                                                                                                        <!-- /.direct-chat-pane -->
-                                                                                                                    </div>
-                                                                                                                    <!-- /.card-body -->
-                                                                                                                    <div class="card-footer">
-                                                                                                                        <form action="#"
-                                                                                                                              method="post">
-                                                                                                                            <div class="input-group">
-                                                                                                                                <input type="text"
-                                                                                                                                       name="message"
-                                                                                                                                       placeholder="Type Message ..."
-                                                                                                                                       class="form-control">
-                                                                                                                                <span class="input-group-append">
-                                                                                                                                    <button type="submit"
-                                                                                                                                            class="btn btn-warning">
-                                                                                                                                        Send
-                                                                                                                                    </button>
-                                                                                                                                </span>
-                                                                                                                            </div>
-                                                                                                                        </form>
-                                                                                                                    </div>
-                                                                                                                    <!-- /.card-footer-->
-                                                                                                                </div>
-                                                                                                                <!--/.direct-chat -->
-                                                                                                            </div>
-                                                                                                            <!-- /.col -->
-                                                                                                            <div class="col-md-3">
-                                                                                                                <!-- DIRECT CHAT DANGER -->
-                                                                                                                <div class="card card-danger direct-chat direct-chat-danger shadow-lg">
-                                                                                                                    <div class="card-header">
-                                                                                                                        <h3 class="card-title">
-                                                                                                                            Shadow - Large
-                                                                                                                        </h3>
-                                                                                                                        <div class="card-tools">
-                                                                                                                            <span title="3 New Messages"
-                                                                                                                                  class="badge">
-                                                                                                                                3
-                                                                                                                            </span>
-                                                                                                                            <button type="button"
-                                                                                                                                    class="btn btn-tool"
-                                                                                                                                    data-card-widget="collapse">
-                                                                                                                                <i class="fas fa-minus"></i>
-                                                                                                                            </button>
-                                                                                                                            <button type="button"
-                                                                                                                                    class="btn btn-tool"
-                                                                                                                                    title="Contacts"
-                                                                                                                                    data-widget="chat-pane-toggle">
-                                                                                                                                <i class="fas fa-comments"></i>
-                                                                                                                            </button>
-                                                                                                                            <button type="button"
-                                                                                                                                    class="btn btn-tool"
-                                                                                                                                    data-card-widget="remove">
-                                                                                                                                <i class="fas fa-times"></i>
-                                                                                                                            </button>
-                                                                                                                        </div>
-                                                                                                                    </div>
-                                                                                                                    <!-- /.card-header -->
-                                                                                                                    <div class="card-body">
-                                                                                                                        <!-- Conversations are loaded here -->
-                                                                                                                        <div class="direct-chat-messages">
-                                                                                                                            <!-- Message. Default to the left -->
-                                                                                                                            <div class="direct-chat-msg">
-                                                                                                                                <div class="direct-chat-infos clearfix">
-                                                                                                                                    <span class="direct-chat-name float-left">
-                                                                                                                                        Alexander Pierce
-                                                                                                                                    </span>
-                                                                                                                                    <span class="direct-chat-timestamp float-right">
-                                                                                                                                        23 Jan 2:00 pm
-                                                                                                                                    </span>
-                                                                                                                                </div>
-                                                                                                                                <!-- /.direct-chat-infos -->
-                                                                                                                                <img class="direct-chat-img"
-                                                                                                                                     src="/static/assets/img/user1-128x128.jpg"
-                                                                                                                                     alt="Message User Image">
-                                                                                                                                    <!-- /.direct-chat-img -->
-                                                                                                                                    <div class="direct-chat-text">
-                                                                                                                                        Is this template really for free? That's unbelievable!
-                                                                                                                                    </div>
-                                                                                                                                    <!-- /.direct-chat-text -->
-                                                                                                                                </div>
-                                                                                                                                <!-- /.direct-chat-msg -->
-                                                                                                                                <!-- Message to the right -->
-                                                                                                                                <div class="direct-chat-msg right">
-                                                                                                                                    <div class="direct-chat-infos clearfix">
-                                                                                                                                        <span class="direct-chat-name float-right">
-                                                                                                                                            Sarah Bullock
-                                                                                                                                        </span>
-                                                                                                                                        <span class="direct-chat-timestamp float-left">
-                                                                                                                                            23 Jan 2:05 pm
-                                                                                                                                        </span>
-                                                                                                                                    </div>
-                                                                                                                                    <!-- /.direct-chat-infos -->
-                                                                                                                                    <img class="direct-chat-img"
-                                                                                                                                         src="/static/assets/img/user3-128x128.jpg"
-                                                                                                                                         alt="Message User Image">
-                                                                                                                                        <!-- /.direct-chat-img -->
-                                                                                                                                        <div class="direct-chat-text">
-                                                                                                                                            You better believe it!
-                                                                                                                                        </div>
-                                                                                                                                        <!-- /.direct-chat-text -->
-                                                                                                                                    </div>
-                                                                                                                                    <!-- /.direct-chat-msg -->
-                                                                                                                                </div>
-                                                                                                                                <!--/.direct-chat-messages-->
-                                                                                                                                <!-- Contacts are loaded here -->
-                                                                                                                                <div class="direct-chat-contacts">
-                                                                                                                                    <ul class="contacts-list">
-                                                                                                                                        <li>
-                                                                                                                                            <a href="#">
-                                                                                                                                                <img class="contacts-list-img"
-                                                                                                                                                     src="/static/assets/img/user1-128x128.jpg"
-                                                                                                                                                     alt="User Avatar">
-                                                                                                                                                    <div class="contacts-list-info">
-                                                                                                                                                        <span class="contacts-list-name">
-                                                                                                                                                            Count Dracula
-                                                                                                                                                            <small class="contacts-list-date float-right">
-                                                                                                                                                            2/28/2015
-                                                                                                                                                            </small>
-                                                                                                                                                        </span>
-                                                                                                                                                        <span class="contacts-list-msg">
-                                                                                                                                                            How have you been? I was...
-                                                                                                                                                        </span>
-                                                                                                                                                    </div>
-                                                                                                                                                    <!-- /.contacts-list-info -->
-                                                                                                                                                </a>
-                                                                                                                                            </li>
-                                                                                                                                            <!-- End Contact Item -->
-                                                                                                                                        </ul>
-                                                                                                                                        <!-- /.contatcts-list -->
-                                                                                                                                    </div>
-                                                                                                                                    <!-- /.direct-chat-pane -->
-                                                                                                                                </div>
-                                                                                                                                <!-- /.card-body -->
-                                                                                                                                <div class="card-footer">
-                                                                                                                                    <form action="#"
-                                                                                                                                          method="post">
-                                                                                                                                        <div class="input-group">
-                                                                                                                                            <input type="text"
-                                                                                                                                                   name="message"
-                                                                                                                                                   placeholder="Type Message ..."
-                                                                                                                                                   class="form-control">
-                                                                                                                                            <span class="input-group-append">
-                                                                                                                                                <button type="submit"
-                                                                                                                                                        class="btn btn-danger">
-                                                                                                                                                    Send
-                                                                                                                                                </button>
-                                                                                                                                            </span>
-                                                                                                                                        </div>
-                                                                                                                                    </form>
-                                                                                                                                </div>
-                                                                                                                                <!-- /.card-footer-->
-                                                                                                                            </div>
-                                                                                                                            <!--/.direct-chat -->
-                                                                                                                        </div>
-                                                                                                                        <!-- /.col -->
-                                                                                                                    </div>
-                                                                                                                    <!-- /.row -->
-                                                                                                                    <h3 class="mt-4 mb-4">
-                                                                                                                        Social Widgets
-                                                                                                                    </h3>
-                                                                                                                    <div class="row">
-                                                                                                                        <div class="col-md-4">
-                                                                                                                            <!-- Widget: user widget style 2 -->
-                                                                                                                            <div class="card card-widget widget-user-2">
-                                                                                                                                <!-- Add the bg color to the header using any of the bg-* classes -->
-                                                                                                                                <div class="widget-user-header bg-warning">
-                                                                                                                                    <div class="widget-user-image">
-                                                                                                                                        <img class="img-circle elevation-2"
-                                                                                                                                             src="/static/assets/img/user7-128x128.jpg"
-                                                                                                                                             alt="User Avatar">
-                                                                                                                                        </div>
-                                                                                                                                        <!-- /.widget-user-image -->
-                                                                                                                                        <h3 class="widget-user-username">
-                                                                                                                                            Nadia Carmichael
-                                                                                                                                        </h3>
-                                                                                                                                        <h5 class="widget-user-desc">
-                                                                                                                                            Lead Developer
-                                                                                                                                        </h5>
-                                                                                                                                    </div>
-                                                                                                                                    <div class="card-footer p-0">
-                                                                                                                                        <ul class="nav flex-column">
-                                                                                                                                            <li class="nav-item">
-                                                                                                                                                <a href="#"
-                                                                                                                                                   class="nav-link">
-                                                                                                                                                    Projects
-                                                                                                                                                    <span class="float-right badge bg-primary">
-                                                                                                                                                        31
-                                                                                                                                                    </span>
-                                                                                                                                                </a>
-                                                                                                                                            </li>
-                                                                                                                                            <li class="nav-item">
-                                                                                                                                                <a href="#"
-                                                                                                                                                   class="nav-link">
-                                                                                                                                                    Tasks
-                                                                                                                                                    <span class="float-right badge bg-info">
-                                                                                                                                                        5
-                                                                                                                                                    </span>
-                                                                                                                                                </a>
-                                                                                                                                            </li>
-                                                                                                                                            <li class="nav-item">
-                                                                                                                                                <a href="#"
-                                                                                                                                                   class="nav-link">
-                                                                                                                                                    Completed Projects
-                                                                                                                                                    <span class="float-right badge bg-success">
-                                                                                                                                                        12
-                                                                                                                                                    </span>
-                                                                                                                                                </a>
-                                                                                                                                            </li>
-                                                                                                                                            <li class="nav-item">
-                                                                                                                                                <a href="#"
-                                                                                                                                                   class="nav-link">
-                                                                                                                                                    Followers
-                                                                                                                                                    <span class="float-right badge bg-danger">
-                                                                                                                                                        842
-                                                                                                                                                    </span>
-                                                                                                                                                </a>
-                                                                                                                                            </li>
-                                                                                                                                        </ul>
-                                                                                                                                    </div>
-                                                                                                                                </div>
-                                                                                                                                <!-- /.widget-user -->
-                                                                                                                            </div>
-                                                                                                                            <!-- /.col -->
-                                                                                                                            <div class="col-md-4">
-                                                                                                                                <!-- Widget: user widget style 1 -->
-                                                                                                                                <div class="card card-widget widget-user">
-                                                                                                                                    <!-- Add the bg color to the header using any of the bg-* classes -->
-                                                                                                                                    <div class="widget-user-header bg-info">
-                                                                                                                                        <h3 class="widget-user-username">
-                                                                                                                                            Alexander Pierce
-                                                                                                                                        </h3>
-                                                                                                                                        <h5 class="widget-user-desc">
-                                                                                                                                            Founder & CEO
-                                                                                                                                        </h5>
-                                                                                                                                    </div>
-                                                                                                                                    <div class="widget-user-image">
-                                                                                                                                        <img class="img-circle elevation-2"
-                                                                                                                                             src="/static/assets/img/user1-128x128.jpg"
-                                                                                                                                             alt="User Avatar">
-                                                                                                                                        </div>
-                                                                                                                                        <div class="card-footer">
-                                                                                                                                            <div class="row">
-                                                                                                                                                <div class="col-sm-4 border-right">
-                                                                                                                                                    <div class="description-block">
-                                                                                                                                                        <h5 class="description-header">
-                                                                                                                                                            3,200
-                                                                                                                                                        </h5>
-                                                                                                                                                        <span class="description-text">
-                                                                                                                                                            SALES
-                                                                                                                                                        </span>
-                                                                                                                                                    </div>
-                                                                                                                                                    <!-- /.description-block -->
-                                                                                                                                                </div>
-                                                                                                                                                <!-- /.col -->
-                                                                                                                                                <div class="col-sm-4 border-right">
-                                                                                                                                                    <div class="description-block">
-                                                                                                                                                        <h5 class="description-header">
-                                                                                                                                                            13,000
-                                                                                                                                                        </h5>
-                                                                                                                                                        <span class="description-text">
-                                                                                                                                                            FOLLOWERS
-                                                                                                                                                        </span>
-                                                                                                                                                    </div>
-                                                                                                                                                    <!-- /.description-block -->
-                                                                                                                                                </div>
-                                                                                                                                                <!-- /.col -->
-                                                                                                                                                <div class="col-sm-4">
-                                                                                                                                                    <div class="description-block">
-                                                                                                                                                        <h5 class="description-header">
-                                                                                                                                                            35
-                                                                                                                                                        </h5>
-                                                                                                                                                        <span class="description-text">
-                                                                                                                                                            PRODUCTS
-                                                                                                                                                        </span>
-                                                                                                                                                    </div>
-                                                                                                                                                    <!-- /.description-block -->
-                                                                                                                                                </div>
-                                                                                                                                                <!-- /.col -->
-                                                                                                                                            </div>
-                                                                                                                                            <!-- /.row -->
-                                                                                                                                        </div>
-                                                                                                                                    </div>
-                                                                                                                                    <!-- /.widget-user -->
-                                                                                                                                </div>
-                                                                                                                                <!-- /.col -->
-                                                                                                                                <div class="col-md-4">
-                                                                                                                                    <!-- Widget: user widget style 1 -->
-                                                                                                                                    <div class="card card-widget widget-user">
-                                                                                                                                        <!-- Add the bg color to the header using any of the bg-* classes -->
-                                                                                                                                        <div class="widget-user-header text-white"
-                                                                                                                                             style="background: url('/static/assets/img/photo1.png') center center;">
-                                                                                                                                            <h3 class="widget-user-username text-right">
-                                                                                                                                                Elizabeth Pierce
-                                                                                                                                            </h3>
-                                                                                                                                            <h5 class="widget-user-desc text-right">
-                                                                                                                                                Web Designer
-                                                                                                                                            </h5>
-                                                                                                                                        </div>
-                                                                                                                                        <div class="widget-user-image">
-                                                                                                                                            <img class="img-circle"
-                                                                                                                                                 src="/static/assets/img/user3-128x128.jpg"
-                                                                                                                                                 alt="User Avatar">
-                                                                                                                                            </div>
-                                                                                                                                            <div class="card-footer">
-                                                                                                                                                <div class="row">
-                                                                                                                                                    <div class="col-sm-4 border-right">
-                                                                                                                                                        <div class="description-block">
-                                                                                                                                                            <h5 class="description-header">
-                                                                                                                                                                3,200
-                                                                                                                                                            </h5>
-                                                                                                                                                            <span class="description-text">
-                                                                                                                                                                SALES
-                                                                                                                                                            </span>
-                                                                                                                                                        </div>
-                                                                                                                                                        <!-- /.description-block -->
-                                                                                                                                                    </div>
-                                                                                                                                                    <!-- /.col -->
-                                                                                                                                                    <div class="col-sm-4 border-right">
-                                                                                                                                                        <div class="description-block">
-                                                                                                                                                            <h5 class="description-header">
-                                                                                                                                                                13,000
-                                                                                                                                                            </h5>
-                                                                                                                                                            <span class="description-text">
-                                                                                                                                                                FOLLOWERS
-                                                                                                                                                            </span>
-                                                                                                                                                        </div>
-                                                                                                                                                        <!-- /.description-block -->
-                                                                                                                                                    </div>
-                                                                                                                                                    <!-- /.col -->
-                                                                                                                                                    <div class="col-sm-4">
-                                                                                                                                                        <div class="description-block">
-                                                                                                                                                            <h5 class="description-header">
-                                                                                                                                                                35
-                                                                                                                                                            </h5>
-                                                                                                                                                            <span class="description-text">
-                                                                                                                                                                PRODUCTS
-                                                                                                                                                            </span>
-                                                                                                                                                        </div>
-                                                                                                                                                        <!-- /.description-block -->
-                                                                                                                                                    </div>
-                                                                                                                                                    <!-- /.col -->
-                                                                                                                                                </div>
-                                                                                                                                                <!-- /.row -->
-                                                                                                                                            </div>
-                                                                                                                                        </div>
-                                                                                                                                        <!-- /.widget-user -->
-                                                                                                                                    </div>
-                                                                                                                                    <!-- /.col -->
-                                                                                                                                </div>
-                                                                                                                                <!-- /.row -->
-                                                                                                                                <div class="row">
-                                                                                                                                    <div class="col-md-6">
-                                                                                                                                        <!-- Box Comment -->
-                                                                                                                                        <div class="card card-widget">
-                                                                                                                                            <div class="card-header">
-                                                                                                                                                <div class="user-block">
-                                                                                                                                                    <img class="img-circle"
-                                                                                                                                                         src="/static/assets/img/user1-128x128.jpg"
-                                                                                                                                                         alt="User Image">
-                                                                                                                                                        <span class="username">
-                                                                                                                                                            <a href="#">
-                                                                                                                                                                Jonathan Burke Jr.
-                                                                                                                                                            </a>
-                                                                                                                                                        </span>
-                                                                                                                                                        <span class="description">
-                                                                                                                                                            Shared publicly - 7:30 PM Today
-                                                                                                                                                        </span>
-                                                                                                                                                    </div>
-                                                                                                                                                    <!-- /.user-block -->
-                                                                                                                                                    <div class="card-tools">
-                                                                                                                                                        <button type="button"
-                                                                                                                                                                class="btn btn-tool"
-                                                                                                                                                                title="Mark as read">
-                                                                                                                                                            <i class="far fa-circle"></i>
-                                                                                                                                                        </button>
-                                                                                                                                                        <button type="button"
-                                                                                                                                                                class="btn btn-tool"
-                                                                                                                                                                data-card-widget="collapse">
-                                                                                                                                                            <i class="fas fa-minus"></i>
-                                                                                                                                                        </button>
-                                                                                                                                                        <button type="button"
-                                                                                                                                                                class="btn btn-tool"
-                                                                                                                                                                data-card-widget="remove">
-                                                                                                                                                            <i class="fas fa-times"></i>
-                                                                                                                                                        </button>
-                                                                                                                                                    </div>
-                                                                                                                                                    <!-- /.card-tools -->
-                                                                                                                                                </div>
-                                                                                                                                                <!-- /.card-header -->
-                                                                                                                                                <div class="card-body">
-                                                                                                                                                    <img class="img-fluid pad"
-                                                                                                                                                         src="/static/assets/img/photo2.png"
-                                                                                                                                                         alt="Photo">
-                                                                                                                                                        <p>
-                                                                                                                                                            I took this photo this morning. What do you guys think?
-                                                                                                                                                        </p>
-                                                                                                                                                        <button type="button"
-                                                                                                                                                                class="btn btn-default btn-sm">
-                                                                                                                                                            <i class="fas fa-share"></i>
-                                                                                                                                                            Share
-                                                                                                                                                        </button>
-                                                                                                                                                        <button type="button"
-                                                                                                                                                                class="btn btn-default btn-sm">
-                                                                                                                                                            <i class="far fa-thumbs-up"></i>
-                                                                                                                                                            Like
-                                                                                                                                                        </button>
-                                                                                                                                                        <span class="float-right text-muted">
-                                                                                                                                                            127 likes - 3 comments
-                                                                                                                                                        </span>
-                                                                                                                                                    </div>
-                                                                                                                                                    <!-- /.card-body -->
-                                                                                                                                                    <div class="card-footer card-comments">
-                                                                                                                                                        <div class="card-comment">
-                                                                                                                                                            <!-- User image -->
-                                                                                                                                                            <img class="img-circle img-sm"
-                                                                                                                                                                 src="/static/assets/img/user3-128x128.jpg"
-                                                                                                                                                                 alt="User Image">
-                                                                                                                                                                <div class="comment-text">
-                                                                                                                                                                    <span class="username">
-                                                                                                                                                                        Maria Gonzales
-                                                                                                                                                                        <span class="text-muted float-right">
-                                                                                                                                                                            8:03 PM Today
-                                                                                                                                                                        </span>
-                                                                                                                                                                    </span>
-                                                                                                                                                                    <!-- /.username -->
-                                                                                                                                                                    It is a long established fact that a reader will be distracted
-                                                                                                                                                                    by the readable content of a page when looking at its layout.
-                                                                                                                                                                </div>
-                                                                                                                                                                <!-- /.comment-text -->
-                                                                                                                                                            </div>
-                                                                                                                                                            <!-- /.card-comment -->
-                                                                                                                                                            <div class="card-comment">
-                                                                                                                                                                <!-- User image -->
-                                                                                                                                                                <img class="img-circle img-sm"
-                                                                                                                                                                     src="/static/assets/img/user4-128x128.jpg"
-                                                                                                                                                                     alt="User Image">
-                                                                                                                                                                    <div class="comment-text">
-                                                                                                                                                                        <span class="username">
-                                                                                                                                                                            Luna Stark
-                                                                                                                                                                            <span class="text-muted float-right">
-                                                                                                                                                                                8:03 PM Today
-                                                                                                                                                                            </span>
-                                                                                                                                                                        </span>
-                                                                                                                                                                        <!-- /.username -->
-                                                                                                                                                                        It is a long established fact that a reader will be distracted
-                                                                                                                                                                        by the readable content of a page when looking at its layout.
-                                                                                                                                                                    </div>
-                                                                                                                                                                    <!-- /.comment-text -->
-                                                                                                                                                                </div>
-                                                                                                                                                                <!-- /.card-comment -->
-                                                                                                                                                            </div>
-                                                                                                                                                            <!-- /.card-footer -->
-                                                                                                                                                            <div class="card-footer">
-                                                                                                                                                                <form action="#"
-                                                                                                                                                                      method="post">
-                                                                                                                                                                    <img class="img-fluid img-circle img-sm"
-                                                                                                                                                                         src="/static/assets/img/user4-128x128.jpg"
-                                                                                                                                                                         alt="Alt Text">
-                                                                                                                                                                        <!-- .img-push is used to add margin to elements next to floating images -->
-                                                                                                                                                                        <div class="img-push">
-                                                                                                                                                                            <input type="text"
-                                                                                                                                                                                   class="form-control form-control-sm"
-                                                                                                                                                                                   placeholder="Press enter to post comment">
-                                                                                                                                                                        </div>
-                                                                                                                                                                    </form>
-                                                                                                                                                                </div>
-                                                                                                                                                                <!-- /.card-footer -->
-                                                                                                                                                            </div>
-                                                                                                                                                            <!-- /.card -->
-                                                                                                                                                        </div>
-                                                                                                                                                        <!-- /.col -->
-                                                                                                                                                        <div class="col-md-6">
-                                                                                                                                                            <!-- Box Comment -->
-                                                                                                                                                            <div class="card card-widget">
-                                                                                                                                                                <div class="card-header">
-                                                                                                                                                                    <div class="user-block">
-                                                                                                                                                                        <img class="img-circle"
-                                                                                                                                                                             src="/static/assets/img/user1-128x128.jpg"
-                                                                                                                                                                             alt="User Image">
-                                                                                                                                                                            <span class="username">
-                                                                                                                                                                                <a href="#">
-                                                                                                                                                                                    Jonathan Burke Jr.
-                                                                                                                                                                                </a>
-                                                                                                                                                                            </span>
-                                                                                                                                                                            <span class="description">
-                                                                                                                                                                                Shared publicly - 7:30 PM Today
-                                                                                                                                                                            </span>
-                                                                                                                                                                        </div>
-                                                                                                                                                                        <!-- /.user-block -->
-                                                                                                                                                                        <div class="card-tools">
-                                                                                                                                                                            <button type="button"
-                                                                                                                                                                                    class="btn btn-tool"
-                                                                                                                                                                                    title="Mark as read">
-                                                                                                                                                                                <i class="far fa-circle"></i>
-                                                                                                                                                                            </button>
-                                                                                                                                                                            <button type="button"
-                                                                                                                                                                                    class="btn btn-tool"
-                                                                                                                                                                                    data-card-widget="collapse">
-                                                                                                                                                                                <i class="fas fa-minus"></i>
-                                                                                                                                                                            </button>
-                                                                                                                                                                            <button type="button"
-                                                                                                                                                                                    class="btn btn-tool"
-                                                                                                                                                                                    data-card-widget="remove">
-                                                                                                                                                                                <i class="fas fa-times"></i>
-                                                                                                                                                                            </button>
-                                                                                                                                                                        </div>
-                                                                                                                                                                        <!-- /.card-tools -->
-                                                                                                                                                                    </div>
-                                                                                                                                                                    <!-- /.card-header -->
-                                                                                                                                                                    <div class="card-body">
-                                                                                                                                                                        <!-- post text -->
-                                                                                                                                                                        <p>
-                                                                                                                                                                            Far far away, behind the word mountains, far from the
-                                                                                                                                                                            countries Vokalia and Consonantia, there live the blind
-                                                                                                                                                                            texts. Separated they live in Bookmarksgrove right at
-                                                                                                                                                                        </p>
-                                                                                                                                                                        <p>
-                                                                                                                                                                            the coast of the Semantics, a large language ocean.
-                                                                                                                                                                            A small river named Duden flows by their place and supplies
-                                                                                                                                                                            it with the necessary regelialia. It is a paradisematic
-                                                                                                                                                                            country, in which roasted parts of sentences fly into
-                                                                                                                                                                            your mouth.
-                                                                                                                                                                        </p>
-                                                                                                                                                                        <!-- Attachment -->
-                                                                                                                                                                        <div class="attachment-block clearfix">
-                                                                                                                                                                            <img class="attachment-img"
-                                                                                                                                                                                 src="/static/assets/img/photo1.png"
-                                                                                                                                                                                 alt="Attachment Image">
-                                                                                                                                                                                <div class="attachment-pushed">
-                                                                                                                                                                                    <h4 class="attachment-heading">
-                                                                                                                                                                                        <a href="https://www.lipsum.com/">
-                                                                                                                                                                                            Lorem ipsum text generator
-                                                                                                                                                                                        </a>
-                                                                                                                                                                                    </h4>
-                                                                                                                                                                                    <div class="attachment-text">
-                                                                                                                                                                                        Description about the attachment can be placed here.
-                                                                                                                                                                                        Lorem Ipsum is simply dummy text of the printing and typesetting industry...
-                                                                                                                                                                                        <a href="#">
-                                                                                                                                                                                            more
-                                                                                                                                                                                        </a>
-                                                                                                                                                                                    </div>
-                                                                                                                                                                                    <!-- /.attachment-text -->
-                                                                                                                                                                                </div>
-                                                                                                                                                                                <!-- /.attachment-pushed -->
-                                                                                                                                                                            </div>
-                                                                                                                                                                            <!-- /.attachment-block -->
-                                                                                                                                                                            <!-- Social sharing buttons -->
-                                                                                                                                                                            <button type="button"
-                                                                                                                                                                                    class="btn btn-default btn-sm">
-                                                                                                                                                                                <i class="fas fa-share"></i>
-                                                                                                                                                                                Share
-                                                                                                                                                                            </button>
-                                                                                                                                                                            <button type="button"
-                                                                                                                                                                                    class="btn btn-default btn-sm">
-                                                                                                                                                                                <i class="far fa-thumbs-up"></i>
-                                                                                                                                                                                Like
-                                                                                                                                                                            </button>
-                                                                                                                                                                            <span class="float-right text-muted">
-                                                                                                                                                                                45 likes - 2 comments
-                                                                                                                                                                            </span>
-                                                                                                                                                                        </div>
-                                                                                                                                                                        <!-- /.card-body -->
-                                                                                                                                                                        <div class="card-footer card-comments">
-                                                                                                                                                                            <div class="card-comment">
-                                                                                                                                                                                <!-- User image -->
-                                                                                                                                                                                <img class="img-circle img-sm"
-                                                                                                                                                                                     src="/static/assets/img/user3-128x128.jpg"
-                                                                                                                                                                                     alt="User Image">
-                                                                                                                                                                                    <div class="comment-text">
-                                                                                                                                                                                        <span class="username">
-                                                                                                                                                                                            Maria Gonzales
-                                                                                                                                                                                            <span class="text-muted float-right">
-                                                                                                                                                                                                8:03 PM Today
-                                                                                                                                                                                            </span>
-                                                                                                                                                                                        </span>
-                                                                                                                                                                                        <!-- /.username -->
-                                                                                                                                                                                        It is a long established fact that a reader will be distracted
-                                                                                                                                                                                        by the readable content of a page when looking at its layout.
-                                                                                                                                                                                    </div>
-                                                                                                                                                                                    <!-- /.comment-text -->
-                                                                                                                                                                                </div>
-                                                                                                                                                                                <!-- /.card-comment -->
-                                                                                                                                                                                <div class="card-comment">
-                                                                                                                                                                                    <!-- User image -->
-                                                                                                                                                                                    <img class="img-circle img-sm"
-                                                                                                                                                                                         src="/static/assets/img/user5-128x128.jpg"
-                                                                                                                                                                                         alt="User Image">
-                                                                                                                                                                                        <div class="comment-text">
-                                                                                                                                                                                            <span class="username">
-                                                                                                                                                                                                Nora Havisham
-                                                                                                                                                                                                <span class="text-muted float-right">
-                                                                                                                                                                                                    8:03 PM Today
-                                                                                                                                                                                                </span>
-                                                                                                                                                                                            </span>
-                                                                                                                                                                                            <!-- /.username -->
-                                                                                                                                                                                            The point of using Lorem Ipsum is that it hrs a morer-less
-                                                                                                                                                                                            normal distribution of letters, as opposed to using
-                                                                                                                                                                                            'Content here, content here', making it look like readable English.
-                                                                                                                                                                                        </div>
-                                                                                                                                                                                        <!-- /.comment-text -->
-                                                                                                                                                                                    </div>
-                                                                                                                                                                                    <!-- /.card-comment -->
-                                                                                                                                                                                </div>
-                                                                                                                                                                                <!-- /.card-footer -->
-                                                                                                                                                                                <div class="card-footer">
-                                                                                                                                                                                    <form action="#"
-                                                                                                                                                                                          method="post">
-                                                                                                                                                                                        <img class="img-fluid img-circle img-sm"
-                                                                                                                                                                                             src="/static/assets/img/user4-128x128.jpg"
-                                                                                                                                                                                             alt="Alt Text">
-                                                                                                                                                                                            <!-- .img-push is used to add margin to elements next to floating images -->
-                                                                                                                                                                                            <div class="img-push">
-                                                                                                                                                                                                <input type="text"
-                                                                                                                                                                                                       class="form-control form-control-sm"
-                                                                                                                                                                                                       placeholder="Press enter to post comment">
-                                                                                                                                                                                            </div>
-                                                                                                                                                                                        </form>
-                                                                                                                                                                                    </div>
-                                                                                                                                                                                    <!-- /.card-footer -->
-                                                                                                                                                                                </div>
-                                                                                                                                                                                <!-- /.card -->
-                                                                                                                                                                            </div>
-                                                                                                                                                                            <!-- /.col -->
-                                                                                                                                                                        </div>
-                                                                                                                                                                        <!-- /.row -->
-                                                                                                                                                                        <!-- =========================================================== -->
-                                                                                                                                                                        <h5 class="mb-2">
-                                                                                                                                                                            Custom Shadows Variations
-                                                                                                                                                                            <small>
-                                                                                                                                                                            <i>
-                                                                                                                                                                            Using Bootstrap's Shadow Utility
-                                                                                                                                                                            </i>
-                                                                                                                                                                            </small>
-                                                                                                                                                                        </h5>
-                                                                                                                                                                        <div class="row">
-                                                                                                                                                                            <div class="col-md-4">
-                                                                                                                                                                                <!-- Widget: user widget style 2 -->
-                                                                                                                                                                                <div class="card card-widget widget-user-2 shadow-sm">
-                                                                                                                                                                                    <!-- Add the bg color to the header using any of the bg-* classes -->
-                                                                                                                                                                                    <div class="widget-user-header bg-warning">
-                                                                                                                                                                                        <div class="widget-user-image">
-                                                                                                                                                                                            <img class="img-circle elevation-2"
-                                                                                                                                                                                                 src="/static/assets/img/user7-128x128.jpg"
-                                                                                                                                                                                                 alt="User Avatar">
-                                                                                                                                                                                            </div>
-                                                                                                                                                                                            <!-- /.widget-user-image -->
-                                                                                                                                                                                            <h3 class="widget-user-username">
-                                                                                                                                                                                                Nadia Carmichael
-                                                                                                                                                                                            </h3>
-                                                                                                                                                                                            <h5 class="widget-user-desc">
-                                                                                                                                                                                                Lead Developer
-                                                                                                                                                                                            </h5>
-                                                                                                                                                                                        </div>
-                                                                                                                                                                                        <div class="card-footer p-0">
-                                                                                                                                                                                            <ul class="nav flex-column">
-                                                                                                                                                                                                <li class="nav-item">
-                                                                                                                                                                                                    <a href="#"
-                                                                                                                                                                                                       class="nav-link">
-                                                                                                                                                                                                        Projects
-                                                                                                                                                                                                        <span class="float-right badge bg-primary">
-                                                                                                                                                                                                            31
-                                                                                                                                                                                                        </span>
-                                                                                                                                                                                                    </a>
-                                                                                                                                                                                                </li>
-                                                                                                                                                                                                <li class="nav-item">
-                                                                                                                                                                                                    <a href="#"
-                                                                                                                                                                                                       class="nav-link">
-                                                                                                                                                                                                        Tasks
-                                                                                                                                                                                                        <span class="float-right badge bg-info">
-                                                                                                                                                                                                            5
-                                                                                                                                                                                                        </span>
-                                                                                                                                                                                                    </a>
-                                                                                                                                                                                                </li>
-                                                                                                                                                                                                <li class="nav-item">
-                                                                                                                                                                                                    <a href="#"
-                                                                                                                                                                                                       class="nav-link">
-                                                                                                                                                                                                        Completed Projects
-                                                                                                                                                                                                        <span class="float-right badge bg-success">
-                                                                                                                                                                                                            12
-                                                                                                                                                                                                        </span>
-                                                                                                                                                                                                    </a>
-                                                                                                                                                                                                </li>
-                                                                                                                                                                                                <li class="nav-item">
-                                                                                                                                                                                                    <a href="#"
-                                                                                                                                                                                                       class="nav-link">
-                                                                                                                                                                                                        Followers
-                                                                                                                                                                                                        <span class="float-right badge bg-danger">
-                                                                                                                                                                                                            842
-                                                                                                                                                                                                        </span>
-                                                                                                                                                                                                    </a>
-                                                                                                                                                                                                </li>
-                                                                                                                                                                                            </ul>
-                                                                                                                                                                                        </div>
-                                                                                                                                                                                    </div>
-                                                                                                                                                                                    <!-- /.widget-user -->
-                                                                                                                                                                                </div>
-                                                                                                                                                                                <!-- /.col -->
-                                                                                                                                                                                <div class="col-md-4">
-                                                                                                                                                                                    <!-- Widget: user widget style 1 -->
-                                                                                                                                                                                    <div class="card card-widget widget-user shadow">
-                                                                                                                                                                                        <!-- Add the bg color to the header using any of the bg-* classes -->
-                                                                                                                                                                                        <div class="widget-user-header bg-info">
-                                                                                                                                                                                            <h3 class="widget-user-username">
-                                                                                                                                                                                                Alexander Pierce
-                                                                                                                                                                                            </h3>
-                                                                                                                                                                                            <h5 class="widget-user-desc">
-                                                                                                                                                                                                Founder & CEO
-                                                                                                                                                                                            </h5>
-                                                                                                                                                                                        </div>
-                                                                                                                                                                                        <div class="widget-user-image">
-                                                                                                                                                                                            <img class="img-circle elevation-2"
-                                                                                                                                                                                                 src="/static/assets/img/user1-128x128.jpg"
-                                                                                                                                                                                                 alt="User Avatar">
-                                                                                                                                                                                            </div>
-                                                                                                                                                                                            <div class="card-footer">
-                                                                                                                                                                                                <div class="row">
-                                                                                                                                                                                                    <div class="col-sm-4 border-right">
-                                                                                                                                                                                                        <div class="description-block">
-                                                                                                                                                                                                            <h5 class="description-header">
-                                                                                                                                                                                                                3,200
-                                                                                                                                                                                                            </h5>
-                                                                                                                                                                                                            <span class="description-text">
-                                                                                                                                                                                                                SALES
-                                                                                                                                                                                                            </span>
-                                                                                                                                                                                                        </div>
-                                                                                                                                                                                                        <!-- /.description-block -->
-                                                                                                                                                                                                    </div>
-                                                                                                                                                                                                    <!-- /.col -->
-                                                                                                                                                                                                    <div class="col-sm-4 border-right">
-                                                                                                                                                                                                        <div class="description-block">
-                                                                                                                                                                                                            <h5 class="description-header">
-                                                                                                                                                                                                                13,000
-                                                                                                                                                                                                            </h5>
-                                                                                                                                                                                                            <span class="description-text">
-                                                                                                                                                                                                                FOLLOWERS
-                                                                                                                                                                                                            </span>
-                                                                                                                                                                                                        </div>
-                                                                                                                                                                                                        <!-- /.description-block -->
-                                                                                                                                                                                                    </div>
-                                                                                                                                                                                                    <!-- /.col -->
-                                                                                                                                                                                                    <div class="col-sm-4">
-                                                                                                                                                                                                        <div class="description-block">
-                                                                                                                                                                                                            <h5 class="description-header">
-                                                                                                                                                                                                                35
-                                                                                                                                                                                                            </h5>
-                                                                                                                                                                                                            <span class="description-text">
-                                                                                                                                                                                                                PRODUCTS
-                                                                                                                                                                                                            </span>
-                                                                                                                                                                                                        </div>
-                                                                                                                                                                                                        <!-- /.description-block -->
-                                                                                                                                                                                                    </div>
-                                                                                                                                                                                                    <!-- /.col -->
-                                                                                                                                                                                                </div>
-                                                                                                                                                                                                <!-- /.row -->
-                                                                                                                                                                                            </div>
-                                                                                                                                                                                        </div>
-                                                                                                                                                                                        <!-- /.widget-user -->
-                                                                                                                                                                                    </div>
-                                                                                                                                                                                    <!-- /.col -->
-                                                                                                                                                                                    <div class="col-md-4">
-                                                                                                                                                                                        <!-- Widget: user widget style 1 -->
-                                                                                                                                                                                        <div class="card card-widget widget-user shadow-lg">
-                                                                                                                                                                                            <!-- Add the bg color to the header using any of the bg-* classes -->
-                                                                                                                                                                                            <div class="widget-user-header text-white"
-                                                                                                                                                                                                 style="background: url('/static/assets/img/photo1.png') center center;">
-                                                                                                                                                                                                <h3 class="widget-user-username text-right">
-                                                                                                                                                                                                    Elizabeth Pierce
-                                                                                                                                                                                                </h3>
-                                                                                                                                                                                                <h5 class="widget-user-desc text-right">
-                                                                                                                                                                                                    Web Designer
-                                                                                                                                                                                                </h5>
-                                                                                                                                                                                            </div>
-                                                                                                                                                                                            <div class="widget-user-image">
-                                                                                                                                                                                                <img class="img-circle"
-                                                                                                                                                                                                     src="/static/assets/img/user3-128x128.jpg"
-                                                                                                                                                                                                     alt="User Avatar">
-                                                                                                                                                                                                </div>
-                                                                                                                                                                                                <div class="card-footer">
-                                                                                                                                                                                                    <div class="row">
-                                                                                                                                                                                                        <div class="col-sm-4 border-right">
-                                                                                                                                                                                                            <div class="description-block">
-                                                                                                                                                                                                                <h5 class="description-header">
-                                                                                                                                                                                                                    3,200
-                                                                                                                                                                                                                </h5>
-                                                                                                                                                                                                                <span class="description-text">
-                                                                                                                                                                                                                    SALES
-                                                                                                                                                                                                                </span>
-                                                                                                                                                                                                            </div>
-                                                                                                                                                                                                            <!-- /.description-block -->
-                                                                                                                                                                                                        </div>
-                                                                                                                                                                                                        <!-- /.col -->
-                                                                                                                                                                                                        <div class="col-sm-4 border-right">
-                                                                                                                                                                                                            <div class="description-block">
-                                                                                                                                                                                                                <h5 class="description-header">
-                                                                                                                                                                                                                    13,000
-                                                                                                                                                                                                                </h5>
-                                                                                                                                                                                                                <span class="description-text">
-                                                                                                                                                                                                                    FOLLOWERS
-                                                                                                                                                                                                                </span>
-                                                                                                                                                                                                            </div>
-                                                                                                                                                                                                            <!-- /.description-block -->
-                                                                                                                                                                                                        </div>
-                                                                                                                                                                                                        <!-- /.col -->
-                                                                                                                                                                                                        <div class="col-sm-4">
-                                                                                                                                                                                                            <div class="description-block">
-                                                                                                                                                                                                                <h5 class="description-header">
-                                                                                                                                                                                                                    35
-                                                                                                                                                                                                                </h5>
-                                                                                                                                                                                                                <span class="description-text">
-                                                                                                                                                                                                                    PRODUCTS
-                                                                                                                                                                                                                </span>
-                                                                                                                                                                                                            </div>
-                                                                                                                                                                                                            <!-- /.description-block -->
-                                                                                                                                                                                                        </div>
-                                                                                                                                                                                                        <!-- /.col -->
-                                                                                                                                                                                                    </div>
-                                                                                                                                                                                                    <!-- /.row -->
-                                                                                                                                                                                                </div>
-                                                                                                                                                                                            </div>
-                                                                                                                                                                                            <!-- /.widget-user -->
-                                                                                                                                                                                        </div>
-                                                                                                                                                                                        <!-- /.col -->
-                                                                                                                                                                                    </div>
-                                                                                                                                                                                    <!-- /.row -->
-                                                                                                                                                                                </div>
-                                                                                                                                                                                <!-- /.container-fluid -->
-                                                                                                                                                                            </section>
-                                                                                                                                                                            <!-- /.content -->
-                                                                                                                                                                            <a id="back-to-top"
-                                                                                                                                                                               href="#"
-                                                                                                                                                                               class="btn btn-primary back-to-top"
-                                                                                                                                                                               role="button"
-                                                                                                                                                                               aria-label="Scroll to top">
-                                                                                                                                                                                <i class="fas fa-chevron-up"></i>
-                                                                                                                                                                            </a>
-                                                                                                                                                                        </div>
-                                                                                                                                                                        <!-- /.content-wrapper -->
-                                                                                                                                                                    {% endblock content %}
-                                                                                                                                                                    <!-- Specific Page JS goes HERE -->
-                                                                                                                                                                    {% block javascripts %}
-                                                                                                                                                                        <!-- jQuery -->
-                                                                                                                                                                        <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
-                                                                                                                                                                        <!-- Bootstrap 4 -->
-                                                                                                                                                                        <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-                                                                                                                                                                        <!-- AdminLTE App -->
-                                                                                                                                                                        <script src="/static/assets/js/adminlte.min.js"></script>
-                                                                                                                                                                        <!-- AdminLTE for demo purposes -->
-                                                                                                                                                                        <script src="/static/assets/js/demo.js"></script>
-                                                                                                                                                                    {% endblock javascripts %}
+                                    <div class="col-sm-4 border-right">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                13,000
+                                            </h5>
+                                            <span class="description-text">
+                                                FOLLOWERS
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
+                                    </div>
+                                    <!-- /.col -->
+                                    <div class="col-sm-4">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                35
+                                            </h5>
+                                            <span class="description-text">
+                                                PRODUCTS
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
+                                    </div>
+                                    <!-- /.col -->
+                                </div>
+                                <!-- /.row -->
+                            </div>
+                        </div>
+                        <!-- /.widget-user -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-4">
+                        <!-- Widget: user widget style 1 -->
+                        <div class="card card-widget widget-user">
+                            <!-- Add the bg color to the header using any of the bg-* classes -->
+                            <div class="widget-user-header text-white"
+                                 style="background: url('/static/assets/img/photo1.png') center center;">
+                                <h3 class="widget-user-username text-right">
+                                    Elizabeth Pierce
+                                </h3>
+                                <h5 class="widget-user-desc text-right">
+                                    Web Designer
+                                </h5>
+                            </div>
+                            <div class="widget-user-image">
+                                <img class="img-circle" src="/static/assets/img/user3-128x128.jpg" alt="User Avatar">
+                            </div>
+                            <div class="card-footer">
+                                <div class="row">
+                                    <div class="col-sm-4 border-right">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                3,200
+                                            </h5>
+                                            <span class="description-text">
+                                                SALES
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
+                                    </div>
+                                    <!-- /.col -->
+                                    <div class="col-sm-4 border-right">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                13,000
+                                            </h5>
+                                            <span class="description-text">
+                                                FOLLOWERS
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
+                                    </div>
+                                    <!-- /.col -->
+                                    <div class="col-sm-4">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                35
+                                            </h5>
+                                            <span class="description-text">
+                                                PRODUCTS
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
+                                    </div>
+                                    <!-- /.col -->
+                                </div>
+                                <!-- /.row -->
+                            </div>
+                        </div>
+                        <!-- /.widget-user -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <div class="row">
+                    <div class="col-md-6">
+                        <!-- Box Comment -->
+                        <div class="card card-widget">
+                            <div class="card-header">
+                                <div class="user-block">
+                                    <img class="img-circle"
+                                         src="/static/assets/img/user1-128x128.jpg"
+                                         alt="User Image">
+                                    <span class="username">
+                                        <a href="#">
+                                            Jonathan Burke Jr.
+                                        </a>
+                                    </span>
+                                    <span class="description">
+                                        Shared publicly - 7:30 PM Today
+                                    </span>
+                                </div>
+                                <!-- /.user-block -->
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" title="Mark as read">
+                                        <i class="far fa-circle"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <img class="img-fluid pad" src="/static/assets/img/photo2.png" alt="Photo">
+                                <p>
+                                    I took this photo this morning. What do you guys think?
+                                </p>
+                                <button type="button" class="btn btn-default btn-sm">
+                                    <i class="fas fa-share"></i>
+                                    Share
+                                </button>
+                                <button type="button" class="btn btn-default btn-sm">
+                                    <i class="far fa-thumbs-up"></i>
+                                    Like
+                                </button>
+                                <span class="float-right text-muted">
+                                    127 likes - 3 comments
+                                </span>
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer card-comments">
+                                <div class="card-comment">
+                                    <!-- User image -->
+                                    <img class="img-circle img-sm"
+                                         src="/static/assets/img/user3-128x128.jpg"
+                                         alt="User Image">
+                                    <div class="comment-text">
+                                        <span class="username">
+                                            Maria Gonzales
+                                            <span class="text-muted float-right">
+                                                8:03 PM Today
+                                            </span>
+                                        </span>
+                                        <!-- /.username -->
+                                        It is a long established fact that a reader will be distracted
+                                        by the readable content of a page when looking at its layout.
+                                    </div>
+                                    <!-- /.comment-text -->
+                                </div>
+                                <!-- /.card-comment -->
+                                <div class="card-comment">
+                                    <!-- User image -->
+                                    <img class="img-circle img-sm"
+                                         src="/static/assets/img/user4-128x128.jpg"
+                                         alt="User Image">
+                                    <div class="comment-text">
+                                        <span class="username">
+                                            Luna Stark
+                                            <span class="text-muted float-right">
+                                                8:03 PM Today
+                                            </span>
+                                        </span>
+                                        <!-- /.username -->
+                                        It is a long established fact that a reader will be distracted
+                                        by the readable content of a page when looking at its layout.
+                                    </div>
+                                    <!-- /.comment-text -->
+                                </div>
+                                <!-- /.card-comment -->
+                            </div>
+                            <!-- /.card-footer -->
+                            <div class="card-footer">
+                                <form action="#" method="post">
+                                    <img class="img-fluid img-circle img-sm"
+                                         src="/static/assets/img/user4-128x128.jpg"
+                                         alt="Alt Text">
+                                    <!-- .img-push is used to add margin to elements next to floating images -->
+                                    <div class="img-push">
+                                        <input type="text"
+                                               class="form-control form-control-sm"
+                                               placeholder="Press enter to post comment">
+                                    </div>
+                                </form>
+                            </div>
+                            <!-- /.card-footer -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-6">
+                        <!-- Box Comment -->
+                        <div class="card card-widget">
+                            <div class="card-header">
+                                <div class="user-block">
+                                    <img class="img-circle"
+                                         src="/static/assets/img/user1-128x128.jpg"
+                                         alt="User Image">
+                                    <span class="username">
+                                        <a href="#">
+                                            Jonathan Burke Jr.
+                                        </a>
+                                    </span>
+                                    <span class="description">
+                                        Shared publicly - 7:30 PM Today
+                                    </span>
+                                </div>
+                                <!-- /.user-block -->
+                                <div class="card-tools">
+                                    <button type="button" class="btn btn-tool" title="Mark as read">
+                                        <i class="far fa-circle"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="collapse">
+                                        <i class="fas fa-minus"></i>
+                                    </button>
+                                    <button type="button" class="btn btn-tool" data-card-widget="remove">
+                                        <i class="fas fa-times"></i>
+                                    </button>
+                                </div>
+                                <!-- /.card-tools -->
+                            </div>
+                            <!-- /.card-header -->
+                            <div class="card-body">
+                                <!-- post text -->
+                                <p>
+                                    Far far away, behind the word mountains, far from the
+                                    countries Vokalia and Consonantia, there live the blind
+                                    texts. Separated they live in Bookmarksgrove right at
+                                </p>
+                                <p>
+                                    the coast of the Semantics, a large language ocean.
+                                    A small river named Duden flows by their place and supplies
+                                    it with the necessary regelialia. It is a paradisematic
+                                    country, in which roasted parts of sentences fly into
+                                    your mouth.
+                                </p>
+                                <!-- Attachment -->
+                                <div class="attachment-block clearfix">
+                                    <img class="attachment-img"
+                                         src="/static/assets/img/photo1.png"
+                                         alt="Attachment Image">
+                                    <div class="attachment-pushed">
+                                        <h4 class="attachment-heading">
+                                            <a href="https://www.lipsum.com/">
+                                                Lorem ipsum text generator
+                                            </a>
+                                        </h4>
+                                        <div class="attachment-text">
+                                            Description about the attachment can be placed here.
+                                            Lorem Ipsum is simply dummy text of the printing and typesetting industry...
+                                            <a href="#">
+                                                more
+                                            </a>
+                                        </div>
+                                        <!-- /.attachment-text -->
+                                    </div>
+                                    <!-- /.attachment-pushed -->
+                                </div>
+                                <!-- /.attachment-block -->
+                                <!-- Social sharing buttons -->
+                                <button type="button" class="btn btn-default btn-sm">
+                                    <i class="fas fa-share"></i>
+                                    Share
+                                </button>
+                                <button type="button" class="btn btn-default btn-sm">
+                                    <i class="far fa-thumbs-up"></i>
+                                    Like
+                                </button>
+                                <span class="float-right text-muted">
+                                    45 likes - 2 comments
+                                </span>
+                            </div>
+                            <!-- /.card-body -->
+                            <div class="card-footer card-comments">
+                                <div class="card-comment">
+                                    <!-- User image -->
+                                    <img class="img-circle img-sm"
+                                         src="/static/assets/img/user3-128x128.jpg"
+                                         alt="User Image">
+                                    <div class="comment-text">
+                                        <span class="username">
+                                            Maria Gonzales
+                                            <span class="text-muted float-right">
+                                                8:03 PM Today
+                                            </span>
+                                        </span>
+                                        <!-- /.username -->
+                                        It is a long established fact that a reader will be distracted
+                                        by the readable content of a page when looking at its layout.
+                                    </div>
+                                    <!-- /.comment-text -->
+                                </div>
+                                <!-- /.card-comment -->
+                                <div class="card-comment">
+                                    <!-- User image -->
+                                    <img class="img-circle img-sm"
+                                         src="/static/assets/img/user5-128x128.jpg"
+                                         alt="User Image">
+                                    <div class="comment-text">
+                                        <span class="username">
+                                            Nora Havisham
+                                            <span class="text-muted float-right">
+                                                8:03 PM Today
+                                            </span>
+                                        </span>
+                                        <!-- /.username -->
+                                        The point of using Lorem Ipsum is that it hrs a morer-less
+                                        normal distribution of letters, as opposed to using
+                                        'Content here, content here', making it look like readable English.
+                                    </div>
+                                    <!-- /.comment-text -->
+                                </div>
+                                <!-- /.card-comment -->
+                            </div>
+                            <!-- /.card-footer -->
+                            <div class="card-footer">
+                                <form action="#" method="post">
+                                    <img class="img-fluid img-circle img-sm"
+                                         src="/static/assets/img/user4-128x128.jpg"
+                                         alt="Alt Text">
+                                    <!-- .img-push is used to add margin to elements next to floating images -->
+                                    <div class="img-push">
+                                        <input type="text"
+                                               class="form-control form-control-sm"
+                                               placeholder="Press enter to post comment">
+                                    </div>
+                                </form>
+                            </div>
+                            <!-- /.card-footer -->
+                        </div>
+                        <!-- /.card -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+                <!-- =========================================================== -->
+                <h5 class="mb-2">
+                    Custom Shadows Variations
+                    <small>
+                    <i>
+                    Using Bootstrap's Shadow Utility
+                    </i>
+                    </small>
+                </h5>
+                <div class="row">
+                    <div class="col-md-4">
+                        <!-- Widget: user widget style 2 -->
+                        <div class="card card-widget widget-user-2 shadow-sm">
+                            <!-- Add the bg color to the header using any of the bg-* classes -->
+                            <div class="widget-user-header bg-warning">
+                                <div class="widget-user-image">
+                                    <img class="img-circle elevation-2"
+                                         src="/static/assets/img/user7-128x128.jpg"
+                                         alt="User Avatar">
+                                </div>
+                                <!-- /.widget-user-image -->
+                                <h3 class="widget-user-username">
+                                    Nadia Carmichael
+                                </h3>
+                                <h5 class="widget-user-desc">
+                                    Lead Developer
+                                </h5>
+                            </div>
+                            <div class="card-footer p-0">
+                                <ul class="nav flex-column">
+                                    <li class="nav-item">
+                                        <a href="#" class="nav-link">
+                                            Projects
+                                            <span class="float-right badge bg-primary">
+                                                31
+                                            </span>
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a href="#" class="nav-link">
+                                            Tasks
+                                            <span class="float-right badge bg-info">
+                                                5
+                                            </span>
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a href="#" class="nav-link">
+                                            Completed Projects
+                                            <span class="float-right badge bg-success">
+                                                12
+                                            </span>
+                                        </a>
+                                    </li>
+                                    <li class="nav-item">
+                                        <a href="#" class="nav-link">
+                                            Followers
+                                            <span class="float-right badge bg-danger">
+                                                842
+                                            </span>
+                                        </a>
+                                    </li>
+                                </ul>
+                            </div>
+                        </div>
+                        <!-- /.widget-user -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-4">
+                        <!-- Widget: user widget style 1 -->
+                        <div class="card card-widget widget-user shadow">
+                            <!-- Add the bg color to the header using any of the bg-* classes -->
+                            <div class="widget-user-header bg-info">
+                                <h3 class="widget-user-username">
+                                    Alexander Pierce
+                                </h3>
+                                <h5 class="widget-user-desc">
+                                    Founder & CEO
+                                </h5>
+                            </div>
+                            <div class="widget-user-image">
+                                <img class="img-circle elevation-2"
+                                     src="/static/assets/img/user1-128x128.jpg"
+                                     alt="User Avatar">
+                            </div>
+                            <div class="card-footer">
+                                <div class="row">
+                                    <div class="col-sm-4 border-right">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                3,200
+                                            </h5>
+                                            <span class="description-text">
+                                                SALES
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
+                                    </div>
+                                    <!-- /.col -->
+                                    <div class="col-sm-4 border-right">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                13,000
+                                            </h5>
+                                            <span class="description-text">
+                                                FOLLOWERS
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
+                                    </div>
+                                    <!-- /.col -->
+                                    <div class="col-sm-4">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                35
+                                            </h5>
+                                            <span class="description-text">
+                                                PRODUCTS
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
+                                    </div>
+                                    <!-- /.col -->
+                                </div>
+                                <!-- /.row -->
+                            </div>
+                        </div>
+                        <!-- /.widget-user -->
+                    </div>
+                    <!-- /.col -->
+                    <div class="col-md-4">
+                        <!-- Widget: user widget style 1 -->
+                        <div class="card card-widget widget-user shadow-lg">
+                            <!-- Add the bg color to the header using any of the bg-* classes -->
+                            <div class="widget-user-header text-white"
+                                 style="background: url('/static/assets/img/photo1.png') center center;">
+                                <h3 class="widget-user-username text-right">
+                                    Elizabeth Pierce
+                                </h3>
+                                <h5 class="widget-user-desc text-right">
+                                    Web Designer
+                                </h5>
+                            </div>
+                            <div class="widget-user-image">
+                                <img class="img-circle" src="/static/assets/img/user3-128x128.jpg" alt="User Avatar">
+                            </div>
+                            <div class="card-footer">
+                                <div class="row">
+                                    <div class="col-sm-4 border-right">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                3,200
+                                            </h5>
+                                            <span class="description-text">
+                                                SALES
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
+                                    </div>
+                                    <!-- /.col -->
+                                    <div class="col-sm-4 border-right">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                13,000
+                                            </h5>
+                                            <span class="description-text">
+                                                FOLLOWERS
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
+                                    </div>
+                                    <!-- /.col -->
+                                    <div class="col-sm-4">
+                                        <div class="description-block">
+                                            <h5 class="description-header">
+                                                35
+                                            </h5>
+                                            <span class="description-text">
+                                                PRODUCTS
+                                            </span>
+                                        </div>
+                                        <!-- /.description-block -->
+                                    </div>
+                                    <!-- /.col -->
+                                </div>
+                                <!-- /.row -->
+                            </div>
+                        </div>
+                        <!-- /.widget-user -->
+                    </div>
+                    <!-- /.col -->
+                </div>
+                <!-- /.row -->
+            </div>
+            <!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+        <a id="back-to-top" href="#" class="btn btn-primary back-to-top" role="button" aria-label="Scroll to top">
+            <i class="fas fa-chevron-up"></i>
+        </a>
+    </div>
+    <!-- /.content-wrapper -->
+{% endblock content %}
+<!-- Specific Page JS goes HERE -->
+{% block javascripts %}
+    <!-- jQuery -->
+    <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
+    <!-- Bootstrap 4 -->
+    <script src="/static/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <!-- AdminLTE App -->
+    <script src="/static/assets/js/adminlte.min.js"></script>
+    <!-- AdminLTE for demo purposes -->
+    <script src="/static/assets/js/demo.js"></script>
+{% endblock javascripts %}