Gallery
Component #1
Explore Unity insider
<!-- Card Grid -->
<div class="container content-space-1">
<!-- Heading -->
<div class="w-lg-65 text-center mx-lg-auto mb-5 mb-sm-7 mb-lg-10">
<h2>Explore Unity insider</h2>
</div>
<!-- End Heading -->
<div class="row justify-content-lg-center">
<div class="col-sm-7 col-md-8 col-lg-6 mb-4">
<!-- Card -->
<a class="card card-sm card-transition-zoom" href="#">
<div class="card-transition-zoom-item">
<img class="card-img" src="../assets/img/580x480/img5.jpg" alt="Image Description">
</div>
<div class="card-img-overlay top-auto">
<div class="d-flex justify-content-end flex-column bg-white rounded-3 p-4">
<h4 class="card-title">Workplace personalities</h4>
</div>
</div>
</a>
<!-- End Card -->
</div>
<!-- End Col -->
<div class="col-sm-5 col-md-4 col-lg-3 align-self-sm-end mb-4">
<!-- Card -->
<a class="card card-sm card-transition-zoom" href="#">
<div class="card-transition-zoom-item">
<img class="card-img" src="../assets/img/950x950/img5.jpg" alt="Image Description">
</div>
<div class="card-img-overlay top-auto">
<div class="d-flex justify-content-end flex-column bg-white rounded-3 p-4">
<h4 class="card-title">Women in engineering</h4>
</div>
</div>
</a>
<!-- End Card -->
</div>
<!-- End Col -->
<div class="w-100"></div>
<div class="col-lg-4 mb-4 mb-lg-0">
<!-- Card -->
<a class="card card-sm card-transition-zoom" href="#">
<div class="card-transition-zoom-item">
<img class="card-img" src="../assets/img/580x480/img1.jpg" alt="Image Description">
</div>
<div class="card-img-overlay top-auto">
<div class="d-flex justify-content-end flex-column bg-white rounded-3 p-4">
<h4 class="card-title">Pride 2021</h4>
</div>
</div>
</a>
<!-- End Card -->
</div>
<!-- End Col -->
<div class="col-sm-6 col-lg-4 mb-4 mb-sm-0">
<!-- Card -->
<a class="card card-sm card-transition-zoom" href="#">
<div class="card-transition-zoom-item">
<img class="card-img" src="../assets/img/950x950/img3.jpg" alt="Image Description">
</div>
<div class="card-img-overlay top-auto">
<div class="d-flex justify-content-end flex-column bg-white rounded-3 p-4">
<h4 class="card-title">Data at Unity</h4>
</div>
</div>
</a>
<!-- End Card -->
</div>
<!-- End Col -->
<div class="col-sm-6 col-lg-4">
<!-- Card -->
<a class="card card-sm card-transition-zoom" href="#">
<div class="card-transition-zoom-item">
<img class="card-img" src="../assets/img/500x650/img3.jpg" alt="Image Description">
</div>
<div class="card-img-overlay top-auto">
<div class="d-flex justify-content-end flex-column bg-white rounded-3 p-4">
<h4 class="card-title">Empowered management</h4>
</div>
</div>
</a>
<!-- End Card -->
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Card Grid -->
Component #2
<!-- Sliding Image -->
<div class="sliding-img mb-3">
<div class="sliding-img-frame-to-start" style="background-image: url(../assets/img/others/img1.png)"></div>
</div>
<!-- End Sliding Image -->
<!-- Sliding Image -->
<div class="sliding-img mb-3">
<div class="sliding-img-frame-to-start-sm" style="background-image: url(../assets/img/others/img2.png)"></div>
</div>
<!-- End Sliding Image -->