<!--Call to action-->
                <section class="position-relative bg-gradient-light">
                      <div class="container py-9 py-lg-11 position-relative z-index-1">
                          <div class="d-md-flex justify-content-center align-items-center">
                              <div class="mb-4 mb-md-0 me-md-5 me-lg-6 me-xl-7">
                                  <!--Title-->
                                  <h2 class="mb-3">Build stunning website faster than ever</h2>
                                  <!--text-->
                                  <p class="text-muted mb-0">Your business deserve a stunning look. </p>
                              </div>
                              <!--Action-->
                              <a class="btn btn-outline-primary btn-hover-arrow" href="#!">
                                  <span>Purchase Now</span></a>
                          </div>
                      </div>
                </section>
                <!--/.section Call to action end-->
                
                

                
                  <!--Call to action-->
                  <section class="position-relative bg-shade-primary text-white">
                      <div class="container position-relative z-index-1 py-9">
                          <div class="d-md-flex justify-content-center align-items-center">
                              <div class="mb-4 mb-md-0 me-md-5 me-lg-6 me-xl-7">
                                  <!--Heading-->
                                  <h2 class="h1 mb-0">Build stunning website faster than ever</h2>
                              </div>
                              <!--Action-->
                              <a class="btn btn-white btn-hover-arrow" href="#">
                                  <span>Purchase Now</span>
                              </a>
                          </div>
                      </div>
                  </section>
                  <!--/.section Call to action end-->
                
                

                
                  <!--Call to action-->
                  <section class="bg-gradient-light position-relative">
                    <div class="container py-9 py-lg-11">
                        <div class="bg-white overflow-hidden shadow-lg px-4 py-6 px-lg-5">
                            <div class="row align-items-center justify-content-center">
                                <div class="col-lg-9 col-md-8">
                                    <!--Sub-heading-->
                                    <h6 data-aos="zoom-in" class="mb-3 text-success">Are you interested?</h6>
                                    <!--Heading-->
                                    <h2 class="mb-3 display-5" data-aos="zoom-in-up" data-aos-delay="100">
                                        Let's build something awesome
                                    </h2>
                                    <!--Text-->
                                    <p class="mb-5 mb-md-0 pe-lg-11" data-aos="fade-up" data-aos-delay="150">
                                        Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing
                                        industries for previewing layouts and visual mockups.
                                    </p>
                                </div>
                                <!--End Col-->
                                <div class="col-lg-3 col-md-4 text-md-end">
                                    <!--Action-->
                                    <div data-aos="fade-left" data-aos-delay="200">
                                        <a href="#!" class="btn btn-primary btn-lg">
                                            <span>Get started</span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div> <!-- / .row -->
                    </div> <!-- / .container -->
                </section>
                <!--/.section Call to action end-->
                
                

                
                  <!--Call to action-->
                  <section class="position-relative">
                      <div class="container pb-9 pb-lg-11 position-relative">
                          <div
                              class="px-4 px-lg-7 py-9 py-lg-11 bg-shade-primary rounded-4 text-white overflow-hidden
                               position-relative">
                              <!--Decoration lines-->
                              <svg class="position-absolute end-0 bottom-0 text-warning w-75 h-auto w-lg-50 w-md-60"
                                  width="197" height="99" viewBox="0 0 197 99" fill="none" xmlns="http://www.w3.org/2000/svg">
                                  <path
                                      d="M280 141C280 122.615 276.392 104.41 269.381 87.4243C262.371 70.4387 252.095 55.0052
                                       239.141 42.005C226.188 29.0048 210.809 18.6925 193.884 11.6569C176.959 4.6212 158.819
                                        0.999999 140.5 1C122.181 1 104.041 4.62121 87.1157 11.6569C70.1907 18.6925 54.8124
                                         29.0049 41.8586 42.0051C28.9048 55.0053 18.6293 70.4387 11.6188 87.4243C4.60827
                                          104.41 0.999998 122.615 1 141L280 141Z"
                                      class="stroke-info" stroke-opacity="1" stroke-width="1.25" />
                                  <path
                                      d="M384 151C384 132.615 380.392 114.41 373.381 97.4243C366.371 80.4387 356.095 65.0052
                                       343.141 52.005C330.188 39.0048 314.809 28.6925 297.884 21.6569C280.959 14.6212 262.819
                                        11 244.5 11C226.181 11 208.041 14.6212 191.116 21.6569C174.191 28.6925 158.812 39.0049
                                         145.859 52.0051C132.905 65.0053 122.629 80.4387 115.619 97.4243C108.608 114.41 105
                                          132.615 105 151L384 151Z"
                                      class="stroke-warning" stroke-opacity="1" stroke-width="1.25" />
                              </svg>
                              <div class="position-relative">
                                  <!--Title-->
                                  <h2 class="display-6 mb-5" data-aos="fade-up">Get stories direct to your inbox</h2>
  
                                  <!--Newsletter form-->
                                  <form novalidate class="needs-validation" data-aos="fade-up" data-aos-delay="100">
                                      <div
                                          class="d-sm-flex w-md-80 w-lg-75 flex-column flex-sm-row mb-4 justify-content-center">
                                          <!--Email-->
                                          <input type="email" name="email"
                                              class="me-sm-1 mb-2 mb-sm-0 form-control form-control-lg border-0"
                                              placeholder="Email Address" required="">
  
                                          <!--Submit-->
                                          <button type="submit" class="ms-sm-1 btn btn-primary btn-lg">
                                              <span>Subscribe</span>
                                          </button>
                                      </div>
                                  </form>
  
                                  <!--Text-->
                                  <p class="small text-muted mb-0" data-aos="fade-up" data-aos-delay="150">
                                      We’ll never share your details.
                                      View our <a href="#!" class="link-hover-underline">Privacy Policy</a> for more info.
                                  </p>
                              </div>
                          </div>
                      </div>
                  </section>
                  <!--/.section Call to action end-->
                
                

                
                  <!--Call to action-->
                  <section class="bg-gradient-primary text-white position-relative">
                      <!--Shape-->
                      <svg class="position-absolute end-0 bottom-0 me-4 text-white h-100 w-auto" width="122" height="87"
                          viewBox="0 0 122 87" fill="none" xmlns="http://www.w3.org/2000/svg">
                          <path opacity="0.1" d="M72 0L122 86.6026H22L72 0Z" fill="currentColor" />
                          <path opacity="0.1" d="M32.5 56L65 -2.38419e-07H0L32.5 56Z" fill="currentColor" />
                      </svg>
  
                      <div class="container py-9 py-lg-11 position-relative z-index-1">
                          <div class="row align-items-center">
                              <div class="col-lg-8">
                                  <!--Heading-->
                                  <h2 class="display-6">Build stunning website faster than ever</h2>
                                  <!--Text-->
                                  <p class="lead mb-5 mb-lg-0">Your business deserve a stunning website. </p>
                              </div>
                              <div class="col-lg-4 ms-lg-auto text-lg-end">
                                  <!--Action-->
                                  <a class="btn btn-white btn-lg btn-hover-arrow" href="#"><span>Purchase
                                          Now</span></a>
                              </div>
                          </div>
                      </div>
                  </section>
                  <!--/.section Call to action end-->
                
                

                
                  <!--Call to action-->
                  <section class="bg-light">
                      <div class="container py-9 py-lg-11">
                          <div class="row">
                              <div class="col-lg-6 col-xl-5 col-md-8 mx-auto">
                                  <!--Heading-->
                                  <h2 class="h1 text-center mb-4" data-aos="fade-up" data-aos-delay="100">
                                      Subscribe
                                  </h2>
                                  <!--text-->
                                  <p class="mb-5 lead text-center" data-aos="fade-up" data-aos-delay="150">
                                      The latest updates, news, articles, and offers, sent direct to your inbox every month.
                                  </p>
                                  <!--Newsletter form-->
                                  <form data-aos="fade-up" data-aos-delay="300" class="needs-validation" novalidate>
                                      <div class="mb-3">
                                          <input type="text" required class="form-control" placeholder="Name">
                                          <span class="invalid-feedback">Please enter your name</span>
                                      </div>
                                      <div class="mb-3">
                                          <input type="email" required class="form-control" placeholder="Email Address">
                                          <span class="invalid-feedback">Please enter a valid email</span>
                                      </div>
                                      <div class="mb-3 d-grid">
                                          <button type="submit" class="btn btn-primary">Subscribe</button>
                                      </div>
                                  </form>
                                  <!--Info text-->
                                  <p class="mb-0 text-muted small" data-aos="fade-up" data-aos-delay="200">
                                      We’ll never share your details. See our <a href="#!"
                                          class="border-bottom border-light ">Privacy
                                          Policy</a>
                                  </p>
                              </div>
                          </div>
                      </div>
                  </section>
                   <!--/.section Call to action end-->
                
                

                
                  <!--Call to action-->
                  <section class="bg-dark text-white position-relative overflow-hidden">
                      <div class="container py-6 text-center">
                          <!--heading-->
                          <h5 class="mb-0 text-decoration-underline d-inline-block position-relative">Purchase now for $29
                          </h5>
                      </div>
                      <!--Link-->
                      <a href="#!" class="w-100 h-100 left-0 top-0 z-index-1 position-absolute"></a>
                  </section>
                  <!--/.section Call to action end-->
                
                

                
                  <!--Call to action-->
                  <section class="bg-gradient-light">
                      <div class="container py-6 py-lg-12">
                          <div class="row align-items-center">
                              <div class="col-lg-6 col-xl-5" data-aos="fade-up" data-aos-delay="100">
                                  <!--Heading-->
                                  <h2 class="h1 mb-3">
                                      Unlock the posibilities
                                  </h2>
                                  <!--Text-->
                                  <p class="mb-5 mb-lg-0">
                                      Sign Up today, No creadit card required
                                  </p>
                              </div>
                              <div class="col-lg-6" data-aos="fade-up" data-aos-delay="150">
                                  <!--Form-->
                                  <form novalidate class="needs-validation">
                                      <div class="d-flex flex-column flex-md-row">
                                          <div class="mb-2 flex-grow-1 mb-md-0 me-md-2">
                                              <input type="email" required class="form-control" placeholder="Email Address">
                                          </div>
                                          <div class="flex-shrink-0">
                                              <button type="submit" class="btn btn-primary">Get Started</button>
                                          </div>
                                      </div>
                                  </form>
                              </div>
                          </div>
                          <!--row-->
                      </div>
                  </section>
                  <!--/.section Call to action end-->
                
                

                
                  <!--Call to action-->
                  <section class="bg-dark text-white jarallax" data-speed=".2">
                     <!--Parallax image-->
                     <img src="assets/img/backgrounds/bg1.jpg" class="jarallax-img opacity-75" alt="">
                     <div class="container py-11 py-lg-15 position-relative">
                         <div class="row align-items-center">
                             <div data-aos="fade-up">
                                 <!--Heading-->
                                 <h2 class="display-3 mb-4">Let's work togethor</h2>
                                 <!--Text-->
                                 <span class="lead d-block mb-5">Lorem ipsum is placeholder text commonly used in the
                                     graphic</span>
                             </div>
                             <div data-aos="fade-up">
                                 <!--Action-->
                                 <a href="#" class="btn btn-lg btn-primary rounded-pill">Start Live Chat</a>
                             </div>
                         </div>
                     </div>
                 </section>
                 <!--/.section Call to action end-->
                
                

                
                  <!--Call to action-->
                 <div class="container py-9 py-lg-11">
                          <div class="px-4 rounded-3 shadow-lg py-6 px-lg-5 py-lg-7 bg-gradient-secondary 
                          text-white position-relative overflow-hidden"
                              data-aos="fade-up" data-aos-delay="100">
                              <!--Shape-->
                              <svg class="position-absolute end-0 bottom-0 mb-4 text-success" width="200" height="400"
                                  preserveAspectRatio="none" viewBox="0 0 150 300" fill="none"
                                  xmlns="http://www.w3.org/2000/svg">
                                  <path
                                      d="M150 300C130.302 300 110.796 296.12 92.5975 288.582C74.3986 281.044 57.8628
                                       269.995 43.934 256.066C30.0052 242.137 18.9563 225.601 11.4181 207.403C3.87986
                                        189.204 -6.2614e-07 169.698 0 150C6.2614e-07 130.302 3.87987 110.796 11.4181
                                         92.5975C18.9563 74.3987 30.0052 57.8628 43.934 43.934C57.8628 30.0052 74.3987
                                          18.9563 92.5975 11.4181C110.796 3.87986 130.302 3.51961e-06 150 5.00679e-06L150
                                           37.5C135.226 37.5 120.597 40.4099 106.948 46.0636C93.299 51.7172 80.8971 60.0039
                                            70.4505 70.4505C60.0039 80.8971 51.7172 93.299 46.0636 106.948C40.4099 120.597
                                             37.5 135.226 37.5 150C37.5 164.774 40.4099 179.403 46.0636 193.052C51.7172
                                              206.701 60.0039 219.103 70.4505 229.55C80.8971 239.996 93.299 248.283 106.948
                                               253.936C120.597 259.59 135.226 262.5 150 262.5V300Z"
                                      fill="currentColor"></path>
                              </svg>
  
                              <div class="row align-items-end position-relative">
                                  <div class="col-lg-6 col-xl-7">
                                      <h5 class="text-muted mb-4">Let's start building</h5>
                                      <h1 class="mb-5 mb-md-0 display-5">Stunning websites ease</h1>
                                  </div>
                                  <div class="col-lg-6 col-xl-5 text-lg-end">
                                      <a href="#!" class="btn btn-primary btn-lg me-2 mb-2 mb-lg-0">Contact sales</a>
                                      <a href="#!" class="btn btn-gray-200 btn-lg">Purchase Now</a>
                                  </div>
                              </div>
                          </div>
                      </div>
                  <!--/.Call to action end-->
                
                

                
                  <!--Call to action-->
                  <section class="bg-gradient-light">
                     <div class="container py-9 py-lg-11">
                         <div class="row align-items-center">
                             <div class="col-12">
                                 <!--Heading-->
                                 <h3>Call us today at <a href="tel:+112345678" class="text-primary">+1 123-45678</a> or Email
                                     us at <a class="text-primary" href="mailto:mail@company.com">mail@company.com</a></h3>
                                 <span>Lorem ipsum is placeholder text commonly used in the graphic</span>
                             </div>
                             <div class="col-12 mt-4">
                                 <!--Action-->
                                 <a href="#" class="btn btn-lg btn-success">Start Live Chat</a>
                             </div>
                         </div>
                     </div>
                 </section>
                 <!--/.section Call to action end-->