diff --git a/resources/views/includes/bayaran/pembayaransag.blade.php b/resources/views/includes/bayaran/pembayaransag.blade.php
index fad4c55..03e088d 100644
--- a/resources/views/includes/bayaran/pembayaransag.blade.php
+++ b/resources/views/includes/bayaran/pembayaransag.blade.php
@@ -2,29 +2,42 @@
 
 @section('content')
 
+<style>
+    .not-allowed {
+        cursor: not-allowed;
+    }
+</style>
+
 <title>Bayar SAG | Customer Portal</title>
 <div class="container">
 
     <form method="post" action="{{ route('payment.engine') }}">
         @csrf
         <div class="row">
-            <nav aria-label="breadcrumb">
-                <ol class="breadcrumb">
-                    <li class="breadcrumb-item text-dark opacity-5"><a href="portalhome">Home</a></li>
-                    <li class="breadcrumb-item text-dark opacity-5"><a href="senaraibayaransag">Pembayaran</a></li>
+            <!-- <nav aria-label="breadcrumb">
+                <ol class="breadcrumb not-allowed">
+                    <li class="breadcrumb-item text-dark opacity-5 no-allowed"><a href="#">Home</a></li>
+                    <li class="breadcrumb-item text-dark opacity-5"><a href="#">Pembayaran</a></li>
                     <li class="breadcrumb-item text-dark active" aria-current="page">Bayar SAG Pilihan</li>
                 </ol>
-            </nav>
+            </nav> -->
+            <div class="row">
+                <div class="d-flex">
+                    <p class="not-allowed text-sm">Home /Pembayaran /</p>
+                    <p class="text-sm text-dark">Bayar SAG Pilihan</p>
+                </div>
+            </div>
+
         </div>
 
         <div class="row justify-content-center">
             <div class="col-xl-12 mb-5">
                 <div class="card shadow">
-                    <div class="card-header border-0">
+                    <div class="card-header mb-4 bg-primary border-0">
                         <div class="row align-items-center">
                             <div class="d-flex">
-                                <h4 class="text-primary" style="margin-right: 1%;">Senarai Surat Gadaian</h4>
-                                <i class="fas fa-clipboard-list fa-2x text-primary"></i>
+                                <h4 class="text-white" style="margin-right: 1%;">Senarai Surat Gadaian</h4>
+                                <i class="fas fa-clipboard-list fa-2x text-white"></i>
                             </div>
 
                         </div>
@@ -189,18 +202,17 @@
             </div>
             <div class="col-md-6 col-sm-12">
                 <div class="card shadow">
-                    <div class="card-header border-0">
+                    <div class="card-header bg-primary border-0">
                         <div class="row align-items-center">
                             <div class="d-flex">
-                                <h4 class="text-primary" style="margin-right: 1%;">Ringkasan Pembayaran</h4>
-                                <i class="fas fa-shopping-cart fa-2x text-primary"></i>
+                                <h4 class="text-white" style="margin-right: 1%;">Ringkasan Pembayaran</h4>
+                                <i class="fas fa-shopping-cart fa-2x text-white"></i>
                             </div>
                         </div>
                     </div>
 
                     <div class="form" style="text-align: center;">
-                        <hr>
-                        <div class="row mb-4 font-weight-light">
+                        <div class="row mt-4 mb-4 font-weight-light">
                             <div class="col-7">
                                 <label class="text-dark ml-4 ">Bayaran Ar-Rahn</label>
                             </div>
@@ -237,11 +249,11 @@
 
                         <div class="row pb-4 font-weight-light">
                             <div class="col-7">
-                                <label class="text-dark ml-4">Jumlah Keseluruhan</label>
+                                <label class="text-dark ml-4"><strong>Jumlah Keseluruhan</strong></label>
                             </div>
 
                             <div class="col-5 text-right pr-5">
-                                <span>RM <span id="spanjumlah">0.00</span></span>
+                                <span><strong>RM <span id="spanjumlah">0.00</span></strong></span>
                             </div>
                         </div>
                     </div>
@@ -249,7 +261,8 @@
                 </div>
 
 
-                <div class="d-flex justify-content-end col-12 mt-3 align-self-end">
+                <div class="d-flex justify-content-between col-12 mt-3 align-self-end">
+                    <button type="button" class="btn btn-danger">Batal</button>
                     <button type="submit" id="bayarsbmt" class="btn btn-primary" disabled onclick="loadingbtn();">Bayar</button>
                 </div>
             </div>
diff --git a/resources/views/includes/bayaran/senaraibayaransag.blade.php b/resources/views/includes/bayaran/senaraibayaransag.blade.php
index 7e37c83..608e00e 100644
--- a/resources/views/includes/bayaran/senaraibayaransag.blade.php
+++ b/resources/views/includes/bayaran/senaraibayaransag.blade.php
@@ -1,4 +1,4 @@
-@extends('layouts.indexfifth')
+@extends('layouts.indexthird')
 
 @section('content')
 @include('modal.marhun')
diff --git a/resources/views/includes/rekod/rekodsag.blade.php b/resources/views/includes/rekod/rekodsag.blade.php
index 6e57101..873e768 100644
--- a/resources/views/includes/rekod/rekodsag.blade.php
+++ b/resources/views/includes/rekod/rekodsag.blade.php
@@ -32,7 +32,7 @@
     </div>
     <!-- Light table -->
     <div class="table-responsive table-bordered">
-        <table class="table align-items-center table-flush" id="belum_tawarruq">
+        <table class="table align-items-center table-flush table-hover" id="belum_tawarruq">
             <thead class="thead-light">
                 <tr>
                     <th scope="col" class="sort" data-sort="name">No Rujukan</th>
@@ -88,7 +88,7 @@
     </div>
     <!-- Light table -->
     <div class="table-responsive table-bordered">
-        <table class="table align-items-center table-flush" id="selepas_tawarruq">
+        <table class="table align-items-center table-flush table-hover" id="selepas_tawarruq">
             <thead class="thead-light">
                 <tr>
                     <th scope="col" class="sort" data-sort="name">No Rujukan</th>
@@ -148,7 +148,7 @@
     </div>
     <!-- Light table -->
     <div class="table-responsive table-bordered">
-        <table class="table align-items-center table-flush" id="saghistory">
+        <table class="table align-items-center table-flush table-hover" id="saghistory">
             <thead class="thead-light">
                 <tr>
                     <th scope="col" class="sort" data-sort="name">No Rujukan</th>
diff --git a/resources/views/layouts/indexfifth.blade.php b/resources/views/layouts/indexfifth.blade.php
index 05a362c..2219fab 100644
--- a/resources/views/layouts/indexfifth.blade.php
+++ b/resources/views/layouts/indexfifth.blade.php
@@ -6,12 +6,41 @@
 </head>
 
 <body class="about-us bg-gray-200">
-    @include('includes.main.navigation')
-    <section class="py-7">
+    <section class="py-3">
         <div class="container-fluid">
             @yield('content')
     </section>
-    @include('includes.main.footerwhite')
 </body>
 
-</html>
\ No newline at end of file
+</html>
+
+<!--   Core JS Files   -->
+<script src="{{ asset('assets/js/material-kit/core/popper.min.js') }}" type="text/javascript"></script>
+<script src="{{ asset('assets/js/material-kit/core/bootstrap.min.js') }}" type="text/javascript"></script>
+<script src="{{ asset('assets/js/material-kit/plugins/perfect-scrollbar.min.js') }}"></script>
+<script src="{{ asset('assets/js/material-kit/plugins/choices.min.js') }}"></script>
+
+<!--  Plugin for TypedJS, full documentation here: https://github.com/inorganik/CountUp.js -->
+<script src="{{ asset('assets/js/material-kit/plugins/countup.min.js') }}"></script>
+
+<!--  Plugin for Parallax, full documentation here: https://github.com/wagerfield/parallax  -->
+<script src="{{ asset('assets/js/material-kit/plugins/parallax.min.js') }}"></script>
+
+<!-- Control Center for Material UI Kit: parallax effects, scripts for the example pages etc -->
+<!--  Google Maps Plugin    -->
+<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDTTfWur0PDbZWPr7Pmq8K3jiDp0_xUziI"></script>
+<script src="{{ asset('assets/js/material-kit/material-kit.min.js?v=3.0.0') }}" type="text/javascript"></script>
+
+<script>
+
+</script>
+<script>
+    if (document.getElementsByClassName('page-header')) {
+        window.onscroll = debounce(function() {
+            var scrollPosition = window.pageYOffset;
+            var bgParallax = document.querySelector('.page-header');
+            var oVal = (window.scrollY / 3);
+            // bgParallax.style.transform = 'translate3d(0,' + oVal + 'px,0)';
+        }, 6);
+    }
+</script>
\ No newline at end of file
diff --git a/resources/views/layouts/indexfirst.blade.php b/resources/views/layouts/indexfirst.blade.php
index f31fa60..15ccfc7 100644
--- a/resources/views/layouts/indexfirst.blade.php
+++ b/resources/views/layouts/indexfirst.blade.php
@@ -1,3 +1,4 @@
+<!-- Home template ui -->
 <!DOCTYPE html>
 <html lang="en" itemscope itemtype="http://schema.org/WebPage">
 
diff --git a/resources/views/layouts/indexforth.blade.php b/resources/views/layouts/indexforth.blade.php
index fdaeb4b..5249e3d 100644
--- a/resources/views/layouts/indexforth.blade.php
+++ b/resources/views/layouts/indexforth.blade.php
@@ -1,3 +1,4 @@
+<!-- Analisa template ui -->
 <!DOCTYPE html>
 <html lang="en" itemscope itemtype="http://schema.org/WebPage">
 
diff --git a/resources/views/layouts/indexsecond.blade.php b/resources/views/layouts/indexsecond.blade.php
index e0e6b76..b45a80a 100644
--- a/resources/views/layouts/indexsecond.blade.php
+++ b/resources/views/layouts/indexsecond.blade.php
@@ -1,3 +1,4 @@
+<!-- Rekod pembelian ui -->
 <!DOCTYPE html>
 <html lang="en" itemscope itemtype="http://schema.org/WebPage">
 
diff --git a/resources/views/layouts/indexthird.blade.php b/resources/views/layouts/indexthird.blade.php
index be24a39..05a362c 100644
--- a/resources/views/layouts/indexthird.blade.php
+++ b/resources/views/layouts/indexthird.blade.php
@@ -11,7 +11,7 @@
         <div class="container-fluid">
             @yield('content')
     </section>
-    @include('includes.main.footerdark')
+    @include('includes.main.footerwhite')
 </body>
 
 </html>
\ No newline at end of file