Order Summary Tile

Order Summary
(All Prices are shown in USD)

Monthly Payment: 2,479.80
Annual Payment: 0.00
One time payment: 1,000.00
Subtotal
(109 items)
3,479.80
Your Total Savings25.60
        
<div class="right-section flyout-top">
  <div class="proceed-checkout">
     <h2 class="place-order-heading">Order Summary <div class="currency-block">
        <span class="currency-info">(All Prices are shown in <strong>USD</strong>)</span>
     </div></h2>
     <table>
        <tbody>
           <tr>
              <td>Monthly Payment:</td>
              <td class="text-right"> 2,479.80</td>
           </tr>
           <tr>
              <td>Annual Payment:</td>
              <td class="text-right">0.00</td>
           </tr>
           <tr>
              <td>One time payment:</td>
              <td class="text-right">1,000.00</td>
           </tr>
           <tr>
              <td><div class="subTotal  mb-3"><span class="subItems">Subtotal</span><br><span class="subtotal-count"> (109 items)</span></div></td>
              <td class="text-right"><span class="totalPrice">3,479.80</span></td>
           </tr>
        </tbody>
     </table>
     <div class="total-saving">
        <span>Your Total Savings</span><span class="ml-auto">25.60</span>
     </div>
     <div class="checkout-btn my-cart">
        <input type="button" class="btn btn-primary proceed" value="Proceed to Checkout">
     </div>
     <div class="checkout-btn order-summary" style="display: none;">
        <input type="button" class="btn btn-primary" value="Proceed to Provisioning">
     </div>
  </div>
  <div class="addOns-col" style="display: none;">
     <h3 class="addOns-heading">Suggestions</h3>
     <div class="scroll-div" tabindex="3" style="overflow-y: hidden; outline: none;">
        <div class="addOns-box">
           <img src="images/ave-point.png">
           <span class="addons-content mr-auto">Cloud Management for <span>Microsoft 365</span></span>
           <i class="icon-b-right-arrow"></i>
        </div>
        <div class="addOns-box">
           <img src="images/addons-pic.png">
           <span class="addons-content mr-auto">Edgewater Fullscope<span>CRM Quick Start Bundle</span></span>
           <i class="icon-b-right-arrow"></i>
        </div>
        <div class="addOns-box">
           <img src="images/ave-point.png">
           <span class="addons-content mr-auto">Cloud Backup for <span>Microsoft 365</span></span>
           <i class="icon-b-right-arrow"></i>
        </div>
     </div>
  </div>
</div>