<!-- -------- START PRE-FOOTER 1 w/ SUBSCRIBE BUTTON AND IMAGE ------- -->
<section class="py-7 mt-1">
<div class="container-fluid px-0">
<div class="row justify-content-center text-center">
<div class="col-12 position-relative">
<div class="row bg-gray-100 bottom-0 py-7">
<div class="col-xl-6 text-start ms-auto">
<h4>Be the first to see the news</h4>
<p class="mb-4">
Your company may not be in the software business,
but eventually, a software company will be in your business.
</p>
<div class="row">
<div class="col-sm-5">
<div class="input-group input-group-outline">
<label class="form-label">Email Here</label>
<input type="text" class="form-control mb-sm-0 mb-2">
</div>
</div>
<div class="col-sm-4 ps-0">
<button type="button" class="btn bg-gradient-warning mb-0 h-100 position-relative z-index-2">Subscribe</button>
</div>
</div>
</div>
<div class="col-xl-4 position-relative">
<img class="w-100 max-width-300 border-radius-lg mt-n10 d-lg-block d-none shadow-xl" src="../../assets/img/examples/blog2.jpg" alt="image">
</div>
</div>
</div>
</div>
</div>
</section>
<!-- -------- END PRE-FOOTER 1 w/ SUBSCRIBE BUTTON AND IMAGE ------- --><!-- ------- START PRE-FOOTER 2 - simple social line w/ title & 3 buttons -------- -->
<div class="py-11">
<div class="container">
<div class="row">
<div class="col-lg-6">
<h4 class="mb-1">Thank you for your support!</h4>
<p class="lead mb-0">Delivering the best products</p>
</div>
<div class="col-lg-6 d-flex align-items-center">
<a href="javascript:;" class="btn btn-twitter mb-0 me-2">
<i class="fab fa-twitter me-1"></i> Twitter
</a>
<a href="javascript:;" class="btn btn-facebook mb-0 me-2">
<i class="fab fa-facebook-square me-1"></i> Facebook
</a>
<a href="javascript:;" class="btn btn-tumblr mb-0 me-2">
<i class="fab fa-tumblr me-1"></i> Tumblr
</a>
<a href="javascript:;" class="btn btn-dribbble mb-0">
<i class="fab fa-dribbble me-1"></i> Dribbble
</a>
</div>
</div>
</div>
</div>
<!-- ------- END PRE-FOOTER 2 - simple social line w/ title & 3 buttons -------- --><!-- -------- START PRE-FOOTER 3 w/ SOCIAL BUTTONS ------- -->
<section class="my-11">
<div class="container bg-gradient-dark border-radius-lg">
<div class="row py-4">
<div class="col-md-2 col-sm-4 col-6 text-center my-auto mb-md-0 mb-4 border-end-md">
<a href="javascript:;" class="btn btn-link btn-icon mb-0">
<i class="fab fa-twitter text-white text-lg"></i>
</a>
</div>
<div class="col-md-2 col-sm-4 col-6 text-center my-auto mb-md-0 mb-4 border-end-md">
<a href="javascript:;" class="btn btn-link btn-icon mb-0">
<i class="fab fa-facebook text-white text-lg"></i>
</a>
</div>
<div class="col-md-2 col-sm-4 col-6 text-center my-auto mb-md-0 mb-4 border-end-md">
<a href="javascript:;" class="btn btn-link btn-icon mb-0">
<i class="fab fa-pinterest text-white text-lg"></i>
</a>
</div>
<div class="col-md-2 col-sm-4 col-6 text-center my-auto border-end-md">
<a href="javascript:;" class="btn btn-link btn-icon mb-0">
<i class="fab fa-dribbble text-white text-lg"></i>
</a>
</div>
<div class="col-md-2 col-sm-4 col-6 text-center my-auto border-end-md">
<a href="javascript:;" class="btn btn-link btn-icon mb-0">
<i class="fab fa-youtube text-white text-lg"></i>
</a>
</div>
<div class="col-md-2 col-sm-4 col-6 text-center my-auto">
<a href="javascript:;" class="btn btn-link btn-icon mb-0">
<i class="fab fa-instagram text-white text-lg"></i>
</a>
</div>
</div>
</div>
</section>
<!-- -------- END PRE-FOOTER 3 w/ SOCIAL BUTTONS ------- --><!-- ------- START PRE-FOOTER 4 - title & description and input -------- -->
<div class="py-11">
<div class="container">
<div class="row">
<div class="col-lg-6 text-start">
<h4>Get tips & tricks every week</h4>
<p class="mb-0">The latest news, articles and resources sent to your inbox weekely.</p>
</div>
<div class="col-lg-5 ms-auto text-end my-auto">
<div class="row">
<div class="col-lg-8 col-md-4 col-7">
<div class="input-group input-group-outline">
<label class="form-label">Your Email</label>
<input class="form-control" type="email" >
</div>
</div>
<div class="col-lg-4 col-md-4 col-5 text-start ps-0">
<button type="button" class="btn bg-gradient-primary mb-0">Subscribe</button>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- ------- END PRE-FOOTER 4 - title & description and input -------- --><!-- -------- START PRE-FOOTER 5 w/ DARK BACKGROUND ------- -->
<section class="my-9 py-5 bg-gradient-dark position-relative overflow-hidden">
<img src="../../assets/img/shapes/pattern-lines.svg" alt="pattern-lines" class="position-absolute start-0 top-0 w-100 opacity-4">
<div class="container position-relative z-index-2">
<div class="row">
<div class="col-lg-6 col-md-8 m-auto text-center">
<h5 class="text-white">Be the first to see the news</h5>
<p class="mb-5 text-white">
Your company may not be in the software business,
but eventually, a software company will be in your business.
</p>
<div class="row">
<div class="col-sm-8 pe-sm-0 mb-sm-0 mb-2">
<div class="input-group input-group-outline">
<label class="form-label">Email Here...</label>
<input class="form-control" type="email" >
</div>
</div>
<div class="col-sm-4 ps-sm-0">
<button type="button" class="btn bg-gradient-primary mb-0 ms-sm-3 me-auto w-100 d-block">Subscribe</button>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- -------- END PRE-FOOTER 5 w/ DARK BACKGROUND ------- --><!-- ------- START PRE-FOOTER 6 - title & description and input -------- -->
<div class="py-8">
<div class="container">
<div class="row">
<div class="col-lg-6 mx-auto text-center">
<h3>Our products are built on top</h3>
<p class="lead">Very nice logos here on this page, you can check more on our social profiles.</p>
</div>
</div>
<div class="row mt-5">
<div class="col-lg-2 col-md-4 col-6 mb-4 ms-auto">
<img class="w-100 opacity-7" src="../../assets/img/logos/gray-logos/logo-apple.svg">
</div>
<div class="col-lg-2 col-md-4 col-6 mb-4">
<img class="w-100 opacity-7" src="../../assets/img/logos/gray-logos/logo-spotify.svg">
</div>
<div class="col-lg-2 col-md-4 col-6 mb-4">
<img class="w-100 opacity-7" src="../../assets/img/logos/gray-logos/logo-behance.svg">
</div>
<div class="col-lg-2 col-md-4 col-6 mb-4">
<img class="w-100 opacity-7" src="../../assets/img/logos/gray-logos/logo-facebook.svg">
</div>
<div class="col-lg-2 col-md-4 col-6 mb-4 me-auto">
<img class="w-100 opacity-7" src="../../assets/img/logos/gray-logos/logo-nasa.svg">
</div>
</div>
</div>
</div>
<!-- ------- END PRE-FOOTER 6 - title & description and input -------- --><!-- -------- START PRE-FOOTER 7 w/ TEXT AND 2 BUTTONS ------- -->
<section class="my-10 py-5 bg-gradient-dark position-relative overflow-hidden">
<img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute start-0 top-0 w-100 opacity-1">
<div class="container position-relative z-index-2">
<div class="row">
<div class="col-lg-5 col-md-8 m-auto text-start">
<h5 class="text-white mb-lg-0 mb-5">
Your company may not be in the software business,
but eventually, a software company will be in your business.
</h5>
</div>
<div class="col-lg-6 m-auto">
<div class="row">
<div class="col-sm-4 col-6 ps-sm-0 ms-auto">
<button type="button" class="btn bg-gradient-primary mb-0 ms-lg-3 ms-sm-2 mb-sm-0 mb-2 me-auto w-100 d-block">Start Now</button>
</div>
<div class="col-sm-4 col-6 ps-sm-0 me-lg-0 me-auto">
<button type="button" class="btn btn-white mb-0 ms-lg-3 ms-sm-2 mb-sm-0 mb-2 me-auto w-100 d-block">Our Story</button>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- -------- END PRE-FOOTER 7 w/ TEXT AND 2 BUTTONS ------- --><!-- -------- START PRE-FOOTER 8 w/ TEXT, BG IMAGE AND 2 BUTTONS ------- -->
<section class="my-10 py-5 bg-gradient-dark position-relative" style="background-image:url(../../assets/img/bg3.jpg)">
<span class="mask bg-gradient-dark opacity-8"></span>
<div class="container position-relative z-index-2">
<div class="row">
<div class="col-lg-5 col-md-8 m-auto text-start">
<h5 class="text-white mb-lg-0 mb-5">
For being a bright color. For standing out. But the time is now to be okay to be the greatest you.
</h5>
</div>
<div class="col-lg-6 m-auto">
<div class="row">
<div class="col-sm-4 col-6 ps-sm-0 ms-auto">
<button type="button" class="btn bg-gradient-warning mb-0 ms-lg-3 ms-sm-2 mb-sm-0 mb-2 me-auto w-100 d-block">Start Now</button>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- -------- END PRE-FOOTER 8 w/ TEXT, BG IMAGE AND 2 BUTTONS ------- -->