<div class="col-md-12" style="padding:20px;">
  <div class="col-md-12" style="padding:0px;">
    <div class="panel panel-default">

    
      <div class="panel-heading"> <i class="fa fa-spoon"></i><i class="fa fa-circle-o"></i> Dine In 
        <div class="panel-tools pull-right"> 
          <!--<a class="btn btn-xs btn-link panel-collapse collapses" href="#">
                                  </a>
                                  <a class="btn btn-xs btn-link panel-config" href="#panel-config" data-toggle="modal">
                                      <i class="fa fa-wrench"></i>
                                  </a>--> 
          
          <a class="btn btn-xs btn-link panel-refresh" href="#"> <i class="fas fa-sync-alt" id="dine_in-panel-refresh"> Refresh</i> </a> 
          <!--<a class="btn btn-xs btn-link panel-close" href="#">
                                      <i class="fa fa-times"></i>
                                  </a>--> 
        </div>
      </div>
      <div class="panel-body">
        <table id="dine_in_table" class="table table-bordered table-condensed table-hover table-striped dataTable" style="width:100%">
          <thead>
            <tr>
              <th class="col-xs-1">ID#</th>
              <th class="col-xs-1">Time</th>
              <!--<th>Invoice No</th>-->
              <th class="col-xs-2">Customer</th>
              <th class="col-xs-3">Sale Items</th>
              <th class="col-xs-1">Grand Total</th>
              <!--<th>Return</th>-->
              <!--<th>Balance</th>-->
              <th class="col-xs-1">Payment Status</th>
              <th class="col-xs-2">Paying By</th>
              <th class="col-xs-1">Actions</th>
            </tr>
          </thead>
          <tfoot>
            <tr>
              <th>ID#</th>
              <th>Time</th>
              <!--<th>Invoice No</th>-->
              <th>Customer</th>
              <th>Sale Items</th>
              <th>Grand Total</th>
              <!--<th>&nbsp;</th>-->
              <!--<th>Balance</th>-->
              <th>Payment Status</th>
              <th>Paying By</th>
              <th>Actions</th>
            </tr>
          </tfoot>
        </table>
      </div>
      
    </div>
  </div>
</div>
