1 files changed, 20 insertions, 25 deletions

diff --git a/public/styles.css b/public/styles.css
index 0a3d6d4..d628ffc 100644
--- a/public/styles.css
+++ b/public/styles.css
@@ -9,6 +9,8 @@ body {
 
 .sidebar {
     position: fixed;
+    top: 0;
+    left: 0;
     width: 240px; /* Default sidebar width */
     height: 100%;
     background-color: #141414;
@@ -18,12 +20,13 @@ body {
 }
 
 .sidebar:hover {
-    width: 280px; /* Width when hovered over */
+    width: 300px; 
 }
 
 .sidebar h2 {
     color: #7a4d7c;
     text-align: center;
+    margin-bottom: 20px;
 }
 
 .sidebar ul {
@@ -50,30 +53,30 @@ body {
 }
 
 .content {
-    margin-left: 240px;
+    margin-left: 240px; 
     padding: 20px;
-    transition: margin-left 0.3s ease;
     flex: 1;
 }
 
-.sidebar:hover ~ .content {
-    margin-left: 300px;
-}
-
 header {
     background-color: #1f1f1f;
     padding: 10px;
     text-align: center;
-    top: 0;
     z-index: 1000;
+    width: 100%;
 }
 
+header a {
+    color: #ffffff;
+    text-align: center;
+    text-decoration: none; 
+}
 
 header hr {
-    width:50%;
-    text-align:center;
+    width: 50%;
+    text-align: center;
 }
-             <hr style="width:50%;text-align:center;">
+
 header h1 {
     margin: 0;
     color: #ffffff;
@@ -117,15 +120,7 @@ main {
     margin-top: 20px;
 }
 
-main h1 {
-    color: #7a4d7c;
-}
-
-main h2 {
-    color: #7a4d7c;
-}
-
-main h3 {
+main h1, main h2, main h3 {
     color: #7a4d7c;
 }
 
@@ -152,17 +147,17 @@ main a:hover {
 .about-content {
     display: flex;
     align-items: center;
-    flex-direction: row-reverse; 
+    flex-direction: row-reverse;
 }
 
 .about-image {
-    margin-left: 20px; 
-    margin-right: 30px
+    margin-left: 20px;
+    margin-right: 30px;
 }
 
 .about-image img {
-    width: 200px; 
-    height: auto; 
+    width: 200px;
+    height: auto;
     border-radius: 50%;
     border: 5px solid #7a4d7c;
 }