{% extends 'main_base.html.twig' %}
{% block styles %}{% endblock %}
{% block content %}
    <section class="position-relative" id="banner">
        <img src="{{ asset('assets/main/img/basindan-banner.png') }}" alt="Banner" class="img-fluid w-100">
        <div class="position-absolute start-0 bottom-0 w-100">
            <div class="container-90 px-20">
                <ol class="breadcrumb pb-2">
                    <li class="breadcrumb-item"><a href="#" class="text-white">ANASAYFA</a></li>
                    <li class="breadcrumb-item text-dark">BASINDAN</li>
                </ol>
            </div>
        </div>
    </section>
    <section class="bg-white py-20">
        <div class="container-90">
            <div class="row">
                <div class="col-lg-10">
                    <div class="row">
                        {% for i in 1..9 %}
                            <div class="col-lg-4 animate__animated" data-animate="animate__fadeInUp">
                                <div class="d-flex">
                                    <div>
                                        <div class="p-3 bg-dark fs-8 text-end text-white">24 Ekim</div>
                                        <a href="" class="d-block py-3 bg-success text-center">
                                            <img src="{{ asset('assets/main/img/paylas.png') }}" width="21" height="21" alt="paylaş">
                                        </a>
                                    </div>
                                    <div class="text-primary text-hover-dark">
                                        <a href="{{ path('app_main_basin_detay') }}" class="text-reset">
                                        <img src="{{ asset('assets/main/img/webrazzi.png') }}" alt="" class="w-100 object-cover">
                                        <p class="mt-5 fs-5">
                                            Kadim bir geçmişin yetiştirdiği nesillerin
                                            farklı amaçlar ancak aynı merak duygu
                                            suyla ürettikleri Teknolojik fikirler;
                                        </p>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        {% endfor %}
                    </div>
                </div>
                <div class="col-lg-2">
                    <div class="card bg-success bg-hover-dark text-dark text-hover-success">
                        <div class="card-body py-20">
                            <h5 class="fw-normal text-white">FONUNIQ</h5>
                            <p class="fs-3">
                                Özel kampanyaları,
                                hizmet ve gelişmelerden
                                haberdar olmak için sosyal
                                medya hesaplarımızdan
                                bizi takip edebilirsiniz.
                            </p>
                            <div class="mt-3">
                                <a href=""><img src="{{ asset('assets/main/img/linkedin.png') }}" width="36" height="34" alt="linkedin"></a>
                                <a href=""><img src="{{ asset('assets/main/img/instagram.png') }}" width="34" height="34" alt="instagram"></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="mt-10 text-center">
                <a href="" class="btn btn-bg-dark btn-active-success btn-text-light btn-active-text-dark rounded-pill">DAHA FAZLA GÖSTER</a>
            </div>
        </div>
    </section>
    <section id="yetkiBelgelerimiz">
        <div class="container-80 py-20">
            <div class="row">
                <div class="col-lg-8">
                    <h2>Sertifika ve Belgeler</h2>
                    <p>Sistemimize ait yetki belgeleri ve uzmanlık alanlarımızı görmek istermisiniz ?</p>
                </div>
                <div class="col-lg-4 text-end">
                    <a href="" class="btn btn-lg btn-bg-dark btn-active-success btn-text-success btn-active-text-dark rounded-pill">Yetki Belgelerimiz</a>
                </div>
            </div>
        </div>
    </section>
{% endblock %}