Product Blocks
Start building your website with ready-to-use product blocks.
Static #1
Featured Books
<div class="container">
<header class="d-md-flex justify-content-between align-items-center mb-4 pb-xl-1">
<h2 class="font-size-7 font-weight-medium mb-4 mb-lg-0">Featured Books</h2>
<ul class="nav justify-content-md-center nav-gray-700 flex-nowrap flex-md-wrap overflow-auto overflow-md-visible" id="featuredBooks" role="tablist">
<li class="nav-item mx-5 mb-1 flex-shrink-0 flex-md-shrink-1">
<a class="nav-link px-0 active" id="featured-tab" data-toggle="tab" href="#featured" role="tab" aria-controls="featured" aria-selected="true">Featured</a>
</li>
<li class="nav-item mx-5 mb-1 flex-shrink-0 flex-md-shrink-1">
<a class="nav-link px-0" id="onsale-tab" data-toggle="tab" href="#onsale" role="tab" aria-controls="onsale" aria-selected="false">On Sale</a>
</li>
<li class="nav-item mx-5 mb-1 flex-shrink-0 flex-md-shrink-1">
<a class="nav-link px-0" id="mostviewed-tab" data-toggle="tab" href="#mostviewed" role="tab" aria-controls="mostviewed" aria-selected="false">Most Viewed</a>
</li>
</ul>
</header>
<div class="tab-content">
<div class="tab-pane fade show active" id="featured" role="tabpanel" aria-labelledby="featured-tab">
<div class="row no-gutters border-top border-left">
<div class="col-lg-4">
<div class="row no-gutters products row-cols-2">
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 product-1">
<div class="h-100">
<div class="product border-bottom border-right mb-5 mb-lg-0 d-flex h-100">
<div class="product__inner overflow-hidden p-3 p-md-4 my-auto">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail mb-5 mb-lg-8">
<a href="#" class="d-block "><img src="https://placehold.it/254x400" class="img-fluid height-400 d-block mx-auto mx-lg-0 px-xl-7 attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body mb-3">
<div class="text-uppercase font-size-1 mb-2 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title mb-2 font-size-22 font-weight-regular"><a href="#">Where the Crawdads Sing</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">L.J. Shen</a></div>
<div class="price d-flex align-items-center font-weight-medium">
<ins class="text-decoration-none mr-2">
<span class="woocommerce-Price-amount amount font-size-3 text-dark">
<span class="woocommerce-Price-currencySymbol">$</span>15</span>
</ins>
<del class="font-size-1 font-weight-regular text-secondary-gray-700">
<span class="woocommerce-Price-amount amount font-size-1"><span class="woocommerce-Price-currencySymbol">$</span>78,96</span>
</del>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-3" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="row no-gutters products row-cols-2">
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="onsale" role="tabpanel" aria-labelledby="onsale-tab">
<div class="row no-gutters border-top border-left">
<div class="col-lg-4">
<div class="row no-gutters products row-cols-2">
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 product-1">
<div class="h-100">
<div class="product border-bottom border-right mb-5 mb-lg-0 d-flex h-100">
<div class="product__inner overflow-hidden p-3 p-md-4 my-auto">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail mb-5 mb-lg-8">
<a href="#" class="d-block "><img src="https://placehold.it/254x400" class="img-fluid height-400 d-block mx-auto mx-lg-0 px-xl-7 attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body mb-3">
<div class="text-uppercase font-size-1 mb-2 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title mb-2 font-size-22 font-weight-regular"><a href="#">Where the Crawdads Sing</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">L.J. Shen</a></div>
<div class="price d-flex align-items-center font-weight-medium">
<ins class="text-decoration-none mr-2">
<span class="woocommerce-Price-amount amount font-size-3 text-dark">
<span class="woocommerce-Price-currencySymbol">$</span>15</span>
</ins>
<del class="font-size-1 font-weight-regular text-secondary-gray-700">
<span class="woocommerce-Price-amount amount font-size-1"><span class="woocommerce-Price-currencySymbol">$</span>78,96</span>
</del>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-3" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="row no-gutters products row-cols-2">
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="mostviewed" role="tabpanel" aria-labelledby="mostviewed-tab">
<div class="row no-gutters border-top border-left">
<div class="col-lg-4">
<div class="row no-gutters products row-cols-2">
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 product-1">
<div class="h-100">
<div class="product border-bottom border-right mb-5 mb-lg-0 d-flex h-100">
<div class="product__inner overflow-hidden p-3 p-md-4 my-auto">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail mb-5 mb-lg-8">
<a href="#" class="d-block "><img src="https://placehold.it/254x400" class="img-fluid height-400 d-block mx-auto mx-lg-0 px-xl-7 attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body mb-3">
<div class="text-uppercase font-size-1 mb-2 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title mb-2 font-size-22 font-weight-regular"><a href="#">Where the Crawdads Sing</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">L.J. Shen</a></div>
<div class="price d-flex align-items-center font-weight-medium">
<ins class="text-decoration-none mr-2">
<span class="woocommerce-Price-amount amount font-size-3 text-dark">
<span class="woocommerce-Price-currencySymbol">$</span>15</span>
</ins>
<del class="font-size-1 font-weight-regular text-secondary-gray-700">
<span class="woocommerce-Price-amount amount font-size-1"><span class="woocommerce-Price-currencySymbol">$</span>78,96</span>
</del>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-3" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="row no-gutters products row-cols-2">
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col product">
<div class="product__inner overflow-hidden p-3 p-md-4">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Static #2
<div class="container space-2">
<div class="row no-gutters row-cols-1 row-cols-lg-3">
<div class="col">
<div class="mb-5 mb-lg-0">
<h6 class="font-weight-medium font-size-7 mb-2 pb-1">New Arrivals</h6>
<div class="border-top border-left">
<div class="border-right border-bottom p-3">
<div class="media m-1">
<a class="d-block" href="#">
<img src="https://placehold.it/70x107" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-3">
<h6 class="font-weight-normal ml-1 mb-2 pb-1 text-lh-md crop-text-2">
<a href="#">The Ride of a Lifetime: Lessons Learned from 15 Years as CEO...</a>
</h6>
<span class="font-weight-medium font-size-3">$37</span>
</div>
</div>
</div>
<div class="border-right border-bottom p-3">
<div class="media m-1">
<a class="d-block" href="#">
<img src="https://placehold.it/70x107" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-3">
<h6 class="font-weight-normal ml-1 mb-2 pb-1 text-lh-md crop-text-2">
<a href="#">The Ride of a Lifetime: Lessons Learned from 15 Years as CEO...</a>
</h6>
<span class="font-weight-medium font-size-3">$37</span>
</div>
</div>
</div>
<div class="border-right border-bottom p-3">
<div class="media m-1">
<a class="d-block" href="#">
<img src="https://placehold.it/70x107" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-3">
<h6 class="font-weight-normal ml-1 mb-2 pb-1 text-lh-md crop-text-2">
<a href="#">The Ride of a Lifetime: Lessons Learned from 15 Years as CEO...</a>
</h6>
<span class="font-weight-medium font-size-3">$37</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col">
<div class="mb-5 mb-lg-0">
<h6 class="font-weight-medium font-size-7 mb-2 pb-1">Featured Products</h6>
<div class="border-top border-left border-lg-left-0">
<div class="border-right border-bottom p-3">
<div class="media m-1">
<a class="d-block" href="#">
<img src="https://placehold.it/70x107" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-3">
<h6 class="font-weight-normal ml-1 mb-2 pb-1 text-lh-md crop-text-2">
<a href="#">The Rural Diaries: Love, Livestock, and Big Life Lessons Down on...</a>
</h6>
<span class="font-weight-medium font-size-3">$21</span>
</div>
</div>
</div>
<div class="border-right border-bottom p-3">
<div class="media m-1">
<a class="d-block" href="#">
<img src="https://placehold.it/70x107" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-3">
<h6 class="font-weight-normal ml-1 mb-2 pb-1 text-lh-md crop-text-2">
<a href="#">The Rural Diaries: Love, Livestock, and Big Life Lessons Down on...</a>
</h6>
<span class="font-weight-medium font-size-3">$21</span>
</div>
</div>
</div>
<div class="border-right border-bottom p-3">
<div class="media m-1">
<a class="d-block" href="#">
<img src="https://placehold.it/70x107" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-3">
<h6 class="font-weight-normal ml-1 mb-2 pb-1 text-lh-md crop-text-2">
<a href="#">The Rural Diaries: Love, Livestock, and Big Life Lessons Down on...</a>
</h6>
<span class="font-weight-medium font-size-3">$21</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col">
<h6 class="font-weight-medium font-size-7 mb-2 pb-1">On-sale Books</h6>
<div class="border-top border-left border-lg-left-0">
<div class="border-right border-bottom p-3">
<div class="media m-1">
<a class="d-block" href="#">
<img src="https://placehold.it/70x107" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-3">
<h6 class="font-weight-normal ml-1 mb-2 pb-1 text-lh-md crop-text-2">
<a href="#">Russians Among Us: Sleeper Cells, Ghost Stories, and the Hunt...</a>
</h6>
<span class="font-weight-medium font-size-3">$182</span>
</div>
</div>
</div>
<div class="border-right border-bottom p-3">
<div class="media m-1">
<a class="d-block" href="#">
<img src="https://placehold.it/70x107" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-3">
<h6 class="font-weight-normal ml-1 mb-2 pb-1 text-lh-md crop-text-2">
<a href="#">Russians Among Us: Sleeper Cells, Ghost Stories, and the Hunt...</a>
</h6>
<span class="font-weight-medium font-size-3">$182</span>
</div>
</div>
</div>
<div class="border-right border-bottom p-3">
<div class="media m-1">
<a class="d-block" href="#">
<img src="https://placehold.it/70x107" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-3">
<h6 class="font-weight-normal ml-1 mb-2 pb-1 text-lh-md crop-text-2">
<a href="#">Russians Among Us: Sleeper Cells, Ghost Stories, and the Hunt...</a>
</h6>
<span class="font-weight-medium font-size-3">$182</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Static #3
Featured Books
<div class="container space-1">
<h2 class="font-size-26 mb-4">Featured Books</h2>
<div class="row row-cols-2 row-cols-md-3 row-cols-xl-3 row-cols-wd-4 products">
<div class="col mb-5">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col mb-5">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col mb-5">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col mb-5">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col mb-5">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col mb-5">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col mb-5">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col mb-5">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col mb-5">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col mb-5 d-lg-none d-wd-block">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col mb-5 d-lg-none d-wd-block">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col mb-5 d-lg-none d-wd-block">
<div class="product border product__space bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Static #4
Top Categories
<div class="bg-gray-200 space-2 space-lg-3">
<div class="container">
<header class="d-xl-flex justify-content-between align-items-center mb-4 pb-xl-1">
<h2 class="font-size-7 font-weight-medium mb-4 mb-xl-0">Top Categories</h2>
<ul class="nav justify-content-xl-center nav-gray-700 flex-nowrap flex-xl-wrap overflow-auto" role="tablist">
<li class="nav-item mx-5 mb-1 flex-shrink-0 flex-xl-shrink-1">
<a class="nav-link px-0 active" id="exampleone-tab" data-toggle="tab" href="#exampleone" role="tab" aria-controls="exampleone" aria-selected="true">Arts & Photography</a>
</li>
<li class="nav-item mx-5 mb-1 flex-shrink-0 flex-xl-shrink-1">
<a class="nav-link px-0" id="exampletwo-tab" data-toggle="tab" href="#exampletwo" role="tab" aria-controls="exampletwo" aria-selected="false">Food & Drink</a>
</li>
<li class="nav-item mx-5 mb-1 flex-shrink-0 flex-xl-shrink-1">
<a class="nav-link px-0" id="examplethree-tab" data-toggle="tab" href="#examplethree" role="tab" aria-controls="examplethree" aria-selected="false">Romance</a>
</li>
<li class="nav-item mx-5 mb-1 flex-shrink-0 flex-xl-shrink-1">
<a class="nav-link px-0" id="examplefour-tab" data-toggle="tab" href="#examplefour" role="tab" aria-controls="examplefour" aria-selected="false">Travel</a>
</li>
<li class="nav-item mx-5 mb-1 flex-shrink-0 flex-xl-shrink-1">
<a class="nav-link px-0" id="examplefive-tab" data-toggle="tab" href="#examplefive" role="tab" aria-controls="examplefive" aria-selected="false">Health</a>
</li>
<li class="nav-item mx-5 mb-1 flex-shrink-0 flex-xl-shrink-1">
<a class="nav-link px-0" id="examplesix-tab" data-toggle="tab" href="#examplesix" role="tab" aria-controls="examplesix" aria-selected="false">Natural History</a>
</li>
</ul>
</header>
<div class="tab-content">
<div class="tab-pane fade show active" id="exampleone" role="tabpanel" aria-labelledby="exampleone-tab">
<div class="row no-gutters">
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 mb-2 mb-lg-0">
<div class="h-100">
<div class="product product__space mx-1 mb-2 mb-lg-0 bg-white h-100">
<div class="product__inner d-flex overflow-hidden py-5 py-md-6 py-lg-8 px-3 px-md-4 px-lg-6 px-xl-8 h-100">
<div class="mt-auto woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail mb-5 mb-xl-8">
<a href="#" class="d-block "><img src="https://placehold.it/254x400" class="img-fluid d-block mx-auto mx-lg-0 px-xl-7 attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body">
<div class="text-uppercase font-size-1 mb-2 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title mb-2 font-size-22 font-weight-regular"><a href="#">Where the Crawdads Sing</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">L.J. Shen</a></div>
<div class="price d-flex align-items-center font-weight-medium mb-4">
<ins class="text-decoration-none mr-2">
<span class="woocommerce-Price-amount amount font-size-3 text-dark">
<span class="woocommerce-Price-currencySymbol">$</span>15</span>
</ins>
<del class="font-size-1 font-weight-regular text-secondary-gray-700">
<span class="woocommerce-Price-amount amount font-size-1"><span class="woocommerce-Price-currencySymbol">$</span>78,96</span>
</del>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-3" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="exampletwo" role="tabpanel" aria-labelledby="exampletwo-tab">
<div class="row no-gutters">
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 mb-2 mb-lg-0">
<div class="h-100">
<div class="product product__space mx-1 mb-2 mb-lg-0 bg-white h-100">
<div class="product__inner d-flex overflow-hidden py-5 py-md-6 py-lg-8 px-3 px-md-4 px-lg-6 px-xl-8 h-100">
<div class="mt-auto woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail mb-5 mb-xl-8">
<a href="#" class="d-block "><img src="https://placehold.it/254x400" class="img-fluid d-block mx-auto mx-lg-0 px-xl-7 attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body">
<div class="text-uppercase font-size-1 mb-2 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title mb-2 font-size-22 font-weight-regular"><a href="#">Where the Crawdads Sing</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">L.J. Shen</a></div>
<div class="price d-flex align-items-center font-weight-medium mb-4">
<ins class="text-decoration-none mr-2">
<span class="woocommerce-Price-amount amount font-size-3 text-dark">
<span class="woocommerce-Price-currencySymbol">$</span>15</span>
</ins>
<del class="font-size-1 font-weight-regular text-secondary-gray-700">
<span class="woocommerce-Price-amount amount font-size-1"><span class="woocommerce-Price-currencySymbol">$</span>78,96</span>
</del>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-3" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="examplethree" role="tabpanel" aria-labelledby="examplethree-tab">
<div class="row no-gutters">
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 mb-2 mb-lg-0">
<div class="h-100">
<div class="product product__space mx-1 mb-2 mb-lg-0 bg-white h-100">
<div class="product__inner d-flex overflow-hidden py-5 py-md-6 py-lg-8 px-3 px-md-4 px-lg-6 px-xl-8 h-100">
<div class="mt-auto woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail mb-5 mb-xl-8">
<a href="#" class="d-block "><img src="https://placehold.it/254x400" class="img-fluid d-block mx-auto mx-lg-0 px-xl-7 attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body">
<div class="text-uppercase font-size-1 mb-2 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title mb-2 font-size-22 font-weight-regular"><a href="#">Where the Crawdads Sing</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">L.J. Shen</a></div>
<div class="price d-flex align-items-center font-weight-medium mb-4">
<ins class="text-decoration-none mr-2">
<span class="woocommerce-Price-amount amount font-size-3 text-dark">
<span class="woocommerce-Price-currencySymbol">$</span>15</span>
</ins>
<del class="font-size-1 font-weight-regular text-secondary-gray-700">
<span class="woocommerce-Price-amount amount font-size-1"><span class="woocommerce-Price-currencySymbol">$</span>78,96</span>
</del>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-3" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="examplefour" role="tabpanel" aria-labelledby="examplefour-tab">
<div class="row no-gutters">
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 mb-2 mb-lg-0">
<div class="h-100">
<div class="product product__space mx-1 mb-2 mb-lg-0 bg-white h-100">
<div class="product__inner d-flex overflow-hidden py-5 py-md-6 py-lg-8 px-3 px-md-4 px-lg-6 px-xl-8 h-100">
<div class="mt-auto woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail mb-5 mb-xl-8">
<a href="#" class="d-block "><img src="https://placehold.it/254x400" class="img-fluid d-block mx-auto mx-lg-0 px-xl-7 attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body">
<div class="text-uppercase font-size-1 mb-2 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title mb-2 font-size-22 font-weight-regular"><a href="#">Where the Crawdads Sing</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">L.J. Shen</a></div>
<div class="price d-flex align-items-center font-weight-medium mb-4">
<ins class="text-decoration-none mr-2">
<span class="woocommerce-Price-amount amount font-size-3 text-dark">
<span class="woocommerce-Price-currencySymbol">$</span>15</span>
</ins>
<del class="font-size-1 font-weight-regular text-secondary-gray-700">
<span class="woocommerce-Price-amount amount font-size-1"><span class="woocommerce-Price-currencySymbol">$</span>78,96</span>
</del>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-3" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="examplefive" role="tabpanel" aria-labelledby="examplefive-tab">
<div class="row no-gutters">
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 mb-2 mb-lg-0">
<div class="h-100">
<div class="product product__space mx-1 mb-2 mb-lg-0 bg-white h-100">
<div class="product__inner d-flex overflow-hidden py-5 py-md-6 py-lg-8 px-3 px-md-4 px-lg-6 px-xl-8 h-100">
<div class="mt-auto woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail mb-5 mb-xl-8">
<a href="#" class="d-block "><img src="https://placehold.it/254x400" class="img-fluid d-block mx-auto mx-lg-0 px-xl-7 attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body">
<div class="text-uppercase font-size-1 mb-2 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title mb-2 font-size-22 font-weight-regular"><a href="#">Where the Crawdads Sing</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">L.J. Shen</a></div>
<div class="price d-flex align-items-center font-weight-medium mb-4">
<ins class="text-decoration-none mr-2">
<span class="woocommerce-Price-amount amount font-size-3 text-dark">
<span class="woocommerce-Price-currencySymbol">$</span>15</span>
</ins>
<del class="font-size-1 font-weight-regular text-secondary-gray-700">
<span class="woocommerce-Price-amount amount font-size-1"><span class="woocommerce-Price-currencySymbol">$</span>78,96</span>
</del>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-3" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="examplesix" role="tabpanel" aria-labelledby="examplesix-tab">
<div class="row no-gutters">
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 mb-2 mb-lg-0">
<div class="h-100">
<div class="product product__space mx-1 mb-2 mb-lg-0 bg-white h-100">
<div class="product__inner d-flex overflow-hidden py-5 py-md-6 py-lg-8 px-3 px-md-4 px-lg-6 px-xl-8 h-100">
<div class="mt-auto woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail mb-5 mb-xl-8">
<a href="#" class="d-block "><img src="https://placehold.it/254x400" class="img-fluid d-block mx-auto mx-lg-0 px-xl-7 attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body">
<div class="text-uppercase font-size-1 mb-2 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title mb-2 font-size-22 font-weight-regular"><a href="#">Where the Crawdads Sing</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">L.J. Shen</a></div>
<div class="price d-flex align-items-center font-weight-medium mb-4">
<ins class="text-decoration-none mr-2">
<span class="woocommerce-Price-amount amount font-size-3 text-dark">
<span class="woocommerce-Price-currencySymbol">$</span>15</span>
</ins>
<del class="font-size-1 font-weight-regular text-secondary-gray-700">
<span class="woocommerce-Price-amount amount font-size-1"><span class="woocommerce-Price-currencySymbol">$</span>78,96</span>
</del>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-3" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 product-4">
<div class="row no-gutters">
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-6">
<div class="products">
<div class="product product__space mx-1 mb-2 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4 bg-white ">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="img-fluid d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto" data-toggle="tooltip" data-placement="right" data-original-title="ADD TO CART" tabindex="0">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0" tabindex="0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Static #5
Featured Products
<div class="container mb-2 space-2">
<div class="row no-gutters row-cols-1 row-cols-lg-3">
<div class="col">
<div class="mb-5 mb-lg-0">
<h6 class="font-weight-medium font-size-7 mb-2 pb-1">New Arrivals</h6>
<div class="py-3 pr-3">
<div class="media my-1 mr-1">
<a class="d-block" href="#">
<img src="https://placehold.it/90x138" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-4">
<div class="text-uppercase font-size-1 text-truncate"><a href="#">Hardcover</a></div>
<h6 class="font-weight-normal mb-1 text-lh-md crop-text-2">
<a href="#">The Ride of a Lifetime: Lessons Learned from 15 Years as CEO...</a>
</h6>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700" tabindex="0">Robert Iger</a></div>
<span class="font-weight-medium font-size-3">$37</span>
</div>
</div>
</div>
<div class="py-3 pr-3">
<div class="media my-1 mr-1">
<a class="d-block" href="#">
<img src="https://placehold.it/90x138" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-4">
<div class="text-uppercase font-size-1 text-truncate"><a href="#">Hardcover</a></div>
<h6 class="font-weight-normal mb-1 text-lh-md crop-text-2">
<a href="#">The Ride of a Lifetime: Lessons Learned from 15 Years as CEO...</a>
</h6>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700" tabindex="0">Robert Iger</a></div>
<span class="font-weight-medium font-size-3">$37</span>
</div>
</div>
</div>
<div class="py-3 pr-3">
<div class="media my-1 mr-1">
<a class="d-block" href="#">
<img src="https://placehold.it/90x138" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-4">
<div class="text-uppercase font-size-1 text-truncate"><a href="#">Hardcover</a></div>
<h6 class="font-weight-normal mb-1 text-lh-md crop-text-2">
<a href="#">The Ride of a Lifetime: Lessons Learned from 15 Years as CEO...</a>
</h6>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700" tabindex="0">Robert Iger</a></div>
<span class="font-weight-medium font-size-3">$37</span>
</div>
</div>
</div>
</div>
</div>
<div class="col">
<div class="mb-5 mb-lg-0">
<h6 class="font-weight-medium font-size-7 mb-2 pb-1">Featured Products</h6>
<div class="py-3 pr-4">
<div class="media my-1 mr-1">
<a class="d-block" href="#">
<img src="https://placehold.it/90x138" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-4">
<div class="text-uppercase font-size-1 text-truncat0"><a href="#">Hardcover</a></div>
<h6 class="font-weight-normal mb-1 text-lh-md crop-text-2">
<a href="#">The Rural Diaries: Love, Livestock, and Big Life Lessons Down on...</a>
</h6>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700" tabindex="0">Hilarie Burton
</a></div>
<span class="font-weight-medium font-size-3">$21</span>
</div>
</div>
</div>
<div class="py-3 pr-4">
<div class="media my-1 mr-1">
<a class="d-block" href="#">
<img src="https://placehold.it/90x138" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-4">
<div class="text-uppercase font-size-1 text-truncat0"><a href="#">Hardcover</a></div>
<h6 class="font-weight-normal mb-1 text-lh-md crop-text-2">
<a href="#">The Rural Diaries: Love, Livestock, and Big Life Lessons Down on...</a>
</h6>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700" tabindex="0">Hilarie Burton
</a></div>
<span class="font-weight-medium font-size-3">$21</span>
</div>
</div>
</div>
<div class="py-3 pr-4">
<div class="media my-1 mr-1">
<a class="d-block" href="#">
<img src="https://placehold.it/90x138" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-4">
<div class="text-uppercase font-size-1 text-truncat0"><a href="#">Hardcover</a></div>
<h6 class="font-weight-normal mb-1 text-lh-md crop-text-2">
<a href="#">The Rural Diaries: Love, Livestock, and Big Life Lessons Down on...</a>
</h6>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700" tabindex="0">Hilarie Burton
</a></div>
<span class="font-weight-medium font-size-3">$21</span>
</div>
</div>
</div>
</div>
</div>
<div class="col">
<h6 class="font-weight-medium font-size-7 mb-2 pb-1">On-sale Books</h6>
<div class="py-3 pr-3">
<div class="media my-1 mr-1">
<a class="d-block" href="#">
<img src="https://placehold.it/90x138" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-4">
<div class="text-uppercase font-size-1 mb-0 text-truncate"><a href="#">Hardcover</a></div>
<h6 class="font-weight-normal mb-1 text-lh-md crop-text-2">
<a href="#">Russians Among Us: Sleeper Cells, Ghost Stories, and the Hunt...</a>
</h6>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700" tabindex="0">Gordon Corera</a></div>
<span class="font-weight-medium font-size-3">$182</span>
</div>
</div>
</div>
<div class="py-3 pr-3">
<div class="media my-1 mr-1">
<a class="d-block" href="#">
<img src="https://placehold.it/90x138" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-4">
<div class="text-uppercase font-size-1 mb-0 text-truncate"><a href="#">Hardcover</a></div>
<h6 class="font-weight-normal mb-1 text-lh-md crop-text-2">
<a href="#">Russians Among Us: Sleeper Cells, Ghost Stories, and the Hunt...</a>
</h6>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700" tabindex="0">Gordon Corera</a></div>
<span class="font-weight-medium font-size-3">$182</span>
</div>
</div>
</div>
<div class="py-3 pr-3">
<div class="media my-1 mr-1">
<a class="d-block" href="#">
<img src="https://placehold.it/90x138" class="img-fluid attachment-shop_catalog size-shop_catalog wp-post-image" alt="image-description">
</a>
<div class="media-body ml-4">
<div class="text-uppercase font-size-1 mb-0 text-truncate"><a href="#">Hardcover</a></div>
<h6 class="font-weight-normal mb-1 text-lh-md crop-text-2">
<a href="#">Russians Among Us: Sleeper Cells, Ghost Stories, and the Hunt...</a>
</h6>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700" tabindex="0">Gordon Corera</a></div>
<span class="font-weight-medium font-size-3">$182</span>
</div>
</div>
</div>
</div>
</div>
</div>
Static #6
Trending Books
View All
<div class="container space-top-2">
<header class="d-md-flex justify-content-between align-items-center mb-5">
<h2 class="font-size-7 mb-4 mb-md-0">Trending Books</h2>
<a href="#" class="d-flex align-items-center h-primary">View All<span class="flaticon-next font-size-3 ml-2"></span></a>
</header>
<ul class="products list-unstyled mb-0 row row-cols-2 row-cols-md-3 row-cols-xl-4 row-cols-wd-5">
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<div class="position-relative">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
<span class="badge badge-md badge-primary-green position-absolute badge-pos--top-right text-white rounded-circle d-flex flex-column align-items-center justify-content-center">21%
</span>
</div>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col d-xl-none d-wd-block">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col d-xl-none d-wd-block">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<div class="position-relative">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
<span class="badge badge-md badge-primary-green position-absolute badge-pos--top-right text-white rounded-circle d-flex flex-column align-items-center justify-content-center">21%
</span>
</div>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
Static #7
Featured Books
<div class="container">
<header class="d-md-flex justify-content-between mb-5">
<h2 class="font-size-7">Featured Books</h2>
<ul class="nav nav-gray-700 flex-nowrap flex-md-wrap overflow-auto overflow-md-visible" role="tablist">
<li class="nav-item mx-4 flex-shrink-0 flex-md-shrink-1">
<a class="nav-link pb-1 px-0 active" id="history-pill-tab" data-toggle="tab" href="#history-pill" role="tab" aria-controls="history-pill" aria-selected="true">On Sale</a>
</li>
<li class="nav-item mx-4 flex-shrink-0 flex-md-shrink-1">
<a class="nav-link pb-1 px-0" id="romance-pill-tab" data-toggle="tab" href="#romance-pill" role="tab" aria-controls="romance-pill" aria-selected="true">New Arrivals</a>
</li>
<li class="nav-item ml-4 flex-shrink-0 flex-md-shrink-1">
<a class="nav-link pb-1 px-0" id="travel-pill-tab" data-toggle="tab" href="#travel-pill" role="tab" aria-controls="travel-pill" aria-selected="true">Most Viewed</a>
</li>
</ul>
</header>
<div class="tab-content" id="pills-tabcontent">
<div class="tab-pane fade show active" id="history-pill" role="tabpanel" aria-labelledby="history-pill-tab">
<div class="row">
<div class="col-lg-3 col-xl-3 col-wd-2 mb-5 mb-md-0 product-2">
<ul class="products row d-block d-md-flex d-lg-block list-unstyled mb-0">
<li class="col">
<div class="mb-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
<div class="col-lg-4 col-xl-3 mb-5 mb-lg-0">
<div class="banner px-3 py-8 py-lg-0 px-lg-5 px-wd-8 d-flex h-100 justify-content-center align-items-center rounded-md bg-punch-light border">
<div class="banner__body">
<div class="banner__image pb-1 mb-5">
<img src="https://placehold.it/250x200" class="img-fluid" alt="image-description">
</div>
<h3 class="banner_text m-0">
<span class="d-block mb-1 font-size-7 font-weight-regular text-dark">Get Extra</span>
<span class="d-block mb-3 font-size-10 font-weight-medium text-primary">Sale -25%</span>
<span class="d-block mb-5 text-uppercase font-size-4 font-weight-regular text-gray-400">On Order Over $100</span>
</h3>
<a href="#" class="btn btn-dark btn-wide rounded-md">View More</a>
</div>
</div>
</div>
<div class="col-lg-5 col-xl-6 col-wd-7">
<ul class="products row row-cols-2 row-cols-lg-2 row-cols-wd-3 list-unstyled mb-0">
<li class="col">
<div class="mb-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-5 mb-lg-0 md-wd-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Open Book</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">hardcover</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Until the End of Time: Mind, Matter</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>89</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col d-lg-none d-wd-block">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>10</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col d-lg-none d-wd-block">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Hardcover</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Camino Winds</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>9</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="tab-pane fade" id="romance-pill" role="tabpanel" aria-labelledby="romance-pill-tab">
<div class="row">
<div class="col-lg-3 col-xl-3 col-wd-2 mb-5 mb-md-0 product-2">
<ul class="products row d-block d-md-flex d-lg-block list-unstyled mb-0">
<li class="col">
<div class="mb-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
<div class="col-lg-4 col-xl-3 mb-5 mb-lg-0">
<div class="banner px-3 py-8 py-lg-0 px-lg-5 px-wd-8 d-flex h-100 justify-content-center align-items-center rounded-md bg-punch-light border">
<div class="banner__body">
<div class="banner__image pb-1 mb-5">
<img src="https://placehold.it/250x200" class="img-fluid" alt="image-description">
</div>
<h3 class="banner_text m-0">
<span class="d-block mb-1 font-size-7 font-weight-regular text-dark">Get Extra</span>
<span class="d-block mb-3 font-size-10 font-weight-medium text-primary">Sale -25%</span>
<span class="d-block mb-5 text-uppercase font-size-4 font-weight-regular text-gray-400">On Order Over $100</span>
</h3>
<a href="#" class="btn btn-dark btn-wide rounded-md">View More</a>
</div>
</div>
</div>
<div class="col-lg-5 col-xl-6 col-wd-7">
<ul class="products row row-cols-2 row-cols-lg-2 row-cols-wd-3 list-unstyled mb-0">
<li class="col">
<div class="mb-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-5 mb-lg-0 md-wd-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Open Book</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">hardcover</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Until the End of Time: Mind, Matter</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>89</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col d-lg-none d-wd-block">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>10</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col d-lg-none d-wd-block">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Hardcover</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Camino Winds</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>9</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="tab-pane fade" id="travel-pill" role="tabpanel" aria-labelledby="travel-pill-tab">
<div class="row">
<div class="col-lg-3 col-xl-3 col-wd-2 mb-5 mb-md-0 product-2">
<ul class="products row d-block d-md-flex d-lg-block list-unstyled mb-0">
<li class="col">
<div class="mb-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
<div class="col-lg-4 col-xl-3 mb-5 mb-lg-0">
<div class="banner px-3 py-8 py-lg-0 px-lg-5 px-wd-8 d-flex h-100 justify-content-center align-items-center rounded-md bg-punch-light border">
<div class="banner__body">
<div class="banner__image pb-1 mb-5">
<img src="https://placehold.it/250x200" class="img-fluid" alt="image-description">
</div>
<h3 class="banner_text m-0">
<span class="d-block mb-1 font-size-7 font-weight-regular text-dark">Get Extra</span>
<span class="d-block mb-3 font-size-10 font-weight-medium text-primary">Sale -25%</span>
<span class="d-block mb-5 text-uppercase font-size-4 font-weight-regular text-gray-400">On Order Over $100</span>
</h3>
<a href="#" class="btn btn-dark btn-wide rounded-md">View More</a>
</div>
</div>
</div>
<div class="col-lg-5 col-xl-6 col-wd-7">
<ul class="products row row-cols-2 row-cols-lg-2 row-cols-wd-3 list-unstyled mb-0">
<li class="col">
<div class="mb-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-5 mb-lg-0 md-wd-5">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Open Book</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>37</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">hardcover</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Until the End of Time: Mind, Matter</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>89</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col d-lg-none d-wd-block">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">kindle edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>10</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="col d-lg-none d-wd-block">
<div class="mb-0">
<div class="product product__space product__space-primary border rounded-md bg-white">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/120x180" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Hardcover</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Camino Winds</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>9</span>
</div>
<div class="product__rating d-none align-items-center font-size-2">
<div class="text-yellow-darker mr-2">
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="fas fa-star"></small>
<small class="far fa-star"></small>
<small class="far fa-star"></small>
</div>
<div class="">(3,714)</div>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-dark border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
Static #8
Trending Books
View All
<div class="bg-gray-200 space-bottom-2 space-top-3">
<div class="container">
<header class="d-md-flex justify-content-between align-items-center mb-5">
<h2 class="font-size-7 mb-3 mb-md-0">Trending Books</h2>
<a href="#" class="d-flex align-items-center h-primary">View All<span class="flaticon-next font-size-3 ml-2"></span></a>
</header>
<ul class="products list-unstyled mb-0 row row-cols-2 row-cols-md-3 row-cols-xl-4 row-cols-wd-5">
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<div class="position-relative">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
<span class="badge badge-md badge-primary-green position-absolute badge-pos--top-right text-white rounded-circle d-flex flex-column align-items-center justify-content-center">21%
</span>
</div>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5 mb-lg-0">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Kindle Edition</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">The Overdue Life of Amy Byler</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Kelly Harms</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col d-xl-none d-wd-block">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="col d-xl-none d-wd-block">
<div class="product product__space product__space-primary border rounded-md bg-white mb-5">
<div class="product__inner overflow-hidden p-3 p-md-4d875">
<div class="woocommerce-LoopProduct-link woocommerce-loop-product__link d-block position-relative">
<div class="woocommerce-loop-product__thumbnail">
<div class="position-relative">
<a href="#" class="d-block"><img src="https://placehold.it/150x225" class="d-block mx-auto attachment-shop_catalog size-shop_catalog wp-post-image img-fluid" alt="image-description"></a>
<span class="badge badge-md badge-primary-green position-absolute badge-pos--top-right text-white rounded-circle d-flex flex-column align-items-center justify-content-center">21%
</span>
</div>
</div>
<div class="woocommerce-loop-product__body product__body pt-3 bg-white">
<div class="text-uppercase font-size-1 mb-1 text-truncate"><a href="#">Paperback</a></div>
<h2 class="woocommerce-loop-product__title product__title h6 text-lh-md mb-1 text-height-2 crop-text-2 h-dark"><a href="#">Think Like a Monk: Train Your Mind for Peace and Purpose Everyday</a></h2>
<div class="font-size-2 mb-1 text-truncate"><a href="#" class="text-gray-700">Jay Shetty</a></div>
<div class="price d-flex align-items-center font-weight-medium font-size-3">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>29</span>
</div>
</div>
<div class="product__hover d-flex align-items-center">
<a href="#" class="text-uppercase text-dark h-dark font-weight-medium mr-auto">
<span class="product__add-to-cart">ADD TO CART</span>
<span class="product__add-to-cart-icon font-size-4"><i class="flaticon-icon-126515"></i></span>
</a>
<a href="#" class="mr-1 h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-switch"></i>
</a>
<a href="#" class="h-p-bg btn btn-outline-primary border-0">
<i class="flaticon-heart"></i>
</a>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>