diff --git a/public/userarea/statkpi/statkpi.php b/public/userarea/statkpi/statkpi.php
index 5debed4..9d2c9bd 100644
--- a/public/userarea/statkpi/statkpi.php
+++ b/public/userarea/statkpi/statkpi.php
@@ -225,6 +225,18 @@ include('parsedatachart.php');
         .active-filters {
             margin-bottom: 20px;
         }
+
+        body {
+            transition: margin-right 0.3s; /* Smooth transition */
+        }
+
+        #main-content{ 
+            transition: margin-right 0.3s; /* Smooth transition */
+        }
+
+        .collapsed {
+            margin-right: 300px; /* Hide the sidebar */
+        }
     </style>
 
     
@@ -244,9 +256,9 @@ include('parsedatachart.php');
 
                 <?php include('../include/topbar.php'); ?>
 
-                <div class="page-content-wrapper ">
+                <div class="page-content-wrapper " id="main-content">
 
-                    <div class="container-fluid">
+                    <div class="container-fluid" >
 
                         <div class="row">
                             <div class="col-sm-12">
@@ -349,6 +361,7 @@ include('parsedatachart.php');
 
                             $('#toggleFilters').on('click', function() {
                                 $('#filterSidebar').toggle();
+                                $('#main-content').toggleClass('collapsed');
                             });
 
                             $('.select2').on('change', function() {