yogiwhere/public/frontend2/listing-details-car.html

2079 lines
179 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="assets/images/favicon.png">
<title>ListOn - Directory & Listing HTML Template</title>
<link href="assets/plugins/aos/aos.min.css" rel="stylesheet">
<link href="assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/plugins/fontawesome/css/all.min.css" rel="stylesheet">
<link href="assets/plugins/OwlCarousel2/css/owl.carousel.min.css" rel="stylesheet">
<link href="assets/plugins/OwlCarousel2/css/owl.theme.default.min.css" rel="stylesheet">
<link href="assets/plugins/jquery-fancyfileuploader/fancy-file-uploader/fancy_fileupload.css" rel="stylesheet">
<link href="assets/plugins/ion.rangeSlider/ion.rangeSlider.min.css" rel="stylesheet">
<link href="assets/plugins/magnific-popup/magnific-popup.css" rel="stylesheet">
<link href="assets/plugins/select2/select2.min.css" rel="stylesheet">
<link href="assets/plugins/select2-bootstrap-5/select2-bootstrap-5-theme.min.css" rel="stylesheet">
<!-- Custom style for this template -->
<link href="assets/css/style.css" rel="stylesheet">
</head>
<body class="bg-light">
<!-- start navbar -->
<nav class="navbar navbar-expand-lg navbar-light sticky-top">
<div class="container">
<a class="navbar-brand m-0" href="index.html">
<img class="logo-white" src="assets/images/logo-white.png" alt="">
<img class="logo-dark" src="assets/images/logo.png" alt="">
</a>
<div class="d-flex order-lg-2">
<!-- start button -->
<a href="signin.html" class="d-flex align-items-center justify-content-center p-0 btn-user position-relative" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-custom-class="custom-tooltip" data-bs-title="Favourite">
<i class="fa-solid fa-heart"></i>
<span class="align-items-center bg-primary d-flex end-0 fs-11 justify-content-center nav-count position-absolute rounded-circle text-white">0</span>
</a>
<!-- end /. button -->
<!-- start button -->
<a href="sign-in.html" class="d-flex align-items-center justify-content-center p-0 btn-user" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-custom-class="custom-tooltip" data-bs-title="Sign In">
<i class="fa-solid fa-user-plus"></i>
</a>
<!-- end /. button -->
<!-- start button -->
<button type="button" id="themeToggleBtn" class="align-items-center bg-transparent border-0 btn-user d-flex justify-content-center p-0">
<i class="fa-solid fa-moon"></i>
</button>
<!-- end /. button -->
<!-- start button -->
<a href="add-listing.html" class="btn btn-primary d-none d-sm-flex fw-medium gap-2 hstack rounded-5">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-plus-circle" viewBox="0 0 16 16">
<path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z" />
<path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z" />
</svg>
<div class="vr d-none d-sm-inline-block"></div>
<span class="d-none d-sm-inline-block">Add Listing</span>
</a>
<!-- end /. button -->
<!-- start navbar toggle button -->
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span id="nav-icon" class="">
<span></span>
<span></span>
<span></span>
</span>
</button>
<!-- end /. navbar toggle button -->
</div>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav m-auto mb-2 mb-lg-0">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" aria-current="page" role="button" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
Home
</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="index.html">Home (Main)</a></li>
<li><a class="dropdown-item" href="home-classic.html">Home (Classic)</a></li>
<li><a class="dropdown-item" href="home-rounded.html">Home (Rounded)</a></li>
<li><a class="dropdown-item" href="home-map.html">Home (Map)</a></li>
<li><a class="dropdown-item" href="home-grid.html">Home (Grid)</a></li>
<li><a class="dropdown-item" href="home-waves.html">Home (Waves)</a></li>
<li><a class="dropdown-item" href="home-car.html">Home (Car)&nbsp;<span class="badge text-bg-primary fw-semibold">New</span></a></li>
<li><a class="dropdown-item" href="home-restaurant.html">Home (Restaurant)&nbsp;<span class="badge text-bg-primary fw-semibold">New</span></a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle material-ripple" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
<i class="typcn typcn-weather-stormy top-menu-icon"></i>Dashboard
</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="dashboard/dashboard.html">Dashboard</a></li>
<li><a class="dropdown-item" href="dashboard/bookings.html">Bookings</a></li>
<li><a class="dropdown-item" href="dashboard/messages.html">Message</a></li>
<li><a class="dropdown-item" href="dashboard/wallet.html">Wallet</a></li>
<li><a class="dropdown-item" href="dashboard/profile.html">Edit Profile</a></li>
<li><a class="dropdown-item" href="dashboard/add-listing.html">Add listing</a></li>
<li><a class="dropdown-item" href="dashboard/my-listing.html">My listing</a></li>
<li><a class="dropdown-item" href="dashboard/bookings.html">Bookings</a></li>
<li><a class="dropdown-item" href="dashboard/reviews.html">Reviews</a></li>
<li><a class="dropdown-item" href="dashboard/bookmark.html">Bookmark</a></li>
<li><a class="dropdown-item" href="dashboard/setting-app.html">Settings</a></li>
<li><a class="dropdown-item" href="dashboard/invoice.html">Invoice</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle active" href="#" role="button" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
Listing
</a>
<ul class="dropdown-menu">
<li class="nav-item dropdown">
<a class="dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">List View</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="listings-list-left.html">Left Sidebar</a></li>
<li><a class="dropdown-item" href="listings-list-right.html">Right Sidebar</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Grid View 1</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="listings-grid-1-left.html">Left Sidebar</a></li>
<li><a class="dropdown-item" href="listings-grid-1-right.html">Right Sidebar</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Grid View 2</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="listings-grid-2-left.html">Left Sidebar</a></li>
<li><a class="dropdown-item" href="listings-grid-2-right.html">Right Sidebar</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Half Map + Sidebar</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="listings-map.html">Half Map List</a></li>
<li><a class="dropdown-item" href="listings-map-car.html">Half Map List (Car)&nbsp;<span class="badge text-bg-primary fw-semibold">New</span></a></li>
<li><a class="dropdown-item" href="listings-map-grid-1.html">Half Map Grid 1</a></li>
<li><a class="dropdown-item" href="listings-map-grid-2.html">Half Map Grid 2</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="dropdown-item dropdown-toggle active" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Listing Details</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="listing-details-car.html">Listing Details 1</a></li>
<li><a class="dropdown-item" href="listing-details-2.html">Listing Details 2</a></li>
<li><a class="dropdown-item active" href="listing-details-car.html">Listing Details Car <span class="badge text-bg-primary fw-semibold">New</span></a></li>
</ul>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="listings-map-grid-1.html">Explore</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
Template
</a>
<ul class="dropdown-menu">
<li class="nav-item dropdown">
<a class="dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">About</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="about.html">About us 1</a></li>
<li><a class="dropdown-item" href="about-2.html">About us 2</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Agent</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="agent.html">Agent</a></li>
<li><a class="dropdown-item" href="agent-details.html">Agent Details</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="dropdown-item dropdown-toggle" href="blog.html" role="button" data-bs-toggle="dropdown" aria-expanded="false">Blog</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="blog.html">Blog</a></li>
<li><a class="dropdown-item" href="blog-details.html">Blog Standard</a></li>
<li><a class="dropdown-item" href="blog-post-galary.html">Blog Galary</a></li>
<li><a class="dropdown-item" href="blog-post-video.html">Blog Video</a></li>
<li><a class="dropdown-item" href="blog-post-audio.html">Blog Audio</a></li>
<li><a class="dropdown-item" href="blog-archive.html">Blog Archive</a></li>
</ul>
</li>
<li><a class="dropdown-item" href="add-listing.html">Add Listing</a></li>
<li><a class="dropdown-item" href="submit-rider.html">Submit Rider</a></li>
<li><a class="dropdown-item" href="contact.html">Contact</a></li>
<li><a class="dropdown-item" href="pricing.html">Pricing</a></li>
<li class="nav-item dropdown">
<a class="dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Authentication</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="sign-in.html">Sign In</a></li>
<li><a class="dropdown-item" href="sign-up.html">Sign Up</a></li>
<li><a class="dropdown-item" href="forgot-password.html">Forgot Password</a></li>
<li><a class="dropdown-item" href="two-factor-auth.html">Two factor authentication</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Specialty</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="404.html">404 Page</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Help Center</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="faq.html">Faq Page</a></li>
<li><a class="dropdown-item" href="terms-conditions.html">Terms & Conditions</a></li>
</ul>
</li>
<li><a class="dropdown-item" href="style-guide.html">Style Guide</a></li>
</ul>
</li>
</ul>
<div class="d-sm-none">
<!-- start button -->
<a href="signin.html" class="btn btn-primary d-flex gap-2 hstack justify-content-center rounded-3">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus-circle" viewBox="0 0 16 16">
<path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z" />
<path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z" />
</svg>
<div class="vr d-none d-sm-inline-block"></div>
<span>Add Listing</span>
</a>
<!-- end /. button -->
</div>
</div>
</div>
</nav>
<!-- end /. navbar -->
<!-- start details header -->
<div class="py-4">
<div class="container">
<div class="justify-content-between row align-items-center g-4">
<div class="col-lg col-xxl-8">
<h1 class="h2 page-header-title fw-semibold">2015 Hyundai Elite i20</h1>
<ul class="list-inline list-separator d-flex align-items-center mb-2">
<li class="list-inline-item">
<a class="fw-medium" href="#">Hyundai<i class="fa-solid fa-arrow-up-right-from-square fs-14 ms-2"></i></a>
</li>
<li class="list-inline-item">
<div class="d-flex align-items-center gap-2 ms-auto">
<div class="d-flex align-items-center text-primary rating-stars">
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon half"></i>
<i class="fa-star-icon none"></i>
</div>
<!-- start counter text -->
<span class="fw-medium text-primary"><span class="fs-6 fw-semibold me-1">(4.5)</span><small>2,391 reviews</small></span>
<!-- end /. counter text -->
</div>
</li>
</ul>
<ul class="fs-14 fw-medium list-inline list-separator mb-0 text-muted">
<li class="list-inline-item">Posted 7 hours ago</li>
<li class="list-inline-item">1123 Fictional St, San Francisco</li>
<li class="list-inline-item">Top Model</li>
</ul>
</div>
<div class="col-lg-auto">
<!-- start checkbbox bookmark -->
<div class="form-check form-check-bookmark mb-2 mb-sm-0">
<input class="form-check-input" type="checkbox" value="" id="jobBookmarkCheck">
<label class="form-check-label" for="jobBookmarkCheck">
<span class="form-check-bookmark-default">
<i class="fa-regular fa-heart me-1"></i> Save this listing
</span>
<span class="form-check-bookmark-active">
<i class="fa-solid fa-heart me-1"></i> Saved
</span>
</label>
</div>
<!-- end /. checkbbox bookmark -->
<div class="small mt-1">46 people bookmarked this place</div>
</div>
</div>
</div>
</div>
<!-- end /. details header -->
<!-- satart gallery -->
<div class="container">
<div class="rounded-4 overflow-hidden">
<div class="row gx-2 zoom-gallery">
<div class="col-md-8">
<a class="d-block position-relative" href="assets/images/listing-details/gallery/11.jpg">
<img class="img-fluid w-100" src="assets/images/listing-details/gallery/11.jpg" alt="Image Description">
<div class="position-absolute bottom-0 end-0 mb-3 me-3">
<span class="align-items-center btn btn-light btn-sm d-flex d-md-none fw-semibold gap-2">
<i class="fa-solid fa-expand"></i>
<span> View photos</span>
</span>
</div>
</a>
</div>
<div class="col-md-4 d-none d-md-inline-block">
<a class="d-block mb-2" href="assets/images/listing-details/gallery/12.jpg">
<img class="img-fluid w-100" src="assets/images/listing-details/gallery/12.jpg" alt="Image Description">
</a>
<a class="d-block position-relative" href="assets/images/listing-details/gallery/13.jpg">
<img class="img-fluid w-100" src="assets/images/listing-details/gallery/13.jpg" alt="Image Description">
<div class="position-absolute bottom-0 end-0 mb-3 me-3">
<span class="align-items-center btn btn-light btn-sm d-md-inline-flex d-none fw-semibold gap-2">
<i class="fa-solid fa-expand"></i>
<span> View photos</span>
</span>
</div>
</a>
</div>
</div>
</div>
<div class="d-flex justify-content-end mt-2 fs-14">
<span class="small text-dark fw-semibold">Published:</span>
<span class="small ms-1 text-muted">November 21, 2023</span>
</div>
</div>
<!-- end /. gallery -->
<!-- start listing details -->
<div class="py-5">
<div class="container">
<div class="row">
<div class="col-lg-7 content">
<div class="mb-5 border-bottom pb-5">
<h4 class="fw-semibold fs-3 mb-4">Know Your <span class="font-caveat text-primary">Car</span></h4>
<div class="row justify-content-between g-4 mb-4">
<div class="col-md-5">
<div class="d-flex">
<div class="flex-shrink-0">
<div class="align-items-center border-0 box-icon card d-flex fs-5 justify-content-center rounded-3">
<!-- <svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" fill="currentColor" class="bi bi-life-preserver" viewBox="0 0 16 16">
<path d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m6.43-5.228a7.025 7.025 0 0 1-3.658 3.658l-1.115-2.788a4.015 4.015 0 0 0 1.985-1.985zM5.228 14.43a7.025 7.025 0 0 1-3.658-3.658l2.788-1.115a4.015 4.015 0 0 0 1.985 1.985zm9.202-9.202-2.788 1.115a4.015 4.015 0 0 0-1.985-1.985l1.115-2.788a7.025 7.025 0 0 1 3.658 3.658m-8.087-.87a4.015 4.015 0 0 0-1.985 1.985L1.57 5.228A7.025 7.025 0 0 1 5.228 1.57l1.115 2.788zM8 11a3 3 0 1 1 0-6 3 3 0 0 1 0 6" />
</svg> -->
<i class="fa-regular fa-life-ring"></i>
</div>
</div>
<div class="flex-grow-1 ms-3">
<div class="fw-bold fs-15">100% tyre life remaining</div>
<div class="fs-13 text-muted">2 tyres that still have 100% of their tread life remaining</div>
</div>
</div>
</div>
<div class="col-md-5">
<div class="d-flex">
<div class="flex-shrink-0">
<div class="align-items-center border-0 box-icon card d-flex fs-5 justify-content-center rounded-3">
<i class="fa-solid fa-shield"></i>
</div>
</div>
<div class="flex-grow-1 ms-3">
<div class="fw-bold fs-15">Standard safety features</div>
<div class="fs-13 text-muted">Equipped with 2 airbags and an Antilock Braking System (ABS)</div>
</div>
</div>
</div>
<div class="col-md-5">
<div class="d-flex">
<div class="flex-shrink-0">
<div class="align-items-center border-0 box-icon card d-flex fs-5 justify-content-center rounded-3">
<i class="fa-solid fa-building-wheat"></i>
</div>
</div>
<div class="flex-grow-1 ms-3">
<div class="fw-bold fs-15">City Driven</div>
<div class="fs-13 text-muted">Cars driven for shorter trips in cities</div>
</div>
</div>
</div>
</div>
<div class="row g-4">
<div class="col-auto col-lg-3">
<!-- Start Amenities -->
<div class="d-flex align-items-center text-dark">
<div class="flex-shrink-0">
<i class="fa-solid fa-calendar fs-18"></i>
</div>
<div class="flex-grow-1 fs-16 fw-medium ms-3">
<div class="fs-12 text-muted">Reg Yea</div>
<div class="fw-bold fs-15">May 20</div>
</div>
</div>
<!-- /. End Amenities -->
</div>
<div class="col-auto col-lg-3">
<!-- Start Amenities -->
<div class="d-flex align-items-center text-dark">
<div class="flex-shrink-0">
<i class="fa-solid fa-building-wheat fs-18"></i>
</div>
<div class="flex-grow-1 fs-16 fw-medium ms-3">
<div class="fs-12 text-muted">Make Year</div>
<div class="fw-bold fs-15">2015</div>
</div>
</div>
<!-- /. End Amenities -->
</div>
<div class="col-auto col-lg-3">
<!-- Start Amenities -->
<div class="d-flex align-items-center text-dark">
<div class="flex-shrink-0">
<i class="fa-solid fa-road fs-18"></i>
</div>
<div class="flex-grow-1 fs-16 fw-medium ms-3">
<div class="fs-12 text-muted">Reg Numbe</div>
<div class="fw-bold fs-15">DL3C-CC6942</div>
</div>
</div>
<!-- /. End Amenities -->
</div>
<div class="col-auto col-lg-3">
<!-- Start Amenities -->
<div class="d-flex align-items-center text-dark">
<div class="flex-shrink-0">
<i class="fa-solid fa-puzzle-piece fs-18"></i>
</div>
<div class="flex-grow-1 fs-16 fw-medium ms-3">
<div class="fs-12 text-muted">Engine Capacity</div>
<div class="fw-bold fs-15">1197 cc</div>
</div>
</div>
<!-- /. End Amenities -->
</div>
<div class="col-auto col-lg-3">
<!-- Start Amenities -->
<div class="d-flex align-items-center text-dark">
<div class="flex-shrink-0">
<i class="fa-solid fa-shield fs-18"></i>
</div>
<div class="flex-grow-1 fs-16 fw-medium ms-3">
<div class="fs-12 text-muted">Insurance</div>
<div class="fw-bold fs-15">Plans starting from ₹4,480/year</div>
</div>
</div>
<!-- /. End Amenities -->
</div>
<div class="col-auto col-lg-3">
<!-- Start Amenities -->
<div class="d-flex align-items-center text-dark">
<div class="flex-shrink-0">
<i class="fa-solid fa-key fs-18"></i>
</div>
<div class="flex-grow-1 fs-16 fw-medium ms-3">
<div class="fs-12 text-muted">Spare key</div>
<div class="fw-bold fs-15">Yes</div>
</div>
</div>
<!-- /. End Amenities -->
</div>
<div class="col-auto col-lg-3">
<!-- Start Amenities -->
<div class="d-flex align-items-center text-dark">
<div class="flex-shrink-0">
<i class="fa-solid fa-gauge fs-18"></i>
</div>
<div class="flex-grow-1 fs-16 fw-medium ms-3">
<div class="fs-12 text-muted">Transmission</div>
<div class="fw-bold fs-15">Manual</div>
</div>
</div>
<!-- /. End Amenities -->
</div>
<div class="col-auto col-lg-3">
<!-- Start Amenities -->
<div class="d-flex align-items-center text-dark">
<div class="flex-shrink-0">
<i class="fa-solid fa-stopwatch-20 fs-18"></i>
</div>
<div class="flex-grow-1 fs-16 fw-medium ms-3">
<div class="fs-12 text-muted">KM Driven</div>
<div class="fw-bold fs-15">36,594 km</div>
</div>
</div>
<!-- /. End Amenities -->
</div>
<div class="col-auto col-lg-3">
<!-- Start Amenities -->
<div class="d-flex align-items-center text-dark">
<div class="flex-shrink-0">
<i class="fa-solid fa-user-shield fs-18"></i>
</div>
<div class="flex-grow-1 fs-16 fw-medium ms-3">
<div class="fs-12 text-muted">Ownership</div>
<div class="fw-bold fs-15">2nd owner</div>
</div>
</div>
<!-- /. End Amenities -->
</div>
<div class="col-auto col-lg-3">
<!-- Start Amenities -->
<div class="d-flex align-items-center text-dark">
<div class="flex-shrink-0">
<i class="fa-solid fa-gas-pump fs-18"></i>
</div>
<div class="flex-grow-1 fs-16 fw-medium ms-3">
<div class="fs-12 text-muted">Fuel Type</div>
<div class="fw-bold fs-15">Petrol</div>
</div>
</div>
<!-- /. End Amenities -->
</div>
</div>
</div>
<div class="mb-5 border-bottom pb-5">
<h4 class="fw-semibold fs-3 mb-4">Inspection <span class="font-caveat text-primary">Report</span></h4>
<div class="row mb-4 g-4">
<div class="col-md-6">
<p class="mb-0 fs-14 text-muted">We aim to provide our customers with a reliable drive. Every car we sell is refurbished by experts at our Mega Refurbishment Labs.</p>
</div>
<div class="col-md-6">
<div class="row g-3">
<div class="col">
<div class="align-items-center border-0 box-icon card d-flex fs-5 justify-content-center m-auto rounded-3">
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" fill="currentColor" class="bi bi-truck" viewBox="0 0 16 16">
<path d="M0 3.5A1.5 1.5 0 0 1 1.5 2h9A1.5 1.5 0 0 1 12 3.5V5h1.02a1.5 1.5 0 0 1 1.17.563l1.481 1.85a1.5 1.5 0 0 1 .329.938V10.5a1.5 1.5 0 0 1-1.5 1.5H14a2 2 0 1 1-4 0H5a2 2 0 1 1-3.998-.085A1.5 1.5 0 0 1 0 10.5zm1.294 7.456A1.999 1.999 0 0 1 4.732 11h5.536a2.01 2.01 0 0 1 .732-.732V3.5a.5.5 0 0 0-.5-.5h-9a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 .294.456M12 10a2 2 0 0 1 1.732 1h.768a.5.5 0 0 0 .5-.5V8.35a.5.5 0 0 0-.11-.312l-1.48-1.85A.5.5 0 0 0 13.02 6H12zm-9 1a1 1 0 1 0 0 2 1 1 0 0 0 0-2m9 0a1 1 0 1 0 0 2 1 1 0 0 0 0-2" />
</svg>
</div>
<div class="fs-13 fw-semibold lh-sm mt-2 text-center">Non<br> Accidental</div>
</div>
<div class="col">
<div class="align-items-center border-0 box-icon card d-flex fs-5 justify-content-center m-auto rounded-3">
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" fill="currentColor" class="bi bi-speedometer" viewBox="0 0 16 16">
<path d="M8 2a.5.5 0 0 1 .5.5V4a.5.5 0 0 1-1 0V2.5A.5.5 0 0 1 8 2M3.732 3.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 8a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 8m9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5m.754-4.246a.389.389 0 0 0-.527-.02L7.547 7.31A.91.91 0 1 0 8.85 8.569l3.434-4.297a.389.389 0 0 0-.029-.518z" />
<path fill-rule="evenodd" d="M6.664 15.889A8 8 0 1 1 9.336.11a8 8 0 0 1-2.672 15.78zm-4.665-4.283A11.945 11.945 0 0 1 8 10c2.186 0 4.236.585 6.001 1.606a7 7 0 1 0-12.002 0z" />
</svg>
</div>
<div class="fs-13 fw-semibold lh-sm mt-2 text-center">Non<br> Tampered</div>
</div>
<div class="col">
<div class="align-items-center border-0 box-icon card d-flex fs-5 justify-content-center m-auto rounded-3">
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" fill="currentColor" class="bi bi-car-front" viewBox="0 0 16 16">
<path d="M4 9a1 1 0 1 1-2 0 1 1 0 0 1 2 0m10 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0M6 8a1 1 0 0 0 0 2h4a1 1 0 1 0 0-2zM4.862 4.276 3.906 6.19a.51.51 0 0 0 .497.731c.91-.073 2.35-.17 3.597-.17 1.247 0 2.688.097 3.597.17a.51.51 0 0 0 .497-.731l-.956-1.913A.5.5 0 0 0 10.691 4H5.309a.5.5 0 0 0-.447.276" />
<path d="M2.52 3.515A2.5 2.5 0 0 1 4.82 2h6.362c1 0 1.904.596 2.298 1.515l.792 1.848c.075.175.21.319.38.404.5.25.855.715.965 1.262l.335 1.679c.033.161.049.325.049.49v.413c0 .814-.39 1.543-1 1.997V13.5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-1.338c-1.292.048-2.745.088-4 .088s-2.708-.04-4-.088V13.5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-1.892c-.61-.454-1-1.183-1-1.997v-.413a2.5 2.5 0 0 1 .049-.49l.335-1.68c.11-.546.465-1.012.964-1.261a.807.807 0 0 0 .381-.404l.792-1.848ZM4.82 3a1.5 1.5 0 0 0-1.379.91l-.792 1.847a1.8 1.8 0 0 1-.853.904.807.807 0 0 0-.43.564L1.03 8.904a1.5 1.5 0 0 0-.03.294v.413c0 .796.62 1.448 1.408 1.484 1.555.07 3.786.155 5.592.155 1.806 0 4.037-.084 5.592-.155A1.479 1.479 0 0 0 15 9.611v-.413c0-.099-.01-.197-.03-.294l-.335-1.68a.807.807 0 0 0-.43-.563 1.807 1.807 0 0 1-.853-.904l-.792-1.848A1.5 1.5 0 0 0 11.18 3z" />
</svg>
</div>
<div class="fs-13 fw-semibold lh-sm mt-2 text-center">Non<br> Flooded</div>
</div>
<div class="col">
<div class="align-items-center border-0 box-icon card d-flex fs-5 justify-content-center m-auto rounded-3">
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" fill="currentColor" class="bi bi-patch-check" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M10.354 6.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7 8.793l2.646-2.647a.5.5 0 0 1 .708 0z" />
<path d="m10.273 2.513-.921-.944.715-.698.622.637.89-.011a2.89 2.89 0 0 1 2.924 2.924l-.01.89.636.622a2.89 2.89 0 0 1 0 4.134l-.637.622.011.89a2.89 2.89 0 0 1-2.924 2.924l-.89-.01-.622.636a2.89 2.89 0 0 1-4.134 0l-.622-.637-.89.011a2.89 2.89 0 0 1-2.924-2.924l.01-.89-.636-.622a2.89 2.89 0 0 1 0-4.134l.637-.622-.011-.89a2.89 2.89 0 0 1 2.924-2.924l.89.01.622-.636a2.89 2.89 0 0 1 4.134 0l-.715.698a1.89 1.89 0 0 0-2.704 0l-.92.944-1.32-.016a1.89 1.89 0 0 0-1.911 1.912l.016 1.318-.944.921a1.89 1.89 0 0 0 0 2.704l.944.92-.016 1.32a1.89 1.89 0 0 0 1.912 1.911l1.318-.016.921.944a1.89 1.89 0 0 0 2.704 0l.92-.944 1.32.016a1.89 1.89 0 0 0 1.911-1.912l-.016-1.318.944-.921a1.89 1.89 0 0 0 0-2.704l-.944-.92.016-1.32a1.89 1.89 0 0 0-1.912-1.911l-1.318.016z" />
</svg>
</div>
<div class="fs-13 fw-semibold lh-sm mt-2 text-center">140 Quality<br> Checks</div>
</div>
</div>
</div>
</div>
<div class="accordion inspection-accordion mb-3" id="accordionPanelsStayOpenExample">
<div class="accordion-item mb-3 rounded-4">
<h2 class="accordion-header">
<button class="accordion-button flex-wrap collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseOne" aria-expanded="false" aria-controls="panelsStayOpen-collapseOne">
<span class="d-flex gap-2 align-items-center mb-2">
<i class="fa-solid fa-circle-info text-danger"></i><strong class="fs-15">Imperfections</strong>
</span>
<span class="text-muted mb-0 fs-14">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal</span>
</button>
</h2>
<div id="panelsStayOpen-collapseOne" class="accordion-collapse collapse">
<div class="accordion-body pt-0">
<div class="bg-light fs-14 mb-4 p-3 rounded-3">
Parts with dents and scratches are repaired and repainted by professionals
</div>
<div class="zoom-gallery-two">
<div class="border-bottom pb-3 mb-3">
<div class="align-items-center row gy-4 gx-4 gx-sm-5">
<div class="col-12 col-sm fs-15 fw-medium">
Driver-side door: Slightly dented
</div>
<a href="assets/images/car-parts/camera-01.png" class="col-auto cursor-zoom-in">
<img src="assets/images/car-parts/camera-01.png" alt="" class="rounded-3" width="150">
</a>
<div class="col-auto">
<img src="assets/images/car-parts/01.png" alt="" width="70">
</div>
</div>
</div>
<div class="border-bottom pb-3 mb-3">
<div class="align-items-center row gy-4 gx-4 gx-sm-5">
<div class="col-12 col-sm fs-15 fw-medium">
Driver-side door: Minor scratches
</div>
<a href="assets/images/car-parts/camera-02.png" class="col-auto cursor-zoom-in">
<img src="assets/images/car-parts/camera-02.png" alt="" class="rounded-3" width="150">
</a>
<div class="col-auto">
<img src="assets/images/car-parts/02.png" alt="" width="70">
</div>
</div>
</div>
<div class="border-bottom pb-3 mb-3">
<div class="align-items-center row gy-4 gx-4 gx-sm-5">
<div class="col-12 col-sm fs-15 fw-medium">
Right rear door: Slightly dented
</div>
<a href="assets/images/car-parts/camera-03.png" class="col-auto cursor-zoom-in">
<img src="assets/images/car-parts/camera-03.png" alt="" class="rounded-3" width="150">
</a>
<div class="col-auto">
<img src="assets/images/car-parts/03.png" alt="" width="70">
</div>
</div>
</div>
<div class="border-bottom pb-3 mb-3">
<div class="align-items-center row gy-4 gx-4 gx-sm-5">
<div class="col-12 col-sm fs-15 fw-medium">
Right rear door: Minor scratches
</div>
<a href="assets/images/car-parts/camera-04.png" class="col-auto cursor-zoom-in">
<img src="assets/images/car-parts/camera-04.png" alt="" class="rounded-3" width="150">
</a>
<div class="col-auto">
<img src="assets/images/car-parts/04.png" alt="" width="70">
</div>
</div>
</div>
<div class="border-bottom pb-3 mb-3">
<div class="align-items-center row gy-4 gx-4 gx-sm-5">
<div class="col-12 col-sm fs-15 fw-medium">
Right rear door: Minor Dicky (Boot door): Jack/Tool not available
</div>
<a href="assets/images/car-parts/camera-05.png" class="col-auto cursor-zoom-in">
<img src="assets/images/car-parts/camera-05.png" alt="" class="rounded-3" width="150">
</a>
<div class="col-auto">
<img src="assets/images/car-parts/05.png" alt="" width="70">
</div>
</div>
</div>
<div class="border-bottom pb-3 mb-3">
<div class="align-items-center row gy-4 gx-4 gx-sm-5">
<div class="col-12 col-sm fs-15 fw-medium">
Dicky (Boot door): Slightly dented
</div>
<a href="assets/images/car-parts/camera-06.png" class="col-auto cursor-zoom-in">
<img src="assets/images/car-parts/camera-06.png" alt="" class="rounded-3" width="150">
</a>
<div class="col-auto">
<img src="assets/images/car-parts/06.png" alt="" width="70">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="accordion-item mb-3 rounded-4">
<h2 class="accordion-header">
<button class="accordion-button flex-wrap collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseTwo" aria-expanded="false" aria-controls="panelsStayOpen-collapseTwo">
<span class="d-flex gap-2 align-items-center mb-2">
<i class="fa-solid fa-gears text-blue"></i><strong class="fs-15">Repainted Parts</strong>
</span>
<span class="text-muted mb-0 fs-14">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words</span>
</button>
</h2>
<div id="panelsStayOpen-collapseTwo" class="accordion-collapse collapse">
<div class="accordion-body pt-0">
<div class="bg-light fs-14 mb-4 p-3 rounded-3">
Parts with dents and scratches are repaired and repainted by professionals
</div>
<div class="row gx-4 gy-3">
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Front passenger door
</div>
<div class="flex-shrink-0">
<img src="assets/images/car-parts/01.png" alt="" width="70">
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Rear left door
</div>
<div class="flex-shrink-0">
<img src="assets/images/car-parts/02.png" alt="" width="70">
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Driver-side door
</div>
<div class="flex-shrink-0">
<img src="assets/images/car-parts/03.png" alt="" width="70">
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Right rear door
</div>
<div class="flex-shrink-0">
<img src="assets/images/car-parts/04.png" alt="" width="70">
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Rear bumper
</div>
<div class="flex-shrink-0">
<img src="assets/images/car-parts/05.png" alt="" width="70">
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Dicky (Boot door)
</div>
<div class="flex-shrink-0">
<img src="assets/images/car-parts/06.png" alt="" width="70">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="accordion-item mb-3 rounded-4">
<h2 class="accordion-header">
<button class="accordion-button flex-wrap collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseThree" aria-expanded="false" aria-controls="panelsStayOpen-collapseThree">
<span class="d-flex gap-2 align-items-center mb-2">
<i class="fa-solid fa-circle-check text-success"></i>
<strong class="fs-15">Perfect Parts</strong>
</span>
<span class="text-muted mb-0 fs-14">The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.</span>
</button>
</h2>
<div id="panelsStayOpen-collapseThree" class="accordion-collapse collapse">
<div class="accordion-body pt-0">
<div class="mb-4">
<h5 class="fs-17 fw-bold mb-3">Electricals & Interior</h5>
<div class="row gx-4 gy-3">
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Front left seat (passenger seat)
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Driver seat
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Second-row left seat
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Second-row right seat
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Steering wheel
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Left front window switch / handle
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Right front window switch / handle
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Right rear window switch / handle
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Interior - LHS front door
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Interior - LHS rear door
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="">
<h5 class="fs-17 fw-bold mb-3">Air-conditioning</h5>
<div class="row gx-4 gy-3">
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Front left seat (passenger seat)
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Driver seat
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Second-row left seat
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Second-row right seat
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Steering wheel
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Left front window switch / handle
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Right front window switch / handle
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Right rear window switch / handle
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Interior - LHS front door
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Interior - LHS rear door
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="bi bi-check-circle-fill text-success" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" />
</svg>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="accordion-item mb-3 rounded-4">
<h2 class="accordion-header">
<button class="accordion-button flex-wrap" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseFour" aria-expanded="true" aria-controls="panelsStayOpen-collapseFour">
<span class="d-flex gap-2 align-items-center mb-2">
<i class="fa-solid fa-circle-info text-danger"></i><strong class="fs-15">Tyres (Life Remaining)</strong>
</span>
<span class="text-muted mb-0 fs-14"> It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop</span>
</button>
</h2>
<div id="panelsStayOpen-collapseFour" class="accordion-collapse collapse show">
<div class="accordion-body pt-0">
<div class="bg-light fs-14 mb-4 p-3 rounded-3">
These tyres are in good condition. We ensure every tyre has a minimum tread depth of 1 mm, with no sidewall damage
</div>
<div class="row gx-4 gy-3">
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Left Front Tyre
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<div class="percent percent-success">
<svg>
<circle cx="10" cy="10" r="8.9"></circle>
<circle cx="10" cy="10" r="8.9" style="--percent: 100"></circle>
</svg>
</div>
~ 100%
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Right Front Tyre
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<div class="percent percent-primary">
<svg>
<circle cx="10" cy="10" r="8.9"></circle>
<circle cx="10" cy="10" r="8.9" style="--percent: 70"></circle>
</svg>
</div>
~ 70%
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Left Rear Tyre
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<div class="percent percent-blue">
<svg>
<circle cx="10" cy="10" r="8.9"></circle>
<circle cx="10" cy="10" r="8.9" style="--percent: 79"></circle>
</svg>
</div>
~ 79%
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Right Rear Tyre
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<div class="percent percent-success">
<svg>
<circle cx="10" cy="10" r="8.9"></circle>
<circle cx="10" cy="10" r="8.9" style="--percent: 60"></circle>
</svg>
</div>
~ 60%
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="align-items-center border-bottom d-flex pb-2">
<div class="flex-grow-1 fs-15 fw-medium">
Spare Tyre
</div>
<div class="flex-shrink-0">
<div class="align-items-center d-flex fs-14 gap-1">
<div class="percent percent-success">
<svg>
<circle cx="10" cy="10" r="8.9"></circle>
<circle cx="10" cy="10" r="8.9" style="--percent: 69"></circle>
</svg>
</div>
~ 69%
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="mb-5 border-bottom pb-5">
<h4 class="fw-semibold fs-3 mb-4">Buy with <span class="font-caveat text-primary">Confidence</span></h4>
<div class="bg-no-repeat numbers-wrapper">
<div class="row g-4">
<div class="col-md-4">
<div class="number-wrap text-center">
<div class="align-items-center bg-primary d-flex font-caveat fs-2 justify-content-center mb-4 mx-auto number-circle-sm rounded-circle text-white">1</div>
<h6 class="fw-bold">ListOn Warranty</h6>
<p class="fs-14 m-0 text-muted">Guaranteed coverage of all covered parts during the period with zero cost</p>
</div>
</div>
<div class="col-md-4">
<div class="number-wrap text-center second">
<div class="align-items-center bg-primary d-flex font-caveat fs-2 justify-content-center mb-4 mx-auto number-circle-sm rounded-circle text-white">2</div>
<h6 class="fw-bold">7-Day Return</h6>
<p class="fs-14 m-0 text-muted">Love it, keep it. Changed your mind? Return it within 7 days for a full refund</p>
</div>
</div>
<div class="col-md-4">
<div class="number-wrap text-center">
<div class="align-items-center bg-primary d-flex font-caveat fs-2 justify-content-center mb-4 mx-auto number-circle-sm rounded-circle text-white">3</div>
<h6 class="fw-bold">Easy Financing Options</h6>
<p class="fs-14 m-0 text-muted">Become eligible for Zero Down Payment via EMIs of up to 72 months and instant loans</p>
</div>
</div>
</div>
</div>
</div>
<div class="mb-5 border-bottom pb-5">
<img src="assets/images/banner-02.jpg" class="img-fluid rounded-4" alt="">
</div>
<!-- start reviews section -->
<div class="mb-5 border-bottom pb-5">
<h4 class="fw-semibold fs-3 mb-4">Latest Property <span class="font-caveat text-primary">Reviews</span></h4>
<div class="card border-0 p-4 mb-5 rounded-4">
<div class="row g-4 align-items-center">
<div class="col-sm-auto">
<div class="rating-block text-center">
<!-- start title -->
<h5 class="font-caveat fs-4 mb-4">Average user rating</h5>
<!-- end /. title -->
<!-- Start Rating Point -->
<div class="rating-point position-relative ml-auto mr-auto">
<!-- Start Svg Icon -->
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width=".5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-star text-primary">
<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"> </polygon>
</svg>
<!-- /.End Svg Icon -->
<h3 class="position-absolute mb-0 fs-18 text-primary">4.3</h3>
</div>
<!-- End Rating Point -->
<span class="fs-13">2,525 Ratings &amp;</span><br>
<span class="fs-13">293 Reviews</span>
</div>
</div>
<div class="col">
<div class="rating-position">
<!-- start title -->
<h5 class="font-caveat fs-4 mb-4">Rating breakdown</h5>
<!-- end /. title -->
<!-- Start Rating Point -->
<!-- start rating dimension -->
<div class="align-items-center d-flex mb-2 rating-dimension gap-2">
<!-- start rating quantity -->
<div class="d-flex align-items-center gap-2">
<span class="fs-14 fw-semibold rating-points">5</span>
<div class="d-flex align-items-center text-primary rating-stars">
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
</div>
</div>
<!-- end /. rating quantity -->
<!-- Start Progress -->
<div class="progress flex-grow-1 me-2">
<div class="progress-bar bg-primary" role="progressbar" style="width: 90%" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<!-- /.End Progress -->
<!-- Start User Rating -->
<div class="bg-dark fs-11 fw-medium px-2 py-1 rounded-pill text-white user-rating">4.5</div>
<!-- /.End User Rating -->
</div>
<!-- end /. rating dimension -->
<!-- start rating dimension -->
<div class="align-items-center d-flex mb-2 rating-dimension gap-2">
<!-- start rating quantity -->
<div class="d-flex align-items-center gap-2">
<span class="fs-14 fw-semibold rating-points">5</span>
<div class="d-flex align-items-center text-primary rating-stars">
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon half"></i>
<i class="fa-star-icon none"></i>
</div>
</div>
<!-- end /. rating quantity -->
<!-- start progress -->
<div class="progress flex-grow-1 me-2">
<div class="progress-bar bg-success" role="progressbar" style="width: 80%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<!-- end /. progress -->
<!-- start user rating -->
<div class="bg-dark fs-11 fw-medium px-2 py-1 rounded-pill text-white user-rating">3.5</div>
<!-- end /. user rating -->
</div>
<!-- end /. rating dimension -->
<!-- start rating dimension -->
<div class="align-items-center d-flex mb-2 rating-dimension gap-2">
<!-- start rating quantity -->
<div class="d-flex align-items-center gap-2">
<span class="fs-14 fw-semibold rating-points">3</span>
<div class="d-flex align-items-center text-primary rating-stars">
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon half"></i>
<i class="fa-star-icon none"></i>
<i class="fa-star-icon none"></i>
</div>
</div>
<!-- end /. rating quantity -->
<!-- start progress -->
<div class="progress flex-grow-1 me-2">
<div class="progress-bar bg-warning" role="progressbar" style="width: 60%" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<!-- end /. progress -->
<!-- start user rating -->
<div class="bg-dark fs-11 fw-medium px-2 py-1 rounded-pill text-white user-rating">1.5</div>
<!-- end /. user rating -->
</div>
<!-- end /. rating dimension -->
<!-- start rating dimension -->
<div class="align-items-center d-flex mb-2 rating-dimension gap-2">
<!-- start rating quantity -->
<div class="d-flex align-items-center gap-2">
<span class="fs-14 fw-semibold rating-points">3</span>
<div class="d-flex align-items-center text-primary rating-stars">
<i class="fa-star-icon"></i>
<i class="fa-star-icon half"></i>
<i class="fa-star-icon none"></i>
<i class="fa-star-icon none"></i>
<i class="fa-star-icon none"></i>
</div>
</div>
<!-- end /. rating quantity -->
<!-- start progress -->
<div class="progress flex-grow-1 me-2">
<div class="progress-bar bg-info" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<!-- end /. progress -->
<!-- start user rating -->
<div class="bg-dark fs-11 fw-medium px-2 py-1 rounded-pill text-white user-rating">5.2</div>
<!-- end /. user rating -->
</div>
<!-- end /. rating dimension -->
<!-- start rating dimension -->
<div class="align-items-center d-flex mb-2 rating-dimension gap-2">
<!-- start rating quantity -->
<div class="d-flex align-items-center gap-2">
<span class="fs-14 fw-semibold rating-points">1</span>
<div class="d-flex align-items-center text-primary rating-stars">
<i class="fa-star-icon"></i>
<i class="fa-star-icon none"></i>
<i class="fa-star-icon none"></i>
<i class="fa-star-icon none"></i>
<i class="fa-star-icon none"></i>
</div>
</div>
<!-- end /. rating quantity -->
<!-- start progress -->
<div class="progress flex-grow-1 me-2">
<div class="progress-bar text-bg-danger" role="progressbar" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<!-- end /. progress -->
<!-- start user rating -->
<div class="bg-dark fs-11 fw-medium px-2 py-1 rounded-pill text-white user-rating">6.9</div>
<!-- end /. user rating -->
</div>
<!-- end /. rating dimension -->
</div>
</div>
</div>
</div>
<div class="d-flex mb-4 border-bottom pb-4">
<div class="flex-shrink-0">
<img src="assets/images/avatar/01.jpg" alt="..." height="70" width="70" class="object-fit-cover rounded-circle">
</div>
<div class="flex-grow-1 ms-4">
<div class="comment-header d-flex flex-wrap gap-2 mb-3">
<div>
<h4 class="fs-18 mb-0">- Ethan Blackwood</h4>
<div class="comment-datetime fs-12 text-muted">25 Oct 2023 at 12.27 pm</div>
</div>
<!-- start rating -->
<div class="d-flex align-items-center gap-2 ms-auto">
<div class="d-flex align-items-center text-primary rating-stars">
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon half"></i>
<i class="fa-star-icon none"></i>
</div>
<span class="fs-14 fw-semibold rating-points">3.5/5</span>
</div>
<!-- end /. rating -->
</div>
<div class="fs-15">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which.</div>
<!-- start review -->
<a href="#" class="btn btn-default btn-sm d-inline-flex gap-2 mt-4 px-3 rounded-pill">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-up" viewBox="0 0 16 16">
<path d="M8.864.046C7.908-.193 7.02.53 6.956 1.466c-.072 1.051-.23 2.016-.428 2.59-.125.36-.479 1.013-1.04 1.639-.557.623-1.282 1.178-2.131 1.41C2.685 7.288 2 7.87 2 8.72v4.001c0 .845.682 1.464 1.448 1.545 1.07.114 1.564.415 2.068.723l.048.03c.272.165.578.348.97.484.397.136.861.217 1.466.217h3.5c.937 0 1.599-.477 1.934-1.064a1.86 1.86 0 0 0 .254-.912c0-.152-.023-.312-.077-.464.201-.263.38-.578.488-.901.11-.33.172-.762.004-1.149.069-.13.12-.269.159-.403.077-.27.113-.568.113-.857 0-.288-.036-.585-.113-.856a2.144 2.144 0 0 0-.138-.362 1.9 1.9 0 0 0 .234-1.734c-.206-.592-.682-1.1-1.2-1.272-.847-.282-1.803-.276-2.516-.211a9.84 9.84 0 0 0-.443.05 9.365 9.365 0 0 0-.062-4.509A1.38 1.38 0 0 0 9.125.111L8.864.046zM11.5 14.721H8c-.51 0-.863-.069-1.14-.164-.281-.097-.506-.228-.776-.393l-.04-.024c-.555-.339-1.198-.731-2.49-.868-.333-.036-.554-.29-.554-.55V8.72c0-.254.226-.543.62-.65 1.095-.3 1.977-.996 2.614-1.708.635-.71 1.064-1.475 1.238-1.978.243-.7.407-1.768.482-2.85.025-.362.36-.594.667-.518l.262.066c.16.04.258.143.288.255a8.34 8.34 0 0 1-.145 4.725.5.5 0 0 0 .595.644l.003-.001.014-.003.058-.014a8.908 8.908 0 0 1 1.036-.157c.663-.06 1.457-.054 2.11.164.175.058.45.3.57.65.107.308.087.67-.266 1.022l-.353.353.353.354c.043.043.105.141.154.315.048.167.075.37.075.581 0 .212-.027.414-.075.582-.05.174-.111.272-.154.315l-.353.353.353.354c.047.047.109.177.005.488a2.224 2.224 0 0 1-.505.805l-.353.353.353.354c.006.005.041.05.041.17a.866.866 0 0 1-.121.416c-.165.288-.503.56-1.066.56z" />
</svg>
Helpful Review
<div class="vr d-none d-sm-inline-block"></div>
<span class="fw-semibold">16</span>
</a>
<!-- end /. review -->
<div class="row mt-3 g-2 review-image zoom-gallery">
<div class="col-auto">
<a href="assets/images/listing-details/review-image-05.jpg" class="galary-overlay-hover dark-overlay position-relative d-block overflow-hidden rounded-3">
<img src="assets/images/listing-details/review-image-05.jpg" alt="" class="img-fluid rounded-3 object-fit-cover" height="70" width="112">
<div class="galary-hover-element h-100 position-absolute start-50 top-50 translate-middle w-100">
<i class="fa-solid fa-expand text-white position-absolute top-50 start-50 translate-middle bg-primary rounded-1 p-2 lh-1"></i>
</div>
</a>
</div>
<div class="col-auto">
<a href="assets/images/listing-details/review-image-06.jpg" class="galary-overlay-hover dark-overlay position-relative d-block overflow-hidden rounded-3">
<img src="assets/images/listing-details/review-image-06.jpg" alt="" class="img-fluid rounded-3 object-fit-cover" height="70" width="112">
<div class="galary-hover-element h-100 position-absolute start-50 top-50 translate-middle w-100">
<i class="fa-solid fa-expand text-white position-absolute top-50 start-50 translate-middle bg-primary rounded-1 p-2 lh-1"></i>
</div>
</a>
</div>
<div class="col-auto">
<a href="assets/images/listing-details/review-image-07.jpg" class="galary-overlay-hover dark-overlay position-relative d-block overflow-hidden rounded-3">
<img src="assets/images/listing-details/review-image-07.jpg" alt="" class="img-fluid rounded-3 object-fit-cover" height="70" width="112">
<div class="galary-hover-element h-100 position-absolute start-50 top-50 translate-middle w-100">
<i class="fa-solid fa-expand text-white position-absolute top-50 start-50 translate-middle bg-primary rounded-1 p-2 lh-1"></i>
</div>
</a>
</div>
</div>
<div class="d-flex mt-4 border-top pt-4">
<div class="flex-shrink-0">
<img src="assets/images/avatar/06.jpg" alt="..." height="60" width="60" class="object-fit-cover rounded-circle">
</div>
<div class="flex-grow-1 ms-3">
<div class="comment-header d-flex flex-wrap gap-2 mb-3">
<div>
<h4 class="fs-18 mb-0">- Gabriel North</h4>
<div class="comment-datetime fs-12 text-muted">25 Oct 2023 at 12.27 pm</div>
</div>
</div>
<div class="fs-15"> This is some content from a media component. You can replace this with any content and adjust it as needed.</div>
<!-- start review -->
<a href="#" class="btn btn-default btn-sm d-inline-flex gap-2 mt-4 px-3 rounded-pill">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-up" viewBox="0 0 16 16">
<path d="M8.864.046C7.908-.193 7.02.53 6.956 1.466c-.072 1.051-.23 2.016-.428 2.59-.125.36-.479 1.013-1.04 1.639-.557.623-1.282 1.178-2.131 1.41C2.685 7.288 2 7.87 2 8.72v4.001c0 .845.682 1.464 1.448 1.545 1.07.114 1.564.415 2.068.723l.048.03c.272.165.578.348.97.484.397.136.861.217 1.466.217h3.5c.937 0 1.599-.477 1.934-1.064a1.86 1.86 0 0 0 .254-.912c0-.152-.023-.312-.077-.464.201-.263.38-.578.488-.901.11-.33.172-.762.004-1.149.069-.13.12-.269.159-.403.077-.27.113-.568.113-.857 0-.288-.036-.585-.113-.856a2.144 2.144 0 0 0-.138-.362 1.9 1.9 0 0 0 .234-1.734c-.206-.592-.682-1.1-1.2-1.272-.847-.282-1.803-.276-2.516-.211a9.84 9.84 0 0 0-.443.05 9.365 9.365 0 0 0-.062-4.509A1.38 1.38 0 0 0 9.125.111L8.864.046zM11.5 14.721H8c-.51 0-.863-.069-1.14-.164-.281-.097-.506-.228-.776-.393l-.04-.024c-.555-.339-1.198-.731-2.49-.868-.333-.036-.554-.29-.554-.55V8.72c0-.254.226-.543.62-.65 1.095-.3 1.977-.996 2.614-1.708.635-.71 1.064-1.475 1.238-1.978.243-.7.407-1.768.482-2.85.025-.362.36-.594.667-.518l.262.066c.16.04.258.143.288.255a8.34 8.34 0 0 1-.145 4.725.5.5 0 0 0 .595.644l.003-.001.014-.003.058-.014a8.908 8.908 0 0 1 1.036-.157c.663-.06 1.457-.054 2.11.164.175.058.45.3.57.65.107.308.087.67-.266 1.022l-.353.353.353.354c.043.043.105.141.154.315.048.167.075.37.075.581 0 .212-.027.414-.075.582-.05.174-.111.272-.154.315l-.353.353.353.354c.047.047.109.177.005.488a2.224 2.224 0 0 1-.505.805l-.353.353.353.354c.006.005.041.05.041.17a.866.866 0 0 1-.121.416c-.165.288-.503.56-1.066.56z" />
</svg>
Helpful Review
<div class="vr d-none d-sm-inline-block"></div>
<span class="fw-semibold">16</span>
</a>
<!-- end /. review -->
</div>
</div>
</div>
</div>
<div class="d-flex mb-4 border-bottom pb-4">
<div class="flex-shrink-0">
<img src="assets/images/avatar/04.jpg" alt="..." height="70" width="70" class="object-fit-cover rounded-circle">
</div>
<div class="flex-grow-1 ms-3">
<div class="comment-header d-flex flex-wrap gap-2 mb-3">
<div>
<h4 class="fs-18 mb-0">- Pranoti Deshpande</h4>
<div class="comment-datetime fs-12 text-muted">25 Oct 2023 at 12.27 pm</div>
</div>
<!-- start rating -->
<div class="d-flex align-items-center gap-2 ms-auto">
<div class="d-flex align-items-center text-primary rating-stars">
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon half"></i>
<i class="fa-star-icon none"></i>
</div>
<span class="fs-14 fw-semibold rating-points">3.5/5</span>
</div>
<!-- end /. rating -->
</div>
<div class="fs-15">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. </div>
<!-- start review -->
<a href="#" class="btn btn-default btn-sm d-inline-flex gap-2 mt-4 px-3 rounded-pill">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-up" viewBox="0 0 16 16">
<path d="M8.864.046C7.908-.193 7.02.53 6.956 1.466c-.072 1.051-.23 2.016-.428 2.59-.125.36-.479 1.013-1.04 1.639-.557.623-1.282 1.178-2.131 1.41C2.685 7.288 2 7.87 2 8.72v4.001c0 .845.682 1.464 1.448 1.545 1.07.114 1.564.415 2.068.723l.048.03c.272.165.578.348.97.484.397.136.861.217 1.466.217h3.5c.937 0 1.599-.477 1.934-1.064a1.86 1.86 0 0 0 .254-.912c0-.152-.023-.312-.077-.464.201-.263.38-.578.488-.901.11-.33.172-.762.004-1.149.069-.13.12-.269.159-.403.077-.27.113-.568.113-.857 0-.288-.036-.585-.113-.856a2.144 2.144 0 0 0-.138-.362 1.9 1.9 0 0 0 .234-1.734c-.206-.592-.682-1.1-1.2-1.272-.847-.282-1.803-.276-2.516-.211a9.84 9.84 0 0 0-.443.05 9.365 9.365 0 0 0-.062-4.509A1.38 1.38 0 0 0 9.125.111L8.864.046zM11.5 14.721H8c-.51 0-.863-.069-1.14-.164-.281-.097-.506-.228-.776-.393l-.04-.024c-.555-.339-1.198-.731-2.49-.868-.333-.036-.554-.29-.554-.55V8.72c0-.254.226-.543.62-.65 1.095-.3 1.977-.996 2.614-1.708.635-.71 1.064-1.475 1.238-1.978.243-.7.407-1.768.482-2.85.025-.362.36-.594.667-.518l.262.066c.16.04.258.143.288.255a8.34 8.34 0 0 1-.145 4.725.5.5 0 0 0 .595.644l.003-.001.014-.003.058-.014a8.908 8.908 0 0 1 1.036-.157c.663-.06 1.457-.054 2.11.164.175.058.45.3.57.65.107.308.087.67-.266 1.022l-.353.353.353.354c.043.043.105.141.154.315.048.167.075.37.075.581 0 .212-.027.414-.075.582-.05.174-.111.272-.154.315l-.353.353.353.354c.047.047.109.177.005.488a2.224 2.224 0 0 1-.505.805l-.353.353.353.354c.006.005.041.05.041.17a.866.866 0 0 1-.121.416c-.165.288-.503.56-1.066.56z" />
</svg>
Helpful Review
<div class="vr d-none d-sm-inline-block"></div>
<span class="fw-semibold">16</span>
</a>
<!-- end /. review -->
</div>
</div>
<div class="d-flex mb-4">
<div class="flex-shrink-0">
<img src="assets/images/avatar/05.jpg" alt="..." height="70" width="70" class="object-fit-cover rounded-circle">
</div>
<div class="flex-grow-1 ms-3">
<div class="comment-header d-flex flex-wrap gap-2 mb-3">
<div>
<h4 class="fs-18 mb-0">- Marcus Knight</h4>
<div class="comment-datetime fs-12 text-muted">25 Oct 2023 at 12.27 pm</div>
</div>
<!-- start rating -->
<div class="d-flex align-items-center gap-2 ms-auto">
<div class="d-flex align-items-center text-primary rating-stars">
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon"></i>
<i class="fa-star-icon half"></i>
<i class="fa-star-icon none"></i>
</div>
<span class="fs-14 fw-semibold rating-points">3.5/5</span>
</div>
<!-- end /. rating -->
</div>
<div class="fs-15"> This is some content from a media component. You can replace this with any content and adjust it as needed.</div>
<!-- start review -->
<a href="#" class="btn btn-default btn-sm d-inline-flex gap-2 mt-4 px-3 rounded-pill">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hand-thumbs-up" viewBox="0 0 16 16">
<path d="M8.864.046C7.908-.193 7.02.53 6.956 1.466c-.072 1.051-.23 2.016-.428 2.59-.125.36-.479 1.013-1.04 1.639-.557.623-1.282 1.178-2.131 1.41C2.685 7.288 2 7.87 2 8.72v4.001c0 .845.682 1.464 1.448 1.545 1.07.114 1.564.415 2.068.723l.048.03c.272.165.578.348.97.484.397.136.861.217 1.466.217h3.5c.937 0 1.599-.477 1.934-1.064a1.86 1.86 0 0 0 .254-.912c0-.152-.023-.312-.077-.464.201-.263.38-.578.488-.901.11-.33.172-.762.004-1.149.069-.13.12-.269.159-.403.077-.27.113-.568.113-.857 0-.288-.036-.585-.113-.856a2.144 2.144 0 0 0-.138-.362 1.9 1.9 0 0 0 .234-1.734c-.206-.592-.682-1.1-1.2-1.272-.847-.282-1.803-.276-2.516-.211a9.84 9.84 0 0 0-.443.05 9.365 9.365 0 0 0-.062-4.509A1.38 1.38 0 0 0 9.125.111L8.864.046zM11.5 14.721H8c-.51 0-.863-.069-1.14-.164-.281-.097-.506-.228-.776-.393l-.04-.024c-.555-.339-1.198-.731-2.49-.868-.333-.036-.554-.29-.554-.55V8.72c0-.254.226-.543.62-.65 1.095-.3 1.977-.996 2.614-1.708.635-.71 1.064-1.475 1.238-1.978.243-.7.407-1.768.482-2.85.025-.362.36-.594.667-.518l.262.066c.16.04.258.143.288.255a8.34 8.34 0 0 1-.145 4.725.5.5 0 0 0 .595.644l.003-.001.014-.003.058-.014a8.908 8.908 0 0 1 1.036-.157c.663-.06 1.457-.054 2.11.164.175.058.45.3.57.65.107.308.087.67-.266 1.022l-.353.353.353.354c.043.043.105.141.154.315.048.167.075.37.075.581 0 .212-.027.414-.075.582-.05.174-.111.272-.154.315l-.353.353.353.354c.047.047.109.177.005.488a2.224 2.224 0 0 1-.505.805l-.353.353.353.354c.006.005.041.05.041.17a.866.866 0 0 1-.121.416c-.165.288-.503.56-1.066.56z" />
</svg>
Helpful Review
<div class="vr d-none d-sm-inline-block"></div>
<span class="fw-semibold">16</span>
</a>
<!-- end /. review -->
</div>
</div>
</div>
<!-- end /. reviews section -->
<!-- start comment form section -->
<div class="mb-4 mb-lg-0">
<h4 class="fw-semibold fs-3 mb-4">Leave a <span class="font-caveat text-primary">Comment</span></h4>
<form class="row g-4">
<div class="col-sm-6">
<!-- start form group -->
<div class="">
<label class="required fw-medium mb-2">Full Name</label>
<input type="text" class="form-control" placeholder="Enter your name" required="">
</div>
<!-- end /. form group -->
</div>
<div class="col-sm-6">
<!-- start form group -->
<div class="">
<label class="required fw-medium mb-2">Email Address</label>
<input type="text" class="form-control" placeholder="Enter your email address">
</div>
<!-- end /. form group -->
</div>
<div class="col-sm-12">
<!-- start form group -->
<div class="">
<label class="required fw-medium mb-2">Comment</label>
<textarea class="form-control" rows="7" placeholder="Tell us what we can help you with!"></textarea>
</div>
<!-- end /. form group -->
</div>
<div class="col-sm-12 text-end">
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</form>
</div>
<!-- end /. comment form section -->
</div>
<div class="col-lg-5 ps-xxl-5 sidebar">
<div class="card border-0 p-4 rounded-4">
<h4 class="fw-bold mb-1">2015 Hyundai Elite i20</h4>
<ul class="fs-14 fw-medium list-inline list-separator mb-0 text-muted">
<li class="list-inline-item">SPORTZ 1.2</li>
<li class="list-inline-item">Manual</li>
</ul>
<div class="d-flex flex-wrap gap-2 mt-3">
<div class="bg-light fs-13 fw-bold px-3 py-1 rounded-2">36,594 KM</div>
<div class="bg-light fs-13 fw-bold px-3 py-1 rounded-2">2ND OWNER</div>
<div class="bg-light fs-13 fw-bold px-3 py-1 rounded-2">PETROL</div>
<div class="bg-light fs-13 fw-bold px-3 py-1 rounded-2">DL-3C</div>
</div>
<ul class="d-flex flex-column fs-14 gap-2 list-unstyled mb-1 mt-4 text-muted">
<li><i class="fa-solid fa-house-chimney fs-13 me-2"></i>Home Test Drive Available</li>
<li><i class="fa-solid fa-location-dot fs-13 me-2"></i>1123 Fictional St, San Francisco</li>
<li><i class="fa-solid fa-file-lines fs-13 me-2"></i>View Inspection Report</li>
<li><i class="fa-solid fa-flag fs-13 me-2"></i> Get Service History Report</li>
</ul>
<div class="row g-0">
<div class="col-sm-6 ps-0 py-3">
<p class="fs-5 fw-bold fw-medium mb-0 text-primary">$7,957/month</p>
<div class="fs-13 fw-medium text-capitalize">On Zero down payment</div>
<a href="#" class="fs-12 fw-medium text-blue text-uppercase">CHECK ELIGIBILITY &nbsp;</a>
</div>
<div class="col-sm-6 pe-0 py-3 text-end">
<p class="fs-5 fw-bold fw-medium mb-0">$4.07 Lakh</p>
<div class="fs-13 fw-medium text-decoration-line-through text-capitalize">$4.4 Lakh</div>
<a href="#" class="fs-12 fw-medium text-blue text-uppercase">UNDERSTAND PRICE &nbsp;</a>
</div>
</div>
<div class="d-flex gap-3 mt-3">
<button type="button" class="btn btn-light" data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="favorite">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-heart" viewBox="0 0 16 16">
<path d="m8 2.748-.717-.737C5.6.281 2.514.878 1.4 3.053c-.523 1.023-.641 2.5.314 4.385.92 1.815 2.834 3.989 6.286 6.357 3.452-2.368 5.365-4.542 6.286-6.357.955-1.886.838-3.362.314-4.385C13.486.878 10.4.28 8.717 2.01zM8 15C-7.333 4.868 3.279-3.04 7.824 1.143c.06.055.119.112.176.171a3.12 3.12 0 0 1 .176-.17C12.72-3.042 23.333 4.867 8 15" />
</svg>
</button>
<button type="button" class="btn btn-primary w-100">BOOK FREE TEST DRIVE</button>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- end /. listing details -->
<!-- start listings carousel -->
<div class="py-5 position-relative overflow-hidden">
<div class="container py-4">
<div class="row justify-content-center">
<div class="col-sm-10 col-md-10 col-lg-8 col-xl-7">
<!-- start section header -->
<div class="section-header text-center mb-5" data-aos="fade-down">
<!-- start subtitle -->
<div class="d-inline-block font-caveat fs-1 fw-medium section-header__subtitle text-capitalize text-primary">Similar Listings</div>
<!-- end /. subtitle -->
<!-- start title -->
<h2 class="display-5 fw-semibold mb-3 section-header__title text-capitalize">Similar Listings you may like</h2>
<!-- end /. title -->
<!-- start description -->
<div class="sub-title fs-16">Discover exciting categories. <span class="text-primary fw-semibold">Find what youre looking for.</span></div>
<!-- end /. description -->
</div>
<!-- end /. section header -->
</div>
</div>
<div class="listings-carousel owl-carousel owl-theme owl-nav-bottom">
<!-- start listing card -->
<div class="card border-0 rounded-4 w-100 flex-fill overflow-hidden card-hover-bg">
<!-- start card link -->
<a href="listing-details-car.html" class="stretched-link"></a>
<!-- end /. card link -->
<!-- start card image wrap -->
<div class="card-img-wrap card-image-hover overflow-hidden dark-overlay">
<img src="assets/images/place/11.jpg" alt="" class="img-fluid">
<div class="align-items-center bg-blur border-0 card-badge d-flex d-inline-block fw-semibold gap-1 position-absolute start-0 text-uppercase text-white z-2">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fire" viewBox="0 0 16 16">
<path d="M8 16c3.314 0 6-2 6-5.5 0-1.5-.5-4-2.5-6 .25 1.5-1.25 2-1.25 2C11 4 9 .5 6 0c.357 2 .5 4-2 6-1.25 1-2 2.729-2 4.5C2 14 4.686 16 8 16m0-1c-1.657 0-3-1-3-2.75 0-.75.25-2 1.25-3C6.125 10 7 10.5 7 10.5c-.375-1.25.5-3.25 2-3.5-.179 1-.25 2 1 3 .625.5 1 1.364 1 2.25C11 14 9.657 15 8 15"></path>
</svg>
10% OFF
</div>
<div class="align-items-center bg-blur border-0 card-badge d-flex d-inline-block fw-semibold gap-1 position-absolute start-0 text-uppercase text-white z-2">$100 off $399: eblwc</div>
<div class="d-flex end-0 gap-2 me-3 mt-3 position-absolute top-0 z-1">
<a href="" class="btn-icon shadow-sm d-flex align-items-center justify-content-center text-primary bg-light rounded-circle" data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bookmark">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-heart" viewBox="0 0 16 16">
<path d="m8 2.748-.717-.737C5.6.281 2.514.878 1.4 3.053c-.523 1.023-.641 2.5.314 4.385.92 1.815 2.834 3.989 6.286 6.357 3.452-2.368 5.365-4.542 6.286-6.357.955-1.886.838-3.362.314-4.385C13.486.878 10.4.28 8.717 2.01L8 2.748zM8 15C-7.333 4.868 3.279-3.04 7.824 1.143c.06.055.119.112.176.171a3.12 3.12 0 0 1 .176-.17C12.72-3.042 23.333 4.867 8 15z"></path>
</svg>
</a>
</div>
</div>
<!-- end /. card image wrap -->
<div class="d-flex flex-column h-100 position-relative p-4">
<!-- start card title -->
<h4 class="fs-5 fw-semibold mb-1 text-truncate">2015 Hyundai Elite i20</h4>
<!-- end /. card title -->
<!-- start card description -->
<p class="mb-3 fs-13">CoWorking, Dedicated Desk, Serviced Offices POA</p>
<!-- end /. card description -->
<!-- start price -->
<div class="fs-5 fw-bold text-primary">$1.71 Lakh</div>
<!-- end /. price -->
<!-- Start meta info -->
<ul class="border-top fs-14 fw-medium fw-semibold list-inline list-separator mb-0 mb-2 mt-3 pt-3 text-muted text-uppercase">
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-speedometer2 me-1" viewBox="0 0 16 16">
<path d="M8 4a.5.5 0 0 1 .5.5V6a.5.5 0 0 1-1 0V4.5A.5.5 0 0 1 8 4M3.732 5.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 10a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 10m9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5m.754-4.246a.389.389 0 0 0-.527-.02L7.547 9.31a.91.91 0 1 0 1.302 1.258l3.434-4.297a.389.389 0 0 0-.029-.518z" />
<path fill-rule="evenodd" d="M0 10a8 8 0 1 1 15.547 2.661c-.442 1.253-1.845 1.602-2.932 1.25C11.309 13.488 9.475 13 8 13c-1.474 0-3.31.488-4.615.911-1.087.352-2.49.003-2.932-1.25A7.988 7.988 0 0 1 0 10m8-7a7 7 0 0 0-6.603 9.329c.203.575.923.876 1.68.63C4.397 12.533 6.358 12 8 12s3.604.532 4.923.96c.757.245 1.477-.056 1.68-.631A7 7 0 0 0 8 3" />
</svg>
<span>69 Miles</span>
</div>
</li>
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fuel-pump me-1" viewBox="0 0 16 16">
<path d="M3 2.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 .5.5v5a.5.5 0 0 1-.5.5h-5a.5.5 0 0 1-.5-.5z" />
<path d="M1 2a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v8a2 2 0 0 1 2 2v.5a.5.5 0 0 0 1 0V8h-.5a.5.5 0 0 1-.5-.5V4.375a.5.5 0 0 1 .5-.5h1.495c-.011-.476-.053-.894-.201-1.222a.97.97 0 0 0-.394-.458c-.184-.11-.464-.195-.9-.195a.5.5 0 0 1 0-1c.564 0 1.034.11 1.412.336.383.228.634.551.794.907.295.655.294 1.465.294 2.081v3.175a.5.5 0 0 1-.5.501H15v4.5a1.5 1.5 0 0 1-3 0V12a1 1 0 0 0-1-1v4h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1zm9 0a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v13h8z" />
</svg>
<span>Petrol</span>
</div>
</li>
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-shuffle me-1" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M0 3.5A.5.5 0 0 1 .5 3H1c2.202 0 3.827 1.24 4.874 2.418.49.552.865 1.102 1.126 1.532.26-.43.636-.98 1.126-1.532C9.173 4.24 10.798 3 13 3v1c-1.798 0-3.173 1.01-4.126 2.082A9.624 9.624 0 0 0 7.556 8a9.624 9.624 0 0 0 1.317 1.918C9.828 10.99 11.204 12 13 12v1c-2.202 0-3.827-1.24-4.874-2.418A10.595 10.595 0 0 1 7 9.05c-.26.43-.636.98-1.126 1.532C4.827 11.76 3.202 13 1 13H.5a.5.5 0 0 1 0-1H1c1.798 0 3.173-1.01 4.126-2.082A9.624 9.624 0 0 0 6.444 8a9.624 9.624 0 0 0-1.317-1.918C4.172 5.01 2.796 4 1 4H.5a.5.5 0 0 1-.5-.5" />
<path d="M13 5.466V1.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384l-2.36 1.966a.25.25 0 0 1-.41-.192zm0 9v-3.932a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384l-2.36 1.966a.25.25 0 0 1-.41-.192z" />
</svg>
<span>CVT</span>
</div>
</li>
</ul>
<!-- end /. Meta info -->
<div class="fs-13 text-muted">Free Test Drive <span class="text-dark fw-semibold">Today</span> at <span class="text-dark fw-semibold">Noakhali, Bangladesh</span></div>
</div>
</div>
<!-- end /. listing card -->
<!-- start listing card -->
<div class="card border-0 rounded-4 w-100 flex-fill overflow-hidden card-hover-bg">
<!-- start card link -->
<a href="listing-details-car.html" class="stretched-link"></a>
<!-- end /. card link -->
<!-- start card image wrap -->
<div class="card-img-wrap card-image-hover overflow-hidden dark-overlay">
<img src="assets/images/place/12.jpg" alt="" class="img-fluid">
<div class="align-items-center bg-blur border-0 card-badge d-flex d-inline-block fw-semibold gap-1 position-absolute start-0 text-uppercase text-white z-2">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fire" viewBox="0 0 16 16">
<path d="M8 16c3.314 0 6-2 6-5.5 0-1.5-.5-4-2.5-6 .25 1.5-1.25 2-1.25 2C11 4 9 .5 6 0c.357 2 .5 4-2 6-1.25 1-2 2.729-2 4.5C2 14 4.686 16 8 16m0-1c-1.657 0-3-1-3-2.75 0-.75.25-2 1.25-3C6.125 10 7 10.5 7 10.5c-.375-1.25.5-3.25 2-3.5-.179 1-.25 2 1 3 .625.5 1 1.364 1 2.25C11 14 9.657 15 8 15"></path>
</svg>
10% OFF
</div>
<div class="align-items-center bg-blur border-0 card-badge d-flex d-inline-block fw-semibold gap-1 position-absolute start-0 text-uppercase text-white z-2">$100 off $399: eblwc</div>
<div class="d-flex end-0 gap-2 me-3 mt-3 position-absolute top-0 z-1">
<a href="" class="btn-icon shadow-sm d-flex align-items-center justify-content-center text-primary bg-light rounded-circle" data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bookmark">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-heart" viewBox="0 0 16 16">
<path d="m8 2.748-.717-.737C5.6.281 2.514.878 1.4 3.053c-.523 1.023-.641 2.5.314 4.385.92 1.815 2.834 3.989 6.286 6.357 3.452-2.368 5.365-4.542 6.286-6.357.955-1.886.838-3.362.314-4.385C13.486.878 10.4.28 8.717 2.01L8 2.748zM8 15C-7.333 4.868 3.279-3.04 7.824 1.143c.06.055.119.112.176.171a3.12 3.12 0 0 1 .176-.17C12.72-3.042 23.333 4.867 8 15z"></path>
</svg>
</a>
</div>
</div>
<!-- end /. card image wrap -->
<div class="d-flex flex-column h-100 position-relative p-4">
<!-- start card title -->
<h4 class="fs-5 fw-semibold mb-1 text-truncate">2017 Hyundai Grand i10 MAGNA 1.2 KAPPA VTVT</h4>
<!-- end /. card title -->
<!-- start card description -->
<p class="mb-3 fs-13">CoWorking, Dedicated Desk, Serviced Offices POA</p>
<!-- end /. card description -->
<!-- start price -->
<div class="fs-5 fw-bold text-primary">$1.71 Lakh</div>
<!-- end /. price -->
<!-- Start meta info -->
<ul class="border-top fs-14 fw-medium fw-semibold list-inline list-separator mb-0 mb-2 mt-3 pt-3 text-muted text-uppercase">
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-speedometer2 me-1" viewBox="0 0 16 16">
<path d="M8 4a.5.5 0 0 1 .5.5V6a.5.5 0 0 1-1 0V4.5A.5.5 0 0 1 8 4M3.732 5.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 10a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 10m9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5m.754-4.246a.389.389 0 0 0-.527-.02L7.547 9.31a.91.91 0 1 0 1.302 1.258l3.434-4.297a.389.389 0 0 0-.029-.518z" />
<path fill-rule="evenodd" d="M0 10a8 8 0 1 1 15.547 2.661c-.442 1.253-1.845 1.602-2.932 1.25C11.309 13.488 9.475 13 8 13c-1.474 0-3.31.488-4.615.911-1.087.352-2.49.003-2.932-1.25A7.988 7.988 0 0 1 0 10m8-7a7 7 0 0 0-6.603 9.329c.203.575.923.876 1.68.63C4.397 12.533 6.358 12 8 12s3.604.532 4.923.96c.757.245 1.477-.056 1.68-.631A7 7 0 0 0 8 3" />
</svg>
<span>69 Miles</span>
</div>
</li>
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fuel-pump me-1" viewBox="0 0 16 16">
<path d="M3 2.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 .5.5v5a.5.5 0 0 1-.5.5h-5a.5.5 0 0 1-.5-.5z" />
<path d="M1 2a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v8a2 2 0 0 1 2 2v.5a.5.5 0 0 0 1 0V8h-.5a.5.5 0 0 1-.5-.5V4.375a.5.5 0 0 1 .5-.5h1.495c-.011-.476-.053-.894-.201-1.222a.97.97 0 0 0-.394-.458c-.184-.11-.464-.195-.9-.195a.5.5 0 0 1 0-1c.564 0 1.034.11 1.412.336.383.228.634.551.794.907.295.655.294 1.465.294 2.081v3.175a.5.5 0 0 1-.5.501H15v4.5a1.5 1.5 0 0 1-3 0V12a1 1 0 0 0-1-1v4h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1zm9 0a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v13h8z" />
</svg>
<span>Petrol</span>
</div>
</li>
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-shuffle me-1" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M0 3.5A.5.5 0 0 1 .5 3H1c2.202 0 3.827 1.24 4.874 2.418.49.552.865 1.102 1.126 1.532.26-.43.636-.98 1.126-1.532C9.173 4.24 10.798 3 13 3v1c-1.798 0-3.173 1.01-4.126 2.082A9.624 9.624 0 0 0 7.556 8a9.624 9.624 0 0 0 1.317 1.918C9.828 10.99 11.204 12 13 12v1c-2.202 0-3.827-1.24-4.874-2.418A10.595 10.595 0 0 1 7 9.05c-.26.43-.636.98-1.126 1.532C4.827 11.76 3.202 13 1 13H.5a.5.5 0 0 1 0-1H1c1.798 0 3.173-1.01 4.126-2.082A9.624 9.624 0 0 0 6.444 8a9.624 9.624 0 0 0-1.317-1.918C4.172 5.01 2.796 4 1 4H.5a.5.5 0 0 1-.5-.5" />
<path d="M13 5.466V1.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384l-2.36 1.966a.25.25 0 0 1-.41-.192zm0 9v-3.932a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384l-2.36 1.966a.25.25 0 0 1-.41-.192z" />
</svg>
<span>CVT</span>
</div>
</li>
</ul>
<!-- end /. Meta info -->
<div class="fs-13 text-muted">Free Test Drive <span class="text-dark fw-semibold">Today</span> at <span class="text-dark fw-semibold">Noakhali, Bangladesh</span></div>
</div>
</div>
<!-- end /. listing card -->
<!-- start listing card -->
<div class="card border-0 rounded-4 w-100 flex-fill overflow-hidden card-hover-bg">
<!-- start card link -->
<a href="listing-details-car.html" class="stretched-link"></a>
<!-- end /. card link -->
<!-- start card image wrap -->
<div class="card-img-wrap card-image-hover overflow-hidden dark-overlay">
<img src="assets/images/place/13.jpg" alt="" class="img-fluid">
<div class="align-items-center bg-blur border-0 card-badge d-flex d-inline-block fw-semibold gap-1 position-absolute start-0 text-uppercase text-white z-2">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fire" viewBox="0 0 16 16">
<path d="M8 16c3.314 0 6-2 6-5.5 0-1.5-.5-4-2.5-6 .25 1.5-1.25 2-1.25 2C11 4 9 .5 6 0c.357 2 .5 4-2 6-1.25 1-2 2.729-2 4.5C2 14 4.686 16 8 16m0-1c-1.657 0-3-1-3-2.75 0-.75.25-2 1.25-3C6.125 10 7 10.5 7 10.5c-.375-1.25.5-3.25 2-3.5-.179 1-.25 2 1 3 .625.5 1 1.364 1 2.25C11 14 9.657 15 8 15"></path>
</svg>
10% OFF
</div>
<div class="align-items-center bg-blur border-0 card-badge d-flex d-inline-block fw-semibold gap-1 position-absolute start-0 text-uppercase text-white z-2">$100 off $399: eblwc</div>
<div class="d-flex end-0 gap-2 me-3 mt-3 position-absolute top-0 z-1">
<a href="" class="btn-icon shadow-sm d-flex align-items-center justify-content-center text-primary bg-light rounded-circle" data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bookmark">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-heart" viewBox="0 0 16 16">
<path d="m8 2.748-.717-.737C5.6.281 2.514.878 1.4 3.053c-.523 1.023-.641 2.5.314 4.385.92 1.815 2.834 3.989 6.286 6.357 3.452-2.368 5.365-4.542 6.286-6.357.955-1.886.838-3.362.314-4.385C13.486.878 10.4.28 8.717 2.01L8 2.748zM8 15C-7.333 4.868 3.279-3.04 7.824 1.143c.06.055.119.112.176.171a3.12 3.12 0 0 1 .176-.17C12.72-3.042 23.333 4.867 8 15z"></path>
</svg>
</a>
</div>
</div>
<!-- end /. card image wrap -->
<div class="d-flex flex-column h-100 position-relative p-4">
<!-- start card title -->
<h4 class="fs-5 fw-semibold mb-1 text-truncate">2021 Maruti Baleno DELTA PETROL 1.2</h4>
<!-- end /. card title -->
<!-- start card description -->
<p class="mb-3 fs-13">CoWorking, Dedicated Desk, Serviced Offices POA</p>
<!-- end /. card description -->
<!-- start price -->
<div class="fs-5 fw-bold text-primary">$1.71 Lakh</div>
<!-- end /. price -->
<!-- Start meta info -->
<ul class="border-top fs-14 fw-medium fw-semibold list-inline list-separator mb-0 mb-2 mt-3 pt-3 text-muted text-uppercase">
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-speedometer2 me-1" viewBox="0 0 16 16">
<path d="M8 4a.5.5 0 0 1 .5.5V6a.5.5 0 0 1-1 0V4.5A.5.5 0 0 1 8 4M3.732 5.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 10a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 10m9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5m.754-4.246a.389.389 0 0 0-.527-.02L7.547 9.31a.91.91 0 1 0 1.302 1.258l3.434-4.297a.389.389 0 0 0-.029-.518z" />
<path fill-rule="evenodd" d="M0 10a8 8 0 1 1 15.547 2.661c-.442 1.253-1.845 1.602-2.932 1.25C11.309 13.488 9.475 13 8 13c-1.474 0-3.31.488-4.615.911-1.087.352-2.49.003-2.932-1.25A7.988 7.988 0 0 1 0 10m8-7a7 7 0 0 0-6.603 9.329c.203.575.923.876 1.68.63C4.397 12.533 6.358 12 8 12s3.604.532 4.923.96c.757.245 1.477-.056 1.68-.631A7 7 0 0 0 8 3" />
</svg>
<span>69 Miles</span>
</div>
</li>
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fuel-pump me-1" viewBox="0 0 16 16">
<path d="M3 2.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 .5.5v5a.5.5 0 0 1-.5.5h-5a.5.5 0 0 1-.5-.5z" />
<path d="M1 2a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v8a2 2 0 0 1 2 2v.5a.5.5 0 0 0 1 0V8h-.5a.5.5 0 0 1-.5-.5V4.375a.5.5 0 0 1 .5-.5h1.495c-.011-.476-.053-.894-.201-1.222a.97.97 0 0 0-.394-.458c-.184-.11-.464-.195-.9-.195a.5.5 0 0 1 0-1c.564 0 1.034.11 1.412.336.383.228.634.551.794.907.295.655.294 1.465.294 2.081v3.175a.5.5 0 0 1-.5.501H15v4.5a1.5 1.5 0 0 1-3 0V12a1 1 0 0 0-1-1v4h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1zm9 0a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v13h8z" />
</svg>
<span>Petrol</span>
</div>
</li>
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-shuffle me-1" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M0 3.5A.5.5 0 0 1 .5 3H1c2.202 0 3.827 1.24 4.874 2.418.49.552.865 1.102 1.126 1.532.26-.43.636-.98 1.126-1.532C9.173 4.24 10.798 3 13 3v1c-1.798 0-3.173 1.01-4.126 2.082A9.624 9.624 0 0 0 7.556 8a9.624 9.624 0 0 0 1.317 1.918C9.828 10.99 11.204 12 13 12v1c-2.202 0-3.827-1.24-4.874-2.418A10.595 10.595 0 0 1 7 9.05c-.26.43-.636.98-1.126 1.532C4.827 11.76 3.202 13 1 13H.5a.5.5 0 0 1 0-1H1c1.798 0 3.173-1.01 4.126-2.082A9.624 9.624 0 0 0 6.444 8a9.624 9.624 0 0 0-1.317-1.918C4.172 5.01 2.796 4 1 4H.5a.5.5 0 0 1-.5-.5" />
<path d="M13 5.466V1.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384l-2.36 1.966a.25.25 0 0 1-.41-.192zm0 9v-3.932a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384l-2.36 1.966a.25.25 0 0 1-.41-.192z" />
</svg>
<span>CVT</span>
</div>
</li>
</ul>
<!-- end /. Meta info -->
<div class="fs-13 text-muted">Free Test Drive <span class="text-dark fw-semibold">Today</span> at <span class="text-dark fw-semibold">Noakhali, Bangladesh</span></div>
</div>
</div>
<!-- end /. listing card -->
<!-- start listing card -->
<div class="card border-0 rounded-4 w-100 flex-fill overflow-hidden card-hover-bg">
<!-- start card link -->
<a href="listing-details-car.html" class="stretched-link"></a>
<!-- end /. card link -->
<!-- start card image wrap -->
<div class="card-img-wrap card-image-hover overflow-hidden dark-overlay">
<img src="assets/images/place/14.jpg" alt="" class="img-fluid">
<div class="align-items-center bg-blur border-0 card-badge d-flex d-inline-block fw-semibold gap-1 position-absolute start-0 text-uppercase text-white z-2">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fire" viewBox="0 0 16 16">
<path d="M8 16c3.314 0 6-2 6-5.5 0-1.5-.5-4-2.5-6 .25 1.5-1.25 2-1.25 2C11 4 9 .5 6 0c.357 2 .5 4-2 6-1.25 1-2 2.729-2 4.5C2 14 4.686 16 8 16m0-1c-1.657 0-3-1-3-2.75 0-.75.25-2 1.25-3C6.125 10 7 10.5 7 10.5c-.375-1.25.5-3.25 2-3.5-.179 1-.25 2 1 3 .625.5 1 1.364 1 2.25C11 14 9.657 15 8 15"></path>
</svg>
10% OFF
</div>
<div class="align-items-center bg-blur border-0 card-badge d-flex d-inline-block fw-semibold gap-1 position-absolute start-0 text-uppercase text-white z-2">$100 off $399: eblwc</div>
<div class="d-flex end-0 gap-2 me-3 mt-3 position-absolute top-0 z-1">
<a href="" class="btn-icon shadow-sm d-flex align-items-center justify-content-center text-primary bg-light rounded-circle" data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bookmark">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-heart" viewBox="0 0 16 16">
<path d="m8 2.748-.717-.737C5.6.281 2.514.878 1.4 3.053c-.523 1.023-.641 2.5.314 4.385.92 1.815 2.834 3.989 6.286 6.357 3.452-2.368 5.365-4.542 6.286-6.357.955-1.886.838-3.362.314-4.385C13.486.878 10.4.28 8.717 2.01L8 2.748zM8 15C-7.333 4.868 3.279-3.04 7.824 1.143c.06.055.119.112.176.171a3.12 3.12 0 0 1 .176-.17C12.72-3.042 23.333 4.867 8 15z"></path>
</svg>
</a>
</div>
</div>
<!-- end /. card image wrap -->
<div class="d-flex flex-column h-100 position-relative p-4">
<!-- start card title -->
<h4 class="fs-5 fw-semibold mb-1 text-truncate">2017 Maruti Swift LXI (O)</h4>
<!-- end /. card title -->
<!-- start card description -->
<p class="mb-3 fs-13">CoWorking, Dedicated Desk, Serviced Offices POA</p>
<!-- end /. card description -->
<!-- start price -->
<div class="fs-5 fw-bold text-primary">$1.71 Lakh</div>
<!-- end /. price -->
<!-- Start meta info -->
<ul class="border-top fs-14 fw-medium fw-semibold list-inline list-separator mb-0 mb-2 mt-3 pt-3 text-muted text-uppercase">
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-speedometer2 me-1" viewBox="0 0 16 16">
<path d="M8 4a.5.5 0 0 1 .5.5V6a.5.5 0 0 1-1 0V4.5A.5.5 0 0 1 8 4M3.732 5.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 10a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 10m9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5m.754-4.246a.389.389 0 0 0-.527-.02L7.547 9.31a.91.91 0 1 0 1.302 1.258l3.434-4.297a.389.389 0 0 0-.029-.518z" />
<path fill-rule="evenodd" d="M0 10a8 8 0 1 1 15.547 2.661c-.442 1.253-1.845 1.602-2.932 1.25C11.309 13.488 9.475 13 8 13c-1.474 0-3.31.488-4.615.911-1.087.352-2.49.003-2.932-1.25A7.988 7.988 0 0 1 0 10m8-7a7 7 0 0 0-6.603 9.329c.203.575.923.876 1.68.63C4.397 12.533 6.358 12 8 12s3.604.532 4.923.96c.757.245 1.477-.056 1.68-.631A7 7 0 0 0 8 3" />
</svg>
<span>69 Miles</span>
</div>
</li>
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fuel-pump me-1" viewBox="0 0 16 16">
<path d="M3 2.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 .5.5v5a.5.5 0 0 1-.5.5h-5a.5.5 0 0 1-.5-.5z" />
<path d="M1 2a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v8a2 2 0 0 1 2 2v.5a.5.5 0 0 0 1 0V8h-.5a.5.5 0 0 1-.5-.5V4.375a.5.5 0 0 1 .5-.5h1.495c-.011-.476-.053-.894-.201-1.222a.97.97 0 0 0-.394-.458c-.184-.11-.464-.195-.9-.195a.5.5 0 0 1 0-1c.564 0 1.034.11 1.412.336.383.228.634.551.794.907.295.655.294 1.465.294 2.081v3.175a.5.5 0 0 1-.5.501H15v4.5a1.5 1.5 0 0 1-3 0V12a1 1 0 0 0-1-1v4h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1zm9 0a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v13h8z" />
</svg>
<span>Petrol</span>
</div>
</li>
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-shuffle me-1" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M0 3.5A.5.5 0 0 1 .5 3H1c2.202 0 3.827 1.24 4.874 2.418.49.552.865 1.102 1.126 1.532.26-.43.636-.98 1.126-1.532C9.173 4.24 10.798 3 13 3v1c-1.798 0-3.173 1.01-4.126 2.082A9.624 9.624 0 0 0 7.556 8a9.624 9.624 0 0 0 1.317 1.918C9.828 10.99 11.204 12 13 12v1c-2.202 0-3.827-1.24-4.874-2.418A10.595 10.595 0 0 1 7 9.05c-.26.43-.636.98-1.126 1.532C4.827 11.76 3.202 13 1 13H.5a.5.5 0 0 1 0-1H1c1.798 0 3.173-1.01 4.126-2.082A9.624 9.624 0 0 0 6.444 8a9.624 9.624 0 0 0-1.317-1.918C4.172 5.01 2.796 4 1 4H.5a.5.5 0 0 1-.5-.5" />
<path d="M13 5.466V1.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384l-2.36 1.966a.25.25 0 0 1-.41-.192zm0 9v-3.932a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384l-2.36 1.966a.25.25 0 0 1-.41-.192z" />
</svg>
<span>CVT</span>
</div>
</li>
</ul>
<!-- end /. Meta info -->
<div class="fs-13 text-muted">Free Test Drive <span class="text-dark fw-semibold">Today</span> at <span class="text-dark fw-semibold">Noakhali, Bangladesh</span></div>
</div>
</div>
<!-- end /. listing card -->
<!-- start listing card -->
<div class="card border-0 rounded-4 w-100 flex-fill overflow-hidden card-hover-bg">
<!-- start card link -->
<a href="listing-details-car.html" class="stretched-link"></a>
<!-- end /. card link -->
<!-- start card image wrap -->
<div class="card-img-wrap card-image-hover overflow-hidden dark-overlay">
<img src="assets/images/place/15.jpg" alt="" class="img-fluid">
<div class="align-items-center bg-blur border-0 card-badge d-flex d-inline-block fw-semibold gap-1 position-absolute start-0 text-uppercase text-white z-2">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fire" viewBox="0 0 16 16">
<path d="M8 16c3.314 0 6-2 6-5.5 0-1.5-.5-4-2.5-6 .25 1.5-1.25 2-1.25 2C11 4 9 .5 6 0c.357 2 .5 4-2 6-1.25 1-2 2.729-2 4.5C2 14 4.686 16 8 16m0-1c-1.657 0-3-1-3-2.75 0-.75.25-2 1.25-3C6.125 10 7 10.5 7 10.5c-.375-1.25.5-3.25 2-3.5-.179 1-.25 2 1 3 .625.5 1 1.364 1 2.25C11 14 9.657 15 8 15"></path>
</svg>
10% OFF
</div>
<div class="align-items-center bg-blur border-0 card-badge d-flex d-inline-block fw-semibold gap-1 position-absolute start-0 text-uppercase text-white z-2">$100 off $399: eblwc</div>
<div class="d-flex end-0 gap-2 me-3 mt-3 position-absolute top-0 z-1">
<a href="" class="btn-icon shadow-sm d-flex align-items-center justify-content-center text-primary bg-light rounded-circle" data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Bookmark">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-heart" viewBox="0 0 16 16">
<path d="m8 2.748-.717-.737C5.6.281 2.514.878 1.4 3.053c-.523 1.023-.641 2.5.314 4.385.92 1.815 2.834 3.989 6.286 6.357 3.452-2.368 5.365-4.542 6.286-6.357.955-1.886.838-3.362.314-4.385C13.486.878 10.4.28 8.717 2.01L8 2.748zM8 15C-7.333 4.868 3.279-3.04 7.824 1.143c.06.055.119.112.176.171a3.12 3.12 0 0 1 .176-.17C12.72-3.042 23.333 4.867 8 15z"></path>
</svg>
</a>
</div>
</div>
<!-- end /. card image wrap -->
<div class="d-flex flex-column h-100 position-relative p-4">
<!-- start card title -->
<h4 class="fs-5 fw-semibold mb-1 text-truncate">2019 Toyota Fortuner 2.8 4X2 MT</h4>
<!-- end /. card title -->
<!-- start card description -->
<p class="mb-3 fs-13">CoWorking, Dedicated Desk, Serviced Offices POA</p>
<!-- end /. card description -->
<!-- start price -->
<div class="fs-5 fw-bold text-primary">$1.71 Lakh</div>
<!-- end /. price -->
<!-- Start meta info -->
<ul class="border-top fs-14 fw-medium fw-semibold list-inline list-separator mb-0 mb-2 mt-3 pt-3 text-muted text-uppercase">
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-speedometer2 me-1" viewBox="0 0 16 16">
<path d="M8 4a.5.5 0 0 1 .5.5V6a.5.5 0 0 1-1 0V4.5A.5.5 0 0 1 8 4M3.732 5.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 10a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 10m9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5m.754-4.246a.389.389 0 0 0-.527-.02L7.547 9.31a.91.91 0 1 0 1.302 1.258l3.434-4.297a.389.389 0 0 0-.029-.518z" />
<path fill-rule="evenodd" d="M0 10a8 8 0 1 1 15.547 2.661c-.442 1.253-1.845 1.602-2.932 1.25C11.309 13.488 9.475 13 8 13c-1.474 0-3.31.488-4.615.911-1.087.352-2.49.003-2.932-1.25A7.988 7.988 0 0 1 0 10m8-7a7 7 0 0 0-6.603 9.329c.203.575.923.876 1.68.63C4.397 12.533 6.358 12 8 12s3.604.532 4.923.96c.757.245 1.477-.056 1.68-.631A7 7 0 0 0 8 3" />
</svg>
<span>69 Miles</span>
</div>
</li>
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fuel-pump me-1" viewBox="0 0 16 16">
<path d="M3 2.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 .5.5v5a.5.5 0 0 1-.5.5h-5a.5.5 0 0 1-.5-.5z" />
<path d="M1 2a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v8a2 2 0 0 1 2 2v.5a.5.5 0 0 0 1 0V8h-.5a.5.5 0 0 1-.5-.5V4.375a.5.5 0 0 1 .5-.5h1.495c-.011-.476-.053-.894-.201-1.222a.97.97 0 0 0-.394-.458c-.184-.11-.464-.195-.9-.195a.5.5 0 0 1 0-1c.564 0 1.034.11 1.412.336.383.228.634.551.794.907.295.655.294 1.465.294 2.081v3.175a.5.5 0 0 1-.5.501H15v4.5a1.5 1.5 0 0 1-3 0V12a1 1 0 0 0-1-1v4h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1zm9 0a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v13h8z" />
</svg>
<span>Petrol</span>
</div>
</li>
<li class="list-inline-item">
<div class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-shuffle me-1" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M0 3.5A.5.5 0 0 1 .5 3H1c2.202 0 3.827 1.24 4.874 2.418.49.552.865 1.102 1.126 1.532.26-.43.636-.98 1.126-1.532C9.173 4.24 10.798 3 13 3v1c-1.798 0-3.173 1.01-4.126 2.082A9.624 9.624 0 0 0 7.556 8a9.624 9.624 0 0 0 1.317 1.918C9.828 10.99 11.204 12 13 12v1c-2.202 0-3.827-1.24-4.874-2.418A10.595 10.595 0 0 1 7 9.05c-.26.43-.636.98-1.126 1.532C4.827 11.76 3.202 13 1 13H.5a.5.5 0 0 1 0-1H1c1.798 0 3.173-1.01 4.126-2.082A9.624 9.624 0 0 0 6.444 8a9.624 9.624 0 0 0-1.317-1.918C4.172 5.01 2.796 4 1 4H.5a.5.5 0 0 1-.5-.5" />
<path d="M13 5.466V1.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384l-2.36 1.966a.25.25 0 0 1-.41-.192zm0 9v-3.932a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384l-2.36 1.966a.25.25 0 0 1-.41-.192z" />
</svg>
<span>CVT</span>
</div>
</li>
</ul>
<!-- end /. Meta info -->
<div class="fs-13 text-muted">Free Test Drive <span class="text-dark fw-semibold">Today</span> at <span class="text-dark fw-semibold">Noakhali, Bangladesh</span></div>
</div>
</div>
<!-- end /. listing card -->
</div>
</div>
</div>
<!-- end /. listings carousel -->
<!-- start footer -->
<footer class="footer-dark main-footer overflow-hidden position-relative pt-5">
<div class="container pt-4">
<div class="py-5">
<!-- start app download content -->
<div class="bg-primary rounded-4">
<div class="col-xxl-10 col-md-11 col-10 d-flex flex-md-row flex-column-reverse align-items-md-end align-items-center mx-auto px-0 gap-4">
<img class="app-image flex-shrink-0" src="assets/images/phone-mpckup.png" width="270" alt="Mobile app">
<div class="align-items-lg-center align-self-center d-flex flex-column flex-lg-row ps-xxl-4 pt-5 py-md-3 text-center text-md-start">
<div class="me-md-5">
<h4 class="text-white">Download Our App</h4>
<p class="mb-lg-0 text-white">It is a long established fact that a reader will be distracted by the readable content.</p>
</div>
<div class="d-flex flex-shrink-0 flex-wrap gap-3 justify-content-center">
<!-- start apple store button -->
<a class="align-items-center app-btn d-flex px-3 py-2 rounded-3 text-decoration-none text-white border" href="#"> <i class="fa-apple fab fs-28 me-2"></i>
<div> <span class="fs-13 d-block">Available on the</span> <span class="fs-17 text-capitalize">App Store</span> </div>
</a>
<!-- end /. apple store button -->
<a class="align-items-center app-btn d-flex fs-11 px-3 py-2 rounded-3 text-decoration-none text-white border" href="#"> <i class="fab fa-google-play fs-25 me-2"></i>
<div> <span class="fs-13 d-block">Get it on</span> <span class="fs-17 text-capitalize">Google Play</span> </div>
</a>
</div>
</div>
</div>
</div>
<!-- end /. app download content -->
</div>
<div class="border-top py-5">
<div class="footer-row row gy-5 g-sm-5 gx-xxl-6">
<div class="border-end col-lg-4 col-md-7 col-sm-6">
<h5 class="fw-bold mb-4">Get In Touch</h5>
<div class="mb-4">Join our newsletter and receive the best job<br class="d-none d-xxl-block"> openings of the week, right on your inbox.</div>
<div class="border rounded-4 p-4 mb-4">
<h6 class="text-white-50 mb-3">Join our Whatsapp:</h6>
<a class="align-items-center d-block d-flex whatsapp-number" href="#"><i class="fa-brands fa-whatsapp fs-2 me-2"></i><span class="fs-5 fw-semibold text-decoration-underline">(123) 456-7890</span></a>
</div>
<h5 class="fw-bold mb-4">Want to join ListOn?<br> Write us !</h5>
<span>support@ListOn.com</span>
</div>
<div class="border-end col-lg-4 col-md-5 col-sm-6">
<h5 class="fw-bold mb-4">Stay Connect</h5>
<div>1123 Fictional St, San Francisco<br class="d-none d-xxl-block"> , CA 94103</div>
<div class="mt-4">
<a class="d-block fw-medium mb-1" href="#">
<i class="fa-solid fa-phone me-2"></i><span>(123) 456-7890</span>
</a>
<a class="email-link d-block fw-medium" href="#">
<i class="fa-solid fa-envelope me-2"></i>
support@ListOn.com
</a>
</div>
</div>
<div class="col-lg-4">
<h5 class="fw-bold mb-4">Get In Touch</h5>
<div class="newsletter position-relative mt-4">
<input type="email" class="form-control" placeholder="name@example.com">
<button type="button" class="btn btn-primary search-btn position-absolute top-50 rounded-circle"><i class="fa-solid fa-angle-right"></i></button>
</div>
<div class="border-top my-4"></div>
<h5 class="fw-bold mb-4">Follow the location</h5>
<!-- start social icon -->
<ul class="d-flex flex-wrap gap-2 list-unstyled mb-0 social-icon">
<li>
<a href="#" class="rounded-circle align-items-center d-flex fs-19 icon-wrap justify-content-center rounded-2 text-white inst">
<i class="fab fa-instagram"></i>
</a>
</li>
<li>
<a href="#" class="rounded-circle align-items-center d-flex fs-19 icon-wrap justify-content-center rounded-2 text-white twi">
<i class="fab fa-twitter"></i>
</a>
</li>
<li>
<a href="#" class="rounded-circle align-items-center d-flex fs-19 icon-wrap justify-content-center rounded-2 text-white dri">
<i class="fab fa-dribbble"></i>
</a>
</li>
<li>
<a href="#" class="rounded-circle align-items-center d-flex fs-19 icon-wrap justify-content-center rounded-2 text-white fb">
<i class="fab fa-facebook-f"></i>
</a>
</li>
<li>
<a href="#" class="rounded-circle align-items-center d-flex fs-19 icon-wrap justify-content-center rounded-2 text-white whatsapp">
<i class="fa-brands fa-whatsapp"></i>
</a>
</li>
</ul>
<!-- /. end social icon -->
</div>
</div>
</div>
</div>
<div class="container border-top">
<div class="align-items-center g-3 py-4 row">
<div class="col-lg-auto">
<!-- start footer nav -->
<ul class="list-unstyled list-separator mb-2 footer-nav">
<li class="list-inline-item"><a href="#">Privacy</a></li>
<li class="list-inline-item"><a href="#">Sitemap</a></li>
<li class="list-inline-item"><a href="#">Cookies</a></li>
</ul>
<!-- end /. footer nav -->
</div>
<div class="col-lg order-md-first">
<div class="align-items-center row">
<!-- start footer logo -->
<a href="index.html" class="col-sm-auto footer-logo mb-2 mb-sm-0">
<img src="assets/images/logo-white.png" alt="">
</a>
<!-- end /. footer logo -->
<!-- start text -->
<div class="col-sm-auto copy">© 2022 ListOn - All Rights Reserved- All Rights Reserved</div>
<!-- end /. text -->
</div>
</div>
</div>
</div>
</footer>
<!-- end /. footer -->
<!-- Optional JavaScript -->
<script src="assets/plugins/jQuery/jquery.min.js"></script>
<script src="assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/plugins/aos/aos.min.js"></script>
<script src="assets/plugins/macy/macy.js"></script>
<script src="assets/plugins/simple-parallax/simpleParallax.min.js"></script>
<script src="assets/plugins/OwlCarousel2/owl.carousel.min.js"></script>
<script src="assets/plugins/theia-sticky-sidebar/ResizeSensor.min.js"></script>
<script src="assets/plugins/theia-sticky-sidebar/theia-sticky-sidebar.min.js"></script>
<script src="assets/plugins/waypoints/jquery.waypoints.min.js"></script>
<script src="assets/plugins/counter-up/jquery.counterup.min.js"></script>
<script src="assets/plugins/jquery-fancyfileuploader/fancy-file-uploader/jquery.ui.widget.js"></script>
<script src="assets/plugins/jquery-fancyfileuploader/fancy-file-uploader/jquery.fileupload.js"></script>
<script src="assets/plugins/jquery-fancyfileuploader/fancy-file-uploader/jquery.iframe-transport.js"></script>
<script src="assets/plugins/jquery-fancyfileuploader/fancy-file-uploader/jquery.fancy-fileupload.js"></script>
<script src="assets/plugins/ion.rangeSlider/ion.rangeSlider.min.js"></script>
<script src="assets/plugins/magnific-popup/jquery.magnific-popup.min.js"></script>
<script src="assets/plugins/select2/select2.min.js"></script>
<!-- Custom script for this template -->
<script src="assets/js/script.js"></script>
</body>
</html>