{% extends 'base.html.twig' %}

{% form_theme secondForm 'bootstrap_5_horizontal_layout.html.twig' %}

{% block title %}{{ page.title }} - {{ contact.phone }} Firma Mutari Bucuresti Move Solutions!{% endblock %}
{% block metacontentdescription %}{% if page.metaDescription is defined and page.metaDescription %}{{ page.metaDescription }}{% else %}{{ parent() }}{% endif %}{% endblock %}


    {% block metacontentkeywords %}{% if page.keywords is defined and page.keywords %}{{ page.keywords }}{% else %}{{ parent() }}{% endif %}{% endblock %}

{% block stylesheets %}
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
    {% include 'default/style.html.twig' %}
    <!-- Add the slick-theme.css if you want default styling -->
    <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>
    <!-- Add the slick-theme.css if you want default styling -->
    <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css"/>

    <style>
        @import url("https://use.typekit.net/wrd0buw.css");
    </style>
{% endblock %}

{% block javascripts %}
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
    {{ encore_entry_script_tags('app') }}
{% endblock %}

{% block body %}
    {% include 'default/navbar.html.twig' %}
<div class="container-fluid bgWhite text-center">
    <section class="bgWhite">
        <div class="container seventhPageRowContainer">
            <div class="container">
                <div class="row">
                    <div class="col-12 ">
                        <div class="singleBlogTitle">{{ page.title }}</div>
                        <div class="container-md singleBlogPreviewDescription">
                            <div class="row">
                                <div class="col-xl-1 d-none d-md-block"></div>
                                <div class="col-12 col-xl-10"><div>{{ page.previewDescription|raw }}</div></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-12">
                        <img class="img-fluid" src="{{ page.featureImage }}"/>
                    </div>
                </div>
                <div class="row">
                    <div class="col-12 singleBlogPageContent">
                        {{ page.pageContent|raw }}
                    </div>
                    <div class="col-12">
                        <div id="carouselExampleDark1" class="carousel carousel-dark slide secondCarouselWrapper" data-bs-ride="carousel">
                            <div class="carousel-inner">
                                {% for testimonial in testimonials %}
                                    <div class="carousel-item {% if loop.first %} active {% endif %}" data-bs-interval="10000">
                                        <div class="d-block w-100">
                                            <div class="row">
                                                <div class="col-sm-2"></div>
                                                <div class="col-12 col-sm-8">
                                                    <div class="row">
                                                        <div class="col-12 col-sm-2 testimonialsImgWrapper">
                                                            <img src="{{ asset('images/testimonials/' ~ testimonial.image) }}" class="rounded-circle testimonialsMobileImg" alt="...">
                                                        </div>
                                                        <div class="col-2 d-block d-sm-none"></div>
                                                        <div class="col-8">
                                                            <p class="testimonialsP">“{{ testimonial.message }}”</p>
                                                            <h5 class="text-start testimonialsName">{{ testimonial.name }}</h5>
                                                        </div>
                                                        <div class="col-2 d-block d-sm-none"></div>
                                                    </div>
                                                </div>
                                                <div class="col-sm-2"></div>
                                            </div>
                                        </div>
                                    </div>
                                {% endfor %}
                                <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleDark1" data-bs-slide="prev">
                                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                                    <span class="visually-hidden">Previous</span>
                                </button>
                                <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleDark1" data-bs-slide="next">
                                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                                    <span class="visually-hidden">Next</span>
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>
{% include 'default/footer.html.twig' %}

{% endblock %}

{% block bottom_javascript %}
<script src="https://unpkg.com/aos@next/dist/aos.js"></script>
<script>
    AOS.init();
</script>
{% endblock %}