<div class="simple-counter">

  <div class="simple">

  <div>

    <span>$</span>

      <p class="counter" data-count="150">0</p>

    </div>

    <p><i class="ti ti-arrow-narrow-up text-success"></i>Income</p>

  </div>

  <div class="simple">

    <div class="counter" data-count="85">0</div>

    <p><i class="ti ti-arrow-narrow-down text-danger"></i>Projects</p>

  </div>

  <div class="simple">

     <div>

      <p class="counter" data-count="60">0</p>

      <span>%</span>

    </div>

    <p><i class="ti ti-arrow-narrow-up text-success"></i>Achievement</p>

  </div>

 </div>

  

  <div class="customized-counter mt-4">

  <div class="customized">

    <i class="ti ti-apps"></i>

    <div class="d-flex align-items-center">

    <span>$</span>

    <p class="counter f-w-500 f-s-30 text-dark" data-count="500">0</p>

  </div>

    <p>Respected Companies</p>

  </div>

  <div class="customized">

    <i class="ti ti-report-analytics"></i>

    <div class="counter" data-count="75">0</div>

    <p>Analytical Reports</p>

  </div>

  <div class="customized">

    <i class="ti ti-brand-paypal"></i>

    <div class="d-flex align-items-center">

    <p class="counter f-w-500 f-s-30 text-dark" data-count="40">0</p>

    <span>%</span>

  </div>

    <p>Protected Payments</p>

  </div>

 </div>

                  

  <div class="simple-counter">

  <div class="simple">

      <div>

    <span>$</span>

      <p class="counter" data-count="150">0</p>

    </div>

    <p><i class="ti ti-arrow-narrow-up text-success"></i>Income</p>

  </div>

  <div class="simple">

    <div class="counter" data-count="85">0</div>

    <p><i class="ti ti-arrow-narrow-down text-danger"></i>Projects</p>

  </div>

  <div class="simple">

     <div>

      <p class="counter" data-count="60">0</p>

      <span>%</span>

    </div>

    <p><i class="ti ti-arrow-narrow-up text-success"></i>Achievement</p>

  </div>

   <div>

     <button class="btn btn-light-primary" id="startCounter">Update Data </button>

   </div>

 </div>

        

         <div class="simple-counter">

        <ul class="nav nav-tabs app-tabs-primary" id="Basic" role="tablist">

          <li class="nav-item" role="presentation">

            <button class="nav-link active" id="one-tab" data-bs-toggle="tab"

              data-bs-target="#tab-one" type="button" role="tab" aria-controls="tab-one"

              aria-selected="true">Tab-1</button>

          </li>

          <li class="nav-item" role="presentation">

            <button class="nav-link" id="two-tab" data-bs-toggle="tab" data-bs-target="#tab-two"

              type="button" role="tab" aria-controls="tab-two" aria-selected="false">Tab-2</button>

          </li>

          <li class="nav-item" role="presentation">

            <button class="nav-link" id="three-tab" data-bs-toggle="tab" data-bs-target="#tab-three"

              type="button" role="tab" aria-controls="tab-three" aria-selected="false">Tab-3</button>

          </li>

        </ul>

        <div class="tab-content" id="BasicContent">

          <div class="tab-pane fade show active" id="tab-one" role="tabpanel"

            aria-labelledby="one-tab" tabindex="0">

            ...

          </div>

          <div class="tab-pane fade" id="tab-two" role="tabpanel" aria-labelledby="two-tab"

            tabindex="0">

             ...

          </div>

          <div class="tab-pane fade" id="tab-three" role="tabpanel" aria-labelledby="three-tab"

            tabindex="0">

             ...

          </div>

        </div>