Skip to main content

Telling our story

Telling the story in our customers' preferred channel, on the fly.


            <!-- 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 gradient-overlay-half-dark-v1" style="height: 120%; background-image: url(../../assets/img/1920x1080/img15.jpg);"></div>

              <!-- Content -->
              <div class="container position-relative z-index-2 space-2 space-3--lg">
                <div class="w-md-80 w-lg-50 text-center mx-md-auto mb-9">
                  <h2 class="display-4 text-white">Telling our story</h2>
                  <p class="lead text-white">Telling the story in our customers' preferred channel, on the fly.</p>
              <!-- End Content -->
            <!-- End Hero Section -->

            <!-- Video Section -->
            <div class="container position-relative z-index-2 mt-n9">
              <div class="w-lg-75 bg-white shadow-sm rounded p-2 mx-lg-auto">
                <!-- Video Block -->
                <div id="youTubeVideoPlayer" class="u-video-player">
                  <!-- Cover Image -->
                  <img class="img-fluid u-video-player__preview" src="../assets/img/900x450/img2.jpg" alt="Image">
                  <!-- End Cover Image -->

                  <!-- Play Button -->
                  <a class="js-inline-video-player u-video-player__btn u-video-player__centered" href="javascript:;"
                    <span class="u-video-player__icon">
                      <span class="fa fa-play u-video-player__icon-inner"></span>
                  <!-- End Play Button -->

                  <!-- Video Iframe -->
                  <div class="embed-responsive embed-responsive-16by9">
                    <iframe id="youTubeVideoIframe" class="embed-responsive-item" src="//"></iframe>
                  <!-- End Video Iframe -->
                <!-- End Video Block -->
            <!-- End Video Section -->

CSS library:

          <link rel="stylesheet" href="../../assets/vendor/dzsparallaxer/dzsparallaxer.css">

JS library and initialization:

          <!-- JS Implementing Plugins -->
          <script src="../../assets/vendor/dzsparallaxer/dzsparallaxer.js"></script>
          <script src="../../assets/vendor/player.js/dist/player.min.js"></script>

          <!-- JS Space -->
          <script src="../../assets/js/components/"></script>

          <!-- JS Plugins Init. -->
            $(document).on('ready', function () {
              // initialization of video player

Please sign in

Signin to manage your account.

Do not have an account? Signup