Empowering teams with the freedom
Own the unlimited power of the web development.
<!-- Hero Section -->
<div class="position-relative bg-img-hero" style="background-image: url(../../assets/svg/components/abstract-shapes-12.svg);">
<div class="container space-top-3 space-top-lg-4 space-bottom-2 space-bottom-lg-3 position-relative z-index-2">
<div class="row justify-content-lg-between align-items-md-center">
<div class="col-md-6 col-lg-5 mb-11 mb-md-0">
<div class="mb-5">
<h1 class="display-4">Empowering teams with the freedom</h1>
<p class="lead">Own the unlimited power of the web development.</p>
</div>
<!-- Fancybox -->
<a class="js-fancybox btn btn-primary btn-pill transition-3d-hover" href="javascript:;"
data-hs-fancybox-options='{
"src": "//youtube.com/0qisGSwZym4",
"caption": "Front - Responsive Website Template",
"speed": 700,
"buttons": ["fullScreen", "close"],
"youtube": {
"autoplay": 1
}
}'>
<i class="fas fa-play-circle mr-1"></i>
Play Video
</a>
<!-- End Fancybox -->
<a class="btn btn-link" href="#">Learn More <i class="fas fa-angle-right fa-sm ml-1"></i></a>
</div>
<div class="col-md-6">
<div class="row justify-content-end">
<div class="col-3 mb-4">
<!-- Logo -->
<div class="d-block bg-white avatar avatar-lg shadow-sm rounded-circle p-3 mt-n3 ml-5" data-aos="fade-up">
<img class="avatar-img" src="../../assets/img/160x160/img17.png" alt="Image Description">
</div>
<!-- End Logo -->
</div>
<div class="col-4 mb-4">
<!-- Logo -->
<div class="d-block bg-white avatar avatar-xl shadow-sm rounded-circle p-4 mx-auto mt-5" data-aos="fade-up" data-aos-delay="50">
<img class="avatar-img" src="../../assets/img/160x160/img12.png" alt="Image Description">
</div>
<!-- End Logo -->
</div>
<div class="col-4 mb-4">
<!-- Logo -->
<div class="d-block bg-white avatar avatar-xl shadow-sm rounded-circle p-4 ml-auto" data-aos="fade-up" data-aos-delay="150">
<img class="avatar-img" src="../../assets/img/160x160/img13.png" alt="Image Description">
</div>
<!-- End Logo -->
</div>
</div>
<div class="row">
<div class="col-3 offset-1 my-4">
<!-- Logo -->
<div class="d-block bg-white avatar avatar-xl shadow-sm rounded-circle p-4 ml-auto" data-aos="fade-up" data-aos-delay="200">
<img class="avatar-img" src="../../assets/img/160x160/img8.jpg" alt="Image Description">
</div>
<!-- End Logo -->
</div>
<div class="col-3 offset-2 my-4">
<!-- Logo -->
<div class="d-block bg-white avatar avatar-xl shadow-sm rounded-circle p-4 ml-auto" data-aos="fade-up" data-aos-delay="250">
<img class="avatar-img" src="../../assets/img/160x160/img29.png" alt="Image Description">
</div>
<!-- End Logo -->
</div>
</div>
<div class="row d-none d-md-flex">
<div class="col-6">
<!-- Logo -->
<div class="d-block bg-white avatar avatar-lg shadow-sm rounded-circle p-3 ml-auto" data-aos="fade-up" data-aos-delay="300">
<img class="avatar-img" src="../../assets/img/160x160/img35.png" alt="Image Description">
</div>
<!-- End Logo -->
</div>
<div class="col-6 mt-6">
<!-- Logo -->
<div class="d-block bg-white avatar avatar-xl shadow-sm rounded-circle p-4 ml-auto" data-aos="fade-up" data-aos-delay="350">
<img class="avatar-img" src="../../assets/img/160x160/img24.png" alt="Image Description">
</div>
<!-- End Logo -->
</div>
</div>
</div>
</div>
</div>
<!-- SVG Shape -->
<figure class="position-absolute bottom-0 right-0 left-0">
<svg preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 1921 273">
<polygon fill="#fff" points="0,273 1921,273 1921,0 "/>
</svg>
</figure>
<!-- End SVG Shape -->
</div>
<!-- End Hero Section -->
<link rel="stylesheet" href="../../assets/vendor/fancybox/dist/jquery.fancybox.min.css">
<link rel="stylesheet" href="../../assets/vendor/aos/dist/aos.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/aos/dist/aos.js"></script>
<script src="../../assets/vendor/fancybox/dist/jquery.fancybox.min.js"></script>
<!-- JS Front -->
<script src="../../assets/js/hs.fancybox.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of fancybox
$('.js-fancybox').each(function () {
var fancybox = $.HSCore.components.HSFancyBox.init($(this));
});
// initialization of aos
AOS.init({
duration: 650,
once: true
});
});
</script>