diff --git a/public/js/miscellaneous/cart.js b/public/js/miscellaneous/cart.js
new file mode 100644
index 0000000..3d0a293
--- /dev/null
+++ b/public/js/miscellaneous/cart.js
@@ -0,0 +1,22 @@
+const test = () =>{
+    let btn_payment = document.getElementById('bayarsbmt');
+   
+    console.log(btn_payment,rad_payment);
+}
+
+let checked_rad = () =>{
+    let rad_payment = document.getElementById('radpembayaran');
+
+    if(rad_payment.checked){
+        console.log('checked');
+        btn_payment.disabled = false;
+    }else{
+        console.log('not-checked');
+        btn_payment.disabled = true;
+    }
+}
+
+document.addEventListener('DOMContentLoaded', function () {
+    console.log('Document is fully loaded and parsed.');
+    // Perform your actions here
+});
\ No newline at end of file
diff --git a/resources/views/includes/bayaran/pembayaransag.blade.php b/resources/views/includes/bayaran/pembayaransag.blade.php
index 8da0f6b..33f452a 100644
--- a/resources/views/includes/bayaran/pembayaransag.blade.php
+++ b/resources/views/includes/bayaran/pembayaransag.blade.php
@@ -13,7 +13,7 @@
 </style>
 
 <title>Bayar SAG | Portal Pelanggan</title>
-<div class="container">
+<div>
 
     <form name="formpayment" method="post" action="{{ route('payment.engine') }}">
         @csrf
@@ -28,16 +28,15 @@
         </div>
 
         <div class="d-flex">
-        <div class="col">
-            <div class="col-md-8 col-sm-12 mb-4">
+        <div class="col-9">
+            <div class="col-md-11 col-sm-12 mb-4">
                 <div class="card shadow">
                     <div class="card-header mb-4 bg-dark border-0">
                         <div class="row align-items-center">
                             <div class="d-flex">
-                                <h4 class="text-white" style="margin-right: 1%;">Pembayaran PKB</h4>
-                                <i class="fas fa-clipboard-list fa-2x text-white"></i>
+                                <h4 class="text-white" style="margin-right: 1%;">PKB</h4>
+                                <input type="radio" id="radpembayaran" name="radpembayaran" class="ms-auto" style="width: 20px; height: 20px;" />
                             </div>
-
                         </div>
                     </div>
                     <div class="form">
@@ -128,13 +127,13 @@
                 </div>
             </div>
 
-            <div class="col-md-8 col-sm-12">
+            <div class="col-md-11 col-sm-12">
                 <div class="card shadow">
                     <div class="card-header mb-4 bg-dark border-0">
                         <div class="row align-items-center">
                             <div class="d-flex">
-                                <h4 class="text-white" style="margin-right: 1%;">Pembayaran KOPKB</h4>
-                                <i class="fas fa-clipboard-list fa-2x text-white"></i>
+                                <h4 class="text-white" style="margin-right: 1%;">KOPKB</h4>
+                                <input type="radio" id="radpembayaran" name="radpembayaran" class="ms-auto" style="width: 20px; height: 20px;" />
                             </div>
 
                         </div>
@@ -204,66 +203,67 @@
                         </div>
 
                     </div>
-                    <div class="row pb-4 font-weight-light">
-                        <div class="col-6">
-                            <label style="text-transform: uppercase; text-align: center;"><strong>Fi Pengurusan</strong></label>
-                        </div>
-
-                        <div class="col-6">
-                            <span class="text-primary"><strong>RM<span>1.00</span></strong></span>
-                        </div>
-                    </div>
-                    <div class="row pb-4 font-weight-light">
-                        <div class="col-6">
-                            <label style="text-transform: uppercase; text-align: center;"><strong>Jumlah Keseluruhan</strong></label>
-                        </div>
-
-                        <div class="col-6">
-                            <span class="text-primary"><strong>RM<span id="spanjumlah">{{ number_format($totalupahasal,2) }}</span></strong></span>
-                        </div>
-                    </div>
 
                     <span class="text-danger d-none" id="spanamarankosong">*Jangan biarkan kotak bayaran ditinggalkan kosong, Sila masukkan amaun!</span>
                 </div>
             </div>
 
-
-
-            <div class="col-md-10 col-sm-12">
-                <div class="card shadow">
-                    <div class="form" style="text-align: center;">
-                    </div>
-                </div>
-
-                <!-- <div class="d-flex justify-content-between col-12 mt-3 align-self-end"> -->
-                <div class="d-flex justify-content-center col-12 mt-3 align-self-end">
-                    <a href="{{ route('home') }}" type="button" class="btn btn-danger">Batal</a>&nbsp;
-                    <!-- <button type="submit" id="bayarsbmt" class="btn btn-primary" disabled onclick="loadingbtn();">Bayar</button> -->
-                    @if($totalupahasal == 1.00 || $errorcount > 0)
-                    <button type="submit" id="bayarsbmt" class="btn btn-primary" disabled onclick="loadingbtn();">Bayar</button>
-                    @else
-                    <button type="submit" id="bayarsbmt" class="btn btn-primary" onclick="loadingbtn();">Bayar</button>
-                    @endif
-                </div>
-            </div>
         </div>
-        <div class="row">
-            <div class="col-md-4">
+        <div class="col-3">
+            <div class="col-md-12">
                 <div class="card shadow">
                     <div class="card-header mb-4 bg-dark border-0">
                         <div class="row align-items-center">
                             <div class="d-flex">
-                                <h4 class="text-white" style="margin-right: 1%;">Pembayaran KOPKB</h4>
-                                <i class="fas fa-clipboard-list fa-2x text-white"></i>
+                                <h4 class="text-white" style="margin-right: 1%;">Pembayaran</h4>
+                                <i class="ms-auto fas fa-shopping-cart fa-2x text-white"></i>
                             </div>
                         </div>
                     </div>
+                    <div class="card-body">
+                        <div class="row pb-4 font-weight-light">
+                            <div class="col-6">
+                                <label style="text-transform: uppercase; text-align: center;"><strong>Fi Pengurusan</strong></label>
+                            </div>
+    
+                            <div class="col-6">
+                                <span class="text-primary"><strong>RM<span>1.00</span></strong></span>
+                            </div>
+                        </div>
+                        <div class="row pb-4 font-weight-light">
+                            <div class="col-6">
+                                <label style="text-transform: uppercase; text-align: center;"><strong>Jumlah Keseluruhan</strong></label>
+                            </div>
+    
+                            <div class="col-6">
+                                <span class="text-primary"><strong>RM<span id="spanjumlah">{{ number_format($totalupahasal,2) }}</span></strong></span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="col-md-12 col-sm-12">
+                    <div class="card shadow">
+                        <div class="form" style="text-align: center;">
+                        </div>
+                    </div>
+    
+                    <!-- <div class="d-flex justify-content-between col-12 mt-3 align-self-end"> -->
+                    <div class="d-flex justify-content-center col-12 mt-3 align-self-end">
+                        <a href="{{ route('home') }}" type="button" class="btn btn-danger">Batal</a>&nbsp;
+                        <!-- <button type="submit" id="bayarsbmt" class="btn btn-primary" disabled onclick="loadingbtn();">Bayar</button> -->
+                        @if($totalupahasal == 1.00 || $errorcount > 0)
+                        <button type="submit" id="bayarsbmt" class="btn btn-primary" disabled onclick="loadingbtn();">Bayar</button>
+                        @else
+                        <button type="submit" id="bayarsbmt" class="btn btn-primary" onclick="loadingbtn();">Bayar</button>
+                        @endif
+                    </div>
                 </div>
             </div>
         </div>
     </form>
 </div>
-
+<script src="{{ asset('js/miscellaneous/cart.js') }}"></script>
 <script>
     $(document).ready(function() {
         $(window).keydown(function(event) {
diff --git a/resources/views/includes/main/head.blade.php b/resources/views/includes/main/head.blade.php
index 051457c..4bace97 100644
--- a/resources/views/includes/main/head.blade.php
+++ b/resources/views/includes/main/head.blade.php
@@ -12,7 +12,10 @@
 <link href="{{ asset('css/nucleo-icons.css') }}" rel="stylesheet">
 <link href="{{ asset('css/nucleo-svg.css') }}" rel="stylesheet">
 
-<script src="https://kit.fontawesome.com/42d5adcbca.js" crossorigin="anonymous"></script>
+{{-- <script src="https://kit.fontawesome.com/42d5adcbca.js" crossorigin="anonymous"></script> --}}
+
+<link href="{{ asset('css/nucleo-svg.css') }}" rel="stylesheet">
+<link href="{{ asset('argon') }}/vendor/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet">
 
 <link href="{{ asset('argon/css/dataTables.bootstrap4.min.css') }}" rel="stylesheet">
 <script src="{{ asset('argon') }}/vendor/bootstrap/dist/js/bootstrap.bundle.min.js"></script>