Multi-platform accessible

Our solution is unique as it is accessible by iOS, Android, Windows and Mac in a cross-platform system.

Download for:

Image Description
Image Description
Image Description
Image Description
<!-- Multi-Platform Accessible -->
<div id="SVGcrossPlatformHero" class="svg-preloader gradient-half-primary-v1 overflow-hidden">
  <div class="container space-2 space-md-3">
    <div class="row">
      <div class="col-lg-5">
        <!-- Title -->
        <div class="pr-md-4 mb-7">
          <span class="btn btn-lg btn-icon btn-white text-primary rounded-circle mb-4">
            <span class="fas fa-mobile-alt btn-icon__inner"></span>
          </span>
          <h2 class="text-white font-weight-semi-bold">Multi-platform <span class="text-warning">accessible</span></h2>
          <p class="text-white-70">Our solution is unique as it is accessible by iOS, Android, Windows and Mac in a cross-platform system.</p>
        </div>
        <!-- End Title -->

        <h3 class="h6 text-white">Download for:</h3>

        <!-- Download Buttons -->
        <div class="row mx-gutters-2">
          <div class="col-sm-6 col-md-4 col-lg-5 mb-3">
            <button type="button" class="btn btn-block btn-warning transition-3d-hover">
              <span class="fab fa-apple mr-2"></span>
              iOS
            </button>
          </div>

          <div class="col-sm-6 col-md-4 col-lg-5 mb-3">
            <button type="button" class="btn btn-block text-primary btn-white transition-3d-hover">
              <span class="fab fa-windows mr-2"></span>
              Windows
            </button>
          </div>
        </div>
        <!-- End Download Buttons -->

        <!-- Download Buttons -->
        <div class="row mx-gutters-2">
          <div class="col-sm-6 col-md-4 col-lg-5 mb-3">
            <button type="button" class="btn btn-block text-primary btn-white transition-3d-hover">
              <span class="fab fa-android mr-2"></span>
              Android
            </button>
          </div>

          <div class="col-sm-6 col-md-4 col-lg-5 mb-3">
            <button type="button" class="btn btn-block text-primary btn-white transition-3d-hover">
              <span class="fab fa-apple mr-2"></span>
              Mac
            </button>
          </div>
        </div>
        <!-- End Download Buttons -->
      </div>
    </div>

    <!-- Mockup Devices v4 -->
    <div class="u-devices-v4">
      <div class="d-none d-lg-flex flex-lg-wrap u-devices-v4__content">
        <!-- SVG Horizontal Tablet Mockup -->
        <div class="align-self-end u-devices-v4__tablet-ver mb-4">
          <div class="u-devices-v4__tablet-svg">
            <figure class="ie-devices-v4-tablet-horizontal">
              <img class="js-svg-injector" src="../../assets/svg/components/tablet-horizontal.svg" alt="Image Description"
                   data-img-paths='[
                     {"targetId": "#SVGhorizontalTabletImg1", "newPath": "../../assets/img/711x533/img1.jpg"}
                   ]'
                   data-parent="#SVGcrossPlatformHero">
            </figure>
          </div>
        </div>
        <!-- End SVG Horizontal Tablet Mockup -->

        <!-- SVG Vertical Tablet Mockup -->
        <div class="u-devices-v4__tablet mb-4">
          <div class="u-devices-v4__tablet-svg">
            <figure class="ie-devices-v4-tablet">
              <img class="js-svg-injector" src="../../assets/svg/components/tablet.svg" alt="Image Description"
                   data-img-paths='[
                     {"targetId": "#SVGtabletImg1", "newPath": "../../assets/img/533x711/img4.jpg"}
                   ]'
                   data-parent="#SVGcrossPlatformHero">
            </figure>
          </div>
        </div>
        <!-- End SVG Vertical Tablet Mockup -->

        <!-- SVG Laptop Mockup -->
        <div class="u-devices-v4__laptop">
          <figure class="ie-devices-v4-laptop">
            <img class="js-svg-injector" src="../../assets/svg/components/laptop.svg" alt="Image Description"
                 data-img-paths='[
                   {"targetId": "#SVGlaptopImg1", "newPath": "../../assets/img/1618x1010/img1.jpg"}
                 ]'
                 data-parent="#SVGcrossPlatformHero">
          </figure>
        </div>
        <!-- SVG Laptop Mockup -->

        <!-- SVG Phone Mockup -->
        <div class="align-self-start u-devices-v4__phone">
          <div class="u-devices-v4__phone-svg">
            <figure class="ie-devices-v4-iphone">
              <img class="js-svg-injector" src="../../assets/svg/components/iphone.svg" alt="Image Description"
                   data-img-paths='[
                     {"targetId": "#SVGiphoneImg1", "newPath": "../../assets/img/282x500/img7.jpg"}
                   ]'
                   data-parent="#SVGcrossPlatformHero">
            </figure>
          </div>
        </div>
        <!-- End SVG Phone Mockup -->
      </div>
      <!-- End Mockup Devices v4 -->
    </div>
  </div>
</div>
<!-- End Multi-Platform Accessible -->
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>

<!-- JS Implementing Plugins -->
<script src="../../assets/js/components/hs.svg-injector.js"></script>

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