description = "Retail"
==
{# RETAIL #}
<section id="retail" class="space-py-8 bg-primary-light overflow-hidden">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-lg-7">
                <header class="mb-3">
                    <div class="section__preheading">{{ this.theme.retail_pretitle }}</div>
                    <h2 class="mb-0">{{ this.theme.retail_title }}</h2>
                </header>
                <div class="pr-0 pr-lg-3 h-100 overflow-hidden">
                    {{ this.theme.retail_text|raw }}
                </div>
            </div>
            <div class="col-lg-5 mt-2 mt-lg-0">
                <div class="position-relative">
                    <div data-aos="fade-up" data-aos-once="true" class="shop__card bg-white corner-shape-lg elevation-1dp position-relative space-p-4 h-100 d-flex flex-column justify-content-center">
                        <ul class="list-unstyled mb-0">
                            {% if this.theme.address %}
                                <li class="d-flex mb-2"><i style="line-height:1.6;" class="text-primary flex-shrink-0 fa-fw fas fa-map-marker-alt"></i>
                                    <div class="ml-2">
                                        <a data-fancybox="" data-animation-effect="fade" data-options="{'iframe' : {'css' : {'width' : '80%', 'height' : '80%'}}}" href="https://www.google.com/maps/search/?api=1&amp;query={{ this.theme.map_search_parameters }}">
                                            <address class="mb-0">
                                                {{ this.theme.address|nl2br }}    
                                            </address>
                                        </a>
                                    </div>
                                </li>
                            {% endif %}
                            {% if this.theme.phone %}
                                <li class="d-flex mb-2"><i style="line-height:1.6;" class="text-primary flex-shrink-0 fa-fw fas fa-phone-alt"></i><div class="ml-2 text-truncate"><a href="tel:{{ this.theme.phone }}">{{ this.theme.phone }}</a></div></li>
                            {% endif %}
                            {% if this.theme.mobile %}
                                <li class="d-flex mb-2"><i style="line-height:1.6;" class="text-primary flex-shrink-0 fa-fw fas fa-mobile-alt"></i><div class="ml-2 text-truncate"><a href="tel:{{ this.theme.mobile }}">{{ this.theme.mobile }}</a></div></li>
                            {% endif %}
                            {% if this.theme.fax %}
                                <li class="d-flex mb-2"><i style="line-height:1.6;" class="text-primary flex-shrink-0 fa-fw fas fa-fax"></i><div class="ml-2 text-truncate"><a href="tel:{{ this.theme.fax }}">{{ this.theme.fax }}</a></div></li>
                            {% endif %}
                            {% if this.theme.email %}
                                <li class="d-flex mb-2"><i style="line-height:1.6;" class="text-primary flex-shrink-0 fa-fw fas fa-envelope"></i><div class="ml-2 text-truncate"><a href="mailto:{{ this.theme.email }}">{{ this.theme.email }}</a></div></li>
                            {% endif %}
                            {% if this.theme.working_hours %}
                                <li class="d-flex mb-2"><i style="line-height:1.6;" class="text-primary flex-shrink-0 fa-fw fas fa-clock"></i><div class="ml-2">{{ this.theme.working_hours|nl2br }}</div></li>
                            {% endif %}
                        </ul>
                        {% if this.theme.retail_button_text %}
                            <a {{ this.theme.retail_button_new_tab_enable ? 'target="_blank" rel="noopener noreferrer"' : '' }} href="{{ this.theme.retail_button_link }}" class="mt-4 btn btn-primary">{% if this.theme.retail_button_icon != '' %}<i class="{{ this.theme.retail_button_icon }}"></i> {% endif %}{{ this.theme.retail_button_text }}</a>
                        {% endif %}
                    </div>
                    {% partial 'global/dots' class="shop-figure" %}
                </div>
            </div>
        </div>
    </div>
</section>
