Movies Carousel
Component #1
Romantic for Valentines Day
Romantic for Valentines Day
Romantic for Valentines Day
<!-- movies carousel aside header -->
<section class="bg-gray-1500 space-2">
<div class="container px-md-4">
<!-- Nav -->
<div class="text-center tab-nav__v1">
<ul class="nav mb-7" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="pills-one-code-features-example2-tab" data-toggle="pill" href="#pills-one-code-features-example2" role="tab" aria-controls="pills-one-code-features-example2" aria-selected="true">Today</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-two-code-features-example2-tab" data-toggle="pill" href="#pills-two-code-features-example2" role="tab" aria-controls="pills-two-code-features-example2" aria-selected="false">This week</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-three-code-features-example2-tab" data-toggle="pill" href="#pills-three-code-features-example2" role="tab" aria-controls="pills-three-code-features-example2" aria-selected="false">Last 30 days</a>
</li>
</ul>
</div>
<!-- End Nav -->
<!-- Tab Content -->
<div class="tab-content slick__tab">
<div class="tab-pane fade show active" id="pills-one-code-features-example2" role="tabpanel" aria-labelledby="pills-one-code-features-example2-tab">
<div class="row">
<div class="col-md-7 col-lg-8 col-xl-9">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v1 left slick-arrow-right rounded-circle position-absolute\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v1 right slick-arrow-right rounded-circle position-absolute\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
</div>
</div>
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-xl-8 title-dash">
<h1 class="display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-two-code-features-example2" role="tabpanel" aria-labelledby="pills-two-code-features-example2-tab">
<div class="row">
<div class="col-md-7 col-lg-8 col-xl-9">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v1 left slick-arrow-right rounded-circle position-absolute\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v1 right slick-arrow-right rounded-circle position-absolute\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
</div>
</div>
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-xl-8 title-dash">
<h1 class="display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-three-code-features-example2" role="tabpanel" aria-labelledby="pills-three-code-features-example2-tab">
<div class="row">
<div class="col-md-7 col-lg-8 col-xl-9">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v1 left slick-arrow-right rounded-circle position-absolute\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v1 right slick-arrow-right rounded-circle position-absolute\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
</div>
</div>
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-xl-8 title-dash">
<h1 class="display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
</div>
</div>
</div>
<!-- End Tab Content -->
</div>
</section>
<!-- End movies carousel aside header -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Vodi -->
<script src="../../assets/js/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$('.js-slick-carousel').each(function() {
var slickCarousel = $.HSCore.components.HSSlickCarousel.init($(this));
});
});
</script>
Component #2
Romantic for Valentines Day
Romantic for Valentines Day
Romantic for Valentines Day
<!-- movies carousel aside header -->
<section class="bg-gray-1100 dark space-2">
<div class="container px-md-4">
<!-- Nav -->
<div class="text-center tab-nav__v1">
<ul class="nav mb-7" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="pills-one-code-features-example2-tab-1" data-toggle="pill" href="#pills-one-code-features-example2-1" role="tab" aria-controls="pills-one-code-features-example2-1" aria-selected="true">Today</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-two-code-features-example2-tab-2" data-toggle="pill" href="#pills-two-code-features-example2-2" role="tab" aria-controls="pills-two-code-features-example2-2" aria-selected="false">This week</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-three-code-features-example2-tab-3" data-toggle="pill" href="#pills-three-code-features-example2-3" role="tab" aria-controls="pills-three-code-features-example2-3" aria-selected="false">Last 30 days</a>
</li>
</ul>
</div>
<!-- End Nav -->
<!-- Tab Content -->
<div class="tab-content slick__tab">
<div class="tab-pane fade show active" id="pills-one-code-features-example2-1" role="tabpanel" aria-labelledby="pills-one-code-features-example2-tab-1">
<div class="row">
<div class="col-md-7 col-lg-8 col-xl-9">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left dark slick-arrow slick-arrow-v1 left slick-arrow-right rounded-circle position-absolute bottom-0\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right dark slick-arrow slick-arrow-v1 right slick-arrow-right rounded-circle position-absolute\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
</div>
</div>
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-xl-8 title-dash">
<h1 class="text-white display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-two-code-features-example2-2" role="tabpanel" aria-labelledby="pills-two-code-features-example2-tab-2">
<div class="row">
<div class="col-md-7 col-lg-8 col-xl-9">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left dark slick-arrow slick-arrow-v1 left slick-arrow-right rounded-circle position-absolute bottom-0\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right dark slick-arrow slick-arrow-v1 right slick-arrow-right rounded-circle position-absolute\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
</div>
</div>
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-xl-8 title-dash">
<h1 class="text-white display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-three-code-features-example2-3" role="tabpanel" aria-labelledby="pills-three-code-features-example2-tab-3">
<div class="row">
<div class="col-md-7 col-lg-8 col-xl-9">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left dark slick-arrow slick-arrow-v1 left slick-arrow-right rounded-circle position-absolute bottom-0\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right dark slick-arrow slick-arrow-v1 right slick-arrow-right rounded-circle position-absolute\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
</div>
</div>
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-xl-8 title-dash">
<h1 class="text-white display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
</div>
</div>
</div>
<!-- End Tab Content -->
</div>
</section>
<!-- End movies carousel aside header -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Vodi -->
<script src="../../assets/js/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$('.js-slick-carousel').each(function() {
var slickCarousel = $.HSCore.components.HSSlickCarousel.init($(this));
});
});
</script>
Component #3
Romantic for Valentines Day
Romantic for Valentines Day
Romantic for Valentines Day
<!-- movies carousel aside header -->
<section class="bg-gray-2000 dark space-2">
<div class="container px-md-4">
<!-- Nav -->
<div class="text-center tab-nav__v1">
<ul class="nav mb-7" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="pills-one-code-features-example2-tab-11" data-toggle="pill" href="#pills-one-code-features-example2-11" role="tab" aria-controls="pills-one-code-features-example2-11" aria-selected="true">Today</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-two-code-features-example2-tab-22" data-toggle="pill" href="#pills-two-code-features-example2-22" role="tab" aria-controls="pills-two-code-features-example2-22" aria-selected="false">This week</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-three-code-features-example2-tab-33" data-toggle="pill" href="#pills-three-code-features-example2-33" role="tab" aria-controls="pills-three-code-features-example2-33" aria-selected="false">Last 30 days</a>
</li>
</ul>
</div>
<!-- End Nav -->
<!-- Tab Content -->
<div class="tab-content slick__tab">
<div class="tab-pane fade show active" id="pills-one-code-features-example2-11" role="tabpanel" aria-labelledby="pills-one-code-features-example2-tab-11">
<div class="row position-relative">
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-8 title-dash">
<h1 class="text-white display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
<div class="col-md-7 col-lg-8 col-xl-9 position-static">
<div class="js-slick-carousel slick slick-gutters-2 position-static"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left dark slick-arrow slick-arrow-v1 left-position left slick-arrow-right rounded-circle position-absolute bottom-0\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right dark slick-arrow slick-arrow-v1 left-position right slick-arrow-right rounded-circle position-absolute\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-two-code-features-example2-22" role="tabpanel" aria-labelledby="pills-two-code-features-example2-tab-22">
<div class="row position-relative">
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-8 title-dash">
<h1 class="text-white display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
<div class="col-md-7 col-lg-8 col-xl-9 position-static">
<div class="js-slick-carousel slick slick-gutters-2 position-static"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left dark slick-arrow slick-arrow-v1 left-position left slick-arrow-right rounded-circle position-absolute bottom-0\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right dark slick-arrow slick-arrow-v1 left-position right slick-arrow-right rounded-circle position-absolute\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-three-code-features-example2-33" role="tabpanel" aria-labelledby="pills-three-code-features-example2-tab-33">
<div class="row position-relative">
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-8 title-dash">
<h1 class="text-white display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
<div class="col-md-7 col-lg-8 col-xl-9 position-static">
<div class="js-slick-carousel slick slick-gutters-2 position-static"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left dark slick-arrow slick-arrow-v1 left-position left slick-arrow-right rounded-circle position-absolute bottom-0\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right dark slick-arrow slick-arrow-v1 left-position right slick-arrow-right rounded-circle position-absolute\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- End Tab Content -->
</div>
</section>
<!-- End movies carousel aside header -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Vodi -->
<script src="../../assets/js/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$('.js-slick-carousel').each(function() {
var slickCarousel = $.HSCore.components.HSSlickCarousel.init($(this));
});
});
</script>
Component #4
Featured
Discover ’18
New Movies that are already playing in theaters and watch them online now.
<!-- Tab Content -->
<section class="space-bottom-5 space-bottom-lg-0">
<div class="h-700rem" style="background-image: url(../assets/img/1920x700/img1.jpg);">
<div class="container px-md-6">
<div class="mx-md-1 space-top-2">
<div class="pt-5 mt-1 mb-8">
<h6 class="font-size-16 font-weight-normal opacity-6 text-lh-md pl-1 mb-3">Featured</h6>
<h5 class="display-10">Discover ’18</h5>
<h4 class="font-size-22 font-weight-light pl-1 max-w-330">New Movies that are already playing in theaters and watch them online now.</h4>
</div>
<div class="tab-nav__v3 mb-3">
<ul class="nav flex-nowrap flex-lg-wrap justify-content-start overflow-auto align-items-center" role="tab-list">
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link active pl-2" id="pills-one-code-features-example6-tab" data-toggle="pill" href="#pills-one-code-features-example6" role="tab" aria-controls="pills-one-code-features-example6" aria-selected="true">New Arrivals</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-two-code-features-example6-tab" data-toggle="pill" href="#pills-two-code-features-example6" role="tab" aria-controls="pills-two-code-features-example6" aria-selected="false">Comedy</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-three-code-features-example6-tab" data-toggle="pill" href="#pills-three-code-features-example6" role="tab" aria-controls="pills-three-code-features-example6" aria-selected="false">Drama</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-four-code-features-example6-tab" data-toggle="pill" href="#pills-four-code-features-example6" role="tab" aria-controls="pills-four-code-features-example6" aria-selected="false">Sci-Fi</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-five-code-features-example6-tab" data-toggle="pill" href="#pills-five-code-features-example6" role="tab" aria-controls="pills-five-code-features-example6" aria-selected="false">Action</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-six-code-features-example6-tab" data-toggle="pill" href="#pills-six-code-features-example6" role="tab" aria-controls="pills-six-code-features-example6" aria-selected="false">Thriller</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-seven-code-features-example6-tab" data-toggle="pill" href="#pills-seven-code-features-example6" role="tab" aria-controls="pills-seven-code-features-example6" aria-selected="false">Horror</a>
</li>
</ul>
</div>
<div class="tab-content pl-2 u-slick__tab">
<div class="tab-pane fade show active" id="pills-one-code-features-example6" role="tab-panel" aria-labelledby="pills-one-code-features-example6-tab">
<div class="js-slick-carousel u-slick"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n5 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>"
}'>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-two-code-features-example6" role="tab-panel" aria-labelledby="pills-two-code-features-example6-tab">
<div class="js-slick-carousel u-slick"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n5 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>"
}'>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-three-code-features-example6" role="tab-panel" aria-labelledby="pills-three-code-features-example6-tab">
<div class="js-slick-carousel u-slick"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n5 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>"
}'>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-four-code-features-example6" role="tab-panel" aria-labelledby="pills-four-code-features-example6-tab">
<div class="js-slick-carousel u-slick"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n5 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>"
}'>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-five-code-features-example6" role="tab-panel" aria-labelledby="pills-five-code-features-example6-tab">
<div class="js-slick-carousel u-slick"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n5 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>"
}'>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-six-code-features-example6" role="tab-panel" aria-labelledby="pills-six-code-features-example6-tab">
<div class="js-slick-carousel u-slick"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n5 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>"
}'>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-seven-code-features-example6" role="tab-panel" aria-labelledby="pills-seven-code-features-example6-tab">
<div class="js-slick-carousel u-slick"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n5 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>"
}'>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
<div class="js-slide">
<div class="row no-gutters">
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img2.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Adventures</a></span>
<span><a href="#" class="h-g-primary">History</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Spiderman 3</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img3.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Drama</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Phantom Thread</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img4.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Made Normal</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Fantacy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Every Day</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid w-100" src="../assets/img/122x183/img6.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Love, Simon</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Tale</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img8.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">Mad</a></div>
</div>
</div>
<div class="col-6 col-md-4 col-lg">
<div class="product mt-2 pr-3">
<div class="product-image mb-1">
<a href="#" class="d-inline-block position-relative stretched-link">
<img class="img-fluid w-100" src="../assets/img/122x183/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="font-weight-bold font-size-1"><a class="text-dark" href="#">The Lost Viking</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End Tab Content -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Vodi -->
<script src="../../assets/js/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$('.js-slick-carousel').each(function() {
var slickCarousel = $.HSCore.components.HSSlickCarousel.init($(this));
});
});
</script>
Component #5
Romantic for Valentines Day
Romantic for Valentines Day
Romantic for Valentines Day
Romantic for Valentines Day
<!-- Tab Content -->
<section>
<div class="container px-md-6">
<!-- Nav -->
<div class="text-center tab-nav__v1">
<ul class="nav max-w-550 mx-auto mb-4 pb-1 flex-nowrap flex-md-wrap justify-content-start overflow-auto" role="tablist">
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link active" id="pills-comedy-example2-tab" data-toggle="pill" href="#pills-comedy-example2" role="tab" aria-controls="pills-comedy-example2" aria-selected="true">Comedy</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-drama-example2-tab" data-toggle="pill" href="#pills-drama-example2" role="tab" aria-controls="pills-drama-example2" aria-selected="false">Drama</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-musical-example2-tab" data-toggle="pill" href="#pills-musical-example2" role="tab" aria-controls="pills-musical-example2" aria-selected="false">Musical</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-romance-example2-tab" data-toggle="pill" href="#pills-romance-example2" role="tab" aria-controls="pills-romance-example2" aria-selected="false">Romance</a>
</li>
</ul>
</div>
<!-- End Nav -->
<!-- Tab Content -->
<div class="tab-content slick__tab">
<div class="tab-pane fade show active" id="pills-comedy-example2" role="tabpanel" aria-labelledby="pills-comedy-example2-tab">
<div class="row">
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-3 mb-xl-8 title-dash">
<h1 class="display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-4 mt-lg-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
<div class="col-md-7 col-lg-8 col-xl-9">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v7 left slick-arrow-right rounded-circle position-absolute d-none d-lg-block\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v7 right slick-arrow-right rounded-circle position-absolute d-none d-lg-block\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-drama-example2" role="tabpanel" aria-labelledby="pills-drama-example2-tab">
<div class="row">
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-3 mb-xl-8 title-dash">
<h1 class="display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-4 mt-lg-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
<div class="col-md-7 col-lg-8 col-xl-9">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v7 left slick-arrow-right rounded-circle position-absolute d-none d-lg-block\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v7 right slick-arrow-right rounded-circle position-absolute d-none d-lg-block\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-musical-example2" role="tabpanel" aria-labelledby="pills-musical-example2-tab">
<div class="row">
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-3 mb-xl-8 title-dash">
<h1 class="display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-4 mt-lg-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
<div class="col-md-7 col-lg-8 col-xl-9">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v7 left slick-arrow-right rounded-circle position-absolute d-none d-lg-block\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v7 right slick-arrow-right rounded-circle position-absolute d-none d-lg-block\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-romance-example2" role="tabpanel" aria-labelledby="pills-romance-example2-tab">
<div class="row">
<div class="col-md-5 col-lg-4 col-xl-3 d-flex">
<header class="max-w-370 mt-auto mb-3 mb-xl-8 title-dash">
<h1 class="display-7 mb-3 font-weight-semi-bold">Romantic for Valentines Day</h1>
<div class="mt-4 mt-lg-11">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center pt-2 font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"/></svg>
</a>
</div>
</header>
</div>
<div class="col-md-7 col-lg-8 col-xl-9">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v7 left slick-arrow-right rounded-circle position-absolute d-none d-lg-block\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v7 right slick-arrow-right rounded-circle position-absolute d-none d-lg-block\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- End Tab Content -->
</div>
</section>
<!-- End Tab Content -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Vodi -->
<script src="../../assets/js/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$('.js-slick-carousel').each(function() {
var slickCarousel = $.HSCore.components.HSSlickCarousel.init($(this));
});
});
</script>
Component #6
Most Popular this Year Movies
<!-- Tab Slick -->
<section class="tab-slick mb-6 mb-lg-7">
<div class="bg-gray-2000 space-top-1 space-bottom-2">
<div class="container px-md-5">
<div class="mx-md-1 pt-4 pb-1">
<h6 class="display-11 text-lh-1dot3 font-weight-semi-bold text-center text-white">Most Popular this Year Movies</h6>
<div class="text-center tab-nav__v6">
<ul class="nav mb-4 justify-content-start justify-content-md-center overflow-auto flex-nowrap flex-md-wrap" role="tablist">
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link active" id="pills-one-code-features-example2-tab-11" data-toggle="pill" href="#pills-one-code-features-example2-11" role="tab" aria-controls="pills-one-code-features-example2-11" aria-selected="true">Today Movies</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-two-code-features-example2-tab-22" data-toggle="pill" href="#pills-two-code-features-example2-22" role="tab" aria-controls="pills-two-code-features-example2-22" aria-selected="false">This week</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-three-code-features-example2-tab-33" data-toggle="pill" href="#pills-three-code-features-example2-33" role="tab" aria-controls="pills-three-code-features-example2-33" aria-selected="false">Last 30 days</a>
</li>
</ul>
</div>
<div class="tab-content u-slick__tab">
<div class="tab-pane fade show active" id="pills-one-code-features-example2-11" role="tabpanel" aria-labelledby="pills-one-code-features-example2-tab-11">
<div class="js-slick-carousel slick slick-gutters-2 dark"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v3 slick-arrow-centered-y left slick-arrow-right rounded-circle left-0 ml-lg-n3 ml-wd-n6\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v3 slick-arrow-centered-y right slick-arrow-right rounded-circle mr-lg-n3 mr-wd-n6\"></span>",
"slidesToShow": 7,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-two-code-features-example2-22" role="tabpanel" aria-labelledby="pills-two-code-features-example2-tab-22">
<div class="js-slick-carousel slick slick-gutters-2 dark"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v3 slick-arrow-centered-y left slick-arrow-right rounded-circle left-0 ml-lg-n3 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v3 slick-arrow-centered-y right slick-arrow-right rounded-circle mr-lg-n3 mr-wd-n5\"></span>",
"slidesToShow": 7,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-three-code-features-example2-33" role="tabpanel" aria-labelledby="pills-three-code-features-example2-tab-33">
<div class="js-slick-carousel slick slick-gutters-2 dark"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v3 slick-arrow-centered-y left slick-arrow-right rounded-circle left-0 ml-lg-n3 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v3 slick-arrow-centered-y right slick-arrow-right rounded-circle mr-lg-n3 mr-wd-n5\"></span>",
"slidesToShow": 7,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End Tab Slick -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Vodi -->
<script src="../../assets/js/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$('.js-slick-carousel').each(function() {
var slickCarousel = $.HSCore.components.HSSlickCarousel.init($(this));
});
});
</script>
Component #7
Top Ranking
<!-- Tab Slick -->
<section class="tab-slick">
<div class="bg-gray-1500 space-top-1 space-bottom-1">
<div class="container px-md-5">
<div class="mx-md-1 pt-4 pb-5">
<h6 class="text-center display-11 text-lh-1dot3 font-weight-semi-bold">Top Ranking</h6>
<div class="text-center tab-nav__v8">
<ul class="nav mb-4 flex-nowrap flex-md-wrap justify-content-start justify-content-md-center overflow-auto" role="tablist">
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link active" id="pills-one-code-features-example5-tab" data-toggle="pill" href="#pills-one-code-features-example5" role="tab" aria-controls="pills-one-code-features-example5" aria-selected="true">New Movies</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-two-code-features-example5-tab" data-toggle="pill" href="#pills-two-code-features-example5" role="tab" aria-controls="pills-two-code-features-example5" aria-selected="false">Upcoming week</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-three-code-features-example5-tab" data-toggle="pill" href="#pills-three-code-features-example5" role="tab" aria-controls="pills-three-code-features-example5" aria-selected="false">Top 300</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-four-code-features-example5-tab" data-toggle="pill" href="#pills-four-code-features-example5" role="tab" aria-controls="pills-four-code-features-example5" aria-selected="false">TV Series</a>
</li>
</ul>
</div>
<div class="tab-content u-slick__tab">
<div class="tab-pane fade show active" id="pills-one-code-features-example5" role="tabpanel" aria-labelledby="pills-one-code-features-example5-tab">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v4 slick-arrow-centered-y left slick-arrow-right rounded-circle left-0 ml-lg-n3 ml-wd-n6\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v4 slick-arrow-centered-y right slick-arrow-right rounded-circle mr-lg-n3 mr-wd-n6\"></span>",
"slidesToShow": 7,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-two-code-features-example5" role="tabpanel" aria-labelledby="pills-two-code-features-example5-tab">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v4 slick-arrow-centered-y left slick-arrow-right rounded-circle left-0 ml-lg-n3 ml-wd-n6\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v4 slick-arrow-centered-y right slick-arrow-right rounded-circle mr-lg-n3 mr-wd-n6\"></span>",
"slidesToShow": 7,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-three-code-features-example5" role="tabpanel" aria-labelledby="pills-three-code-features-example5-tab">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v4 slick-arrow-centered-y left slick-arrow-right rounded-circle left-0 ml-lg-n3 ml-wd-n6\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v4 slick-arrow-centered-y right slick-arrow-right rounded-circle mr-lg-n3 mr-wd-n6\"></span>",
"slidesToShow": 7,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-four-code-features-example5" role="tabpanel" aria-labelledby="pills-four-code-features-example5-tab">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v4 slick-arrow-centered-y left slick-arrow-right rounded-circle left-0 ml-lg-n3 ml-wd-n6\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v4 slick-arrow-centered-y right slick-arrow-right rounded-circle mr-lg-n3 mr-wd-n6\"></span>",
"slidesToShow": 7,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Dirt</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Fantastic Beasts and Where to Find Them</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Bpm</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link"><img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image Description"></a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Sunday</a></div>
</div>
<div class="product mt-2">
<div class="product-image mb-2">
<a href="#" class="d-inline-block position-relative stretched-link">
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12">Featured</span>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description">
</a>
</div>
<div class="product-meta font-size-12 mb-1">
<span><a href="#" class="h-g-primary">2020</a></span>
<span><a href="#" class="h-g-primary">Action</a></span>
<span><a href="#" class="h-g-primary">Comedy</a></span>
<span><a href="#" class="h-g-primary">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Convenient Groom</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End Tab Slick -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Vodi -->
<script src="../../assets/js/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$('.js-slick-carousel').each(function() {
var slickCarousel = $.HSCore.components.HSSlickCarousel.init($(this));
});
});
</script>
Component #8
Apreciated User’s Collection
<!-- Tab Slick -->
<section>
<div class="bg-gray-2200 space-1">
<div class="container px-md-5 pt-md-3 pb-md-4">
<div class="mx-md-1">
<h6 class="text-center display-11 text-lh-1dot3 font-weight-semi-bold">Apreciated User’s Collection</h6>
<div class="text-center tab-nav__v8">
<ul class="nav mb-3 pb-1 justify-content-center" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="pills-one-code-features-example7-tab" data-toggle="pill" href="#pills-one-code-features-example7" role="tab" aria-controls="pills-one-code-features-example7" aria-selected="true">Movies</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-two-code-features-example7-tab" data-toggle="pill" href="#pills-two-code-features-example7" role="tab" aria-controls="pills-two-code-features-example7" aria-selected="false">TV Series</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-three-code-features-example7-tab" data-toggle="pill" href="#pills-three-code-features-example7" role="tab" aria-controls="pills-three-code-features-example7" aria-selected="false">Trailers</a>
</li>
</ul>
</div>
<div class="tab-content u-slick__tab ">
<div class="tab-pane fade show active dark" id="pills-one-code-features-example7" role="tabpanel" aria-labelledby="pills-one-code-features-example7-tab">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v6 left slick-arrow-right rounded-circle slick-arrow-centered-y left-0 ml-lg-n3 ml-wd-n6\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v6 right slick-arrow-right rounded-circle slick-arrow-centered-y mr-lg-n3 mr-wd-n6\"></span>",
"slidesToShow": 5,
"responsive": [{
"breakpoint": 992,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div>
<div class="bg-gray-2300 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Top 100 Horror Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">16 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2400 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Modern Action Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">26 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2500 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Thriller From 2020 Only</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">13 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2600 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Girl Day Best Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">18 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2700 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Fresh Action-Drama Collection</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">10s Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2400 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Modern Action Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">26 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2600 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Girl Day Best Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">18 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2500 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Thriller From 2020 Only</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">13 Movies</div>
</div>
</a>
</div>
</div>
</div>
<div class="tab-pane fade dark" id="pills-two-code-features-example7" role="tabpanel" aria-labelledby="pills-two-code-features-example7-tab">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v6 left slick-arrow-right rounded-circle slick-arrow-centered-y left-0 ml-lg-n3 ml-wd-n6\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v6 right slick-arrow-right rounded-circle slick-arrow-centered-y mr-lg-n3 mr-wd-n6\"></span>",
"slidesToShow": 5,
"responsive": [{
"breakpoint": 992,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div>
<div class="bg-gray-2300 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Top 100 Horror Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">16 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2400 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Modern Action Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">26 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2500 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Thriller From 2020 Only</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">13 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2600 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Girl Day Best Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">18 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2700 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Fresh Action-Drama Collection</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">10s Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2400 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Modern Action Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">26 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2600 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Girl Day Best Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">18 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2500 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Thriller From 2020 Only</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">13 Movies</div>
</div>
</a>
</div>
</div>
</div>
<div class="tab-pane fade dark" id="pills-three-code-features-example7" role="tabpanel" aria-labelledby="pills-three-code-features-example7-tab">
<div class="js-slick-carousel slick slick-gutters-2"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-v6 left slick-arrow-right rounded-circle slick-arrow-centered-y left-0 ml-lg-n3 ml-wd-n6\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-v6 right slick-arrow-right rounded-circle slick-arrow-centered-y mr-lg-n3 mr-wd-n6\"></span>",
"slidesToShow": 5,
"responsive": [{
"breakpoint": 992,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}]
}'>
<div>
<div class="bg-gray-2300 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Top 100 Horror Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">16 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2400 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Modern Action Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">26 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2500 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Thriller From 2020 Only</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">13 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2600 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Girl Day Best Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">18 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2700 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Fresh Action-Drama Collection</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">10s Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2400 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Modern Action Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">26 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2600 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Girl Day Best Movies</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">18 Movies</div>
</div>
</a>
</div>
<div>
<div class="bg-gray-2500 space-top-1 rounded-pseudo">
<div class="px-5">
<h6 class="product-title font-size-15 font-weight-bold text-center mt-1 text-lh-sm mb-5">
<a href="#">Thriller From 2020 Only</a>
</h6>
<a href="#" class="d-flex align-items-center justify-content-center position-relative stretched-link px-2 mx-1"><img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image Description"></a>
</div>
</div>
<a class="d-block" href="#">
<span class="avatar avatar-circle avatar-border-lg d-flex mx-auto border-white-5 mt-n4">
<img class="avatar-img" src="../assets/img/36x36/img1.jpg" alt="Image Description">
</span>
<div class="text-center">
<div class="text-dark font-size-12 font-weight-medium">By: admin</div>
<div class="font-size-12 font-weight-medium text-gray-1300">13 Movies</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End Tab Slick -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Vodi -->
<script src="../../assets/js/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$('.js-slick-carousel').each(function() {
var slickCarousel = $.HSCore.components.HSSlickCarousel.init($(this));
});
});
</script>
Component #9
Valentines Day Movies
<!-- Tab Slick -->
<section>
<div class="bg-gray-1100 space-1">
<div class="container px-md-6 px-xl-7 px-wd-6 pb-3 pt-1">
<div class="space-bottom-2">
<div class="border-bottom pb-4 border-g-1200-op mb-1">
<div class="home-section">
<header class="d-md-flex align-items-center justify-content-between mb-4 w-100">
<div class="font-size-24 font-weight-medium mb-3 mb-md-0 text-white font-secondary">Valentines Day Movies</div>
<div class="d-none d-lg-block border-top col p-0 mx-3 border-gray-6830"></div>
<div class="tab-nav__v2">
<ul class="nav justify-content-start flex-nowrap flex-lg-wrap overflow-auto" role="tab-list">
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link active" id="pills-one-code-features-example5-tab" data-toggle="pill" href="#pills-one-code-features-example5" role="tab" aria-controls="pills-two-code-features-example5" aria-selected="true">All</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-two-code-features-example5-tab" data-toggle="pill" href="#pills-two-code-features-example5" role="tab" aria-controls="pills-two-code-features-example5" aria-selected="false">Comedy</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-three-code-features-example5-tab" data-toggle="pill" href="#pills-three-code-features-example5" role="tab" aria-controls="pills-three-code-features-example5" aria-selected="false">Drama</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-four-code-features-example5-tab" data-toggle="pill" href="#pills-four-code-features-example5" role="tab" aria-controls="pills-four-code-features-example5" aria-selected="false">Musical</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-five-code-features-example5-tab" data-toggle="pill" href="#pills-five-code-features-example5" role="tab" aria-controls="pills-five-code-features-example5" aria-selected="false">Romance</a>
</li>
</ul>
</div>
</header>
</div>
<div class="tab-content slick__tab">
<div class="tab-pane fade show active dark" id="pills-one-code-features-example5" role="tab-panel" aria-labelledby="pills-one-code-features-example5-tab">
<div class="js-slick-carousel slick mx-n2d"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\" slick-arrow slick-arrow-svg-left left slick-arrow-right rounded-circle position-absolute slick-arrow-centered-y left-0 ml-n4 ml-wd-5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right right slick-arrow-right rounded-circle position-absolute slick-arrow-centered-y mr-lg-n5 mr-wd-n7\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img4.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Delta Bravo</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img5.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Mad</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img6.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Oh Lucy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img7.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img9.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Groom</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img10.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Oh Lucy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img11.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Euphoria</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade dark" id="pills-two-code-features-example5" role="tab-panel" aria-labelledby="pills-two-code-features-example5-tab">
<div class="js-slick-carousel slick mx-n2d"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\" slick-arrow slick-arrow-svg-left left slick-arrow-right rounded-circle position-absolute left-0 ml-n4 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right right slick-arrow-right rounded-circle position-absolute mr-lg-n5 mr-wd-n7\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img11.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Delta Bravo</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img10.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Mad</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img9.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Oh Lucy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img8.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img6.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Groom</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img5.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Oh Lucy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img4.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Euphoria</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade dark" id="pills-three-code-features-example5" role="tab-panel" aria-labelledby="pills-three-code-features-example5-tab">
<div class="js-slick-carousel slick mx-n2d"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\" slick-arrow slick-arrow-svg-left left slick-arrow-right rounded-circle position-absolute left-0 ml-n4 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right right slick-arrow-right rounded-circle position-absolute mr-lg-n5 mr-wd-n7\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img10.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Delta Bravo</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img11.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Mad</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Oh Lucy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img9.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img6.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Groom</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img4.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Oh Lucy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img5.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Euphoria</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade dark" id="pills-four-code-features-example5" role="tab-panel" aria-labelledby="pills-four-code-features-example5-tab">
<div class="js-slick-carousel slick mx-n2d"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\" slick-arrow slick-arrow-svg-left left slick-arrow-right rounded-circle position-absolute left-0 ml-n4 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right right slick-arrow-right rounded-circle position-absolute mr-lg-n5 mr-wd-n7\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img4.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Delta Bravo</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img6.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Mad</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Oh Lucy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img10.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img5.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Groom</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img9.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Oh Lucy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img11.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Euphoria</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade dark" id="pills-five-code-features-example5" role="tab-panel" aria-labelledby="pills-five-code-features-example5-tab">
<div class="js-slick-carousel slick mx-n2d"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\" slick-arrow slick-arrow-svg-left left slick-arrow-right rounded-circle position-absolute left-0 ml-n4 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right right slick-arrow-right rounded-circle position-absolute mr-lg-n5 mr-wd-n7\"></span>",
"slidesToShow": 6,
"responsive": [{
"breakpoint": 1199,
"settings": {
"slidesToShow": 3
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]
}'>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img11.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Delta Bravo</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img10.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Mad</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img9.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Oh Lucy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img8.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img6.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">The Groom</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img5.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Oh Lucy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative px-2d">
<div class="mb-4 mb-md-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src=" ../assets/img/300x450/img4.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#">2020</a></span>
<span><a href="#">Action</a></span>
<span><a href="#">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#">Euphoria</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="d-flex justify-content-end">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"></path></svg>
</a>
</div>
</div>
</div>
</div>
</section>
<!-- End Tab Slick -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Vodi -->
<script src="../../assets/js/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$('.js-slick-carousel').each(function() {
var slickCarousel = $.HSCore.components.HSSlickCarousel.init($(this));
});
});
</script>
Component #10
Recently Viewed Movies
<!-- Tab Slick -->
<section>
<div class="bg-gray-1100 space-1">
<div class="container px-md-6 px-xl-7 px-wd-6 pt-2">
<div class="home-section">
<div class="border-bottom border-g-1200-op mb-2">
<header class="d-md-flex align-items-center justify-content-between mb-4 w-100">
<div class="font-size-24 font-weight-medium mb-3 mb-md-0 text-white font-secondary">Recently Viewed Movies</div>
<div class="d-none d-lg-block border-top col p-0 mx-3 border-gray-6830"></div>
<div class="tab-nav__v2">
<ul class="nav justify-content-start flex-nowrap flex-lg-wrap overflow-auto" role="tab-list">
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link active" id="pills-one-features-example1-tab" data-toggle="pill" href="#pills-one-features-example1" role="tab" aria-controls="pills-one-features-example1" aria-selected="true">Action</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-two-features-example1-tab" data-toggle="pill" href="#pills-two-features-example1" role="tab" aria-controls="pills-two-features-example1" aria-selected="false">Biography</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-three-c-features-example1-tab" data-toggle="pill" href="#pills-three-features-example1" role="tab" aria-controls="pills-three-features-example1" aria-selected="false">Sci-Fi</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-four-features-example1-tab" data-toggle="pill" href="#pills-four-features-example1" role="tab" aria-controls="pills-four-features-example1" aria-selected="false">Crime</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-five-features-example1-tab" data-toggle="pill" href="#pills-five-features-example1" role="tab" aria-controls="pills-five-features-example1" aria-selected="false">Drama</a>
</li>
<li class="nav-item flex-shrink-0 flex-shrink-md-1">
<a class="nav-link" id="pills-six-features-example1-tab" data-toggle="pill" href="#pills-six-features-example1" role="tab" aria-controls="pills-six-features-example1" aria-selected="false">Kids</a>
</li>
</ul>
</div>
</header>
<div class="tab-content u-slick__tab">
<div class="tab-pane fade show active" id="pills-one-features-example1" role="tab-panel" id="pills-one-features-example1-tab">
<div class="js-slick-carousel slick slick-gutters-1 dark"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n4 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>",
"slidesToShow": 10,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 7
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 3
}
}]
}'>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Delta Bravo</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Mad</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Oh Lusy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Paradigm Lost</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Pacific Rim</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Dirt</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img10.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Fantastic Beats</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img11.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Sunday</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img12.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Bpm</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>3
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-two-features-example1" role="tab-panel" id="pills-two-features-example1-tab">
<div class="js-slick-carousel slick slick-gutters-1 dark"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n4 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>",
"slidesToShow": 10,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 7
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 3
}
}]
}'>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Delta Bravo</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Mad</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Oh Lusy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Paradigm Lost</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Pacific Rim</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Dirt</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img10.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Fantastic Beats</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img11.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Sunday</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img12.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Bpm</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>3
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-three-features-example1" role="tab-panel" id="pills-three-features-example1-tab">
<div class="js-slick-carousel slick slick-gutters-1 dark"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n4 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>",
"slidesToShow": 10,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 7
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 3
}
}]
}'>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Delta Bravo</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Mad</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Oh Lusy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Paradigm Lost</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Pacific Rim</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Dirt</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img10.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Fantastic Beats</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img11.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Sunday</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img12.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Bpm</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>3
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-four-features-example1" role="tab-panel" id="pills-four-features-example1-tab">
<div class="js-slick-carousel slick slick-gutters-1 dark"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n4 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>",
"slidesToShow": 10,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 7
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 3
}
}]
}'>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Delta Bravo</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Mad</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Oh Lusy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Paradigm Lost</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Pacific Rim</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Dirt</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img10.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Fantastic Beats</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img11.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Sunday</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img12.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Bpm</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>3
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-five-features-example1" role="tab-panel" id="pills-five-features-example1-tab">
<div class="js-slick-carousel slick slick-gutters-1 dark"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n4 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>",
"slidesToShow": 10,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 7
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 3
}
}]
}'>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Delta Bravo</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Mad</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Oh Lusy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Paradigm Lost</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Pacific Rim</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Dirt</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img10.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Fantastic Beats</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img11.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Sunday</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img12.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Bpm</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>3
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-six-features-example1" role="tab-panel" id="pills-six-features-example1-tab">
<div class="js-slick-carousel slick slick-gutters-1 dark"
data-hs-slick-carousel-options='{
"prevArrow": "<span class=\"fas fa-chevron-left slick-arrow slick-arrow-svg-left slick-arrow-centered-y left slick-arrow-right rounded-circle position-absolute left-0 ml-n4 ml-wd-n5\"></span>",
"nextArrow": "<span class=\"fas fa-chevron-right slick-arrow slick-arrow-svg-right slick-arrow-centered-y right slick-arrow-right rounded-circle position-absolute mr-lg-n6 mr-wd-n8\"></span>",
"slidesToShow": 10,
"responsive": [{
"breakpoint": 1200,
"settings": {
"slidesToShow": 7
}
}, {
"breakpoint": 992,
"settings": {
"slidesToShow": 5
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 3
}
}]
}'>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img1.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Delta Bravo</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img2.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Mad</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Oh Lusy</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img4.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img5.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img6.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Comedy</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Paradigm Lost</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Drama</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Pacific Rim</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img9.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Mystery</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Dirt</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img10.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
<span><a href="#" tabindex="0">Adventures</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Fantastic Beats</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img11.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Sunday</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img12.jpg" alt="Image-Descrition">
</div>
<span class="position-absolute px-2d line-height-lg bg-primary rounded content-centered-x z-index-2 mt-n2 text-white font-size-12 top-0">Featured</span>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Bpm</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img3.jpg" alt="Image-Descrition">
</div>3
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Adventres</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Euphoria</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img7.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">Black Mirror</a></div>
</div>
</div>
</div>
</div>
<div class="product position-relative">
<div class="mb-4 mb-lg-0">
<div class="gradient-x-overlay-1 mt-2">
<div>
<img class="img-fluid" src="../assets/img/174x260/img8.jpg" alt="Image-Descrition">
</div>
<div class="position-absolute bottom-0 pb-2 pl-3">
<div class="product--title product-meta font-size-12">
<span><a href="#" tabindex="0">2020</a></span>
<span><a href="#" tabindex="0">Action</a></span>
</div>
<div class="product-title font-weight-bold font-size-1"><a href="#" tabindex="0">The Groom</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="d-flex justify-content-end">
<a href="#" class="h-w-primary text-gray-1300 d-inline-flex align-items-center font-secondary font-weight-medium font-size-13">VIEW ALL
<svg class="ml-2" xmlns="http://www.w3.org/2000/svg" width="4" height="7"><path d="M3.979,3.703 C3.987,3.785 3.966,3.869 3.903,3.934 L1.038,6.901 C0.921,7.023 0.724,7.029 0.598,6.916 L0.143,6.506 C0.017,6.393 0.011,6.203 0.128,6.082 L2.190,3.946 C2.276,3.829 2.356,3.691 2.356,3.548 C2.356,3.214 1.947,2.885 1.947,2.885 L1.963,2.877 L0.080,0.905 C-0.036,0.784 -0.029,0.592 0.095,0.479 L0.547,0.068 C0.671,-0.045 0.867,-0.039 0.983,0.083 L3.823,3.057 C3.867,3.102 3.876,3.161 3.885,3.218 C3.945,3.267 3.988,3.334 3.988,3.416 L3.988,3.681 C3.988,3.690 3.979,3.694 3.979,3.703 Z" fill="rgb(148, 156, 176)"></path></svg>
</a>
</div>
</div>
</div>
</div>
</section>
<!-- End Tab Slick -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Vodi -->
<script src="../../assets/js/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$('.js-slick-carousel').each(function() {
var slickCarousel = $.HSCore.components.HSSlickCarousel.init($(this));
});
});
</script>