@extends("website.layouts.layout")
@section('title',"Services")
@section("body")


<section class="banner-services">
    <img class="banner-background-ellipse" src="{{asset('webAssets/assets/images/banner-bg-img.png')}}" alt="">
</section>

<!--- breadcrumb section -->

<section class="services-breadcrumb-section">
    <div class="container">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{route('homepage')}}">Home</a></li>
                <li class="breadcrumb-item active" aria-current="page">Cities We Serve</li>
            </ol>
        </nav>
    </div>
</section>

<!-- banner section starts -->

<section class="cities-service">
    <div class="container">
        <div class="cities-serve-header d-flex flex-column align-items-center text-center">
            <h3 class="heading">Cities We Serve</h3>
            <p class="paragraph font-size-18">Get hassle-free and professional house care services and much more.
            </p>
        </div>

        <div class="cities-block d-flex flex-wrap">
            @foreach($serveCity as $cities)
            
            <div class="cities-items">
                <div class="cities-inner-items d-flex align-items-center">
                    <div class="cities-img-col">
                        <img src="{{asset($cities->city_image)}}" alt="cities">
                    </div>
                    <div class="cities-text-col w-100">
                    {{$cities->city_name}}
                    </div>
                </div>
            </div>
            @endforeach
        </div>
    </div>
</section>




@endsection