{# BLOCK HOTSPOT #}
{% import 'blocks\\settings.default.html.twig' as styles %}
<section class="block-hotspot {{ settings.extra_class|default }}" {% if settings.extra_block_id|default %} id="{{ settings.extra_block_id|default}}" {% endif %} >
    <div class="container">   
        <div class="hotspot-container">
            <img src="{{ fields.hotspot_image|imagine_filter('bannerbig') }}" class="img-fluid hotspot-image">
            {{ fields.hotspot_image_content|raw }}
            {% for item in repeatable %}
            <div class="hotspot-box" data-hotspotid="{{item.input_hotspot_id}}" data-skin="{{item.icon}}">
                <div class="hotspot-body">
                    {% if item.image %}
                    <img src="{{ item.image|imagine_filter('small')|urldecode }}" class="object-fit-cover" alt="{{ item.image_alt|default }}" {% if item.image_title|default %} title="{{ item.image_title}}"{% endif %}>
                    {% endif %}
                    <h3>{{item.title|default}}</h3>
                    <div>{{item.text|default|raw}}</div>
                    {% if item.link|default %}
                    {% set pageInfo=get_page_info(app.request.locale, item.link) %}	
                        <a href="{{ pageInfo.url }}" class="btn {{settings.btn_style|default('btn-primary')}}">{{item.label}}</a>
                    {% endif %} 
                </div>
            </div>
            {% endfor %}
        </div>
    </div>
</section>
{# @END BLOCK #}