diff --git a/src/components/home/contentAuth.vue b/src/components/home/contentAuth.vue
index 113843a7..8bf71c72 100644
--- a/src/components/home/contentAuth.vue
+++ b/src/components/home/contentAuth.vue
@@ -264,7 +264,9 @@ store.dispatch('labels/loadAllLabels')
 	bottom: 0;
 	left: 0;
 	right: 0;
-	background: rgba(250, 250, 250, 0.8);
+	height: 100vh;
+	width: 100vw;
+	background: hsla(var(--grey-100-hsl), 0.8);
 	z-index: 5;
 	opacity: 0;
 	transition: all $transition;
diff --git a/src/styles/custom-properties/colors.scss b/src/styles/custom-properties/colors.scss
index ae68dd60..a9bffb3d 100644
--- a/src/styles/custom-properties/colors.scss
+++ b/src/styles/custom-properties/colors.scss
@@ -3,7 +3,8 @@
 :root {
   // Vikunja specific variables
   --grey-50: hsl(210, 20%, 98%);
-  --grey-100: hsl(220, 14.3%, 95.9%);
+  --grey-100-hsl: 220, 14.3%, 95.9%;
+  --grey-100: hsl(var(--grey-100-hsl));
   --grey-200: hsl(220, 13%, 91%);
   --grey-300: hsl(216, 12.2%, 83.9%);
   --grey-400: hsl(217.9, 10.6%, 64.9%);