<section id="slider-hero" class="z-0 swiper-container swiper-hero h-132 relative w-full"> <div class="swiper-wrapper"> {% for encart in encarts %} <div class="swiper-slide"> <img class="w-full h-full object-cover object-top" src="{{ ('encarts/'~encart.image) | imagine_filter('xl') }}" alt=""> </div> {% endfor %} </div> <div class="z-10 absolute top-1/4 sm:top-15p lg:y-center x-center sm:transform-none sm:left-28 lg:left-24 xl:left-64 text-white w-full sm:w-1/2 sm:w-2/5 lg:w-1/3 px-8 sm:px-0"> <h1 class=" text-white text-3xl sm:text-4xl md:text-5xl xl:text-6xl ">{{ 'COORDONNEES_NOM'|trans() }}</h1> <p>{{ 'LG_ACCUEIL_ASSOCIATION'|trans({'fr':'Association pour le Bilinguisme en Classe dès la Maternelle'}) }}</p> <p class="mt-12 mb-4 leading-6 tracking-wider font-semibold text-xl">{{ 'LG_ACCUEIL_PRECURSEUR'|trans({'fr':'Précurseur de l\'enseignement bilingue en Alsace et en Moselle.'}) }}</p> <a class="bg-secondary text-white px-10 py-1 rounded-2xl hover:bg-secondary-500 transitioning hover:text-white" href="{{ path('trouver-ecole') }}">{{ 'LG_NOS_ECOLES'|trans({'fr':'Nos écoles'}) }}</a> </div> <div class="swiper-part-pagination absolute z-10 cursor-pointer"></div></section>