diff --git a/styles/Components/header.module.css b/styles/Components/header.module.css
index 6d6b338..b16974a 100644
--- a/styles/Components/header.module.css
+++ b/styles/Components/header.module.css
@@ -138,3 +138,10 @@
     margin-inline: 5px;
     padding: 0;
 }
+
+.leftArrow {
+    transform: rotate(90deg);
+}
+.rightArrow {
+    transform: rotate(270deg);
+}
diff --git a/styles/Components/navbar.module.css b/styles/Components/navbar.module.css
index 7ca3c5f..121d382 100644
--- a/styles/Components/navbar.module.css
+++ b/styles/Components/navbar.module.css
@@ -32,7 +32,8 @@
     height: 100%;
     width: 3px;
     border-radius: 100vh;
-    background-color: #424242;
+    background-color: var(--theme-ui-colors-borderHint);
+    transition: 0.3s ease-in-out;
 }
 
 .skipNav {
@@ -69,6 +70,6 @@
 .message {
     font-size: 1.2rem;
     padding-left: 10px;
-    color: white;
+    color: var(--theme-ui-colors-text);
     transition: color 0.3s ease-in-out;
-}
\ No newline at end of file
+}
diff --git a/styles/globals.module.css b/styles/globals.module.css
index 1761aeb..944f797 100644
--- a/styles/globals.module.css
+++ b/styles/globals.module.css
@@ -5,7 +5,8 @@
     height: calc(100vh - 42px);
     width: 100%;
     border-radius: 25px;
-    box-shadow: 0 0 0 100px black;
+    box-shadow: 0 0 0 100px var(--theme-ui-colors-borders);
+    transition: 0.3s ease-in-out;
     pointer-events: none;
     background: transparent;
 }