<ul class="stepper" id="stepper" data-mdb-stepper="stepper" data-mdb-stepper-linear="true" data-mdb-stepper-type="vertical">

  <form class="needs-validation stepper-form" novalidate>

    <li class="stepper-step stepper-active">

    <div class="stepper-head">

        <span class="stepper-head-icon"> 1 </span>

        <span class="stepper-head-text"> Customer Details</span>

     </div>

      <div class="stepper-content py-3">

<div class="form-group">

          <label for="address">Address<span class="text-danger">*</span> </label>

          <input type="text" class="form-control" name="address" id="address" required>

          <div class="invalid-feedback">Required</div>

        </div>

</div>

 </li>

    <li class="stepper-step">

      <div class="stepper-head">

        <span class="stepper-head-icon"> 2 </span>

        <span class="stepper-head-text"> Product Details </span>

      </div>

      <div class="stepper-content py-3">

<div class="row mt-3">

          <div class="col-12">

            <div class="form-group">

              <label for="powerunit">Power Unit Model #<span class="text-danger">*</span> </label>

              <input type="text" class="form-control" name="powerunitmodel" id="powerunitmodel" placeholder="Choose Power Unit from Dropdown" required>

              <div class="invalid-feedback">Required</div>

            </div>

          </div>

        </div>

</div>

</li>

</form>

</ul>

 <button id="next-step-btn" class="btn btn-primary next-step">next</button>