{% load i18n %}
{% load static %}

{% if carousel_items %}

<div id="my-slider" class="owl-carousel owl-theme">

    {% for item in carousel_items %}
    <div class="item">
        <div class="it-hero-wrapper {% if item.heading %} it-dark {% endif %} it-overlay">

          <!-- - img-->
          <div class="img-responsive-wrapper">
            <div class="img-responsive">
                <div class="img-wrapper">
                    <img src="{{ item.image.file.url }}" title="{{ item.image.name }}" alt="{{ item.image.name }}">
                </div>
            </div>
          </div>

          <!-- - texts-->
          <div class="container">
            <div class="row">
                <div class="col-12">
                  <div class="it-hero-text-wrapper {% if item.heading %} bg-dark {% endif %}">
                      <span class="it-category">{{ item.pre_heading|default_if_none:"" }}</span>
                      <h1 class="no_toc">{{ item.heading|default_if_none:"" }}</h1>
                      <p class="d-none d-lg-block">{{ item.description|default_if_none:"" }}</p>
                      {% for link in item.get_links %}
                        <div class="it-btn-container">
                            <a class="btn btn-sm btn-secondary" href="{{ link.url }}">
                                {{ link.get_title }}
                            </a>
                        </div>
                      {% endfor %}
                  </div>
                </div>
            </div>
          </div>

        </div>
    </div>
    {% endfor %}


</div>








{% endif %}