@extends('website.layouts.app')
@section('content')
<section class="service_banner">
	<div class="innerbanner_text">
		<div class="container">
			<h1 class="mb-2">Services</h1>
			<p class="mb-5">Dive into our irresistible offers and make every journey a celebration of affordability and adventure. Explore <br class="d-xl-block d-none">more, spend less, and let the deals guide your next unforgettable escape!</p>
			<form class="service_search input-group" role="form">
				<input type="text" class="form-control border-0 px-4" placeholder="Search Packages...">
				<button class="btn ms-1 trs" type="submit">Search</button>
			</form>
		</div>
	</div>
</section>
<section class="service">
	<div class="container">
		<nav class="d-lg-flex justify-content-between text-lg-start text-center mb-5">
			<div class="nav nav-tabs border-0 align-items-center justify-content-lg-start justify-content-center" id="nav-tab" role="tablist">
				<button class="nav-link position-relative border-0 pt-2 p-0 mx-2 mb-2 active" id="all_services_tab" data-bs-toggle="tab" data-bs-target="#all_services_nav" type="button" role="tab" aria-controls="all_services_nav" aria-selected="true">All Services</button>
				<button class="nav-link position-relative border-0 pt-2 p-0 mx-2 mb-2" id="travel_tab" data-bs-toggle="tab" data-bs-target="#travel_nav" type="button" role="tab" aria-controls="travel_nav" aria-selected="false">Travel</button>
				<button class="nav-link position-relative border-0 pt-2 p-0 mx-2 mb-2" id="corporate_tab" data-bs-toggle="tab" data-bs-target="#corporate_nav" type="button" role="tab" aria-controls="corporate_nav" aria-selected="false">Corporate</button>
				<button class="nav-link position-relative border-0 pt-2 p-0 mx-2 mb-2" id="others_tab" data-bs-toggle="tab" data-bs-target="#others_nav" type="button" role="tab" aria-controls="others_nav" aria-selected="false">Others</button>
			</div>
		</nav>
		<div class="tab-content" id="nav-tabContent">
			<div class="tab-pane fade show active" id="all_services_nav" role="tabpanel" aria-labelledby="all_services_tab" tabindex="0">
				<div class="row gx-lg-5 gy-5">
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_01.webp" alt="Services">
							<h3>Air Ticket Booking</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_02.webp" alt="Services">
							<h3>Corporate Travel</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_03.webp" alt="Services">
							<h3>Medical Tourism</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_04.webp" alt="Services">
							<h3>Holiday Packages</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_05.webp" alt="Services">
							<h3>Hotel Reservation</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_06.webp" alt="Services">
							<h3>Visa Services</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_07.webp" alt="Services">
							<h3>Air Travel Services</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_08.webp" alt="Services">
							<h3>Travel Insurance</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_09.webp" alt="Services">
							<h3>Car Rentals</h3>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-pane fade" id="travel_nav" role="tabpanel" aria-labelledby="travel_tab" tabindex="0">
				<div class="row gx-lg-5 gy-5">
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_01.webp" alt="Services">
							<h3>Air Ticket Booking</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_02.webp" alt="Services">
							<h3>Corporate Travel</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_03.webp" alt="Services">
							<h3>Medical Tourism</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_04.webp" alt="Services">
							<h3>Holiday Packages</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_05.webp" alt="Services">
							<h3>Hotel Reservation</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_06.webp" alt="Services">
							<h3>Visa Services</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_07.webp" alt="Services">
							<h3>Air Travel Services</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_08.webp" alt="Services">
							<h3>Travel Insurance</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_09.webp" alt="Services">
							<h3>Car Rentals</h3>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-pane fade" id="corporate_nav" role="tabpanel" aria-labelledby="corporate_tab" tabindex="0">
				<div class="row gx-lg-5 gy-5">
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_01.webp" alt="Services">
							<h3>Air Ticket Booking</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_02.webp" alt="Services">
							<h3>Corporate Travel</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_03.webp" alt="Services">
							<h3>Medical Tourism</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_04.webp" alt="Services">
							<h3>Holiday Packages</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_05.webp" alt="Services">
							<h3>Hotel Reservation</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_06.webp" alt="Services">
							<h3>Visa Services</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_07.webp" alt="Services">
							<h3>Air Travel Services</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_08.webp" alt="Services">
							<h3>Travel Insurance</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_09.webp" alt="Services">
							<h3>Car Rentals</h3>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-pane fade" id="others_nav" role="tabpanel" aria-labelledby="others_tab" tabindex="0">
				<div class="row gx-lg-5 gy-5">
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_01.webp" alt="Services">
							<h3>Air Ticket Booking</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_02.webp" alt="Services">
							<h3>Corporate Travel</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_03.webp" alt="Services">
							<h3>Medical Tourism</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_04.webp" alt="Services">
							<h3>Holiday Packages</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_05.webp" alt="Services">
							<h3>Hotel Reservation</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_06.webp" alt="Services">
							<h3>Visa Services</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_07.webp" alt="Services">
							<h3>Air Travel Services</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_08.webp" alt="Services">
							<h3>Travel Insurance</h3>
						</a>
					</div>
					<div class="col-md-4 col-12 position-relative overflow-hidden">
						<a class="w-100 float-start border rounded-2 shine_ani" href="service-details.html">
							<img class="img-fluid rounded-2" src="images/service_09.webp" alt="Services">
							<h3>Car Rentals</h3>
						</a>
					</div>
				</div>
			</div>
		</div>
		<div class="text-center mt-5">
			<button type="button" class="btn send_btn trs">Load More</button>
		</div>
	</div>
</section>
@endsection