diff --git a/app/assets/stylesheets/origami.scss b/app/assets/stylesheets/origami.scss
index 07c7428f..c417613a 100755
--- a/app/assets/stylesheets/origami.scss
+++ b/app/assets/stylesheets/origami.scss
@@ -198,6 +198,18 @@ select.form-control {
 	background-color: blue !important;
 }
 
+.selected-payment {
+  color: #fff !important;
+  background-color: blue !important;
+}
+.payment_btn {
+  white-space: normal !important;
+  margin-bottom: 15px;
+  margin-right: 15px;
+  color:#fff !important;
+ # background-color: green !important;
+} 
+
 /* Reciept Style */
 #order-charges-table td {
 	border-top: none !important;
diff --git a/app/views/origami/home/show.html.erb b/app/views/origami/home/show.html.erb
index 83816151..4922c1df 100755
--- a/app/views/origami/home/show.html.erb
+++ b/app/views/origami/home/show.html.erb
@@ -528,12 +528,12 @@
                   <div class="modal-body">
                    <!--  <select class="form-control show-tick payment_method" multiple="true"  id="payment_method" > -->
                              <!-- <option value="Cash">Cash</option> -->
-                       <button class='btn btn- waves-effect payment_btn ' data-type='Credit' data-value='Credit'>Credit</button>
+                       <button class='btn waves-effect payment_btn green' data-type='Credit' data-value='Credit'>Credit</button>
                       <% @payment_methods.each do |pay| %>
                     <!-- <option value="<%= pay.payment_method %>">
                         <%= pay.payment_method %>
                       </option> -->
-                      <button class='btn btn- waves-effect payment_btn ' data-type='<%= pay.payment_method %>' data-value='<%= pay.payment_method %>'><%= pay.payment_method %></button>
+                      <button class='btn btn-lg waves-effect payment_btn green' data-type='<%= pay.payment_method %>' data-value='<%= pay.payment_method %>'><%= pay.payment_method %></button>
                     <%end %>
                             
                    <!--  </select>   --> 
@@ -743,25 +743,20 @@
     type       = $(this).data('type');
     group      = $(this).data('group');
     payments    = $(".payment_btn");
-    $(payments).each(function(i){
-      if ($(payments[i]).attr('data-type')==type){
-        $('.'+type).removeClass("selected-payment");
-      }
-    });
-    if (active) {
+
+    if (active) {      
       $(this).removeClass('selected-payment');
-    }else{
+    }else{      
       $(this).addClass('selected-payment');
     }
-    
   }); //End selecct attribute buttom
 
     $(".choose_payment").on('click', function () {
       $( "#loading_wrapper").show();
 
         var sale_id = $('#sale_id').val();
-          type = $('.payment_method').val();
-          console.log(type)
+          // type = $('.payment_method').val();
+          type    = get_selected_attributes('selected-payment');
           if(parseInt(jQuery.inArray("Credit", type)) == -1){
             if (parseInt(jQuery.inArray("MPU", type)) != -1 || parseInt(jQuery.inArray("VISA", type)) != -1 || parseInt(jQuery.inArray("JCB", type)) != -1 || parseInt(jQuery.inArray("Master", type)) != -1 || parseInt(jQuery.inArray("UNIONPAY", type)) != -1 || parseInt(jQuery.inArray("Redeem", type)) != -1) {
                calculate_member_discount(sale_id,"Card");
@@ -771,21 +766,21 @@
             }         
           }
           var ajax_url = "/origami/sale/" + sale_id + "/first_bill";
-          // $.ajax({
-          //     type: "GET",
-          //     url: ajax_url,
-          //     success: function (result) {
-          //         $( "#loading_wrapper" ).hide();
-          //         receipt_no = ($("#receipt_no").html()).trim();
-          //         if((receipt_no!=undefined) && (receipt_no!=""))
-          //           createReceiptNoInFirstBillData(receipt_no,type);
-          //         // For Server Print - from jade
-          //          if ($("#server_mode").val() == "cloud") {
-          //           code2lab.printFile(result.filepath, result.printer_url);
-          //          }
-          //         location.reload();
-          //     }
-          // });  
+          $.ajax({
+              type: "GET",
+              url: ajax_url,
+              success: function (result) {
+                  $( "#loading_wrapper" ).hide();
+                  receipt_no = ($("#receipt_no").html()).trim();
+                  if((receipt_no!=undefined) && (receipt_no!=""))
+                    createReceiptNoInFirstBillData(receipt_no,type);
+                  // For Server Print - from jade
+                   if ($("#server_mode").val() == "cloud") {
+                    code2lab.printFile(result.filepath, result.printer_url);
+                   }
+                  location.reload();
+              }
+          });  
     });
 
     function calculate_member_discount(sale_id,type) {
@@ -1007,4 +1002,16 @@
         window.location.href = '/oqs/'+ assigned_order_item_id  + "/edit/"+dining_id;
       }
     });
+
+     // Get Selected Class
+    function get_selected_attributes(selected_class) {
+      var item_row      = $('.'+selected_class);
+      var attribute_arr = [];
+      $(item_row).each(function(i){
+        value = $(item_row[i]).attr('data-value');
+        str = value;
+        attribute_arr.push(str);
+      });
+      return attribute_arr;
+    }
 </script>
diff --git a/app/views/origami/rooms/show.html.erb b/app/views/origami/rooms/show.html.erb
index 867f6034..a5497ed0 100755
--- a/app/views/origami/rooms/show.html.erb
+++ b/app/views/origami/rooms/show.html.erb
@@ -489,16 +489,13 @@
                             <h4 class="modal-title" id="paymentModalLabel">Choose Payment</h4>
                         </div>
                         <div class="modal-body">
-                           <select class="form-control show-tick payment_method" multiple="true"  id="payment_method" >
-                             <option value="Cash">Cash</option>
-                             <option value="Credit">Credit</option>
+                            <button class='btn waves-effect payment_btn green' data-type='Credit' data-value='Credit'>Credit</button>
                             <% @payment_methods.each do |pay| %>
-                              <option value="<%= pay.payment_method %>">
-                                <%= pay.payment_method %>
-                              </option>
-                            <%end %>
-                            
-                            </select>   
+                          <!-- <option value="<%= pay.payment_method %>">
+                              <%= pay.payment_method %>
+                            </option> -->
+                            <button class='btn btn-lg waves-effect payment_btn green' data-type='<%= pay.payment_method %>' data-value='<%= pay.payment_method %>'><%= pay.payment_method %></button>
+                          <%end %>   
                         </div>
                         <div class="modal-footer  p-r-30">
                             <button type="button" class="btn btn-link btn-danger waves-effect" data-dismiss="modal">CLOSE</button>
@@ -680,6 +677,21 @@ $(document).ready(function(){
 
 });
 
+ // click select option icon for add 
+  $(document).on('click', '.payment_btn', function(event){ 
+    active     = $(this).hasClass('selected-payment');
+    value      = $(this).data('value');
+    type       = $(this).data('type');
+    group      = $(this).data('group');
+    payments    = $(".payment_btn");
+
+    if (active) {
+      $(this).removeClass('selected-payment');
+    }else{
+      $(this).addClass('selected-payment');
+    }
+}); //End selecct attribute buttom
+
 // Print for first bill
 $("#first_bill").on('click', function(){ 
   var sale_id = $('#sale_id').val();
@@ -701,7 +713,9 @@ $(".choose_payment").on('click', function () {
   $( "#loading_wrapper").show();
 
   var sale_id = $('#sale_id').val();
-  type = $('.payment_method').val();
+  type    = get_selected_attributes('selected-payment');
+ 
+  // type = $('.payment_method').val();
   if(parseInt(jQuery.inArray("Credit", type)) == -1){
     if (parseInt(jQuery.inArray("MPU", type)) != -1 || parseInt(jQuery.inArray("VISA", type)) != -1 || parseInt(jQuery.inArray("JCB", type)) != -1 || parseInt(jQuery.inArray("Master", type)) != -1 || parseInt(jQuery.inArray("UNIONPAY", type)) != -1 || parseInt(jQuery.inArray("Redeem", type)) != -1) {
       calculate_member_discount(sale_id,"Card");
@@ -945,4 +959,15 @@ $('#add_invoice').on('click',function(){
         window.location.href = '/oqs/'+ assigned_order_item_id  + "/edit/"+dining_id;
       }
     });
+    // Get Selected Class
+    function get_selected_attributes(selected_class) {
+      var item_row      = $('.'+selected_class);
+      var attribute_arr = [];
+      $(item_row).each(function(i){
+        value = $(item_row[i]).attr('data-value');
+        str = value;
+        attribute_arr.push(str);
+      });
+      return attribute_arr;
+    }
 </script>