{% for key, productParagraph in productParagraphs %} <div class="may-160-lg may-100-md may-70-sm may-40 text-center text-md-left"> <div class="row align-items-stretch {% if loop.index is odd %}flex-row-reverse{% endif %}"> <div data-aos="fade-{% if loop.index is odd %}left{% else%}right{% endif %}" data-aos-duration="800" class="col-md-5 fs-15 fw-500 pay-60-md pay-30 d-flex align-items-center c-8E9094 lh2-19 {% if loop.index is odd %}offset-md-1{% endif %}"> <div> <h4 class="c-333333 fs-38 fw-700 mat-0 mab-35 position-relative"> {{ productParagraph.title }} </h4> <div class="c-8E9094 fs-15 lh2-19"> {{ productParagraph.content|raw|nl2br }} </div> {% if productParagraph.link %} <a class="c-9DC771 d-block mat-20 tdl-underline fw-600" href="{{ productParagraph.link }}" target="_blank"> {{ productParagraph.linkName }} </a> {% endif %} </div> </div> <div data-aos="fade-{% if loop.index is odd %}right{% else%}left{% endif %}" data-aos-duration="800" class="col-md-6 br-20 position-relative {% if loop.index is even %}offset-md-1{% endif %}"> <div class="br-20 bgc-EEF2F5 position-relative pay-70 h-100 d-flex align-items-center justify-content-center pax-20 text-center"> <img src="{{ asset('assets/img/bg_support.png') }}" alt="bg_support" class="overlay br-20 position-absolute t-0 h-100 w-100 l-0"/> <img src="{{ asset('assets/img/points.svg') }}" class="position-absolute grayscale2 t-40 r--20 zi-0" alt="points icon"/> <img src="{{ asset(vich_uploader_asset(productParagraph, 'productParagraphFile'))|imagine_filter('medium') }}" alt="{{ productParagraph.title }}" class=" "/> {# <img src="{{ asset(vich_uploader_asset(presentationParagraph, 'presentationParagraphFile'))|imagine_filter('medium') }}" alt="View Point" class="br-20 "/>#} </div> </div> </div> </div>{% endfor %}