Process steps

<div class="rootwizard">
  <ul>
    <li>
      <a href="#tab01" data-toggle="tab">1</a>
      <span>Info</span>
    </li>
    <li class="tab-cart">
      <a href="#tab02" data-toggle="tab">2</a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab03" data-toggle="tab">3</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab04" data-toggle="tab">4</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab05" data-toggle="tab">5</a>
      <span>Receipt</span>
    </li>
    <li>
      <a href="#tab06" data-toggle="tab">6</a>
      <span>Done</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab01">
      <!-- [info step] -->
      <h3 class="text-center m-b-md">Please read the following:</h3>
      <p class="content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elementum quis dolor vehicula suscipit. Ut interdum et arcu non hustensaft. Nullam nec volutpat felis, ac convallis tortor. Nam quis mauris metus. Nunc consectetur urna vitae tellus dapibus pulvinar id non turpis. Fusce quis nunc dictum, fringilla nisi eu, bibendum ante. Donec eu aliquet elit. Nulla facilisi. Nullam dignissim imperdiet condimentum</p>
      <p class="content">Collaboratively administrate empowered markets via plug-and-play networks. Dynamically procrastinate B2C users after installed base benefits. Dramatically visualize customer directed convergence without revolutionary ROI.<br>                Efficiently unleash cross-media information without cross-media value. Quickly maximize timely deliverables for real-time schemas. Dramatically maintain clicks-and-mortar solutions without functional solutions.</p>
      <!-- END OF [info step] -->
      
    </div>
    <div class="tab-pane" id="tab02">
      <!-- [cart step] -->
      <div class="tab-pane-cart">
      
          <div class="cart-rows">
            <div class="col-sm-3 col-sm-offset-3">Product</div>
            <div class="col-sm-1">Size</div>
            <div class="col-sm-2">Unit Price</div>
            <div class="col-sm-1">Quantity</div>
            <div class="col-sm-2">Total</div>
          </div>
      
          <ul>
            <li class="minicart-item">
              <div class="minicart-details-img col-xs-6 col-sm-3">
                <a href="/features/shop/single.html"><img class="minicart-img" src="/img/shop/t-shirts/t-shirt-11.png" alt="shop item 1"></a>
              </div>
              <div class="minicart-details-name col-xs-6 col-sm-3">
                <a href="/features/shop/single.html"><span class="minicart-name">Spacious T-Shirt</span></a>
              </div>
              <div class="minicart-details-size col-xs-6 col-sm-1">
                <div class="minicart-size">S</div>
              </div>
              <div class="minicart-details-unit col-xs-6 col-sm-2">
                <span class="minicart-price">25.50</span>
              </div>
              <div class="minicart-details-quantity col-xs-6 col-sm-1">
                <i>-</i>
                <input class="minicart-quantity dummy-class" data-minicart-idx="0" name="quantity_1" type="text" pattern="[0-9]*" value="4" autocomplete="off">
                <i>+</i>
              </div>
              <div class="minicart-details-price col-xs-6 col-sm-2">
                <span class="minicart-price">$102.00</span>
              </div>
              <div class="minicart-details-remove">
                <button type="button" class="button p-a-0 fa fa-trash-o minicart-remove dummy-class" data-minicart-idx="0"></button>
              </div>
            </li>
      
            <li class="minicart-item">
              <div class="minicart-details-img col-xs-6 col-sm-3">
                <a href="/features/shop/single.html"><img class="minicart-img" src="/img/shop/hoodies/11.png" alt="shop item 4"></a>
              </div>
              <div class="minicart-details-name col-xs-6 col-sm-3">
                <a href="/features/shop/single.html"><span class="minicart-name">Runner Hoodie</span></a>
              </div>
              <div class="minicart-details-size col-xs-6 col-sm-1">
                <div class="minicart-size">M</div>
              </div>
              <div class="minicart-details-unit col-xs-6 col-sm-2">
                <span class="minicart-price">110.00</span>
              </div>
              <div class="minicart-details-quantity col-xs-6 col-sm-1">
                <i>-</i>
                <input class="minicart-quantity dummy-class" data-minicart-idx="0" name="quantity_1" type="text" pattern="[0-9]*" value="1" autocomplete="off">
                <i>+</i>
              </div>
              <div class="minicart-details-price col-xs-6 col-sm-2">
                <span class="minicart-price">$110.00</span>
              </div>
              <div class="minicart-details-remove">
                <button type="button" class="button p-a-0 fa fa-trash-o minicart-remove dummy-class" data-minicart-idx="0"></button>
              </div>
            </li>
      
            <li class="minicart-item">
              <div class="minicart-details-img col-xs-6 col-sm-3">
                <a href="/features/shop/single.html"><img class="minicart-img" src="/img/shop/shirts/11.png" alt="shop item 7"></a>
              </div>
              <div class="minicart-details-name col-xs-6 col-sm-3">
                <a href="/features/shop/single.html"><span class="minicart-name">Office Shirt</span></a>
              </div>
              <div class="minicart-details-size col-xs-6 col-sm-1">
                <div class="minicart-size">XS</div>
              </div>
              <div class="minicart-details-unit col-xs-6 col-sm-2">
                <span class="minicart-price">40.00</span>
              </div>
              <div class="minicart-details-quantity col-xs-6 col-sm-1">
                <i>-</i>
                <input class="minicart-quantity dummy-class" data-minicart-idx="0" name="quantity_1" type="text" pattern="[0-9]*" value="2" autocomplete="off">
                <i>+</i>
              </div>
              <div class="minicart-details-price col-xs-6 col-sm-2">
                <span class="minicart-price">$80.00</span>
              </div>
              <div class="minicart-details-remove">
                <button type="button" class="button p-a-0 fa fa-trash-o minicart-remove dummy-class" data-minicart-idx="0"></button>
              </div>
            </li>
          </ul>
      
      </div>
      <!-- END OF [cart step] -->
      
      
    </div>
    <div class="tab-pane" id="tab03">
      <!-- [shipping step] -->
      <form class="tab-pane-shipping">
        <div class="form-group row">
          <label for="inputName" class="col-sm-2 form-control-label">Full Name</label>
          <div class="col-sm-10">
            <input type="text" class="form-control" id="inputName">
          </div>
        </div>
        <div class="form-group row">
          <label for="inputAddress1" class="col-sm-2 form-control-label">Address Line 1</label>
          <div class="col-sm-10">
            <input type="text" class="form-control" id="inputAddress1">
            <small class="text-muted">Street address, P.O. box, company name, c/o</small>
          </div>
        </div>
        <div class="form-group row">
          <label for="inputAddress2" class="col-sm-2 form-control-label">Address Line 2</label>
          <div class="col-sm-10">
            <input type="text" class="form-control" id="inputAddress2">
            <small class="text-muted">Apartment, suite, unit, building, floor, etc.</small>
          </div>
        </div>
        <div class="form-group row">
          <label for="inputCity" class="col-sm-2 form-control-label">City</label>
          <div class="col-sm-10">
            <input type="text" class="form-control" id="inputCity">
          </div>
        </div>
        <div class="form-group row">
          <label for="inputState" class="col-sm-2 form-control-label">Region</label>
          <div class="col-sm-10">
            <input type="text" class="form-control" id="inputState">
            <small class="text-muted">or State/Province</small>
          </div>
        </div>
        <div class="form-group row">
          <label for="inputPostal" class="col-sm-2 form-control-label">Postal Code</label>
          <div class="col-sm-10">
            <input type="text" class="form-control" id="inputPostal">
            <small class="text-muted">or ZIP</small>
          </div>
        </div>
        <div class="form-group row">
          <label for="inputCountry" class="col-sm-2 form-control-label">Country</label>
          <div class="col-sm-10">
            <input type="text" class="form-control" id="inputCountry">
          </div>
        </div>
      </form>
      <!-- END OF [shipping step] -->
      
    </div>
    <div class="tab-pane" id="tab04">
      <!-- [payment step] -->
      
      <form class="tab-pane-payment">
        <div class="row">
          <div class="pane-big-icon col-sm-4 text-center">
            <i class="fa fa-credit-card"></i>
            <div class="cards-block m-b">
              <span class="pane-small-icon">
                <i class="fa fa-cc-mastercard"></i>
              </span>
              <span class="pane-small-icon">
                <i class="fa fa-cc-visa"></i>
              </span>
            </div>
          </div>
          <div class="col-sm-8">
            <div class="row">
              <div class="col-xs-12">
                <input type="text" class="form-control m-b input-mask" data-mask="9999-9999-9999-9999" placeholder="Card Number">
              </div>
              <div class="col-xs-8">
                <input type="text" class="form-control input-mask" data-mask="99/99" placeholder="Expiration date">
              </div>
              <div class="col-xs-4">
                <input type="password" class="form-control input-mask" data-mask="999" placeholder="CVV">
              </div>
            </div>
          </div>
        </div>
      </form>
      
      <!-- END OF [payment step] -->
      
    </div>
    <div class="tab-pane" id="tab05">
      <!-- [receipt step] -->
      <form class="tab-pane-receipt">
        <div class="row">
          <div class="pane-icon pane-big-icon col-sm-3 text-right">
            <i class="fa fa-envelope-o"></i>
          </div>
          
          <div class="form-group-lg col-sm-9">
            <label for="inputEmail">Enter your email address, so we can send you receipt.<br><small>Leave the field blank to skip.</small></label>
            <input type="email" class="form-control" id="inputEmail">
          </div>
        </div>
      </form>
      <!-- END OF [receipt step] -->
      
    </div>
    <div class="tab-pane" id="tab06">
      <!-- [done step] -->
      <div class="tab-pane-done margin-medium">
        <i class="fa fa-check-circle-o m-b-md"></i>
        <h3>Thank you for your purchase!</h3>
      </div>
      <!-- END OF [done step] -->
      
    </div>
    <ul class="pager wizard">
      <li class="previous"><a class="button button-theme" href="#">Previous</a></li>
      <li class="next"><a class="button button-theme" href="#">Next</a></li>
    </ul>
  </div>  
</div>

<div class="rootwizard">
  <ul>
    <li>
      <a href="#tab21" data-toggle="tab">1</a>
      <span>Download</span>
    </li>
    <li>
      <a href="#tab22" data-toggle="tab">2</a>
      <span>Done</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab21">
        <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab22">
        <!-- 2 -->
    </div>
  </div>  
</div>

<div class="rootwizard rootwizard-short">
  <ul>
    <li>
      <a href="#tab21s" data-toggle="tab">1</a>
      <span>Info</span>
    </li>
    <li>
      <a href="#tab22s" data-toggle="tab">2</a>
      <span>Download</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab21s">
        <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab22s">
        <!-- 2 -->
    </div>
  </div>  
</div>

<div class="rootwizard">
  <ul>
    <li>
      <a href="#tab32" data-toggle="tab">2</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab33" data-toggle="tab">3</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab31" data-toggle="tab">1</a>
      <span>Done</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab31">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab32">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab33">
      <!-- 3 -->
    </div>
  </div>  
</div>

<div class="rootwizard rootwizard-short">
  <ul>
    <li>
      <a href="#tab31s" data-toggle="tab">1</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab32s" data-toggle="tab">2</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab33s" data-toggle="tab">3</a>
      <span>Done</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab31s">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab32s">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab33s">
      <!-- 3 -->
    </div>
  </div>  
</div>

<div class="rootwizard">
  <ul>
    <li>
      <a href="#tab41" data-toggle="tab">1</a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab42" data-toggle="tab">2</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab43" data-toggle="tab">3</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab44" data-toggle="tab">4</a>
      <span>Done</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab41">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab42">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab43">
      <!-- 3 -->
    </div>
    <div class="tab-pane" id="tab44">
      <!-- 4 -->
    </div>
  </div>  
</div>

<div class="rootwizard rootwizard-short">
  <ul>
    <li>
      <a href="#tab41s" data-toggle="tab">1</a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab42s" data-toggle="tab">2</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab43s" data-toggle="tab">3</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab44s" data-toggle="tab">4</a>
      <span>Done</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab41s">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab42s">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab43s">
      <!-- 3 -->
    </div>
    <div class="tab-pane" id="tab44s">
      <!-- 4 -->
    </div>
  </div>  
</div>

<div class="rootwizard">
  <ul>
    <li>
      <a href="#tab51" data-toggle="tab">1</a>
      <span>Info</span>
    </li>
    <li>
      <a href="#tab52" data-toggle="tab">2</a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab53" data-toggle="tab">3</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab54" data-toggle="tab">4</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab55" data-toggle="tab">5</a>
      <span>Done</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab51">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab52">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab53">
      <!-- 3 -->
    </div>
    <div class="tab-pane" id="tab54">
      <!-- 4 -->
    </div>
    <div class="tab-pane" id="tab55">
      <!-- 5 -->
    </div>
  </div>  
</div>

<div class="rootwizard rootwizard-short">
  <ul>
    <li>
      <a href="#tab51s" data-toggle="tab">1</a>
      <span>Info</span>
    </li>
    <li>
      <a href="#tab52s" data-toggle="tab">2</a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab53s" data-toggle="tab">3</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab54s" data-toggle="tab">4</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab55s" data-toggle="tab">5</a>
      <span>Done</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab51s">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab52s">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab53s">
      <!-- 3 -->
    </div>
    <div class="tab-pane" id="tab54s">
      <!-- 4 -->
    </div>
    <div class="tab-pane" id="tab55s">
      <!-- 5 -->
    </div>
  </div>  
</div>

<div class="rootwizard">
  <ul>
    <li>
      <a href="#tab61" data-toggle="tab">1</a>
      <span>Info</span>
    </li>
    <li>
      <a href="#tab62" data-toggle="tab">2</a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab63" data-toggle="tab">3</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab64" data-toggle="tab">4</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab65" data-toggle="tab">5</a>
      <span>Receipt</span>
    </li>
    <li>
      <a href="#tab66" data-toggle="tab">6</a>
      <span>Download</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab61">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab62">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab63">
      <!-- 3 -->
    </div>
    <div class="tab-pane" id="tab64">
      <!-- 4 -->
    </div>
    <div class="tab-pane" id="tab65">
      <!-- 5 -->
    </div>
    <div class="tab-pane" id="tab66">
      <!-- 6 -->
    </div>
  </div>  
</div>

<div class="rootwizard rootwizard-short">
  <ul>
    <li>
      <a href="#tab61s" data-toggle="tab">1</a>
      <span>Info</span>
    </li>
    <li>
      <a href="#tab62s" data-toggle="tab">2</a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab63s" data-toggle="tab">3</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab64s" data-toggle="tab">4</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab65s" data-toggle="tab">5</a>
      <span>Receipt</span>
    </li>
    <li>
      <a href="#tab66s" data-toggle="tab">6</a>
      <span>Download</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab61s">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab62s">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab63s">
      <!-- 3 -->
    </div>
    <div class="tab-pane" id="tab64s">
      <!-- 4 -->
    </div>
    <div class="tab-pane" id="tab65s">
      <!-- 5 -->
    </div>
    <div class="tab-pane" id="tab66s">
      <!-- 6 -->
    </div>
  </div>  
</div>

<div class="rootwizard">
  <ul>
    <li>
      <a href="#tab71" data-toggle="tab">1</a>
      <span>Info</span>
    </li>
    <li>
      <a href="#tab72" data-toggle="tab">2</a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab73" data-toggle="tab">3</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab74" data-toggle="tab">4</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab75" data-toggle="tab">5</a>
      <span>Receipt</span>
    </li>
    <li>
      <a href="#tab76" data-toggle="tab">6</a>
      <span>Done</span>
    </li>
    <li>
      <a href="#tab77" data-toggle="tab">7</a>
      <span>Download</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab71">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab72">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab73">
      <!-- 3 -->
    </div>
    <div class="tab-pane" id="tab74">
      <!-- 4 -->
    </div>
    <div class="tab-pane" id="tab75">
      <!-- 5 -->
    </div>
    <div class="tab-pane" id="tab76">
      <!-- 6 -->
    </div>
    <div class="tab-pane" id="tab77">
      <!-- 7 -->
    </div>
  </div>  
</div>

<div class="rootwizard">
  <ul>
    <li>
      <a href="#tab61c" data-toggle="tab"><i class="fa fa-info-circle"></i></a>
      <span>Info</span>
    </li>
    <li>
      <a href="#tab62c" data-toggle="tab"><i class="fa fa-shopping-basket"></i></a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab63c" data-toggle="tab"><i class="fa fa-home"></i></a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab64c" data-toggle="tab"><i class="fa fa-credit-card"></i></a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab65c" data-toggle="tab"><i class="fa fa-at"></i></a>
      <span>Receipt</span>
    </li>
    <li>
      <a href="#tab66c" data-toggle="tab"><i class="fa fa-check"></i></a>
      <span>Done</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab61c">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab62c">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab63c">
      <!-- 3 -->
    </div>
    <div class="tab-pane" id="tab64c">
      <!-- 4 -->
    </div>
    <div class="tab-pane" id="tab65c">
      <!-- 5 -->
    </div>
    <div class="tab-pane" id="tab66c">
      <!-- 6 -->
    </div>
  </div>  
</div>

<div class="rootwizard rootwizard-short rootwizard-rounded">
  <ul>
    <li>
      <a href="#tab51r" data-toggle="tab">1</a>
      <span>Info</span>
    </li>
    <li>
      <a href="#tab52r" data-toggle="tab">2</a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab53r" data-toggle="tab">3</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab54r" data-toggle="tab">4</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab55r" data-toggle="tab">5</a>
      <span>Done</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab51r">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab52r">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab53r">
      <!-- 3 -->
    </div>
    <div class="tab-pane" id="tab54r">
      <!-- 4 -->
    </div>
    <div class="tab-pane" id="tab55r">
      <!-- 5 -->
    </div>
  </div>  
</div>

<div class="rootwizard rootwizard-no-fade">
  <ul>
    <li>
      <a href="#tab51nf" data-toggle="tab">1</a>
      <span>Info</span>
    </li>
    <li>
      <a href="#tab52nf" data-toggle="tab">2</a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab53nf" data-toggle="tab">3</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab54nf" data-toggle="tab">4</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab55nf" data-toggle="tab">5</a>
      <span>Done</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab51nf">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab52nf">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab53nf">
      <!-- 3 -->
    </div>
    <div class="tab-pane" id="tab54nf">
      <!-- 4 -->
    </div>
    <div class="tab-pane" id="tab55nf">
      <!-- 5 -->
    </div>
  </div>  
</div>

<div class="rootwizard rootwizard-only-pager">
  <ul>
    <li>
      <a href="#tab61op" data-toggle="tab">1</a>
      <span>Info</span>
    </li>
    <li>
      <a href="#tab62op" data-toggle="tab">2</a>
      <span>Cart</span>
    </li>
    <li>
      <a href="#tab63op" data-toggle="tab">3</a>
      <span>Shipping</span>
    </li>
    <li>
      <a href="#tab64op" data-toggle="tab">4</a>
      <span>Payment</span>
    </li>
    <li>
      <a href="#tab65op" data-toggle="tab">5</a>
      <span>Receipt</span>
    </li>
    <li>
      <a href="#tab66op" data-toggle="tab">6</a>
      <span>Download</span>
    </li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane" id="tab61op">
      <!-- 1 -->
    </div>
    <div class="tab-pane" id="tab62op">
      <!-- 2 -->
    </div>
    <div class="tab-pane" id="tab63op">
      <!-- 3 -->
    </div>
    <div class="tab-pane" id="tab64op">
      <!-- 4 -->
    </div>
    <div class="tab-pane" id="tab65op">
      <!-- 5 -->
    </div>
    <div class="tab-pane" id="tab66op">
      <!-- 6 -->
    </div>
    <ul class="pager wizard">
      <li class="previous"><a class="button button-theme" href="#">Previous</a></li>
      <li class="next"><a class="button button-theme" href="#">Next</a></li>
    </ul>
  </div>  
</div>