diff --git a/src/routes/Footer.svelte b/src/routes/Footer.svelte
index e3e8a1f..2f84d1b 100644
--- a/src/routes/Footer.svelte
+++ b/src/routes/Footer.svelte
@@ -14,23 +14,43 @@
 
 <style>
 	footer {
-		max-width: var(--size-container);
-		margin: 4rem auto;
+		width: 100%;
+		padding: 2rem;
 		display: flex;
 		flex-direction: column;
 		gap: 2rem;
-		transition: opacity var(--animation-speed) var(--animation-type);
-		opacity: 0.5;
-	}
-	footer:hover,
-	footer:focus-within {
-		opacity: 1;
+		background: repeating-linear-gradient(
+			70deg,
+			#ff0018,
+			#ff0018 170px,
+			#ffa52c 170px,
+			#ffa52c 340px,
+			#ffff41 340px,
+			#ffff41 510px,
+			#008018 510px,
+			#008018 680px,
+			#0000f9 680px,
+			#0000f9 850px,
+			#86007d 850px,
+			#86007d 1020px
+		);
 	}
 
 	.row {
+		margin: 0 auto;
+		max-width: var(--size-container);
+		background-color: var(--color-bg);
+		padding: 1rem;
+		border-radius: 0.5rem;
 		display: flex;
 		flex-direction: row;
 		align-items: center;
+		opacity: 0.6;
+		transition: opacity var(--animation-speed) var(--animation-type);
+	}
+	.row:hover,
+	.row:focus-within {
+		opacity: 1;
 	}
 	.row > * {
 		flex-grow: 1;