Destination

Dynamic destination.

Destination #v1

                                            
                                                <!-- Destinantion v1 -->
                                                    <div class="destination-block destination-v1">
                                                        <div class="container space-1">
                                                            <div class="w-md-80 w-lg-50 text-center mx-md-auto mb-5 mt-3">
                                                                <h2 class="section-title text-black font-size-30 font-weight-bold mb-0">Top Destination</h2>
                                                            </div>
                                                            <div class="row">
                                                                <!-- Card Block -->
                                                                <div class="col-md-6 mb-3 mb-md-4">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2 border-0 dropdown" style="background-image: url(../../assets/img/630x350/img1.jpg);">
                                                                        <div class="w-100 d-flex justify-content-between mb-2">
                                                                            <div class="position-relative">
                                                                                <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">United Kingdom</a>

                                                                                <!-- Dropdown List -->
                                                                                <div class="destination-dropdown v1">
                                                                                    <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                    <a class="dropdown-item" href="#">48 Tour</a>
                                                                                    <a class="dropdown-item" href="#">46 Activity</a>
                                                                                    <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                </div>
                                                                                <!-- End Dropdown List -->

                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 mb-3 mb-md-4">
                                                                        <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2 border-0 dropdown" style="background-image: url(../../assets/img/630x350/img2.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between mb-2">
                                                                                <div class="position-relative">
                                                                                    <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">Turkey</a>

                                                                                    <!-- Dropdown List -->
                                                                                    <div class="destination-dropdown v1">
                                                                                        <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                        <a class="dropdown-item" href="#">48 Tour</a>
                                                                                        <a class="dropdown-item" href="#">46 Activity</a>
                                                                                        <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                    </div>
                                                                                    <!-- End Dropdown List -->


                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4">
                                                                    <div class="min-height-350 gradient-overlay-half-bg-gradient rounded-border p-5 bg-img-hero transition-3d-hover shadow-hover-2 border-0 dropdown" style="background-image: url(../../assets/img/300x350/img1.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-2">
                                                                            <div class="position-relative">
                                                                                <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">United States</a>

                                                                                <!-- Dropdown List -->
                                                                                <div class="destination-dropdown v1">
                                                                                    <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                    <a class="dropdown-item" href="#">48 Tour</a>
                                                                                    <a class="dropdown-item" href="#">46 Activity</a>
                                                                                    <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                </div>
                                                                                <!-- End Dropdown List -->


                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4">
                                                                    <div class="min-height-350 gradient-overlay-half-bg-gradient rounded-border p-5 bg-img-hero transition-3d-hover shadow-hover-2 border-0 dropdown" style="background-image: url(../../assets/img/300x350/img3.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-2">
                                                                            <div class="position-relative">
                                                                                <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">Ukraine</a>

                                                                                <!-- Dropdown List -->
                                                                                <div class="destination-dropdown v1">
                                                                                    <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                    <a class="dropdown-item" href="#">48 Tour</a>
                                                                                    <a class="dropdown-item" href="#">46 Activity</a>
                                                                                    <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                </div>
                                                                                <!-- End Dropdown List -->


                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4">
                                                                    <div class="min-height-350 gradient-overlay-half-bg-gradient rounded-border p-5 bg-img-hero transition-3d-hover shadow-hover-2 border-0 dropdown" style="background-image: url(../../assets/img/300x350/img2.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-2">
                                                                            <div class="position-relative">
                                                                                <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">France</a>

                                                                                <!-- Dropdown List -->
                                                                                <div class="destination-dropdown v1">
                                                                                    <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                    <a class="dropdown-item" href="#">48 Tour</a>
                                                                                    <a class="dropdown-item" href="#">46 Activity</a>
                                                                                    <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                </div>
                                                                                <!-- End Dropdown List -->


                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4">
                                                                    <div class="min-height-350 gradient-overlay-half-bg-gradient rounded-border p-5 bg-img-hero transition-3d-hover shadow-hover-2 border-0 dropdown" style="background-image: url(../../assets/img/300x350/img4.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-2">
                                                                            <div class="position-relative">
                                                                                <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">India</a>

                                                                                <!-- Dropdown List -->
                                                                                <div class="destination-dropdown v1">
                                                                                    <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                    <a class="dropdown-item" href="#">48 Tour</a>
                                                                                    <a class="dropdown-item" href="#">46 Activity</a>
                                                                                    <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                </div>
                                                                                <!-- End Dropdown List -->


                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->
                                                            </div>
                                                        </div>
                                                    </div>
                                                <!-- End Destinantion v1 -->
                                            
                                        

Destination #v2

                                            
                                                <!-- Destinantion v2 -->
                                                    <div class="destination-block destination-v2">
                                                        <div class="container space-1">
                                                            <div class="w-md-80 w-lg-50 text-center mx-md-auto mb-5 mt-3">
                                                                <h2 class="section-title text-black font-size-30 font-weight-bold mb-0">Top Destination</h2>
                                                            </div>
                                                            <div class="row">
                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img3.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Turkey</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img7.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">United States</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img6.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Ukraine</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img10.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">France</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img2.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">India</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img5.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">United Kingdom</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img9.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Germany</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img8.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Greece</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img1.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Canada</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img4.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Italy</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->
                                                            </div>
                                                        </div>
                                                    </div>
                                                <!-- End Destinantion v2 -->
                                            
                                        

Destination #v3

                                            
                                                <!-- Destinantion v3 -->
                                                    <div class="destination-block destination-v3">
                                                        <div class="container space-1">
                                                            <div class="mb-3 pb-md-3 mb-md-2">
                                                                <h2 class="font-weight-bold font-size-xs-20 font-size-30 mb-0">Top Destination</h2>
                                                            </div>
                                                            <div class="row">
                                                                <!-- Card Block -->
                                                                <div class="col-md-6 mb-3 mb-md-0">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient-v4 gradient-overlay transition-3d-hover shadow-hover-2 dropdown" style="background-image: url(../../assets/img/630x350/img1.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div class="position-relative">
                                                                                <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">United Kingdom</a>

                                                                                <!-- Dropdown List -->
                                                                                <div class="destination-dropdown v3">
                                                                                    <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                    <a class="dropdown-item" href="#">48 Tour</a>
                                                                                    <a class="dropdown-item" href="#">46 Activity</a>
                                                                                    <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                </div>
                                                                                <!-- End Dropdown List -->

                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient-v4 gradient-overlay transition-3d-hover shadow-hover-2 dropdown" style="background-image: url(../../assets/img/300x350/img2.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div class="position-relative">
                                                                                <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">France</a>

                                                                                <!-- Dropdown List -->
                                                                                <div class="destination-dropdown v3">
                                                                                    <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                    <a class="dropdown-item" href="#">48 Tour</a>
                                                                                    <a class="dropdown-item" href="#">46 Activity</a>
                                                                                    <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                </div>
                                                                                <!-- End Dropdown List -->

                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient-v4 gradient-overlay transition-3d-hover shadow-hover-2 dropdown" style="background-image: url(../../assets/img/300x350/img4.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div class="position-relative">
                                                                                <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">India</a>

                                                                                <!-- Dropdown List -->
                                                                                <div class="destination-dropdown v3">
                                                                                    <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                    <a class="dropdown-item" href="#">48 Tour</a>
                                                                                    <a class="dropdown-item" href="#">46 Activity</a>
                                                                                    <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                </div>
                                                                                <!-- End Dropdown List -->

                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient-v4 gradient-overlay transition-3d-hover shadow-hover-2 dropdown" style="background-image: url(../../assets/img/300x350/img1.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div class="position-relative">
                                                                                <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">United States</a>

                                                                                <!-- Dropdown List -->
                                                                                <div class="destination-dropdown v3">
                                                                                    <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                    <a class="dropdown-item" href="#">48 Tour</a>
                                                                                    <a class="dropdown-item" href="#">46 Activity</a>
                                                                                    <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                </div>
                                                                                <!-- End Dropdown List -->

                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient-v4 gradient-overlay transition-3d-hover shadow-hover-2 dropdown" style="background-image: url(../../assets/img/300x350/img3.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div class="position-relative">
                                                                                <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">Ukraine</a>

                                                                                <!-- Dropdown List -->
                                                                                <div class="destination-dropdown v3">
                                                                                    <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                    <a class="dropdown-item" href="#">48 Tour</a>
                                                                                    <a class="dropdown-item" href="#">46 Activity</a>
                                                                                    <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                </div>
                                                                                <!-- End Dropdown List -->

                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 mb-3 mb-md-0">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient-v4 gradient-overlay transition-3d-hover shadow-hover-2 dropdown" style="background-image: url(../../assets/img/630x350/img2.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div class="position-relative">
                                                                                <a href="#" class="destination text-white font-weight-bold font-size-21 pb-3 mb-3 text-lh-1 d-block">Turkey</a>

                                                                                <!-- Dropdown List -->
                                                                                <div class="destination-dropdown v3">
                                                                                    <a class="dropdown-item" href="#">30 Hotel</a>
                                                                                    <a class="dropdown-item" href="#">48 Tour</a>
                                                                                    <a class="dropdown-item" href="#">46 Activity</a>
                                                                                    <a class="dropdown-item" href="#">32 Yacht</a>
                                                                                </div>
                                                                                <!-- End Dropdown List -->

                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->
                                                            </div>
                                                        </div>
                                                    </div>
                                                <!-- End Destinantion v3 -->
                                            
                                        

Destination #v4

                                            
                                                <!-- Destinantion v4 -->
                                                    <div class="destination-block destination-v4">
                                                        <div class="container space-1">
                                                            <div class="w-md-80 w-lg-50 text-center mx-md-auto mb-5 mt-3">
                                                                <h2 class="section-title text-black font-size-30 font-weight-bold mb-0">Top Destination</h2>
                                                            </div>
                                                                <div class="row">
                                                                <!-- Card Block -->
                                                                <div class="col-md-6 mb-3 mb-md-0">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/630x350/img1.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div>
                                                                                <div class="destination pb-3 text-lh-1">
                                                                                    <a href="#" class="text-white font-weight-bold font-size-21">United Kingdom</a>
                                                                                </div>
                                                                                <div class="mt-1 pt-1">
                                                                                    <a href="#" class="text-white">79 Hotel</a>
                                                                                </div>
                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/300x350/img2.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div>
                                                                                <div class="destination pb-3 text-lh-1">
                                                                                    <a href="#" class="text-white font-weight-bold font-size-21">France</a>
                                                                                </div>
                                                                                <div class="mt-1 pt-1">
                                                                                    <a href="#" class="text-white">54 Hotel</a>
                                                                                </div>
                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/300x350/img4.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div>
                                                                                <div class="destination pb-3 text-lh-1">
                                                                                    <a href="#" class="text-white font-weight-bold font-size-21">India</a>
                                                                                </div>
                                                                                <div class="mt-1 pt-1">
                                                                                    <a href="#" class="text-white">26 Hotel</a>
                                                                                </div>
                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/300x350/img1.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div>
                                                                                <div class="destination pb-3 text-lh-1">
                                                                                    <a href="#" class="text-white font-weight-bold font-size-21">United States</a>
                                                                                </div>
                                                                                <div class="mt-1 pt-1">
                                                                                    <a href="#" class="text-white">1991 Hotel</a>
                                                                                </div>
                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/300x350/img3.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div>
                                                                                <div class="destination pb-3 text-lh-1">
                                                                                    <a href="#" class="text-white font-weight-bold font-size-21">Ukraine</a>
                                                                                </div>
                                                                                <div class="mt-1 pt-1">
                                                                                    <a href="#" class="text-white">269 Hotel</a>
                                                                                </div>
                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-6 mb-3 mb-md-0">
                                                                    <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/630x350/img2.jpg);">
                                                                        <header class="w-100 d-flex justify-content-between mb-3">
                                                                            <div>
                                                                                <div class="destination pb-3 text-lh-1">
                                                                                    <a href="#" class="text-white font-weight-bold font-size-21">Turkey</a>
                                                                                </div>
                                                                                <div class="mt-1 pt-1">
                                                                                    <a href="#" class="text-white">1205 Hotel</a>
                                                                                </div>
                                                                            </div>
                                                                        </header>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->
                                                            </div>
                                                        </div>
                                                    </div>
                                                <!-- End Destinantion v4 -->
                                            
                                        

Destination #v5

                                            
                                                <!-- Destinantion v5 -->
                                                    <div class="destination-block destination-vv5">
                                                        <div class="container space-1">
                                                            <div class="w-md-80 w-lg-50 text-center mx-md-auto mb-5 mt-3">
                                                                <h2 class="section-title text-black font-size-30 font-weight-bold mb-0">Popular Destination</h2>
                                                            </div>
                                                            <div class="row">
                                                                <!-- Card Block -->
                                                                    <div class="col-md-6 mb-3 mb-md-0">
                                                                        <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/630x350/img1.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between mb-3">
                                                                                <div>
                                                                                    <div class="pb-3 text-lh-1">
                                                                                        <a href="#" class="text-white font-weight-bold font-size-21">United Kingdom</a>
                                                                                    </div>
                                                                                    <div class="d-inline-flex px-3 py-1 rounded-pill bg-white">
                                                                                        <a href="#" class="font-size-14">15 Tour</a>
                                                                                    </div>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                    <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                        <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/300x350/img6.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between mb-3">
                                                                                <div>
                                                                                    <div class="pb-3 text-lh-1">
                                                                                        <a href="#" class="text-white font-weight-bold font-size-21">Turkey</a>
                                                                                    </div>
                                                                                    <div class="d-inline-flex px-3 py-1 rounded-pill bg-white">
                                                                                        <a href="#" class="font-size-14">88 Tour</a>
                                                                                    </div>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                    <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                        <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/300x350/img5.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between mb-3">
                                                                                <div>
                                                                                    <div class="pb-3 text-lh-1">
                                                                                        <a href="#" class="text-white font-weight-bold font-size-21">Norway</a>
                                                                                    </div>
                                                                                    <div class="d-inline-flex px-3 py-1 rounded-pill bg-white">
                                                                                        <a href="#" class="font-size-14">92 Tour</a>
                                                                                    </div>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                    <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                        <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/300x350/img1.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between mb-3">
                                                                                <div>
                                                                                    <div class="pb-3 text-lh-1">
                                                                                        <a href="#" class="text-white font-weight-bold font-size-21">United States</a>
                                                                                    </div>
                                                                                    <div class="d-inline-flex px-3 py-1 rounded-pill bg-white">
                                                                                        <a href="#" class="font-size-14">75 Tour</a>
                                                                                    </div>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                    <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                        <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/300x350/img3.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between mb-3">
                                                                                <div>
                                                                                    <div class="pb-3 text-lh-1">
                                                                                        <a href="#" class="text-white font-weight-bold font-size-21">Ukraine</a>
                                                                                    </div>
                                                                                    <div class="d-inline-flex px-3 py-1 rounded-pill bg-white">
                                                                                        <a href="#" class="font-size-14">05 Tour</a>
                                                                                    </div>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                    <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                        <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/300x350/img2.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between mb-3">
                                                                                <div>
                                                                                    <div class="pb-3 text-lh-1">
                                                                                        <a href="#" class="text-white font-weight-bold font-size-21">France</a>
                                                                                    </div>
                                                                                    <div class="d-inline-flex px-3 py-1 rounded-pill bg-white">
                                                                                        <a href="#" class="font-size-14">05 Tour</a>
                                                                                    </div>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                    <div class="col-md-6 col-xl-3 mb-3 mb-md-4 pb-1">
                                                                        <div class="min-height-350 bg-img-hero rounded-border p-5 gradient-overlay-half-bg-gradient transition-3d-hover shadow-hover-2" style="background-image: url(../../assets/img/300x350/img4.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between mb-3">
                                                                                <div>
                                                                                    <div class="pb-3 text-lh-1">
                                                                                        <a href="#" class="text-white font-weight-bold font-size-21">India</a>
                                                                                    </div>
                                                                                    <div class="d-inline-flex px-3 py-1 rounded-pill bg-white">
                                                                                        <a href="#" class="font-size-14">65 Tour</a>
                                                                                    </div>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </div>
                                                                <!-- End Card Block -->
                                                            </div>
                                                        </div>
                                                    </div>
                                                <!-- End Destinantion v5 -->
                                            
                                        

Destination #v6

                                            
                                                <!-- Destinantion v6 -->
                                                    <div class="destination-block destination-v6">
                                                        <div class="container space-1">
                                                            <div class="w-md-80 w-lg-50 text-center mx-md-auto mb-5 mt-3">
                                                                <h2 class="section-title text-black font-size-30 font-weight-bold mb-0">Top Destination</h2>
                                                            </div>
                                                            <div class="row">
                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 gradient-overlay shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img3.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Turkey</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 gradient-overlay shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img7.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">United States</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 gradient-overlay shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img6.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Ukraine</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 gradient-overlay shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img10.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">France</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 gradient-overlay shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img2.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">India</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 gradient-overlay shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img5.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">United Kingdom</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 gradient-overlay shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img9.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Germany</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 gradient-overlay shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img8.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Greece</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 gradient-overlay shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img1.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Canada</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->

                                                                <!-- Card Block -->
                                                                <div class="col-md-4 col-lg-6 col-xl-2dot4 mb-3 mb-md-4 pb-1">
                                                                    <a class="d-block" href="#">
                                                                        <div class="min-height-240 rounded-border px-4 py-5 bg-img-hero transition-3d-hover gradient-overlay-half-bg-gradient-v2 gradient-overlay shadow-hover-2 dropdown" style="background-image: url(../../assets/img/235x240/img4.jpg);">
                                                                            <header class="w-100 d-flex justify-content-between">
                                                                                <div class="position-relative">
                                                                                    <h5 class="text-white font-weight-bold font-size-17 mb-1 text-lh-2 d-block">Italy</h5>
                                                                                </div>
                                                                            </header>
                                                                        </div>
                                                                    </a>
                                                                </div>
                                                                <!-- End Card Block -->
                                                            </div>
                                                        </div>
                                                    </div>
                                                <!-- End Destinantion v6 -->
                                            
                                        

Destination Carousel #v7

Top Destination

                                            
                                                <!-- Destinantion v7 -->
                                                    <div class="destination-block destination-v7">
                                                        <div class="container space-1">
                                                            <div class="w-md-80 w-lg-50 text-center mx-md-auto mb-5 mt-3">
                                                                <h2 class="section-title text-black font-size-30 font-weight-bold mb-0">Top Destination</h2>
                                                            </div>
                                                            <div class="js-slick-carousel u-slick u-slick--gutters-3"
                                                                 data-slides-show="4"
                                                                 data-slides-scroll="1"
                                                                 data-arrows-classes="d-none d-lg-inline-block u-slick__arrow-classic v1 u-slick__arrow-classic--v1 u-slick__arrow-centered--y rounded-circle"
                                                                 data-arrow-left-classes="fas fa-chevron-left u-slick__arrow-classic-inner u-slick__arrow-classic-inner--left"
                                                                 data-arrow-right-classes="fas fa-chevron-right u-slick__arrow-classic-inner u-slick__arrow-classic-inner--right"
                                                                 data-pagi-classes="d-lg-none text-center u-slick__pagination mt-4"
                                                                 data-responsive='[{
                                                                "breakpoint": 1025,
                                                                "settings": {
                                                                "slidesToShow": 3
                                                                }
                                                                }, {
                                                                "breakpoint": 992,
                                                                "settings": {
                                                                "slidesToShow": 2
                                                                }
                                                                }, {
                                                                "breakpoint": 768,
                                                                "settings": {
                                                                "slidesToShow": 1
                                                                }
                                                                }, {
                                                                "breakpoint": 554,
                                                                "settings": {
                                                                "slidesToShow": 1
                                                                }
                                                                }]'>


                                                                <!-- Card Block -->
                                                                <div class="js-slide bg-img-hero-center rounded-border min-height-350 gradient-overlay-half-bg-gradient-v1" style="background-image: url(../../assets/img/300x350/img1.jpg);">
                                                                    <div class="text-center py-4 mt-1">
                                                                        <a href="#" class="text-white font-weight-bold font-size-21">United States</a>
                                                                        <p class="text-white font-size-19 font-weight-bold mt-1 mb-0">£99 /
                                                                            <span class="font-size-14 font-weight-normal ml-1">night average</span>
                                                                        </p>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                <div class="js-slide bg-img-hero-center rounded-border min-height-350 gradient-overlay-half-bg-gradient-v1" style="background-image: url(../../assets/img/300x350/img3.jpg);">
                                                                    <div class="text-center py-4 mt-1">
                                                                        <a href="#" class="text-white font-weight-bold font-size-21">Ukraine</a>
                                                                        <p class="text-white font-size-19 font-weight-bold mt-1 mb-0">£299 /
                                                                            <span class="font-size-14 font-weight-normal ml-1">night average</span>
                                                                        </p>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                <div class="js-slide bg-img-hero-center rounded-border min-height-350 gradient-overlay-half-bg-gradient-v1" style="background-image: url(../../assets/img/300x350/img2.jpg);">
                                                                    <div class="text-center py-4 mt-1">
                                                                        <a href="#" class="text-white font-weight-bold font-size-21">France</a>
                                                                        <p class="text-white font-size-19 font-weight-bold mt-1 mb-0">£358 /
                                                                            <span class="font-size-14 font-weight-normal ml-1">night average</span>
                                                                        </p>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                <div class="js-slide bg-img-hero-center rounded-border min-height-350 gradient-overlay-half-bg-gradient-v1" style="background-image: url(../../assets/img/300x350/img4.jpg);">
                                                                    <div class="text-center py-4 mt-1">
                                                                        <a href="#" class="text-white font-weight-bold font-size-21">India</a>
                                                                        <p class="text-white font-size-19 font-weight-bold mt-1 mb-0">£36 /
                                                                            <span class="font-size-14 font-weight-normal ml-1">night average</span>
                                                                        </p>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                <div class="js-slide bg-img-hero-center rounded-border min-height-350 gradient-overlay-half-bg-gradient-v1" style="background-image: url(../../assets/img/300x350/img5.jpg);">
                                                                    <div class="text-center py-4 mt-1">
                                                                        <a href="#" class="text-white font-weight-bold font-size-21">Norway</a>
                                                                        <p class="text-white font-size-19 font-weight-bold mt-1 mb-0">£89 /
                                                                            <span class="font-size-14 font-weight-normal ml-1">night average</span>
                                                                        </p>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->


                                                                <!-- Card Block -->
                                                                <div class="js-slide bg-img-hero-center rounded-border min-height-350 gradient-overlay-half-bg-gradient-v1" style="background-image: url(../../assets/img/300x350/img6.jpg);">
                                                                    <div class="text-center py-4 mt-1">
                                                                        <a href="#" class="text-white font-weight-bold font-size-21">Turkey</a>
                                                                        <p class="text-white font-size-19 font-weight-bold mt-1 mb-0">£152 /
                                                                            <span class="font-size-14 font-weight-normal ml-1">night average</span>
                                                                        </p>
                                                                    </div>
                                                                </div>
                                                                <!-- End Card Block -->
                                                            </div>
                                                        </div>
                                                    </div>
                                                <!-- End Destinantion v7 -->
                                            
                                        
                                            
                                                <!-- CSS Implementing Plugins -->
                                                <link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
                                            
                                        
                                            
                                                <!-- JS Implementing Plugins -->
                                                <script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>


                                                <!-- JS MyTravel -->
                                                <script src="../../assets/js/components/hs.slick-carousel.js"></script>

                                                <!-- JS Plugins Init. -->
                                                
                                                <script>
                                                  $(document).on('ready', function () {
                                                    // initialization of slick carousel
                                                    $.HSCore.components.HSSlickCarousel.init('.js-slick-carousel');
                                                  });
                                                </script>