<div class="container" id="circuits"> <div class="fancy-title title-border title-center mb-5"> <h4 id="explore-more-elements" class="h3" data-onepage-settings="{"offset":60,"speed":1250,"easing":false}"> <a href="icons.html" class="btn btn-warning btn-lg">Nos Circuits<i class="bi-arrow-right ms-2" style="position: relative; top: 1px;"></i> </a> </h4> </div> <div class="row"> {% for circuit in circuits %} <div class="row col-lg-4 col-md-6 "> <article class="entry event col-12 mb-0"> <div class="grid-inner bg-white row g-0 p-3 border-0 rounded-5 shadow-sm h-shadow all-ts h-translate-y-sm"> <div class="col-12 mb-md-0"> <a href="{{ path('frontend_circuit_detail', {'alias': circuit.alias}) }}" class="entry-image"> <img src="{{ asset('uploads/') ~ circuit.image }}" alt="Inventore voluptates velit totam ipsa tenetur" class="rounded-2"> <div class="bg-overlay"> <div class="bg-overlay-content justify-content-start align-items-start"> <div class="badge bg-danger text-light rounded-pill">{{ circuit.difficulty }}</div> </div> </div> </a> </div> <div class="col-12 p-4 pt-0"> <div class="entry-meta no-separator mb-1 mt-0"> </div> <div class="entry-title nott"> <h3> <a href="{{ path('frontend_circuit_detail', {'alias': circuit.alias}) }}">{{ circuit.title }}</a> </h3> </div> <div class="entry-content my-3"> <p class="mb-0">{{ circuit.shortdescription | raw }}.</p> </div> <div class="entry-meta no-separator"> <ul> <li><a href="#" class="fw-normal"><i class="fa-solid fa-route"></i>{{ circuit.distance }}Km</a></li> <li><a href="#" class="fw-normal"><i class="fa-solid fa-clock"></i>{{ circuit.duration }}</a></li> </ul> </div> </div> </div> </article> </div> {% endfor %} </div></div>