{% if blocks is defined and blocks['cms_snippets'] is defined  and blocks['cms_snippets']|length > 0 %}
    {% set counter = 1 %}
    {% set total = blocks['cms_snippets']|length %}
    {% for block in blocks['cms_snippets'] %}
        {% set alignClass = 'fade-left' %}
        {% set orderClass = 'me-auto' %}
        {% if counter is odd  %}
            {% set alignClass = 'fade-right' %}
            {% set orderClass = 'ms-auto order-2' %}
        {% endif %}


        {% set summaryDots = '' %}

        {% set pageContent = block.content|default("")|raw|replace({' ':' '}) %}

        {% if pageContent|striptags|length > 500 %}
            {% set summaryDots = '...' %}
        {% endif %}

        <section class="section pb-0 {% if counter is same as(1) %}pt-3{% endif %} {% if counter is same as(total) %}pb-3{% endif %} ">
            <div class="container">
                <div class="row equal">
                    <div class="col-md-6 {{ orderClass }} my-lg-auto text-center align-middle acba-blue-font pt-5 px-5">
                        <h2 class="mb-4">{{ block.title }}</h2>
                        <p class="mb-4">{{ pageContent|striptags|slice(0, 500)  ~ summaryDots }}</p>
                        <p>

                            {% if block.link is not null %}
                                <a class="btn btn-secondary acba-blue-bg rounded-pill" href="{{ block.link }}">Read More</a>
                            {% else %}
                                <a class="btn btn-secondary acba-blue-bg rounded-pill" href="{{ path('block_view_page', {'pageId':block.id, 'title': block.title}) }}">Read More</a>
                            {% endif %}
                        </p>
                    </div>
                    <div class="col-md-6 overflow-hidden alternating-image-container image-hover-effect" data-aos="{{ alignClass }}">
                        <div class="row">
                        {% if block.imagePath is not null %}
                            <img  class="p-0 m-0"
                                 src="{{ asset(blockImagesDirectory ~ block.imagePath) }}"
                                 alt="Content Image Removed"
                            />
                        {% endif %}
                        </div>
                    </div>
                </div>
            </div>
        </section>
        {% set counter = counter + 1 %}
    {% endfor %}
{% endif %}