@extends('layout.mainlayout')
@section('content')	
@component('components.breadcrumb')
        @slot('title')
		Blog Grid
        @endslot
        @slot('item1')
       index
        @endslot
        @slot('item3')
		Pages
        @endslot
        @slot('item2')
		Blog Grid
        @endslot
       @endcomponent

 <!-- Page Wrapper -->
 <div class="content">
    <div class="container">
        <div class="row justify-content-center">

            <!-- Blog Item-->
            <div class="col-xl-4 col-md-6">
                <div class="blog-item mb-4 wow fadeInUp" data-wow-delay="0.2s">
                    <a href="{{url('blog-details')}}" class="blog-img">
                        <img src="{{URL::asset('build/img/blog/blog-01.jpg')}}" alt="img">
                    </a>
                    <span class="badge bg-primary fs-13 fw-medium">Travel</span>
                    <div class="blog-info text-center">
                        <div class="d-inline-flex align-items-center justify-content-center">
                            <div class="d-inline-flex align-items-center border-end pe-3 me-3 mb-2">
                                <a href="javascript:void(0);" class="d-flex align-items-center">
                                    <span class="avatar avatar-sm me-2">
                                        <img src="{{URL::asset('build/img/users/user-01.jpg')}}" class="rounded-circle border border-white" alt="img">
                                    </span>
                                    <p>Bryan Bradfield</p>
                                </a>
                            </div>
                            <p class="text-white mb-2"><i class="isax isax-calendar-2 me-2"></i>14 May 2025</p>
                        </div>
                        <h5><a href="{{url('blog-details')}}">Top 10 Hidden Gems places in Central Europe in 2025</a></h5>
                    </div>
                </div>
            </div>
            <!-- /Blog Item-->

            <!-- Blog Item-->
            <div class="col-xl-4 col-md-6">
                <div class="blog-item mb-4 wow fadeInUp" data-wow-delay="0.2s">
                    <a href="{{url('blog-details')}}" class="blog-img">
                        <img src="{{URL::asset('build/img/blog/blog-02.jpg')}}" alt="img">
                    </a>
                    <span class="badge bg-primary fs-13 fw-medium">Guide</span>
                    <div class="blog-info text-center">
                        <div class="d-inline-flex align-items-center justify-content-center">
                            <div class="d-inline-flex align-items-center border-end pe-3 me-3 mb-2">
                                <a href="javascript:void(0);" class="d-flex align-items-center">
                                    <span class="avatar avatar-sm me-2">
                                        <img src="{{URL::asset('build/img/users/user-02.jpg')}}" class="rounded-circle border border-white" alt="img">
                                    </span>
                                    <p>Michell West</p>
                                </a>
                            </div>
                            <p class="text-white mb-2"><i class="isax isax-calendar-2 me-2"></i>12 May 2025</p>
                        </div>
                        <h5><a href="{{url('blog-details')}}">Exploring the World: Your Ultimate Dream Tour Itinerary</a></h5>
                    </div>
                </div>
            </div>
            <!-- /Blog Item-->

            <!-- Blog Item-->
            <div class="col-xl-4 col-md-6">
                <div class="blog-item mb-4 wow fadeInUp" data-wow-delay="0.2s">
                    <a href="{{url('blog-details')}}" class="blog-img">
                        <img src="{{URL::asset('build/img/blog/blog-03.jpg')}}" alt="img">
                    </a>
                    <span class="badge bg-primary fs-13 fw-medium">Rental</span>
                    <div class="blog-info text-center">
                        <div class="d-inline-flex align-items-center justify-content-center">
                            <div class="d-inline-flex align-items-center border-end pe-3 me-3 mb-2">
                                <a href="javascript:void(0);" class="d-flex align-items-center">
                                    <span class="avatar avatar-sm me-2">
                                        <img src="{{URL::asset('build/img/users/user-03.jpg')}}" class="rounded-circle border border-white" alt="img">
                                    </span>
                                    <p>Patricia Hasbro</p>
                                </a>
                            </div>
                            <p class="text-white mb-2"><i class="isax isax-calendar-2 me-2"></i>14 May 2025</p>
                        </div>
                        <h5><a href="{{url('blog-details')}}">New York City, USA - The City That  Never Sleeps</a></h5>
                    </div>
                </div>
            </div>
            <!-- /Blog Item-->

            <!-- Blog Item-->
            <div class="col-xl-4 col-md-6">
                <div class="blog-item mb-4 wow fadeInUp" data-wow-delay="0.2s">
                    <a href="{{url('blog-details')}}" class="blog-img">
                        <img src="{{URL::asset('build/img/blog/blog-09.jpg')}}" alt="img">
                    </a>
                    <span class="badge bg-primary fs-13 fw-medium">Travel</span>
                    <div class="blog-info text-center">
                        <div class="d-inline-flex align-items-center justify-content-center">
                            <div class="d-inline-flex align-items-center border-end pe-3 me-3 mb-2">
                                <a href="javascript:void(0);" class="d-flex align-items-center">
                                    <span class="avatar avatar-sm me-2">
                                        <img src="{{URL::asset('build/img/users/user-01.jpg')}}" class="rounded-circle border border-white" alt="img">
                                    </span>
                                    <p>Bryan Bradfield</p>
                                </a>
                            </div>
                            <p class="text-white mb-2"><i class="isax isax-calendar-2 me-2"></i>14 May 2025</p>
                        </div>
                        <h5><a href="{{url('blog-details')}}">How to Travel on a Budget: Affordable Destinations & Tips</a></h5>
                    </div>
                </div>
            </div>
            <!-- /Blog Item-->

            <!-- Blog Item-->
            <div class="col-xl-4 col-md-6">
                <div class="blog-item mb-4 wow fadeInUp" data-wow-delay="0.2s">
                    <a href="{{url('blog-details')}}" class="blog-img">
                        <img src="{{URL::asset('build/img/blog/blog-05.jpg')}}" alt="img">
                    </a>
                    <span class="badge bg-primary fs-13 fw-medium">Guide</span>
                    <div class="blog-info text-center">
                        <div class="d-inline-flex align-items-center justify-content-center">
                            <div class="d-inline-flex align-items-center border-end pe-3 me-3 mb-2">
                                <a href="javascript:void(0);" class="d-flex align-items-center">
                                    <span class="avatar avatar-sm me-2">
                                        <img src="{{URL::asset('build/img/users/user-03.jpg')}}" class="rounded-circle border border-white" alt="img">
                                    </span>
                                    <p>Michell West</p>
                                </a>
                            </div>
                            <p class="text-white mb-2"><i class="isax isax-calendar-2 me-2"></i>12 May 2025</p>
                        </div>
                        <h5><a href="{{url('blog-details')}}">The Ultimate Guide to Solo Travel: Tips for First-Time Travelers</a></h5>
                    </div>
                </div>
            </div>
            <!-- /Blog Item-->

            <!-- Blog Item-->
            <div class="col-xl-4 col-md-6">
                <div class="blog-item mb-4 wow fadeInUp" data-wow-delay="0.2s">
                    <a href="{{url('blog-details')}}" class="blog-img">
                        <img src="{{URL::asset('build/img/blog/blog-06.jpg')}}" alt="img">
                    </a>
                    <span class="badge bg-primary fs-13 fw-medium">Adventure</span>
                    <div class="blog-info text-center">
                        <div class="d-inline-flex align-items-center justify-content-center">
                            <div class="d-inline-flex align-items-center border-end pe-3 me-3 mb-2">
                                <a href="javascript:void(0);" class="d-flex align-items-center">
                                    <span class="avatar avatar-sm me-2">
                                        <img src="{{URL::asset('build/img/users/user-20.jpg')}}" class="rounded-circle border border-white" alt="img">
                                    </span>
                                    <p>Patricia Hasbro</p>
                                </a>
                            </div>
                            <p class="text-white mb-2"><i class="isax isax-calendar-2 me-2"></i>14 May 2025</p>
                        </div>
                        <h5><a href="{{url('blog-details')}}">Top 10 Breath taking Destinations You Must Visit in 2025</a></h5>
                    </div>
                </div>
            </div>
            <!-- /Blog Item-->

            <!-- Blog Item-->
            <div class="col-xl-4 col-md-6">
                <div class="blog-item mb-4 wow fadeInUp" data-wow-delay="0.2s">
                    <a href="{{url('blog-details')}}" class="blog-img">
                        <img src="{{URL::asset('build/img/blog/blog-10.jpg')}}" alt="img">
                    </a>
                    <span class="badge bg-primary fs-13 fw-medium">Tips</span>
                    <div class="blog-info text-center">
                        <div class="d-inline-flex align-items-center justify-content-center">
                            <div class="d-inline-flex align-items-center border-end pe-3 me-3 mb-2">
                                <a href="javascript:void(0);" class="d-flex align-items-center">
                                    <span class="avatar avatar-sm me-2">
                                        <img src="{{URL::asset('build/img/users/user-01.jpg')}}" class="rounded-circle border border-white" alt="img">
                                    </span>
                                    <p>Bryan Bradfield</p>
                                </a>
                            </div>
                            <p class="text-white mb-2"><i class="isax isax-calendar-2 me-2"></i>14 May 2025</p>
                        </div>
                        <h5><a href="{{url('blog-details')}}">How to Plan the Perfect Weekend Getaway: Quick Travel Tips</a></h5>
                    </div>
                </div>
            </div>
            <!-- /Blog Item-->

            <!-- Blog Item-->
            <div class="col-xl-4 col-md-6">
                <div class="blog-item mb-4 wow fadeInUp" data-wow-delay="0.2s">
                    <a href="{{url('blog-details')}}" class="blog-img">
                        <img src="{{URL::asset('build/img/blog/blog-08.jpg')}}" alt="img">
                    </a>
                    <span class="badge bg-primary fs-13 fw-medium">Vacation</span>
                    <div class="blog-info text-center">
                        <div class="d-inline-flex align-items-center justify-content-center">
                            <div class="d-inline-flex align-items-center border-end pe-3 me-3 mb-2">
                                <a href="javascript:void(0);" class="d-flex align-items-center">
                                    <span class="avatar avatar-sm me-2">
                                        <img src="{{URL::asset('build/img/users/user-02.jpg')}}" class="rounded-circle border border-white" alt="img">
                                    </span>
                                    <p>Michell West</p>
                                </a>
                            </div>
                            <p class="text-white mb-2"><i class="isax isax-calendar-2 me-2"></i>12 May 2025</p>
                        </div>
                        <h5><a href="{{url('blog-details')}}">Top 7 Beach Destinations for a Relaxing Summer Vacation</a></h5>
                    </div>
                </div>
            </div>
            <!-- /Blog Item-->

            <!-- Blog Item-->
            <div class="col-xl-4 col-md-6">
                <div class="blog-item mb-4 wow fadeInUp" data-wow-delay="0.2s">
                    <a href="{{url('blog-details')}}" class="blog-img">
                        <img src="{{URL::asset('build/img/blog/blog-07.jpg')}}" alt="img">
                    </a>
                    <span class="badge bg-primary fs-13 fw-medium">Flight Tours</span>
                    <div class="blog-info text-center">
                        <div class="d-inline-flex align-items-center justify-content-center">
                            <div class="d-inline-flex align-items-center border-end pe-3 me-3 mb-2">
                                <a href="javascript:void(0);" class="d-flex align-items-center">
                                    <span class="avatar avatar-sm me-2">
                                        <img src="{{URL::asset('build/img/users/user-18.jpg')}}" class="rounded-circle border border-white" alt="img">
                                    </span>
                                    <p>Patricia Hasbro</p>
                                </a>
                            </div>
                            <p class="text-white mb-2"><i class="isax isax-calendar-2 me-2"></i>14 May 2025</p>
                        </div>
                        <h5><a href="{{url('blog-details')}}">The Best Flight Tours Over Iconic Landmarks You Have to Experience</a></h5>
                    </div>
                </div>
            </div>
            <!-- /Blog Item-->

            <!-- Pagination -->
            <nav class="pagination-nav">
                <ul class="pagination justify-content-center">
                    <li class="page-item disabled">
                        <a class="page-link" href="javascript:void(0);" aria-label="Previous">
                            <span aria-hidden="true"><i class="fa-solid fa-chevron-left"></i></span>
                        </a>
                    </li>
                    <li class="page-item"><a class="page-link" href="javascript:void(0);">1</a></li>
                    <li class="page-item"><a class="page-link" href="javascript:void(0);">2</a></li>
                    <li class="page-item"><a class="page-link" href="javascript:void(0);">3</a></li>
                    <li class="page-item active"><a class="page-link" href="javascript:void(0);">4</a></li>
                    <li class="page-item"><a class="page-link" href="javascript:void(0);">5</a></li>
                    <li class="page-item">
                        <a class="page-link" href="javascript:void(0);" aria-label="Next">
                            <span aria-hidden="true"><i class="fa-solid fa-chevron-right"></i></span>
                        </a>
                    </li>
                </ul>
            </nav>
            <!-- /Pagination -->
        </div>
    </div>
</div>
<!-- /Page Wrapper -->



       @endsection