Your business needs a little push.

<!-- Hero Section -->
<div class="dzsparallaxer auto-init height-is-based-on-content use-loading mode-scroll"
     data-options='{direction: "normal"}'>
  <!-- Apply your Parallax background image here -->
  <div class="divimage dzsparallaxer--target u-bg-overlay-v3" style="height: 120%; background-image: url(../../assets/img/1920x1080/img28.jpg);"></div>

  <div class="d-lg-flex">
    <div class="container d-lg-flex align-items-lg-center min-height-lg-100vh position-relative space-2 space-top-md-5 space-bottom-4 z-index-2">
      <!-- Content -->
      <div class="w-lg-80 text-center mx-auto">
        <h1 class="display-3 font-size-md-down-5 text-white font-weight-semi-bold mb-0">Your business needs a little push.</h1>
      </div>
      <!-- End Content -->

      <!-- Clients Section -->
      <div class="container position-absolute right-0 bottom-0 left-0 z-index-2 mb-3">
        <div class="gradient-half-primary-v1 space-1 rounded-pill">
          <!-- Clients Carousel -->
          <div class="js-slick-carousel u-slick"
               data-infinite="true"
               data-slides-show="7"
               data-responsive='[{
                 "breakpoint": 1200,
                 "settings": {
                   "slidesToShow": 6
                 }
               }, {
                 "breakpoint": 992,
                 "settings": {
                   "slidesToShow": 5
                 }
               }, {
                 "breakpoint": 768,
                 "settings": {
                   "slidesToShow": 4
                 }
               }, {
                 "breakpoint": 576,
                 "settings": {
                   "slidesToShow": 4
                 }
               }, {
                 "breakpoint": 480,
                 "settings": {
                   "slidesToShow": 3
                 }
               }, {
                 "breakpoint": 380,
                 "settings": {
                   "slidesToShow": 2
                 }
               }]'>
            <div class="js-slide">
              <img class="u-clients" src="../../assets/svg/clients-logo/lenovo-white.svg" alt="Image Description">
            </div>
            <div class="js-slide">
              <img class="u-clients" src="../../assets/svg/clients-logo/stripe-white.svg" alt="Image Description">
            </div>
            <div class="js-slide">
              <img class="u-clients" src="../../assets/svg/clients-logo/paypal-white.svg" alt="Image Description">
            </div>
            <div class="js-slide">
              <img class="u-clients" src="../../assets/svg/clients-logo/spotify-white.svg" alt="Image Description">
            </div>
            <div class="js-slide">
              <img class="u-clients" src="../../assets/svg/clients-logo/slack-white.svg" alt="Image Description">
            </div>
            <div class="js-slide">
              <img class="u-clients" src="../../assets/svg/clients-logo/airbnb-white.svg" alt="Image Description">
            </div>
            <div class="js-slide">
              <img class="u-clients" src="../../assets/svg/clients-logo/google-white.svg" alt="Image Description">
            </div>
          </div>
          <!-- End Clients Carousel -->
        </div>
      </div>
      <!-- End Clients Section -->
    </div>
  </div>
</div>
<!-- End Hero Section -->
<link rel="stylesheet" href="../../assets/vendor/dzsparallaxer/dzsparallaxer.css">
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/dzsparallaxer/dzsparallaxer.js"></script>
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>

<!-- JS Front -->
<script src="../../assets/js/components/hs.slick-carousel.js"></script>

<!-- JS Plugins Init. -->
<script>
  $(document).on('ready', function () {
    // initialization of slick carousel
    $.HSCore.components.HSSlickCarousel.init('.js-slick-carousel');
  });
</script>