{% if pages is not empty %}
    <div class="widget clearfix hidden-xs">

        <div class="widget-title">
            <a class="collapse-widget" href="#{{ target_widget }}" data-toggle="collapse" aria-expanded="true">{{ slider_title }}</a>
        </div><!-- end title -->
        <div class="boxwidget collapse in" id="{{ target_widget }}" aria-expanded="true">

            <div class="box-slider">
                {% for page in pages %}

                    <div class="travel-wrapper slide{{ loop.first ? ' active' }}">

                        <a href="{{ page.urlPath|default('javascript:void(0);') }}" class="item text-center">
                            <div class="item-img">
                                {% include 'default/components/pageBoxImage.html.twig' %}
                            </div>

                            <div class="box_mid">
                                <div class="hl5">{{ page.title }}</div>

                                <p>{{ page.boxBody ?? page.description }}</p>

                                {% if page.travelProgram is not empty and page.travelProgram.lowestPrice > 0 %}
                                    <div class="price">
                                        Für {{ page.travelProgram.lowestPrice|number_format }},- € p.P.
                                    </div>
                                {% endif %}
                            </div>
                        </a>

                    </div><!-- end travel-wrapper -->
                {% endfor %}

                <div class="item-switch clearfix">
                    <a href="javascript:void(0);" class="item-button-prev">zurück</a>
                    <a href="javascript:void(0);" class="item-button-next">weiter</a>
                </div>
            </div>
        </div>

    </div><!-- end widget -->
{% endif %}