<section class="wrapper bg-light">\n      <div class="container pt-18 pt-md-20 pb-14 pb-md-16">\n        <div class="row text-center">\n          <div class="col-lg-10 col-xl-9 col-xxl-8 mx-auto position-relative">\n            <img src="/assets/img/svg/doodle3.svg" class="h-11 position-absolute d-none d-lg-block" style="top: -45%; left: 23%" alt="">\n            <img src="/assets/img/svg/doodle4.svg" class="h-8 position-absolute d-none d-lg-block" style="top: 6%; right: 2%" alt="">\n            <h2 class="fs-16 text-uppercase text-muted mb-3">App Features</h2>\n            <h3 class="display-3 mb-11 px-lg-5 px-xl-0 px-xxl-6">Simeya makes your spending <span class="text-gradient gradient-7">stress-free</span> for you to have the perfect control.</h3>\n          </div>\n          <!-- /column -->\n        </div>\n        <!-- /.row -->\n        <div class="row mb-20">\n          <div class="col-xxl-11 mx-auto">\n            <div class="row gx-md-8 gy-10 text-center">\n              <div class="col-md-6 col-lg-3">\n                <div class="svg-bg svg-bg-lg bg-pale-yellow rounded-xl mb-4"> <img src="/assets/img/icons/solid/cloud-network-2.svg" class="svg-inject icon-svg solid text-navy" alt="" /> </div>\n                <h4 class="fs-20">Always up to Date</h4>\n              </div>\n              <!--/column -->\n              <div class="col-md-6 col-lg-3">\n                <div class="svg-bg svg-bg-lg bg-pale-green rounded-xl mb-4"> <img src="/assets/img/icons/solid/touchscreen.svg" class="svg-inject icon-svg solid text-navy" alt="" /> </div>\n                <h4 class="fs-20">Easy Usage</h4>\n              </div>\n              <!--/column -->\n              <div class="col-md-6 col-lg-3">\n                <div class="svg-bg svg-bg-lg bg-pale-purple rounded-xl mb-4"> <img src="/assets/img/icons/solid/lock.svg" class="svg-inject icon-svg solid text-navy" alt="" /> </div>\n                <h4 class="fs-20">Secure Payments</h4>\n              </div>\n              <!--/column -->\n              <div class="col-md-6 col-lg-3">\n                <div class="svg-bg svg-bg-lg bg-pale-pink rounded-xl mb-4"> <img src="/assets/img/icons/solid/rocket.svg" class="svg-inject icon-svg solid text-navy" alt="" /> </div>\n                <h4 class="fs-20">Fast Transactions</h4>\n              </div>\n              <!--/column -->\n              <div class="col-md-6 col-lg-3">\n                <div class="svg-bg svg-bg-lg bg-pale-violet rounded-xl mb-4"> <img src="/assets/img/icons/solid/bar-chart.svg" class="svg-inject icon-svg solid text-navy" alt="" /> </div>\n                <h4 class="fs-20">Reports & Forecasting</h4>\n              </div>\n              <!--/column -->\n              <div class="col-md-6 col-lg-3">\n                <div class="svg-bg svg-bg-lg bg-pale-orange rounded-xl mb-4"> <img src="/assets/img/icons/solid/safe.svg" class="svg-inject icon-svg solid text-navy" alt="" /> </div>\n                <h4 class="fs-20">Online Banking</h4>\n              </div>\n              <!--/column -->\n              <div class="col-md-6 col-lg-3">\n                <div class="svg-bg svg-bg-lg bg-pale-blue rounded-xl mb-4"> <img src="/assets/img/icons/solid/controls.svg" class="svg-inject icon-svg solid text-navy" alt="" /> </div>\n                <h4 class="fs-20">Configurable Fields</h4>\n              </div>\n              <!--/column -->\n              <div class="col-md-6 col-lg-3">\n                <div class="svg-bg svg-bg-lg bg-pale-leaf rounded-xl mb-4"> <img src="/assets/img/icons/solid/checked.svg" class="svg-inject icon-svg solid text-navy" alt="" /> </div>\n                <h4 class="fs-20">List of Transactions</h4>\n              </div>\n              <!--/column -->\n            </div>\n            <!--/.row -->\n          </div>\n          <!-- /column -->\n        </div>\n        <!-- /.row -->\n        <div class="row text-center">\n          <div class="col-md-10 col-lg-7 mx-auto position-relative">\n            <img src="/assets/img/svg/doodle5.svg" class="w-15 position-absolute d-none d-lg-block" data-delay="1800" style="bottom: -60%; right: 10%" alt="">\n            <img src="/assets/img/svg/doodle6.svg" class="h-15 position-absolute d-none d-lg-block" data-delay="1800" style="top: -40%; left: -5%" alt="">\n            <h2 class="fs-16 text-uppercase text-muted mb-3">How It Works</h2>\n            <h3 class="display-3 mb-8 px-xl-6">Download the app, create your profile and <span class="text-gradient gradient-7">voilà</span>, you're all set!</h3>\n          </div>\n          <!-- /column -->\n        </div>\n        <!-- /.row -->\n        <div class="row mb-lg-20 mb-xl-23">\n          <div class="col-xxl-11 mx-auto">\n            <div class="row gy-10 gy-lg-0 text-center d-flex align-items-center">\n              <div class="col-md-6 col-lg-4 mx-auto mb-n10 mb-lg-0">\n                <figure class="mx-auto"><img src="/assets/img/photos/devices4.png" srcset="/assets/img/photos/devices4@2x.png 2x" alt=""></figure>\n              </div>\n              <!-- /column -->\n              <div class="w-100 d-lg-none"></div>\n              <div class="col-md-6 col-lg-4 order-lg-first">\n                <div class="mb-8">\n                  <span class="fs-60 lh-1 mb-3 fw-normal text-gradient gradient-7">01</span>\n                  <h4 class="fs-20">Download Application</h4>\n                  <p class="mb-0 px-xl-7">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus.</p>\n                </div>\n                <!-- /div -->\n                <div>\n                  <span class="fs-60 lh-1 mb-3 fw-normal text-gradient gradient-7">02</span>\n                  <h4 class="fs-20">Quick Registration</h4>\n                  <p class="mb-0 px-xl-7">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus.</p>\n                </div>\n                <!-- /div -->\n              </div>\n              <!-- /column -->\n              <div class="col-md-6 col-lg-4">\n                <div class="mb-8">\n                  <span class="fs-60 lh-1 mb-3 fw-normal text-gradient gradient-7">03</span>\n                  <h4 class="fs-20">Track Your Spending</h4>\n                  <p class="mb-0 px-xl-7">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus.</p>\n                </div>\n                <!-- /div -->\n                <div>\n                  <span class="fs-60 lh-1 mb-3 fw-normal text-gradient gradient-7">04</span>\n                  <h4 class="fs-20">Have Total Control</h4>\n                  <p class="mb-0 px-xl-7">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus.</p>\n                </div>\n                <!-- /div -->\n              </div>\n              <!-- /column -->\n            </div>\n            <!-- /.row -->\n          </div>\n          <!-- /column -->\n        </div>\n        <!-- /.row -->\n      </div>\n      <!-- /.container -->\n    </section>