Icon With Text
# Style 01
<div class="row mt-n1-9">
<div class="col-sm-6 col-lg-4 mt-1-9">
<div class="card card-style1 h-100">
<div class="card-body">
<div class="categorie-icon light-blue">
<img src="img/icons/icon-01.png" alt="...">
</div>
<h3 class="h5"><a href="#!">Accounting</a></h3>
<span class="mb-0 display-30 font-weight-600">(2 open positions)</span>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 mt-1-9">
<div class="card card-style1 h-100">
<div class="card-body">
<div class="categorie-icon red">
<img src="img/icons/icon-02.png" alt="...">
</div>
<h3 class="h5"><a href="#!">Marketing</a></h3>
<span class="mb-0 display-30 font-weight-600">(86 open positions)</span>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 mt-1-9">
<div class="card card-style1 h-100">
<div class="card-body">
<div class="categorie-icon yellow">
<img src="img/icons/icon-06.png" alt="...">
</div>
<h3 class="h5"><a href="#!">Customer Service</a></h3>
<span class="mb-0 display-30 font-weight-600">(20 open positions)</span>
</div>
</div>
</div>
</div>
# Style 02
01. CV / Resume Upload
Upload By Category
02. Find Vacancy
Choose A Suitable Job
03. Apply Them
Get Personal Job Offer
<div class="row mt-n1-9">
<div class="col-sm-6 col-lg-4 mt-1-9">
<div class="process-style2 first">
<div class="process-arrow">
<div class="process-icon-box">
<img src="img/icons/icon-23.png" alt="...">
</div>
<div class="process-contnet">
<h4 class="h5">01. CV / Resume Upload</h4>
<p class="mb-0">Upload By Category</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 mt-1-9">
<div class="process-style2">
<div class="process-arrow">
<div class="process-icon-box">
<img src="img/icons/icon-24.png" alt="...">
</div>
<div class="process-contnet">
<h4 class="h5">02. Find Vacancy</h4>
<p class="mb-0">Choose A Suitable Job</p>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 mt-1-9">
<div class="process-style2 last">
<div class="process-arrow">
<div class="process-icon-box">
<img src="img/icons/icon-25.png" alt="...">
</div>
<div class="process-contnet">
<h4 class="h5">03. Apply Them</h4>
<p class="mb-0">Get Personal Job Offer</p>
</div>
</div>
</div>
</div>
</div>
# Style 03
<div class="row mt-n1-9">
<div class="col-md-6 col-lg-4 mt-1-9">
<div class="card card-style8">
<div class="card-body">
<img src="img/icons/icon-26.png" alt="..." class="mb-4 d-block mx-auto">
<h4 class="h5"><a href="#!">Accounting / Finance</a></h4>
<span class="mb-4 d-block display-30 font-weight-600">(02 Open Position)</span>
<a class="category-link" href="#!"><i class="ti-arrow-right"></i></a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mt-1-9">
<div class="card card-style8">
<div class="card-body">
<img src="img/icons/icon-27.png" alt="..." class="mb-4 d-block mx-auto">
<h4 class="h5"><a href="#!">Marketing</a></h4>
<span class="mb-4 d-block display-30 font-weight-600">(86 Open Position)</span>
<a class="category-link" href="#!"><i class="ti-arrow-right"></i></a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mt-1-9">
<div class="card card-style8">
<div class="card-body">
<img src="img/icons/icon-28.png" alt="..." class="mb-4 d-block mx-auto">
<h4 class="h5"><a href="#!">Customer Service</a></h4>
<span class="mb-4 d-block display-30 font-weight-600">(20 Open Position)</span>
<a class="category-link" href="#!"><i class="ti-arrow-right"></i></a>
</div>
</div>
</div>
</div>
# Style 04
<div class="row mt-n1-9">
<div class="col-md-6 mt-1-9">
<div class="card card-style11">
<div class="card-body">
<div class="d-flex align-items-center">
<div class="flex-shrink-0">
<div class="categories-icon">
<img src="img/icons/icon-38.png" alt="...">
</div>
<div class="hover-icon">
<img src="img/icons/icon-39.png" alt="...">
</div>
</div>
<div class="flex-grow-1 ms-3">
<h4 class="h5"><a href="#!">Accounting</a></h4>
<p class="mb-0 text-secondary font-weight-600">2 Open Position</p>
<span>01</span>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 mt-1-9">
<div class="card card-style11">
<div class="card-body">
<div class="d-flex align-items-center">
<div class="flex-shrink-0">
<div class="categories-icon">
<img src="img/icons/icon-40.png" alt="...">
</div>
<div class="hover-icon">
<img src="img/icons/icon-41.png" alt="...">
</div>
</div>
<div class="flex-grow-1 ms-3">
<h4 class="h5"><a href="#!">Marketing</a></h4>
<p class="mb-0 text-secondary font-weight-600">86 Open Position</p>
<span>02</span>
</div>
</div>
</div>
</div>
</div>
</div>
# Style 05
<div class="row mt-n1-9">
<div class="col-md-6 col-lg-4 mt-1-9">
<div class="card card-style13">
<div class="card-body">
<div class="categories-icon mx-auto mb-3">
<img src="img/icons/icon-56.png" alt="...">
</div>
<h4 class="h5"><a href="#!">Accounting</a></h4>
<div class="categories-info">
<div>
<p class="mb-0 text-secondary font-weight-600">02 Jobs</p>
</div>
<a class="categorie-link" href="#!"><i class="fas fa-arrow-right"></i></a>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mt-1-9">
<div class="card card-style13">
<div class="card-body">
<div class="categories-icon mx-auto mb-3">
<img src="img/icons/icon-57.png" alt="...">
</div>
<h4 class="h5"><a href="#!">Marketing</a></h4>
<div class="categories-info">
<div>
<p class="mb-0 text-secondary font-weight-600">86 Jobs</p>
</div>
<a class="categorie-link" href="#!"><i class="fas fa-arrow-right"></i></a>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mt-1-9">
<div class="card card-style13">
<div class="card-body">
<div class="categories-icon mx-auto mb-3">
<img src="img/icons/icon-58.png" alt="...">
</div>
<h4 class="h5"><a href="#!">Customer Service</a></h4>
<div class="categories-info">
<div>
<p class="mb-0 text-secondary font-weight-600">20 Jobs</p>
</div>
<a class="categorie-link" href="#!"><i class="fas fa-arrow-right"></i></a>
</div>
</div>
</div>
</div>
</div>
# Style 06
Create Account
Search all the open positions on the web that suits you.
CV / Resume Upload
Search all the open positions on the web that suits you.
Find Your Job
Search all the open positions on the web that suits you.
<div class="row mt-n1-9 list-progress">
<div class="col-md-6 col-lg-4 mt-1-9">
<div class="process-style3">
<div class="d-flex justify-content-between">
<img src="img/icons/icon-22.png" alt="...">
<div class="process-number"></div>
</div>
<div class="seprator"></div>
<h4 class="h5 mb-3">Create Account</h4>
<p class="mb-0">Search all the open positions on the web that suits you.</p>
</div>
</div>
<div class="col-md-6 col-lg-4 mt-1-9">
<div class="process-style3">
<div class="d-flex justify-content-between">
<img src="img/icons/icon-23.png" alt="...">
<div class="process-number"></div>
</div>
<div class="seprator"></div>
<h4 class="h5 mb-3">CV / Resume Upload</h4>
<p class="mb-0">Search all the open positions on the web that suits you.</p>
</div>
</div>
<div class="col-md-6 col-lg-4 mt-1-9">
<div class="process-style3">
<div class="d-flex justify-content-between">
<img src="img/icons/icon-24.png" alt="...">
<div class="process-number"></div>
</div>
<div class="seprator"></div>
<h4 class="h5 mb-3">Find Your Job</h4>
<p class="mb-0">Search all the open positions on the web that suits you.</p>
</div>
</div>
</div>