You have 03 items in your shopping bag
<div class="row discount-2">
<div class="col-lg-8 col-md-8 col-sm-8 col-xs-12">
<div class="row">
<div class="discount-product-slider dots-bottom-right">
<!-- single-discount-product start -->
<div class="col-lg-12">
<div class="discount-product">
<div class="row">
<div class="col-lg-5 col-md-5 col-sm-6 col-xs-12">
<a href="single-blog.html">
<img src="img/discount/5.jpg" alt="" />
</a>
</div>
<div class="col-lg-7 col-md-7 col-sm-6 col-xs-12">
<div class="discount-info">
<h1 class="text-dark-red">Discount 50%</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed does eiusmodes tempor incididunt ut labore labore et labore et dolore magna aliqua. Ut enim ad minim venim.</p>
<a class="button-2 text-dark-red text-uppercase" href="#">GET DISCOUNT <i class="zmdi zmdi-long-arrow-right"></i></a>
</div>
</div>
</div>
</div>
</div>
<!-- single-discount-product end -->
<!-- single-discount-product start -->
<div class="col-lg-12">
<div class="discount-product">
<div class="row">
<div class="col-lg-5 col-md-5 col-sm-6 col-xs-12">
<a href="single-blog.html">
<img src="img/discount/6.jpg" alt="" />
</a>
</div>
<div class="col-lg-7 col-md-7 col-sm-6 col-xs-12">
<div class="discount-info">
<h1 class="text-dark-red">Discount 50%</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed does eiusmodes tempor incididunt ut labore labore et labore et dolore magna aliqua. Ut enim ad minim venim.</p>
<a class="button-2 text-dark-red text-uppercase" href="#">GET DISCOUNT <i class="zmdi zmdi-long-arrow-right"></i></a>
</div>
</div>
</div>
</div>
</div>
<!-- single-discount-product end -->
<!-- single-discount-product start -->
<div class="col-lg-12">
<div class="discount-product">
<div class="row">
<div class="col-lg-5 col-md-5 col-sm-6 col-xs-12">
<a href="single-blog.html">
<img src="img/discount/7.jpg" alt="" />
</a>
</div>
<div class="col-lg-7 col-md-7 col-sm-6 col-xs-12">
<div class="discount-info">
<h1 class="text-dark-red">Discount 50%</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed does eiusmodes tempor incididunt ut labore labore et labore et dolore magna aliqua. Ut enim ad minim venim.</p>
<a class="button-2 text-dark-red text-uppercase" href="#">GET DISCOUNT <i class="zmdi zmdi-long-arrow-right"></i></a>
</div>
</div>
</div>
</div>
</div>
<!-- single-discount-product end -->
<!-- single-discount-product start -->
<div class="col-lg-12">
<div class="discount-product">
<div class="row">
<div class="col-lg-5 col-md-5 col-sm-6 col-xs-12">
<a href="single-blog.html">
<img src="img/discount/8.jpg" alt="" />
</a>
</div>
<div class="col-lg-7 col-md-7 col-sm-6 col-xs-12">
<div class="discount-info">
<h1 class="text-dark-red">Discount 50%</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed does eiusmodes tempor incididunt ut labore labore et labore et dolore magna aliqua. Ut enim ad minim venim.</p>
<a class="button-2 text-dark-red text-uppercase" href="#">GET DISCOUNT <i class="zmdi zmdi-long-arrow-right"></i></a>
</div>
</div>
</div>
</div>
</div>
<!-- single-discount-product end -->
</div>
</div>
</div>
</div>
.discount-product {position: relative;}
.discount-img-brief {
left: 0;
margin: auto;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
.onsale {
background: #c87065 none repeat scroll 0 0;
border-radius: 50%;
float: left;
height: 112px;
margin: 5% 15% 0 25%;
padding-top: 30px;
text-align: center;
width: 112px;
}
.discount-info {
float: left;
margin-top: 45px;
padding: 0;
width: 40%;
}
.onsale span {
color: #fff;
display: block;
font-size: 20px;
line-height: 14px;
}
.onsale-text {
font-style: italic;
padding-bottom: 12px;
position: relative;
}
.onsale-text::before {
background: #fff none repeat scroll 0 0;
bottom: 0;
content: "";
height: 2px;
left: 0;
margin: auto;
position: absolute;
right: 0;
width: 20px;
}
.onsale-price {
padding-top: 10px;
font-weight: 700;
}
.discount-info h1 {
font-size: 45px;
font-weight: 900;
line-height: 35px;
margin-bottom: 15px;
}
.discount-2 .discount-product {
background: #fff none repeat scroll 0 0;
padding: 72px 20px;
position: inherit;
}
.discount-2 .discount-info {
float: none;
width: 100%;
}
$('.discount-product-slider').slick({
autoplay: false,
arrows: false,
dots: true,
speed: 500,
slidesToShow: 1,
slidesToScroll: 1,
responsive: [
{ breakpoint: 1169, settings: { slidesToShow: 1, } },
{ breakpoint: 969, settings: { slidesToShow: 1, } },
{ breakpoint: 767, settings: { slidesToShow: 1, } },
]
});