diff --git a/app/controllers/API/Complaints.php b/app/controllers/API/Complaints.php
index 27858400..044cef10 100644
--- a/app/controllers/API/Complaints.php
+++ b/app/controllers/API/Complaints.php
@@ -29,4 +29,16 @@ public function resolveComplaint(string $a = ''): void
         $response = new JSONResponse;
         $response->statusCode(200)->success(true)->data(['complaint_id' => $a])->send();
     }
+
+    public function cancelCustomerComplaint(string $a = '', string $b = '', string $c = ''): void
+    {
+
+        $complaint = new RentComplaintModel;
+        $complaint->cancelComplaint($a);
+
+        $response = new JSONResponse;
+        $response->statusCode(200)->data(['complaint_id' => $a])->send();
+    }
+
+   
 }
diff --git a/app/controllers/Complaints.php b/app/controllers/Complaints.php
index a1bb3afc..862f9f57 100644
--- a/app/controllers/Complaints.php
+++ b/app/controllers/Complaints.php
@@ -110,7 +110,7 @@ public function rentComplaints(string $a = '', string $b = '', string $c = ''):v
         $rentcomplaint = new RentComplaintModel;
         $data = ['customer_id' => UserMiddleware::getUser()['id']];
         $data['complaints'] = $rentcomplaint->getComplaintsByCustomer($data);
-        show ($data['complaints']);
+        // show ($data['complaints']);
 
         $this->view('customer/components/customercomplaintlist', $data);
     }
@@ -122,7 +122,7 @@ public function rentComplaint(string $a = '', string $b = '', string $c = ''):vo
 
         $rent = new RentModel;
         $data['rentitems'] = $rent->getItemListbyRentId($data['complaint']->rent_id);
-        show($data);
+        // show($data);
 
         $this->view('customer/components/customercomplaints', $data);
     }
diff --git a/app/controllers/_404.php b/app/controllers/_404.php
index 58500916..24f88077 100755
--- a/app/controllers/_404.php
+++ b/app/controllers/_404.php
@@ -5,7 +5,7 @@ class _404{
     public function index(){
         http_response_code(404);
         
-        echo "Controller not found";
+       $this->view('404');
     }
 }
 
diff --git a/app/models/RentComplaint.php b/app/models/RentComplaint.php
index efd2b2b0..574f10a0 100644
--- a/app/models/RentComplaint.php
+++ b/app/models/RentComplaint.php
@@ -3,12 +3,14 @@ class RentComplaintModel
 {
     use Model;
 
-    protected string $table = 'rent_return_complaints';
+    protected string $table = 'rent_complaint';
 
     protected array $allowedColumns = [
         'rent_id',
+        'complaint_no',
         'title',
         'description',
+        'created_at',
         'status'
     ];
 
@@ -30,36 +32,44 @@ public function resolveComplaint($id)
         //$table
         $this->update($id, ['status' => 'resolved']);
     }
-    public function getComplaints(array $data)
-    {
+    public function getComplaints(array $data) {
         return $this->where($data);
     }
 
-    public function getComplaintsByCustomer(array $data)
-    {
+    public function getComplaintsByCustomer(array $data) {
         $q = new QueryBuilder;
         $q->setTable('rent_complaint');
         $q->select('rent.customer_id as customer_id, rent.id as rent_id, complaint_no as complaint_no, rent_complaint.status as status, rent_complaint.description as description, rent_complaint.created_at as created_at')
-            ->join('rent', 'rent_complaint.rent_id', 'rent.id')
-            ->where('rent.customer_id', $data['customer_id']);
+        ->join('rent', 'rent_complaint.rent_id','rent.id')
+        ->where('rent.customer_id', $data['customer_id'])
+        ->orderBy('rent_complaint.created_at', 'DESC');
 
         return $this->query($q->getQuery(), $q->getData());
     }
-
-    public function getRentComplaint($id)
-    {
+    
+    public function getRentComplaint($id) {
         $q = new QueryBuilder;
         $q->setTable('rent_complaint');
         $q->select('rent_complaint.complaint_no as complaint_no, rent.id as rent_id,rent.created_at as rent_date, rent.customer_id as customer_id, rent.paid_amount as paid_amount, rent.created_at as paid_date, rent.start_date as start_date, rent.end_date as end_date, 
-            rent.status as rent_status, rent.total as total_amount,rental_services.id as rental_id, rental_services.name as rental_name, rental_services.mobile as rental_mobile,
-            rent_complaint.title as title, rent_complaint.description as description, rent_complaint.created_at as created_at, rent_complaint.status as status')
-            ->join('rent', 'rent_complaint.rent_id', 'rent.id')
-            ->join('rental_services', 'rent.rentalservice_id', 'rental_services.id')
-            ->where('rent_complaint.complaint_no', $id);
-
+        rent.status as rent_status, rent.total as total_amount,rental_services.id as rental_id, rental_services.name as rental_name, rental_services.mobile as rental_mobile,
+        rent_complaint.title as title, rent_complaint.description as description, rent_complaint.created_at as created_at, rent_complaint.status as status')
+        ->join('rent','rent_complaint.rent_id', 'rent.id')
+        ->join('rental_services', 'rent.rentalservice_id','rental_services.id')
+        ->where('rent_complaint.complaint_no', $id);
+        return $this->query($q->getQuery(), $q->getData());
+    }
+    
+    public function cancelComplaint($id){
+        // show($id);
+        // return $this->update($id, ['status' => 'cancelled'], 'complaint_no');
+        $q = new QueryBuilder;
+        $q->setTable('rent_complaint');
+        $q->update(['status' => 'cancelled'])->where('complaint_no', $id);
         return $this->query($q->getQuery(), $q->getData());
     }
 
+
  
 
+
 }
diff --git a/app/views/404.view.php b/app/views/404.view.php
index 8037c559..6e9e252b 100755
--- a/app/views/404.view.php
+++ b/app/views/404.view.php
@@ -1,5 +1,14 @@
-<div class="modal-content">
-    <h1>Page not found</h1>
-    <!-- <img src="</php echo ROOT_DIR?>/assets/images/404.jpg" alt="404.jpg" class="404-image"> -->
+<?php
+require_once('../app/views/layout/header.php');
+// require_once('../app/views/components/navbar-auth.php');
+?>
+
+<div class="profile col-lg-12 align-items-center">
+    <div class="customer-bg-image">
+        <img src="<?php echo ROOT_DIR?>/assets/images/customerbg.jpg" alt="customer-bg-image" class="customer-bg-image">
+    </div>
+    <div class="error-container p-6 mt-6">
+        <img src="<?php echo ROOT_DIR?>/assets/images/404-error.png" alt="customer-bg-image" class="error-img mt-10">
+    </div>
 </div>
 
diff --git a/app/views/customer/complaints.view.php b/app/views/customer/complaints.view.php
index 19eefa23..67552f1a 100644
--- a/app/views/customer/complaints.view.php
+++ b/app/views/customer/complaints.view.php
@@ -7,10 +7,10 @@
     <div class="customer-bg-image">
     <img src="<?php echo ROOT_DIR?>/assets/images/customerbg.jpg" alt="customer-bg-image" class="customer-bg-image">
     </div>
-    <div class="cl-lg-12 flex-d-c gap-2 mt-5">
+    <div class="cl-lg-7 flex-d-c gap-2 mt-9">
             <div class="card card-normal-glass">
                 <!-- <button class="btn-text-green">hi</button> -->
-                <h2 class="justufy-content-ceneter flex-d"> Complaints </h2>
+                <h2 class="justufy-content-ceneter flex-d ml-3"> Complaints </h2>
 
                 <div class="section-switch flex-d gap-3 flex-wrap">
                     <button class="btn-selected" id="rentComplaints">My complaints</button>
@@ -29,6 +29,20 @@
     
 </div>
 
+<!-- complaint cancel -->
+
+<div id="cancel-complaint-modal" class="modal">
+    <div class="modal-content">
+        <span class="close">&times;</span>
+        <h2>Cancel Complaint</h2>
+        <p>Are you sure you want to cancel this complaint?</p>
+        <div class="flex-d gap-3 mt-3">
+            <button class="btn btn-primary" id="cancel-complaint-confirm">Yes</button>
+            <button class="btn btn-danger modal-close" id="cancel-complaint-cancel">No</button>
+        </div>
+    </div>
+</div>
+
 <script>
 
     function getComplaints(status) {
@@ -71,38 +85,6 @@ function getComplaints(status) {
             }
         });
     });
-
-    $(document).on('click', '#cancel-complaint', function() {
-        var complaintId = $(this).closest('.complaint').attr('data-id');
-        $('#cancel-complaint-confirm').attr('data-id', complaintId);
-        $('#cancel-complaint-modal').css('display', 'block');
-    });
-
-    $(document).on('click', '#cancel-complaint-confirm', function() {
-        var complaintId = $(this).attr('data-id');
-        $.ajax({
-            headers:{
-                'Authorization': 'Bearer ' +  getCookie('jwt_auth_token')
-            },
-            url: '<?= ROOT_DIR ?>/api/complaints/cancelComplaint/' + complaintId,
-            type: 'GET',
-            success: function(response) {
-                console.log(response);
-                var id = response.data.complaint_id;
-                $('#complaint-card[data-id="' + id + '"]').remove();
-                $('#cancel-complaint-modal').css('display', 'none');
-
-                getComplaints('myComplaints');
-
-
-
-                
-            },
-            error: function(err) {
-                console.log(err);
-            }
-        });
-    });
     
 </script>
 
@@ -137,4 +119,43 @@ function getComplaints(status) {
             }
         });
     });
+</script>
+
+<!-- cancel complaint -->
+<script>
+    $(document).on('click', '#cancel-complaint', function() {
+        var complaintId = $(this).closest('.complaint').attr('data-id');
+        $('#cancel-complaint-confirm').attr('data-id', complaintId);
+        $('#cancel-complaint-modal').css('display', 'block');
+    });
+
+
+
+
+    $(document).on('click', '#cancel-complaint-confirm', function() {
+        var complaintId = $(this).attr('data-id');
+        $.ajax({
+            headers:{
+                'Authorization': 'Bearer ' +  getCookie('jwt_auth_token')
+            },
+            url: '<?= ROOT_DIR ?>/api/complaints/cancelCustomerComplaint/' + complaintId,
+            type: 'GET',
+            success: function(response) {
+                console.log(response);
+                var id = response.data.complaint_id;
+                $('#complaint-card[data-id="' + id + '"]').remove();
+                $('#cancel-complaint-modal').css('display', 'none');
+
+                // getComplaints('pending');
+                alertmsg ("Complaint cancelled successfully", 'success');
+
+
+                
+            },
+            error: function(err) {
+                console.log(err);
+            }
+        });
+    });
+
 </script>
\ No newline at end of file
diff --git a/app/views/customer/components/cart.view.php b/app/views/customer/components/cart.view.php
index ef0e6aa7..64e6a965 100644
--- a/app/views/customer/components/cart.view.php
+++ b/app/views/customer/components/cart.view.php
@@ -2,7 +2,7 @@
     <h2 class="justify-content-center flex-d">Cart</h2>
 
     <div class="row gap-2">
-        <h3> <?php echo htmlspecialchars($cart->start_date); ?> - <?php echo htmlspecialchars($cart->end_date); ?> </h3>
+        <h6 class="rent-item-view-price"> <?php echo htmlspecialchars($cart->start_date); ?> - <?php echo htmlspecialchars($cart->end_date); ?> </h6>
         </div>
     <div class="row gap-2 ">
         <!-- scrollable cart items -->
@@ -36,7 +36,7 @@
                         <!-- <div class="item-count">
                         </div> -->
                         <div class="cart-item-price">
-                            <h4>Rs. <?php echo htmlspecialchars($item->total); ?></h4>
+                            <h4 class="rent-item-view-price py-1">Rs. <?php echo htmlspecialchars($item->total); ?></h4>
                             <!-- <input class="form-control-lg" type="number" name="count" id="item-count" value="1" min="1" max="48"> -->
                         </div>
                     </div>
diff --git a/app/views/customer/components/complaint.view.php b/app/views/customer/components/complaint.view.php
index 9997ff9c..f3c90355 100644
--- a/app/views/customer/components/complaint.view.php
+++ b/app/views/customer/components/complaint.view.php
@@ -94,7 +94,9 @@
     <!-- item list -->
 
     <div class="col-lg-12 col-md-12">
-        <h3>Equipment List</h3>
+        <div class="row">
+            <h3>Equipment List</h3>
+        </div>
         <div class="table-container">
             <table class="table-custom">
                 <thead>
@@ -119,20 +121,6 @@
         </div>
 
     </div>
-   
-        
-
-
-
-        
-
-    </div>
-
-
-
-
     </div>
-        
-
-
+ </div>
 </div>
\ No newline at end of file
diff --git a/app/views/customer/components/complaintlist.view.php b/app/views/customer/components/complaintlist.view.php
index 72bea6fc..949c1062 100644
--- a/app/views/customer/components/complaintlist.view.php
+++ b/app/views/customer/components/complaintlist.view.php
@@ -93,7 +93,7 @@
 
 <!-- complaint cancel -->
 
-<div id="cancel-complaint-modal" class="modal">
+<!-- <div id="cancel-complaint-modal" class="modal">
     <div class="modal-content">
         <span class="close">&times;</span>
         <h2>Cancel Complaint</h2>
@@ -103,7 +103,7 @@
             <button class="btn btn-danger modal-close" id="cancel-complaint-cancel">No</button>
         </div>
     </div>
-</div>
+</div> -->
 
 <style>
  
diff --git a/app/views/customer/components/customercomplaintlist.view.php b/app/views/customer/components/customercomplaintlist.view.php
index 124db2b8..cecd6a89 100644
--- a/app/views/customer/components/customercomplaintlist.view.php
+++ b/app/views/customer/components/customercomplaintlist.view.php
@@ -23,41 +23,20 @@
 
             <div class="complaint-actions flex-d gap-3">
                 <button class="btn-text-green" id="mycom-view-button"><i class="fa fa-list" aria-hidden="true"></i> View</button>
-                <button class="btn-text-red" id="cancel-complaint"><i class="fa fa-times" aria-hidden="true"></i> Cancel</button>  
+                
                 <!-- if status pending set show  -->
-                <!-- <?php if ($complaint->status == 'myComplaints') {
-                   
-
-                    
-                        
-                    
-                    ?>
-                    <div class="flex-d-c">
-                    <button class="btn-text-red" id="cancel-complaint"><i class="fa fa-times" aria-hidden="true"></i> Cancel</button>  
-
-
-                    <button class="btn-text-red" id="cancel-rented" hidden>Cancel</button>
-                    </div>
                 <?php 
-                 }
-                elseif ($complaint->status == 'rented') { ?>
-                    <button class="btn btn-primary" id="mark-as-returned">Mark as Returned</button>
-                <?php }
-                elseif ($complaint->status == 'pending') { ?>
-                    <button class="btn-text-orange" id="accept-complaint"><i class="fa fa-check" aria-hidden="true"></i> Accept</button>
-                    <button class="btn-text-red" id="cancel-complaint"><i class="fa fa-times" aria-hidden="true"></i> Cancel</button>  
-                <?php }
-                ?> -->
+                if ($complaint->status == 'pending') { ?>
+                    <button class="btn-text-red" id="cancel-complaint"><i class="fa fa-times" aria-hidden="true"></i> Cancel</button> 
+                <?php }?>
+                
 
   
             </div>
         </div>
         </div>
-        <?php
+    <?php
     }
-
-
-
 ?>
 
 
@@ -77,21 +56,6 @@
     </div>
 </div>
 
-
-<!-- complaint cancel -->
-
-<div id="cancel-complaint-modal" class="modal">
-    <div class="modal-content">
-        <span class="close">&times;</span>
-        <h2>Cancel Complaint</h2>
-        <p>Are you sure you want to cancel this complaint?</p>
-        <div class="flex-d gap-3 mt-3">
-            <button class="btn btn-primary" id="cancel-complaint-confirm">Yes</button>
-            <button class="btn btn-danger modal-close" id="cancel-complaint-cancel">No</button>
-        </div>
-    </div>
-</div>
-
 <style>
  
 </style>
\ No newline at end of file
diff --git a/app/views/customer/components/customercomplaints.view.php b/app/views/customer/components/customercomplaints.view.php
index 556ddb2c..092688a6 100644
--- a/app/views/customer/components/customercomplaints.view.php
+++ b/app/views/customer/components/customercomplaints.view.php
@@ -119,8 +119,9 @@
         [equipment_name] => BBQ Grill
         [item_number] => I000539029
         [equipment_cost] => 5600.00 -->
-
-        <h3>Equipment List</h3>
+        <div class="row">
+            <h3>Equipment List</h3>
+        </div>
         <div class="table-container">
             <table class="table-custom">
                 <thead>
diff --git a/app/views/customer/components/item.view.php b/app/views/customer/components/item.view.php
index 17896660..fe0f064d 100644
--- a/app/views/customer/components/item.view.php
+++ b/app/views/customer/components/item.view.php
@@ -5,31 +5,32 @@
     <div class="col-lg-12 flex-d align-items-center gap-2" >
 
         <img src="<?php echo ROOT_DIR; ?>/uploads/images/rental_services/<?php echo htmlspecialchars($equipment->rentalservice_image); ?>" alt="Image" class="img-fluid mh-50px rounded-7">
-        <h3 class="rental-name"> <?php echo htmlspecialchars($equipment->rentalservice_name); ?> </h3>
+        <h4 class="rental-name"> <?php echo htmlspecialchars($equipment->rentalservice_name); ?> </h4>
        
         <!-- <?php show($equipment) ?> -->
     </div>
     </a>
 </div>
-<div class="row flex-d mt-5">
+<div class="row flex-d mt-5 px-6 mb-6">
 
-        <div class="col-lg-6">
+        <div class="col-lg-6 p-3 rounded-9">
             <img src="<?php echo htmlspecialchars(OSURL); ?>images/equipment/<?php echo htmlspecialchars($equipment->image); ?>" alt="Image" class="img-fluid mh-200px rounded-7">
             
         </div>
 
             <div class="col-lg-6">
-                <h1 class="rental-name"> <?php echo htmlspecialchars($equipment->name); ?> </h1>
+                <h3 class="rental-name"> <?php echo htmlspecialchars($equipment->name); ?> </h3>
                 <p class="rental-description"> <?php echo htmlspecialchars($equipment->description); ?> </p>
                 
-                <!-- set count input -->
-                <input class="form-control-lg" type="number" name="count" id="item-count" value="1" min="1" max="<?php echo htmlspecialchars($equipment->count); ?>">
+                <!-- set count input
+                <input class="form-control-lg" type="number" name="count" id="item-count" value="1" min="1" max="<?php echo htmlspecialchars($equipment->count); ?>"> -->
 
 
                 
 
-
-                <h3 id="item-fee"   data-fee="<?php echo htmlspecialchars($equipment->total); ?>">Rs. <?php echo htmlspecialchars($equipment->total); ?></h3>
+                <div class="row">
+                    <h5 id="item-fee" class="rent-item-view-price py-3" data-fee="<?php echo htmlspecialchars($equipment->total); ?>">Rs. <?php echo htmlspecialchars($equipment->total); ?></h5>
+                </div>
 
                 <button id="add-to-cart" class="btn-text-green border">Add to Cart</button>
                 <!-- <button  class="btn btn-primary">Add to Cart</button> -->
diff --git a/app/views/customer/orders.view.php b/app/views/customer/orders.view.php
index 127c3c00..38b3c936 100644
--- a/app/views/customer/orders.view.php
+++ b/app/views/customer/orders.view.php
@@ -6,53 +6,32 @@
 ?>
 
 <div class="container flex-d flex-md-c justify-content-center mt-5">
-<div class="customer-bg-image">
-    <img src="<?php echo ROOT_DIR?>/assets/images/customerbg.jpg" alt="customer-bg-image" class="customer-bg-image">
+    <div class="customer-bg-image">
+        <img src="<?php echo ROOT_DIR?>/assets/images/customerbg.jpg" alt="customer-bg-image" class="customer-bg-image">
     </div>
-    <div class=" col-lg-12 flex-d-c gap-2 mt-5 ">
-
-
+    <div class="col-lg-8 flex-d-c gap-2 mt-9 ">
         <div class="card card-normal-glass ">
-
-        <h2 class="justify-content-center flex-d"> Orders </h2>
-
+            <h2 class="justify-content-center flex-d ml-3"> Orders </h2>
             <div class="section-switch flex-d  gap-3 flex-wrap" >
-
-                            <button class="btn-selected" id="all">All</button>
-                            <button class="btn-selected" id="unpaid">Unpaid</button>
-
-                            <button class="btn-selected" id="pending">Pending</button>
-                            <button class="btn-selected" id="upcoming">Upcoming</button>
-                            <button class="btn-selected" id="rented">Rented</button>
-                            <button class="btn-selected" id="completed">Completed</button>
-                            <button class="btn-selected" id="cancelled">Cancelled</button>
-
-
-                            <!-- not rented yet -->
-
-                        </div>
-
+                <button class="btn-selected" id="all">All</button>
+                <button class="btn-selected" id="unpaid">Unpaid</button>
+                <button class="btn-selected" id="pending">Pending</button>
+                <button class="btn-selected" id="upcoming">Upcoming</button>
+                <button class="btn-selected" id="rented">Rented</button>
+                <button class="btn-selected" id="completed">Completed</button>
+                <button class="btn-selected" id="cancelled">Cancelled</button>
+                <!-- not rented yet -->
+            </div>
             <div class="row gap-2 ">
-                <!-- scrollable cart items -->
-                <!-- <div class="col-lg-12    " id="cart-items"> -->
+            <!-- scrollable cart items -->
+            <!-- <div class="col-lg-12    " id="cart-items"> -->
                 <div class="col-lg-12 checkout-items overflow-scroll " >
-
                     <div id="orders">
-    
-    
-    
-    
-    
-    
-    
-                    </div>
-
-                </div>
 
 
+                    </div>
+                </div>
             </div>
-
-           
         </div>
     </div>
 </div>
@@ -486,24 +465,27 @@ function paymentGateWay(data) {
             xhttp.send();
         }
 
-
-
-
-
-
-
-
-
 </script>
 
 <!-- Order Item Modal -->
-<div class="modal" id="order-item-modal">
+<!-- <div class="modal" id="order-item-modal">
     <div class="modal-content">
         <span class="close">&times;</span>
         
         <div id="order-data">   </div>
 
     </div>
+</div> -->
+
+<!-- View modal -->
+    <div class="modal" id="order-item-modal" class
+>
+    <div class="modal-content">
+        <span class="close">&times;</span>
+        
+        
+        <div id="order-data">   </div>
+    </div>
 </div>
 
 
diff --git a/app/views/customer/rent.view.php b/app/views/customer/rent.view.php
index 9fb1bb41..c63e3f21 100644
--- a/app/views/customer/rent.view.php
+++ b/app/views/customer/rent.view.php
@@ -91,15 +91,15 @@
 
     <div class=" col-lg-12 flex-d-c gap-2 location-container">
 
-    <div class="location-form-element">    
+    <div class="location-form-element mb-3 ml-2">    
     <input id="pac-input" class="controls " type="text" placeholder="Enter Location" />
     </div>
-        <div id="map-canvas" class="map-canvas"> </div>
+        <div id="map-canvas" class="map-canvas ml-2"> </div>
 
             <!-- <input type="text" class="form-control" id="latitude"  hidden/>
             <input type="text" class="form-control" id="longitude" hidden/> -->
 
-        <div class="location-button-container">
+        <div class="location-button-container mb-3 ml-2">
             <button id="confirm-location" class="location-button btn-text-green border center" type="button">Confirm Location</button>
         </div>
     </div>
diff --git a/app/views/home.view.php b/app/views/home.view.php
index 20315052..b179d391 100755
--- a/app/views/home.view.php
+++ b/app/views/home.view.php
@@ -19,6 +19,9 @@
 }
 ?>
 
+<div class="customer-bg-image">
+    <img src="<?php echo ROOT_DIR?>/assets/images/customerbg.jpg" alt="customer-bg-image" class="customer-bg-image">
+</div>
 
 <?php require_once('../app/views/sections/hero.php');
 ?>
@@ -32,11 +35,11 @@
 <?php require_once('../app/views/sections/rental-service.php');
 ?>
 
-<?php require_once('../app/views/sections/blog.php');
-?>
+<!-- <?php require_once('../app/views/sections/blog.php');
+?> -->
 
-<?php require_once('../app/views/sections/tips.php');
-?>
+<!-- <?php require_once('../app/views/sections/tips.php');
+?> -->
 
 <?php require_once('../app/views/sections/complaints.php');
 ?>
diff --git a/app/views/sections/complaints.php b/app/views/sections/complaints.php
index d1b92346..e49ea23b 100755
--- a/app/views/sections/complaints.php
+++ b/app/views/sections/complaints.php
@@ -13,12 +13,12 @@
             $user = $_SESSION['USER']; ?>
 
             <div class="home_button">
-                <a href="#" class="btn">Add Complains</a>
+                <a href="#" class="btn-text-green border">Add Complains</a>
             </div>
 
         <?php } else {  ?>
             <div class="home_button">
-            <a href="<?= ROOT_DIR ?>/login" class="btn">Add Complain</a>
+            <a href="<?= ROOT_DIR ?>/login" class="btn-text-green border">Add Complain</a>
             </div>
         <?php } ?>
     </div>
diff --git a/app/views/sections/guide.php b/app/views/sections/guide.php
index 7121f0cd..10a74fe2 100755
--- a/app/views/sections/guide.php
+++ b/app/views/sections/guide.php
@@ -28,12 +28,12 @@
             $user = $_SESSION['USER']; ?>
 
             <div class="home_button">
-                <a href="#" class="btn">Book Now</a>
+                <a href="#" class="btn-text-green border">Book Now</a>
             </div>
 
         <?php } else {  ?>
             <div class="home_button">
-            <a href="<?= ROOT_DIR ?>/login" class="btn">Book Now</a>
+            <a href="<?= ROOT_DIR ?>/login" class="btn-text-green border">Book Now</a>
             </div>
         <?php } ?>
     </div>
diff --git a/app/views/sections/hero.php b/app/views/sections/hero.php
index b7f10abe..14af4264 100755
--- a/app/views/sections/hero.php
+++ b/app/views/sections/hero.php
@@ -29,12 +29,12 @@
             $user = $_SESSION['USER']; ?>
 
             <div class="home_button">
-                <a href="#" class="btn">Get Started</a>
+                <a href="#" class="btn-text-green border">Get Started</a>
             </div>
 
         <?php } else {  ?>
             <div class="home_button">
-            <a href="<?= ROOT_DIR ?>/login" class="btn">Get Started</a>
+            <a href="<?= ROOT_DIR ?>/login" class="btn-text-green border">Get Started</a>
             </div>
         <?php } ?>
     </div>
diff --git a/app/views/sections/rental-service.php b/app/views/sections/rental-service.php
index 71328466..f81d7e5f 100755
--- a/app/views/sections/rental-service.php
+++ b/app/views/sections/rental-service.php
@@ -13,12 +13,12 @@
             $user = $_SESSION['USER']; ?>
 
             <div class="home_button">
-                <a href="#" class="btn">Book Now</a>
+                <a href="#" class="btn-text-green border">Book Now</a>
             </div>
 
         <?php } else {  ?>
             <div class="home_button">
-            <a href="<?= ROOT_DIR ?>/login" class="btn">Book Now</a>
+            <a href="<?= ROOT_DIR ?>/login" class="btn-text-green border">Book Now</a>
             </div>
         <?php } ?>
     </div>
diff --git a/public/assets/images/404-error.png b/public/assets/images/404-error.png
new file mode 100644
index 00000000..59feee8e
Binary files /dev/null and b/public/assets/images/404-error.png differ
diff --git a/public/assets/scss/wl/dashboard/_button.scss b/public/assets/scss/wl/dashboard/_button.scss
index dfd92b00..3c1bf7b5 100644
--- a/public/assets/scss/wl/dashboard/_button.scss
+++ b/public/assets/scss/wl/dashboard/_button.scss
@@ -130,7 +130,7 @@
   width: fit-content;
   cursor: pointer;
   border: none;
-  padding: 10px;
+  padding: 8px 16px;
   // font-family: "poppins", sans-serif;
 
   & i {
@@ -143,15 +143,15 @@
 
   // btn-text-green with border
   &.border {
-    border: 2px solid $color-primary;
+    border: 1px solid $color-primary;
     border-radius: 10px;
     min-width: 100px;
 
     &:hover {
-      border: 2px solid $color-primary;
+      border: 1px solid $color-primary;
       text-decoration: none;
       // shadow
-      box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.2);
+      box-shadow : 0px 1px 10px 1px rgba(105, 105, 105, 0.5);
       
     }
   }
@@ -182,22 +182,22 @@
   width: fit-content;
   cursor: pointer;
   border: none;
-  padding: 10px;
+  padding: 8px 16px;
   // font-family: "poppins", sans-serif;
   & i {
     margin-right: 5px;
   }
 
   &.border {
-    border: 2px solid $blue;
+    border: 1px solid $blue;
     border-radius: 10px;
     min-width: 100px;
 
 
     &:hover {
-      border: 2px solid $blue;
+      border: 1px solid $blue;
       text-decoration: none;
-      box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.2);
+      box-shadow : 0px 1px 10px 1px rgba(105, 105, 105, 0.5);
     }
   }
 
@@ -215,7 +215,7 @@
   width: fit-content;
   cursor: pointer;
   border: none;
-  padding: 10px;
+  padding: 8px 16px;
   // font-family: "poppins", sans-serif;
 
   & i {
@@ -223,15 +223,15 @@
   }
 
   &.border {
-    border: 2px solid $orange;
+    border: 1px solid $orange;
     border-radius: 10px;
     min-width: 100px;
 
 
     &:hover {
-      border: 2px solid $orange;
+      border: 1px solid $orange;
       text-decoration: none;
-      box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.2);
+      box-shadow : 0px 1px 10px 1px rgba(105, 105, 105, 0.5);
     }
   }
 
@@ -249,7 +249,7 @@
   width: fit-content;
   cursor: pointer;
   border: none;
-  padding: 10px;
+  padding: 8px 16px;
   // font-family: "poppins", sans-serif;
 
   & i {
@@ -257,15 +257,15 @@
   }
 
   &.border {
-    border: 2px solid $red;
+    border: 1px solid $red;
     border-radius: 10px;
     min-width: 100px;
 
 
     &:hover {
-      border: 2px solid $red;
+      border: 1px solid $red;
       text-decoration: none;
-      box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.2);
+      box-shadow : 0px 1px 10px 1px rgba(105, 105, 105, 0.5);
     }
   } 
 
@@ -444,7 +444,7 @@
   width: fit-content;
   cursor: pointer;
   border: none;
-  padding: 10px;
+  padding: 8px 16px;
   // font-family: "poppins", sans-serif;
 
   &:hover{
diff --git a/public/assets/scss/wl/dashboard/_customer.scss b/public/assets/scss/wl/dashboard/_customer.scss
index fbb6142c..428ac79c 100644
--- a/public/assets/scss/wl/dashboard/_customer.scss
+++ b/public/assets/scss/wl/dashboard/_customer.scss
@@ -786,3 +786,12 @@
   }
 }
 
+//view item on rent page
+.rent-item-view-price{
+  font-size: 2rem;
+  font-weight: 600;
+  color: $gray-text;
+  // justify-content: center;
+  // align-items: center;
+}
+
diff --git a/public/assets/scss/wl/dashboard/_home.scss b/public/assets/scss/wl/dashboard/_home.scss
index a95bde49..afb76f41 100644
--- a/public/assets/scss/wl/dashboard/_home.scss
+++ b/public/assets/scss/wl/dashboard/_home.scss
@@ -88,4 +88,21 @@
             margin-top: 2rem;
         }
     }
+}
+
+.error-container{
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    // height: 50%;
+    // width: 50%;
+    // // background-color: red;
+
+    .error-img {
+        height: 50%;
+        width: 50%;
+        object-fit: cover;
+        overflow: visible;
+    }
 }
\ No newline at end of file