<!-- ============================================== FEATURED PRODUCTS ============================================== -->
<section class="section new-arriavls  outer-bottom">
   <h3 class="section-title">Featured Products</h3>
   <div class="owl-carousel home-owl-carousel custom-carousel owl-theme outer-top-xs">


        {% for annonce in showAnnonce.annonces %}
            
            <div class="item item-carousel">
                <div class="products">
                    <div class="product">
                    <div class="product-image">
                        <div class="image"> 
                            <a href="{{ path('frontend_annonce_detail', {id:annonce.getId()} ) }}">
                            <img src="{{ asset('uploads/images/annonces/' ~ annonce.getImageHome()) }}" alt="{{ annonce.getTitre() }}"> 
                            <img src="{{ asset('uploads/images/annonces/' ~ annonce.getImageSearch()) }}" alt="{{ annonce.getTitre() }}" class="hover-image">
                            </a>
                        </div>
                        <!-- /.image -->
                        <div class="tag new"><span>new</span></div>
                    </div>
                    <!-- /.product-image -->
                    <div class="product-info text-left">
                        <h3 class="name"><a href="{{ path('frontend_annonce_detail', {id:annonce.getId()} ) }}">{{ annonce.getTitre() }}</a></h3>
                        <div class="rating rateit-small"></div>
                        <div class="description"></div>
                        <div class="product-price"> <span class="price"> {{ annonce.getPrixPromo() }} </span> <span class="price-before-discount">{{ annonce.getPrixMarche() }}</span> </div>
                        <!-- /.product-price --> 
                    </div>
                    <!-- /.product-info -->
                    <div class="cart clearfix animate-effect">
                        <div class="action">
                            <ul class="list-unstyled">
                                <li class="add-cart-button btn-group">
                                <button class="btn btn-primary icon" data-toggle="dropdown" type="button"> <i class="fa fa-shopping-cart"></i> </button>
                                <button class="btn btn-primary cart-btn" type="button">Add to cart</button>
                                </li>
                                <li class="lnk wishlist"> <a class="add-to-cart" href="detail.html" title="Wishlist"> <i class="icon fa fa-heart"></i> </a> </li>
                                <li class="lnk"> <a class="add-to-cart" href="detail.html" title="Compare"> <i class="fa fa-signal" aria-hidden="true"></i> </a> </li>
                            </ul>
                        </div>
                        <!-- /.action --> 
                    </div>
                    <!-- /.cart --> 
                    </div>
                    <!-- /.product --> 
                </div>
                <!-- /.products --> 
            </div>
            <!-- /.item -->
        {% endfor %}
      
   </div>
   <!-- /.home-owl-carousel --> 
</section>
<!-- /.section --> 
<!-- ============================================== FEATURED PRODUCTS : END ============================================== -->
