{# Template : How it works #}


{% extends ('layouts/' ~ page_meta.layout) %}

{% block content %}


    {#  
    {% include 'navigation/breadcrumbs.twig' %}
    #}

    {% include 'includes/page_blocks/title_banner.twig' with {
        banner: p.pagedata['Title Banner'][0],
        dark_background: false,
        class: 'howitworksPageHeader',
        class: 'lightBg'
    }%}

    
    {% if p.pagedata['Image Banner'][0]['Title']['value'] is not empty %}

        <div class="imageBannersWrap">

            {% set banners = p.pagedata['Image Banner'] %}

            {% for banner in banners %}

                {% set image_pos = 'right' %}

                {% if loop.index is even %}
                    {% set image_pos = 'left' %}
                {% endif %}

                {% include 'includes/page_blocks/image_banner.twig' with {
                    image_position: image_pos,
                    show_testimonial: false,
                    banner: banner
                }%}

            {% endfor %}

        </div><!-- .imageBannersWrap -->
        
    {% endif %}

    {% include 'includes/page_blocks/cta_banner.twig' with {
        dark_background: false,
        title: p.pagedata['CTA Banner'][0]['Title']['value'],
        content: p.pagedata['CTA Banner'][0]['Content']['value'],
        small_mode: true
    }%}

    {% include 'includes/page_blocks/sidebar_tabs.twig' with {
        tabs: description_tabs,
        class: 'aboutTabs',
        disable_tab_titles: true
    }%}



{% endblock %}
