<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
<style>
.hire_cars_container .pickup_location{
border: 1px solid #80808040;
margin-top: 8px;
margin-bottom: 5px;
padding: 2px 5px;
}
.hire_cars_container .hire_cars_col .right_side{
position: relative;
}
.hire_cars_container .right_side .price{
font-size: 30px;
font-weight: bold;
text-align: center;
}
.hire_cars_container .right_side .view_deal button{
width: 100%;
border-radius: 0;
background: #0ec6c6 !important;
font-weight: bold;
}
.hire_cars_container .bg-secondary{
background: #0ec6c6 !important;
}
.hire_cars_container .badge{
color: #000;
padding: 4px 5px;
width: 75px;
border-radius: 0;
}
.hire_cars_container .view_deal{
position: absolute;
width: 85%;
bottom: 22px;
}
</style>
<div class="container-fluid mt-5 mb-5 hire_cars_container">
<!------------------------------------>
<div class="row">
<div class="hire_cars_col col-sm-6">
<div class="card mb-3">
<div class="row g-0">
<div class="col-md-3">
<img src="https://pngimg.com/d/bmw_PNG99543.png" class="mt-5 img-fluid rounded-start" alt="...">
</div>
<div class="col-md-6">
<div class="card-body">
<h5 class="card-title">Mini</h5>
<p class="card-text">4 door mini ride, No smoking smell, very cheap price.</p>
<div class="features">
<span class="badge bg-secondary">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" style="width: 1.125rem; height: 1.125rem;">
<path d="M12 0a1.5 1.5 0 00-1.5 1.5v2.379l-1.94-1.94a1.5 1.5 0 10-2.157 2.085l.037.037 4.06 4.06V10.5H8.121l-4.06-4.06a1.5 1.5 0 00-2.159 2.083l.037.037 1.94 1.94H1.5a1.5 1.5 0 000 3h2.379l-1.94 1.94a1.5 1.5 0 002.122 2.12l4.06-4.06H10.5v2.379l-4.06 4.06a1.5 1.5 0 002.12 2.122l1.94-1.94V22.5a1.5 1.5 0 003 0v-2.379l1.94 1.94a1.5 1.5 0 002.12-2.122l-4.06-4.06V13.5h2.379l4.06 4.06a1.5 1.5 0 002.122-2.12l-1.94-1.94H22.5a1.5 1.5 0 000-3h-2.379l1.94-1.94a1.5 1.5 0 00-2.122-2.12l-4.06 4.06H13.5V8.121l4.06-4.06a1.5 1.5 0 00-2.12-2.122L13.5 3.88V1.5A1.5 1.5 0 0012 0z"></path>
</svg>
AC
</span>
<span class="badge bg-secondary">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" style="width: 1.125rem; height: 1.125rem;"><path d="M12 1.5c-2.703 0-4.688 1.426-5.543 2.46C6.111 4.38 6 4.895 6 5.32v1.43a.75.75 0 01-.75.75H4.5a3 3 0 00-3 3v9a3 3 0 003 3h15a3 3 0 003-3v-9a3 3 0 00-3-3h-.75a.75.75 0 01-.75-.75V5.385c0-.514-.162-1.074-.555-1.5C16.547 2.914 14.693 1.5 12 1.5zm2.625 6h-5.25C9.168 7.5 9 7.276 9 7v-.583c0-.264.075-.52.23-.684C9.751 5.176 10.721 4.5 12 4.5c1.276 0 2.208.676 2.758 1.262.16.171.242.436.242.71V7c0 .276-.168.5-.375.5z"></path></svg>
Bags
</span>
<span class="badge bg-secondary">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" style="width: 1.125rem; height: 1.125rem;"><path d="M9.572 2.082A1.384 1.384 0 009 3.33v5.897A2.792 2.792 0 0012 12a2.791 2.791 0 003-2.774v-5.86a1.435 1.435 0 00-.608-1.285A4.966 4.966 0 0012 1.5a5.122 5.122 0 00-2.428.582zM4.145 16.865A17.3 17.3 0 0112 15a17.608 17.608 0 017.893 1.867A2 2 0 0121 18.75v.75a3.226 3.226 0 01-3 3H6a3.226 3.226 0 01-3-3v-.75a2.073 2.073 0 011.145-1.885z"></path></svg>
Bags
</span>
<span class="badge bg-secondary">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" style="width: 1.125rem; height: 1.125rem;"><path d="M9.572 2.082A1.384 1.384 0 009 3.33v5.897A2.792 2.792 0 0012 12a2.791 2.791 0 003-2.774v-5.86a1.435 1.435 0 00-.608-1.285A4.966 4.966 0 0012 1.5a5.122 5.122 0 00-2.428.582zM4.145 16.865A17.3 17.3 0 0112 15a17.608 17.608 0 017.893 1.867A2 2 0 0121 18.75v.75a3.226 3.226 0 01-3 3H6a3.226 3.226 0 01-3-3v-.75a2.073 2.073 0 011.145-1.885z"></path></svg>
Manual
</span>
</div>
<div class="pickup_location">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" class="Location_icon__ZjIxN BpkIcon_bpk-icon--rtl-support__NjAzZ" style="width: 1.125rem; height: 1.125rem;"><path d="M22.854 9.233l-8.087-8.087a3.913 3.913 0 00-5.534 0L1.146 9.233a3.913 3.913 0 000 5.534l8.087 8.087a3.913 3.913 0 005.534 0l8.087-8.087a3.913 3.913 0 000-5.534zM9 12.023a.45.45 0 01-.34.437l-3.113.778a.842.842 0 01-.71-1.491L8.28 9.165a.45.45 0 01.72.36zm10.334.902a.842.842 0 01-.881.313L14.06 12.14a.45.45 0 00-.559.436v3.174l1.063.532a.79.79 0 01-.545 1.473L12 17.25l-2.018.505a.79.79 0 01-.545-1.473l1.063-.532v-9c0-1.5.672-2.25 1.5-2.25s1.5.75 1.5 2.25v1.31a1.5 1.5 0 00.845 1.35l4.818 2.337a.842.842 0 01.17 1.178z"></path></svg>
Hamaray chachu ki airport, Islamabad
</div>
</div>
</div>
<div class="col-md-3 right_side">
<div class="card-body">
<div class="price">$20</div>
<div class="pickup_location">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" class="CommonLabel_Container__icon__YzE5N" style="width: 1.125rem; height: 1.125rem;"><path d="M22 7.382a1.935 1.935 0 00-.514.068.647.647 0 01-.747-.279 2.722 2.722 0 00-.057-.103l-1.53-2.75a3.986 3.986 0 00-3.473-2.068H8.321a3.985 3.985 0 00-3.473 2.068l-1.53 2.75q-.03.05-.057.103a.647.647 0 01-.747.279A1.935 1.935 0 002 7.382a2.026 2.026 0 00-2 2.052c0 .958.14 1.566 1.005 1.792a.626.626 0 01.495.577v8.447a1.5 1.5 0 001.5 1.5h1.5a1.5 1.5 0 001.5-1.5v-1.5h12v1.5a1.5 1.5 0 001.5 1.5H21a1.5 1.5 0 001.5-1.5v-8.447a.626.626 0 01.495-.577C23.86 11 24 10.393 24 9.434a2.026 2.026 0 00-2-2.052zM6 10.5v-3a.75.75 0 011.5 0v1.045a5.251 5.251 0 019.047.079.75.75 0 01-1.298.752 3.752 3.752 0 00-6.687.374H9.75a.75.75 0 010 1.5h-3A.75.75 0 016 10.5zM18 15a.75.75 0 01-1.5 0v-1.045a5.251 5.251 0 01-9.047-.079.75.75 0 011.298-.752 3.751 3.751 0 006.687-.374H14.25a.75.75 0 010-1.5h3A.75.75 0 0118 12z"></path></svg>
Free Cancellation
</div>
<div class="pickup_location">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" class="CommonLabel_Container__icon__YzE5N" style="width: 1.125rem; height: 1.125rem;"><path d="M22 7.382a1.935 1.935 0 00-.514.068.647.647 0 01-.747-.279 2.722 2.722 0 00-.057-.103l-1.53-2.75a3.986 3.986 0 00-3.473-2.068H8.321a3.985 3.985 0 00-3.473 2.068l-1.53 2.75q-.03.05-.057.103a.647.647 0 01-.747.279A1.935 1.935 0 002 7.382a2.026 2.026 0 00-2 2.052c0 .958.14 1.566 1.005 1.792a.626.626 0 01.495.577v8.447a1.5 1.5 0 001.5 1.5h1.5a1.5 1.5 0 001.5-1.5v-1.5h12v1.5a1.5 1.5 0 001.5 1.5H21a1.5 1.5 0 001.5-1.5v-8.447a.626.626 0 01.495-.577C23.86 11 24 10.393 24 9.434a2.026 2.026 0 00-2-2.052zM6 10.5v-3a.75.75 0 011.5 0v1.045a5.251 5.251 0 019.047.079.75.75 0 01-1.298.752 3.752 3.752 0 00-6.687.374H9.75a.75.75 0 010 1.5h-3A.75.75 0 016 10.5zM18 15a.75.75 0 01-1.5 0v-1.045a5.251 5.251 0 01-9.047-.079.75.75 0 011.298-.752 3.751 3.751 0 006.687-.374H14.25a.75.75 0 010-1.5h3A.75.75 0 0118 12z"></path></svg>
Limited Time
</div>
<div class="view_deal">
<button type="button" class="btn">
View Deal
</button>
</div>
</div>
</div>
</div>
</div>
</div> <!-- col end -->
<div class="hire_cars_col col-sm-6">
<div class="card mb-3">
<div class="row g-0">
<div class="col-md-3">
<img src="https://pngimg.com/d/bmw_PNG99543.png" class="mt-5 img-fluid rounded-start" alt="...">
</div>
<div class="col-md-6">
<div class="card-body">
<h5 class="card-title">Mini</h5>
<p class="card-text">4 door mini ride, No smoking smell, very cheap price.</p>
<div class="features">
<span class="badge bg-secondary">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" style="width: 1.125rem; height: 1.125rem;">
<path d="M12 0a1.5 1.5 0 00-1.5 1.5v2.379l-1.94-1.94a1.5 1.5 0 10-2.157 2.085l.037.037 4.06 4.06V10.5H8.121l-4.06-4.06a1.5 1.5 0 00-2.159 2.083l.037.037 1.94 1.94H1.5a1.5 1.5 0 000 3h2.379l-1.94 1.94a1.5 1.5 0 002.122 2.12l4.06-4.06H10.5v2.379l-4.06 4.06a1.5 1.5 0 002.12 2.122l1.94-1.94V22.5a1.5 1.5 0 003 0v-2.379l1.94 1.94a1.5 1.5 0 002.12-2.122l-4.06-4.06V13.5h2.379l4.06 4.06a1.5 1.5 0 002.122-2.12l-1.94-1.94H22.5a1.5 1.5 0 000-3h-2.379l1.94-1.94a1.5 1.5 0 00-2.122-2.12l-4.06 4.06H13.5V8.121l4.06-4.06a1.5 1.5 0 00-2.12-2.122L13.5 3.88V1.5A1.5 1.5 0 0012 0z"></path>
</svg>
AC
</span>
<span class="badge bg-secondary">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" style="width: 1.125rem; height: 1.125rem;"><path d="M12 1.5c-2.703 0-4.688 1.426-5.543 2.46C6.111 4.38 6 4.895 6 5.32v1.43a.75.75 0 01-.75.75H4.5a3 3 0 00-3 3v9a3 3 0 003 3h15a3 3 0 003-3v-9a3 3 0 00-3-3h-.75a.75.75 0 01-.75-.75V5.385c0-.514-.162-1.074-.555-1.5C16.547 2.914 14.693 1.5 12 1.5zm2.625 6h-5.25C9.168 7.5 9 7.276 9 7v-.583c0-.264.075-.52.23-.684C9.751 5.176 10.721 4.5 12 4.5c1.276 0 2.208.676 2.758 1.262.16.171.242.436.242.71V7c0 .276-.168.5-.375.5z"></path></svg>
Bags
</span>
<span class="badge bg-secondary">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" style="width: 1.125rem; height: 1.125rem;"><path d="M9.572 2.082A1.384 1.384 0 009 3.33v5.897A2.792 2.792 0 0012 12a2.791 2.791 0 003-2.774v-5.86a1.435 1.435 0 00-.608-1.285A4.966 4.966 0 0012 1.5a5.122 5.122 0 00-2.428.582zM4.145 16.865A17.3 17.3 0 0112 15a17.608 17.608 0 017.893 1.867A2 2 0 0121 18.75v.75a3.226 3.226 0 01-3 3H6a3.226 3.226 0 01-3-3v-.75a2.073 2.073 0 011.145-1.885z"></path></svg>
Bags
</span>
<span class="badge bg-secondary">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" style="width: 1.125rem; height: 1.125rem;"><path d="M9.572 2.082A1.384 1.384 0 009 3.33v5.897A2.792 2.792 0 0012 12a2.791 2.791 0 003-2.774v-5.86a1.435 1.435 0 00-.608-1.285A4.966 4.966 0 0012 1.5a5.122 5.122 0 00-2.428.582zM4.145 16.865A17.3 17.3 0 0112 15a17.608 17.608 0 017.893 1.867A2 2 0 0121 18.75v.75a3.226 3.226 0 01-3 3H6a3.226 3.226 0 01-3-3v-.75a2.073 2.073 0 011.145-1.885z"></path></svg>
Manual
</span>
</div>
<div class="pickup_location">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" class="Location_icon__ZjIxN BpkIcon_bpk-icon--rtl-support__NjAzZ" style="width: 1.125rem; height: 1.125rem;"><path d="M22.854 9.233l-8.087-8.087a3.913 3.913 0 00-5.534 0L1.146 9.233a3.913 3.913 0 000 5.534l8.087 8.087a3.913 3.913 0 005.534 0l8.087-8.087a3.913 3.913 0 000-5.534zM9 12.023a.45.45 0 01-.34.437l-3.113.778a.842.842 0 01-.71-1.491L8.28 9.165a.45.45 0 01.72.36zm10.334.902a.842.842 0 01-.881.313L14.06 12.14a.45.45 0 00-.559.436v3.174l1.063.532a.79.79 0 01-.545 1.473L12 17.25l-2.018.505a.79.79 0 01-.545-1.473l1.063-.532v-9c0-1.5.672-2.25 1.5-2.25s1.5.75 1.5 2.25v1.31a1.5 1.5 0 00.845 1.35l4.818 2.337a.842.842 0 01.17 1.178z"></path></svg>
Hamaray chachu ki airport, Islamabad
</div>
</div>
</div>
<div class="col-md-3 right_side">
<div class="card-body">
<div class="price">$20</div>
<div class="pickup_location">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" class="CommonLabel_Container__icon__YzE5N" style="width: 1.125rem; height: 1.125rem;"><path d="M22 7.382a1.935 1.935 0 00-.514.068.647.647 0 01-.747-.279 2.722 2.722 0 00-.057-.103l-1.53-2.75a3.986 3.986 0 00-3.473-2.068H8.321a3.985 3.985 0 00-3.473 2.068l-1.53 2.75q-.03.05-.057.103a.647.647 0 01-.747.279A1.935 1.935 0 002 7.382a2.026 2.026 0 00-2 2.052c0 .958.14 1.566 1.005 1.792a.626.626 0 01.495.577v8.447a1.5 1.5 0 001.5 1.5h1.5a1.5 1.5 0 001.5-1.5v-1.5h12v1.5a1.5 1.5 0 001.5 1.5H21a1.5 1.5 0 001.5-1.5v-8.447a.626.626 0 01.495-.577C23.86 11 24 10.393 24 9.434a2.026 2.026 0 00-2-2.052zM6 10.5v-3a.75.75 0 011.5 0v1.045a5.251 5.251 0 019.047.079.75.75 0 01-1.298.752 3.752 3.752 0 00-6.687.374H9.75a.75.75 0 010 1.5h-3A.75.75 0 016 10.5zM18 15a.75.75 0 01-1.5 0v-1.045a5.251 5.251 0 01-9.047-.079.75.75 0 011.298-.752 3.751 3.751 0 006.687-.374H14.25a.75.75 0 010-1.5h3A.75.75 0 0118 12z"></path></svg>
Free Cancellation
</div>
<div class="pickup_location">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" class="CommonLabel_Container__icon__YzE5N" style="width: 1.125rem; height: 1.125rem;"><path d="M22 7.382a1.935 1.935 0 00-.514.068.647.647 0 01-.747-.279 2.722 2.722 0 00-.057-.103l-1.53-2.75a3.986 3.986 0 00-3.473-2.068H8.321a3.985 3.985 0 00-3.473 2.068l-1.53 2.75q-.03.05-.057.103a.647.647 0 01-.747.279A1.935 1.935 0 002 7.382a2.026 2.026 0 00-2 2.052c0 .958.14 1.566 1.005 1.792a.626.626 0 01.495.577v8.447a1.5 1.5 0 001.5 1.5h1.5a1.5 1.5 0 001.5-1.5v-1.5h12v1.5a1.5 1.5 0 001.5 1.5H21a1.5 1.5 0 001.5-1.5v-8.447a.626.626 0 01.495-.577C23.86 11 24 10.393 24 9.434a2.026 2.026 0 00-2-2.052zM6 10.5v-3a.75.75 0 011.5 0v1.045a5.251 5.251 0 019.047.079.75.75 0 01-1.298.752 3.752 3.752 0 00-6.687.374H9.75a.75.75 0 010 1.5h-3A.75.75 0 016 10.5zM18 15a.75.75 0 01-1.5 0v-1.045a5.251 5.251 0 01-9.047-.079.75.75 0 011.298-.752 3.751 3.751 0 006.687-.374H14.25a.75.75 0 010-1.5h3A.75.75 0 0118 12z"></path></svg>
Limited Time
</div>
<div class="view_deal">
<button type="button" class="btn">
View Deal
</button>
</div>
</div>
</div>
</div>
</div>
</div> <!-- col end -->
</div>
<!--------- row end --------->
