diff --git a/_layouts/default.html b/_layouts/default.html
index 7915b4e..cc8f0af 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -14,6 +14,8 @@
         --bg-color-dark: #1a1a1a;
         --text-color-light: #000000;
         --text-color-dark: #ffffff;
+        --header-height: 145px;
+        --footer-height: 145px;
         --sidebar-width: 300px;
         --accent-color: #10b981;
         --accent-color-hover: #059669;
@@ -24,6 +26,7 @@
         color: var(--text-color-light);
         margin: 0;
         padding: 0;
+        overflow-y: hidden;
       }
 
       body.dark-mode {
@@ -65,6 +68,7 @@
         display: flex;
         justify-content: space-between;
         align-items: center;
+        height: var(--header-height);
       }
 
       .dark-mode .site-header {
@@ -142,6 +146,7 @@
         left: 0;
         right: 0;
         z-index: 100;
+        height: var(--footer-height);
       }
 
       .dark-mode .site-footer {
@@ -497,7 +502,7 @@
         width: var(--sidebar-width);
         padding: 20px;
         border-right: 1px solid #e1e4e8;
-        height: calc(100vh - 140px);
+        height: calc(100vh - var(--header-height) - var(--footer-height));
         overflow-y: auto;
         background-color: var(--bg-color-light);
       }
@@ -505,17 +510,22 @@
       .dark-mode .sidebar {
         background-color: var(--bg-color-dark);
         border-right-color: #2d2d2d;
+        scrollbar-color: #2d2d2d transparent;
       }
 
       .main-content {
         flex: 1;
-        height: calc(100vh - 140px);
+        height: calc(100vh - var(--header-height) - var(--footer-height));
         overflow-y: auto;
         padding: 20px;
         padding-top: 0;
         position: relative;
       }
 
+      .dark-mode .main-content {
+         scrollbar-color: #2d2d2d transparent;
+       }
+
       .main-content-header {
         position: sticky;
         top: 0;