{% if products %} <section id="{{ id }}" class=" {{ class }} section-grey position-relative overflow-hidden"> <img src="{{ asset('assets/img/Motif.png') }}" alt="background motif" class="uexpmv w-100 b-0 l-0 img-fit position-absolute"/> <div class="position-relative zi-9"> <div data-aos="fade-up" data-aos-duration="800" data-aos-delay='200' class="surtitle text-center c-204A9A mab-20 fs-16 fw-600 text-uppercase ls-custom2"> {{ surTitle|trans }} </div> <h3 data-aos="fade-up" data-aos-duration="800" data-aos-delay='400' class="text-center mawi-440 d-table mx-auto c-333333 fs-38 fw-700 mat-0 mab-70 position-relative"> <img src="{{ asset('assets/img/points.svg') }}" class="position-absolute grayscale2 t--20 l--20 zi-0" alt="points icon"/> {{ title }}</h3> <div data-aos="fade-up" data-aos-duration="800" data-aos-delay='600' class="container"> <div class="position-relative"> {% if products|length > 3 %} <div class="pointer prev-{{arrows}}-rel-slid position-absolute l--30-sm l-0 zi-99 t-0 b-40 d-flex align-items-center justify-content-center"> <img src="{{ asset('assets/img/next-arrow.svg') }}" alt="prev arrow" class="rot-180"/> </div> <div class="pointer next-{{arrows}}-rel-slid position-absolute r--30-sm r-0 zi-99 t-0 b-40 d-flex align-items-center justify-content-center"> <img src="{{ asset('assets/img/next-arrow.svg') }}" alt="next arrow"/> </div> {% endif %} <div class="slick-{{id}} justify-content-center "> {% include "front/productsList.html.twig" with {'sliderProduct' : true,'products':products,'categoryActive':subCategory.category} %} </div> </div> </div> </div> </section>{% endif %}