<div class="row">
<!-- column -->
<div class="col-lg-4 col-md-6">
<!-- Card -->
<div class="card">
  <img class="card-img-top img-responsive" src="./assets/images/blog/blog-img1.jpg"
    alt="Card image cap" />
  <div class="card-body">
    <h4 class="card-title">Card title</h4>
    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>
    <a href="javascript:void(0)" class="btn btn-primary">Go somewhere</a>
  </div>
</div>
<!-- Card -->
</div>
<!-- column -->
<!-- column -->
<div class="col-lg-4 col-md-6">
<!-- Card -->
<div class="card">
  <img class="card-img-top img-responsive" src="./assets/images/blog/blog-img2.jpg"
    alt="Card image cap" />
  <div class="card-body">
    <h4 class="card-title">Card title</h4>
    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>
    <a href="javascript:void(0)" class="btn btn-primary">Go somewhere</a>
  </div>
</div>
<!-- Card -->
</div>
<!-- column -->
<!-- column -->
<div class="col-lg-4 col-md-6">
<!-- Card -->
<div class="card">
  <img class="card-img-top img-responsive" src="./assets/images/blog/blog-img3.jpg"
    alt="Card image cap" />
  <div class="card-body">
    <h4 class="card-title">Card title</h4>
    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>
    <a href="javascript:void(0)" class="btn btn-primary">Go somewhere</a>
  </div>
</div>
<!-- Card -->
</div>
<!-- column -->
<!-- column -->
<div class="col-lg-4 col-md-6">
<!-- Card -->
<div class="card">
  <img class="card-img-top img-responsive" src="./assets/images/blog/blog-img4.jpg"
    alt="Card image cap" />
  <div class="card-body">
    <h4 class="card-title">Card title</h4>
    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>
    <a href="javascript:void(0)" class="btn btn-primary">Go somewhere</a>
  </div>
</div>
<!-- Card -->
</div>
<!-- column -->
<!-- column -->
<div class="col-lg-4 col-md-6">
<!-- Card -->
<div class="card">
  <img class="card-img-top img-responsive" src="./assets/images/blog/blog-img5.jpg"
    alt="Card image cap" />
  <div class="card-body">
    <h4 class="card-title">Card title</h4>
    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>
    <a href="javascript:void(0)" class="btn btn-primary">Go somewhere</a>
  </div>
</div>
<!-- Card -->
</div>
<!-- column -->
<!-- column -->
<div class="col-lg-4 col-md-6">
<!-- Card -->
<div class="card">
  <img class="card-img-top img-responsive" src="./assets/images/blog/blog-img6.jpg"
    alt="Card image cap" />
  <div class="card-body">
    <h4 class="card-title">Card title</h4>
    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>
    <a href="javascript:void(0)" class="btn btn-primary">Go somewhere</a>
  </div>
</div>
<!-- Card -->
</div>
<!-- column -->
</div>

<div class="row">
<div class="col-md-6 col-lg-3">
  <div class="card">
    <div class="card-body">
      <h5 class="card-title">James Smith</h5>
      <h6 class="card-subtitle mb-2 text-muted d-flex align-items-center"><i class="ti ti-map-pin me-1 fs-5"></i>Albania</h6>
      <p class="card-text pt-2">
        Some quick example text to build on the card title and make up the bulk of the card's content.
      </p>
      <a href="#" class="card-link">Follow</a>
      <a href="#" class="card-link">View profile</a>
    </div>
  </div>
</div>
<div class="col-md-6 col-lg-3">
  <div class="card">
    <div class="card-body">
      <h5 class="card-title">Michael Smith</h5>
      <h6 class="card-subtitle mb-2 text-muted d-flex align-items-center"><i class="ti ti-map-pin me-1 fs-5"></i>Belize</h6>
      <p class="card-text pt-2">
        Some quick example text to build on the card title and make up the bulk of the card's content.
      </p>
      <a href="#" class="card-link">Follow</a>
      <a href="#" class="card-link">View profile</a>
    </div>
  </div>
</div>
<div class="col-md-6 col-lg-3">
  <div class="card">
    <div class="card-body">
      <h5 class="card-title">Maria Hernandez</h5>
      <h6 class="card-subtitle mb-2 text-muted d-flex align-items-center"><i class="ti ti-map-pin me-1 fs-5"></i>Colombia</h6>
      <p class="card-text pt-2">
        Some quick example text to build on the card title and make up the bulk of the card's content.
      </p>
      <a href="#" class="card-link">Follow</a>
      <a href="#" class="card-link">View profile</a>
    </div>
  </div>
</div>
<div class="col-md-6 col-lg-3">
  <div class="card">
    <div class="card-body">
      <h5 class="card-title">David Margaret</h5>
      <h6 class="card-subtitle mb-2 text-muted d-flex align-items-center"><i class="ti ti-map-pin me-1 fs-5"></i>Egypt</h6>
      <p class="card-text pt-2">
        Some quick example text to build on the card title and make up the bulk of the card's content.
      </p>
      <a href="#" class="card-link">Follow</a>
      <a href="#" class="card-link">View profile</a>
    </div>
  </div>
</div>
</div>

<div class="row justify-content-center">
<div class="col-lg-4 col-md-6">
<div class="card">
  <img src="./assets/images/blog/blog-img5.jpg" class="card-img-top" alt="..." />
  <div class="card-body p-10">
    <h5 class="card-title fs-5">Nancy Henry</h5>
    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>
  </div>
  <ul class="list-group list-group-flush">
    <li class="list-group-item">Cras justo odio</li>
    <li class="list-group-item">Dapibus ac facilisis in</li>
    <li class="list-group-item">Vestibulum at eros</li>
  </ul>
  <div class="card-body button-group d-flex align-items-stretch p-10">
    <a href="#" class="btn bg-secondary-subtle text-secondary px-2 d-flex align-items-center"><i class="ti ti-heart fs-6 me-1"></i> Like</a>
    <a href="#" class="btn bg-secondary-subtle text-secondary px-2 d-flex align-items-center"><i class="ti ti-message-circle fs-6 me-1"></i> Comment</a>
    <div class="ms-auto">
      <a href="#" class="btn bg-secondary-subtle text-secondary px-2 d-flex align-items-center flex-column flex-sm-row"><i class="ti ti-share fs-6"></i> </a>
    </div>
  </div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="card">
  <img src="./assets/images/blog/blog-img6.jpg" class="card-img-top" alt="..." />
  <div class="card-body p-10">
    <h5 class="card-title fs-5">George Jane</h5>
    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>
  </div>
  <ul class="list-group list-group-flush">
    <li class="list-group-item">Cras justo odio</li>
    <li class="list-group-item">Dapibus ac facilisis in</li>
    <li class="list-group-item">Vestibulum at eros</li>
  </ul>
  <div class="card-body button-group d-flex align-items-stretch p-10">
    <a href="#" class="btn bg-secondary-subtle text-secondary px-2 d-flex align-items-center"><i class="ti ti-heart fs-6 me-1"></i> Like</a>
    <a href="#" class="btn bg-secondary-subtle text-secondary px-2 d-flex align-items-center"><i class="ti ti-message-circle fs-6 me-1"></i> Comment</a>
    <div class="ms-auto">
      <a href="#" class="btn bg-secondary-subtle text-secondary px-2 d-flex align-items-center flex-column flex-sm-row"><i class="ti ti-share fs-6"></i> </a>
    </div>
  </div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="card">
  <img src="./assets/images/blog/blog-img8.jpg" class="card-img-top" alt="..." />
  <div class="card-body p-10">
    <h5 class="card-title fs-5">Samuel Eliza</h5>
    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>
  </div>
  <ul class="list-group list-group-flush">
    <li class="list-group-item">Cras justo odio</li>
    <li class="list-group-item">Dapibus ac facilisis in</li>
    <li class="list-group-item">Vestibulum at eros</li>
  </ul>
  <div class="card-body button-group d-flex align-items-stretch p-10">
    <a href="#" class="btn bg-secondary-subtle text-secondary px-2 d-flex align-items-center"><i class="ti ti-heart fs-6 me-1"></i> Like</a>
    <a href="#" class="btn bg-secondary-subtle text-secondary px-2 d-flex align-items-center"><i class="ti ti-message-circle fs-6 me-1"></i> Comment</a>
    <div class="ms-auto">
      <a href="#" class="btn bg-secondary-subtle text-secondary px-2 d-flex align-items-center flex-column flex-sm-row"><i class="ti ti-share fs-6"></i> </a>
    </div>
  </div>
</div>
</div>
</div>

<div class="row">
<div class="col-lg-6">
  <div class="card">
    <div class="card-header">Featured</div>
    <div class="card-body">
      <h5 class="card-title">Special title treatment</h5>
      <p class="card-text">
        With supporting text below as a natural lead-in to additional content.
      </p>
      <a href="#" class="btn btn-primary">Go somewhere</a>
    </div>
  </div>
</div>
<div class="col-lg-6">
  <div class="card text-center">
    <div class="card-header">Featured</div>
    <div class="card-body">
      <h5 class="card-title">Special title treatment</h5>
      <p class="card-text">
        With supporting text below as a natural lead-in to additional content.
      </p>
      <a href="#" class="btn btn-primary">Go somewhere</a>
    </div>
  </div>
</div>
</div>

<div class="row gx-3">
<div class="col-md-4 col-lg-2 col-6">
<div class="card text-white bg-primary rounded">
  <div class="card-body p-4">
    <span>
      <i class="ti ti-layout-grid fs-8"></i>
    </span>
    <h3 class="card-title mt-3 mb-0 text-white">450</h3>
    <p class="card-text text-white-50 fs-3 fw-normal">
      New Products
    </p>
  </div>
</div>
</div>
<div class="col-md-4 col-lg-2 col-6">
<div class="card text-white text-bg-success rounded">
  <div class="card-body p-4">
    <span>
      <i class="ti ti-archive fs-8"></i>
    </span>
    <h3 class="card-title mt-3 mb-0 text-white">50</h3>
    <p class="card-text text-white-50 fs-3 fw-normal">
      Pending Apps
    </p>
  </div>
</div>
</div>
<div class="col-md-4 col-lg-2 col-6">
<div class="card text-white text-bg-warning rounded">
  <div class="card-body p-4">
    <span>
      <i class="ti ti-users fs-8"></i>
    </span>
    <h3 class="card-title mt-3 mb-0 text-white">80</h3>
    <p class="card-text text-white-50 fs-3 fw-normal">
      New Customers
    </p>
  </div>
</div>
</div>
<div class="col-md-4 col-lg-2 col-6">
<div class="card text-white text-bg-danger rounded">
  <div class="card-body p-4">
    <span>
      <i class="ti ti-gift fs-8"></i>
    </span>
    <h3 class="card-title mt-3 mb-0 text-white">15</h3>
    <p class="card-text text-white-50 fs-3 fw-normal">
      Birthday Gifts
    </p>
  </div>
</div>
</div>
<div class="col-md-4 col-lg-2 col-6">
<div class="card text-white text-bg-info rounded">
  <div class="card-body p-4">
    <span>
      <i class="ti ti-credit-card fs-8"></i>
    </span>
    <h3 class="card-title mt-3 mb-0 text-white">1800</h3>
    <p class="card-text text-white-50 fs-3 fw-normal">
      Total Budgets
    </p>
  </div>
</div>
</div>
<div class="col-md-4 col-lg-2 col-6">
<div class="card text-white text-bg-secondary rounded">
  <div class="card-body p-4">
    <span>
      <i class="ti ti-brand-github fs-8"></i>
    </span>
    <h3 class="card-title mt-3 mb-0 text-white">90</h3>
    <p class="card-text text-white-50 fs-3 fw-normal">
      Best Designers
    </p>
  </div>
</div>
</div>
</div>