<div class="py-11 pt-lg-12 pb-lg-10">
<div class="container container-xl">
<div class="row">
<div class="col-12 col-lg-7/10 mb-6 mb-lg-0">
<div class="card border-0 banner banner-08 hover-zoom-in hover-shine">
<div class="card-img bg-img-cover-center"
style="background-image: url('../../../images/banner-45.jpg');"></div>
<div class="card-img-overlay d-inline-flex flex-column p-6 p-md-9">
<h3 class="card-title fs-40 text-white lh-129 mb-2">Empower Yourself</h3>
<p class="card-text fs-18 text-white font-weight-500">
Get the skin you want to feel
</p>
<div>
<a href="#"
class="btn btn-link btn-light bg-transparent text-white hover-white border-0 border-bottom rounded-0 p-0 fs-16 font-weight-600">
Shop Now
<svg class="icon icon-arrow-right">
<use xlink:href="#icon-arrow-right"></use>
</svg>
</a>
</div>
</div>
</div>
</div>
<div class="col-12 col-lg-3/10">
<div class="row">
<div class="col-12 col-sm-6 col-lg-12">
<div class="card border-0 banner banner-09 hover-zoom-in hover-shine">
<div class="card-img bg-img-cover-center"
style="background-image: url('../../../images/banner-43.jpg');"></div>
<div class="card-img-overlay d-inline-flex flex-column p-6 p-md-9 align-items-center justify-content-center">
<a href="#"
class="fs-16 font-weight-600 btn text-secondary hover-white bg-white bg-hover-secondary shadow-1">Haircare</a>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-lg-12 mt-6 mt-sm-0 mt-lg-6">
<div class="card border-0 banner banner-09 hover-zoom-in hover-shine">
<div class="card-img bg-img-cover-center"
style="background-image: url('../../../images/banner-44.jpg');"></div>
<div class="card-img-overlay d-inline-flex flex-column p-6 p-md-9 align-items-center justify-content-center">
<a href="#"
class="fs-16 font-weight-600 btn text-secondary hover-white bg-white bg-hover-secondary shadow-1">Skincare</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
