<div class="section w-100">
<div class="container-fluid px-0">
<!-- Row item -->
<div class="row no-gutters">
<div class="col-lg-6">
<div class="h-100 hover-item hover-scale hover-uncaption">
<a href="#">
<div class="hover-transition">
<div class="hover-down">
<i class="far fa-link fa-2x hover-icon"></i>
</div>
</div>
<figure class="h-100 bg-image" data-img-src="../../assets/images/upload/info-box-21.jpg">
<img class="w-100 h-100" src="../../assets/images/upload/info-box-image-cover.png" alt="image cover">
</figure>
</a>
</div>
</div>
<div class="col-lg-6 arrow-overflow-container d-flex align-items-center bg-primary text-white-75">
<svg class="arrow-overflow-up d-lg-none" fill="#2196f3" xmlns="http://www.w3.org/2000/svg" viewBox="3 10.2 34 18" width="34px" height="18px"><path d="M20,10.2l-17,18h34L20,10.2z"></path></svg>
<svg class="arrow-overflow-left d-none d-lg-block" fill="#2196f3" xmlns="http://www.w3.org/2000/svg" viewBox="9.4 3.8 18 34" width="18px" height="34px"><path d="M27.4,3.8l-18,17l18,17V3.8z"></path></svg>
<div class="py-5">
<div class="row no-gutters">
<div class="col-md-10 offset-md-1 px-4 py-5">
<h5 class="font-weight-400 text-white my-2">High Quality Product</h5>
<div data-height="3px"></div>
<h2 class="h1 section-title-4 title-light-1 text-left font-weight-800 mb-4">
Designed to Sell
<div class="title-divider-round"></div>
</h2>
<div class="lead-sm font-weight-500 pt-2 pb-4 mb-5">
Cras aliquet condimentum ligula neca convallis fusce sapien lectus sagittis malesuada consequa euismod iaculis ac dolor eget pharetra justo phasellus tortor ante facilisis cursus metus neque rutrum pulvinar metus sem nibh iaculis in congue ultrices
</div>
<div class="text-right mb-n2">
<a href="#" class="btn btn-lg btn-link text-white pr-0 mb-0"><i class="fas fa-long-arrow-alt-right"></i>More information</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Row item -->
<div class="row no-gutters">
<div class="col-lg-6 arrow-overflow-container d-flex align-items-center bg-indigo text-white-75 order-2 order-lg-1">
<svg class="arrow-overflow-right d-none d-lg-block" fill="#1565c0" xmlns="http://www.w3.org/2000/svg" viewBox="12.6 3.8 18 34" width="18px" height="34px"><path d="M12.6,3.8v34l18-17L12.6,3.8z"></path></svg>
<svg class="arrow-overflow-up d-lg-none" fill="#1565c0" xmlns="http://www.w3.org/2000/svg" viewBox="3 10.2 34 18" width="34px" height="18px"><path d="M20,10.2l-17,18h34L20,10.2z"></path></svg>
<div class="py-5">
<div class="row no-gutters">
<div class="col-md-10 offset-md-1 px-4 py-5">
<h5 class="font-weight-400 text-white my-2">Get Your Project Done</h5>
<div data-height="3px"></div>
<h2 class="h1 section-title-4 title-light-1 text-left font-weight-800 mb-4">
Task Management
<div class="title-divider-round"></div>
</h2>
<div class="lead-sm font-weight-500 pt-2 pb-4 mb-5">
Dolor mollis bibendum in etiam vehicula semper tellus ullamcorper dui lobortis aenean dictum neca nunc quis convallis at sapien arcu porta a dapibus lacinia justo nam consequat nec interdum consequa sapien quis tortor in tincidunt sit amet interdum
</div>
<div class="text-right mb-n2">
<a href="#" class="btn btn-lg btn-link text-white pr-0 mb-0"><i class="fas fa-long-arrow-alt-right"></i>More information</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6 order-1 order-lg-2">
<div class="h-100 hover-item hover-scale hover-uncaption">
<a href="#">
<div class="hover-transition">
<div class="hover-down">
<i class="far fa-link fa-2x hover-icon"></i>
</div>
</div>
<figure class="h-100 bg-image" data-img-src="../../assets/images/upload/info-box-22.jpg">
<img class="w-100 h-100" src="../../assets/images/upload/info-box-image-cover.png" alt="image cover">
</figure>
</a>
</div>
</div>
</div>
<!-- Row item -->
<div class="row no-gutters">
<div class="col-lg-6">
<div class="h-100 hover-item hover-scale hover-uncaption">
<a href="#">
<div class="hover-transition">
<div class="hover-down">
<i class="far fa-link fa-2x hover-icon"></i>
</div>
</div>
<figure class="h-100 bg-image" data-img-src="../../assets/images/upload/info-box-23.jpg">
<img class="w-100 h-100" src="../../assets/images/upload/info-box-image-cover.png" alt="image cover">
</figure>
</a>
</div>
</div>
<div class="col-lg-6 arrow-overflow-container d-flex align-items-center bg-navy text-white-75">
<svg class="arrow-overflow-up d-lg-none" fill="#0d47a1" xmlns="http://www.w3.org/2000/svg" viewBox="3 10.2 34 18" width="34px" height="18px"><path d="M20,10.2l-17,18h34L20,10.2z"></path></svg>
<svg class="arrow-overflow-left d-none d-lg-block" fill="#0d47a1" xmlns="http://www.w3.org/2000/svg" viewBox="9.4 3.8 18 34" width="18px" height="34px"><path d="M27.4,3.8l-18,17l18,17V3.8z"></path></svg>
<div class="py-5">
<div class="row no-gutters">
<div class="col-md-10 offset-md-1 px-4 py-5">
<h5 class="font-weight-400 text-white my-2">We Are at Your Service</h5>
<div data-height="3px"></div>
<h2 class="h1 section-title-4 title-light-1 text-left font-weight-800 mb-4">
Customer Support
<div class="title-divider-round"></div>
</h2>
<div class="lead-sm font-weight-500 pt-2 pb-4 mb-5">
Fusce sem massa congue vitae neque in rhoncus viverra erat aliquam dui odio posuere in lobortis sit amet consequat eu dolor nulla eget velit vitae diam efficitur fermentum morbi quis placera imperdiet massa purus mattis consequa mauris curabitur
</div>
<div class="text-right mb-n2">
<a href="#" class="btn btn-lg btn-link text-white pr-0 mb-0"><i class="fas fa-long-arrow-alt-right"></i>More information</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>