{% if promotion.images %}
    <div class="container">
        <div id="{{ promotion.name|slugify }}" class="carousel slide">
            <ol class="carousel-indicators">
                {% for promotion_image in promotion.images.all %}
                    <li data-target="#{{ promotion.name|slugify }}" data-slide-to="{{ forloop.counter0 }}"
                        class="{% if forloop.first %}active{% endif %}"></li>
                {% endfor %}
            </ol>

            <div class="carousel-inner">
                {% for promotion_image in promotion.images.all %}
                    <div class="item {% if forloop.first %}active{% endif %}">
                        {% if promotion_image.link_url %}
                            <a href="{{ promotion_image.link_url }}"><img src="{{ promotion_image.image.url }}"
                                                                          title="{{ promotion_image.name }}"/></a>
                        {% else %}
                            <img src="{{ promotion_image.image.url }}" title="{{ promotion_image.name }}"/>
                        {% endif %}
                    </div>
                {% endfor %}
            </div>

            <a class="carousel-control left" href="#{{ promotion.name|slugify }}" data-slide="prev">&lsaquo;</a>
            <a class="carousel-control right" href="#{{ promotion.name|slugify }}" data-slide="next">&rsaquo;</a>
        </div>
    </div>
{% endif %}