<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<div class="container mt-5 mb-3">
<div class="row">
<div class="col-md-4">
<div class="card p-3 mb-2">
<div class="d-flex justify-content-between">
<div class="d-flex flex-row align-items-center">
<div class="icon">
<img src="https://placehold.co/60x40/png"/> </div>
<div class="ms-2 c-details">
<h6 class="mb-0">Mailchimp</h6> <span>1 days ago</span>
</div>
</div>
<div class="badge"> <span>Design</span> </div>
</div>
<div class="mt-5">
<h3 class="heading">Senior Product<br>Designer-Singapore</h3>
<div class="mt-5">
<div class="progress">
<div class="progress-bar" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="mt-3"> <span class="text1">32 Applied <span class="text2">of 50 capacity</span></span> </div>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card p-3 mb-2">
<div class="d-flex justify-content-between">
<div class="d-flex flex-row align-items-center">
<div class="icon"> <i class="bx bxl-dribbble"></i> </div>
<div class="ms-2 c-details">
<h6 class="mb-0">Dribbble</h6> <span>4 days ago</span>
