<!--Page hero newsletter-->
<section class="position-relative bg-primary bg-opacity-10">
  <div class="container position-relative pt-14 pb-9 pb-lg-12">
   <div class="row pt-lg-9 pb-lg-5">
    <div class="col-xl-8 mx-auto text-center">
     <!--Hero heading-->
     <h1 class="display-2 mb-4">Make an impact with stunning design</h1>
     <!--Hero subheading-->
     <p class="lead mb-4 mb-md-5">Build a stunning website that attract visitors</p>
     <!--Newsletter form-->
     <form class="w-100 d-md-flex flex-0 justify-content-center needs-validation" novalidate>
        <div class="d-md-flex justify-content-center align-items-center rounded-2 w-lg-75">
        <!--Input-->
          <input type="email" required placeholder="Enter your email"
            class="form-control me-md-2 form-control-lg mb-2 mb-lg-0">
          <!--Submit button-->
          <div class="d-grid d-md-block flex-shrink-0">
            <button class="btn btn-primary btn-lg" type="submit">
             Get Started
            </button>
         </div>
       </div>
     </form>
    <small class="d-block pt-2 opacity-50">No cc required. Cancel anytime</small>
   </div>
  </div>
  <!--/.row-->
 </div>
 <!--/.content-->
</section>
<!--/Hero end-->