diff --git a/assets/styles/_variables.scss b/assets/styles/_variables.scss
new file mode 100644
index 0000000..2c33292
--- /dev/null
+++ b/assets/styles/_variables.scss
@@ -0,0 +1,2 @@
+$page-transition-duration: 500ms;
+$page-transition-easing: ease;
diff --git a/assets/styles/global.scss b/assets/styles/global.scss
index 4807a61..ccc1cfb 100644
--- a/assets/styles/global.scss
+++ b/assets/styles/global.scss
@@ -1,6 +1,7 @@
 @use "./colors";
 @use "./content";
 @use "./formatted";
+@use "./variables";
 
 // General
 html, body {
@@ -23,7 +24,7 @@ html, body {
 
 // Transitions
 .page-enter-active, .page-leave-active {
-  transition: 500ms ease opacity;
+  transition: variables.$page-transition-duration variables.$page-transition-easing opacity;
 }
 
 .page-enter, .page-leave-to {
diff --git a/components/MyButton.vue b/components/MyButton.vue
index 2a61d57..33fe06a 100644
--- a/components/MyButton.vue
+++ b/components/MyButton.vue
@@ -100,7 +100,7 @@
   .my-button__prefix {
     display: inline-flex;
     margin-right: 10px;
-    margin-left: -5px;
+    margin-left: -10px;
 
     justify-content: center;
 
diff --git a/components/NavigationBar.vue b/components/NavigationBar.vue
index b707188..76c864c 100644
--- a/components/NavigationBar.vue
+++ b/components/NavigationBar.vue
@@ -39,6 +39,7 @@
   @use "~@/assets/styles/screenSize";
   @use "~@/assets/styles/colors";
   @use "~@/assets/styles/content";
+  @use "~@/assets/styles/variables";
   @use "~@/assets/styles/z-indexes";
 
   body {
@@ -70,6 +71,14 @@
     align-items: center;
     justify-content: space-between;
     padding: 0 30px 0 20px;
+
+    transition: variables.$page-transition-duration variables.$page-transition-easing background;
+    background: transparent;
+
+    .navigation-bar--show-background & {
+      background: transparentize(colors.$background, 0.8);
+      backdrop-filter: blur(10px);
+    }
   }
 
   .navigation-bar__toggle {
@@ -294,7 +303,8 @@
 
         return toModifierClasses("navigation-bar", {
           open,
-          hideActiveState
+          hideActiveState,
+          showBackground: this.$route.fullPath !== "/"
         })
       }
     },
diff --git a/components/pages/projects/MyProject.vue b/components/pages/projects/MyProject.vue
index fa38bb8..4a63872 100644
--- a/components/pages/projects/MyProject.vue
+++ b/components/pages/projects/MyProject.vue
@@ -52,7 +52,7 @@
 
   .my-project__content {
     margin: 2px;
-    padding: 20px;
+    padding: 30px;
     background: colors.$background;
     font-size: 1.1rem;
 
@@ -79,10 +79,10 @@
   .my-project__links {
     flex-grow: 1;
 
-    margin-top: 10px;
+    margin: 10px -5px -15px;
 
     display: grid;
-    gap: 2px;
+    gap: 4px;
     grid-auto-flow: column;
     grid-auto-columns: min-content;
     grid-auto-rows: min-content;
@@ -105,7 +105,7 @@
 
   @media (max-width: 500px) {
     .my-project__links {
-      grid-template-columns: 1fr;
+      grid-template-columns: 1fr 1fr;
       grid-auto-flow: row;
     }
   }