diff --git a/images/background-original.png b/images/background-original.png
index bf5104d0..d6becf80 100644
Binary files a/images/background-original.png and b/images/background-original.png differ
diff --git a/images/background.png b/images/background.png
index 0f6ec3c8..5635fb38 100644
Binary files a/images/background.png and b/images/background.png differ
diff --git a/index.html b/index.html
index f4857c51..360104a1 100644
--- a/index.html
+++ b/index.html
@@ -541,12 +541,11 @@
 /*Color Palette*/
 :root {
 	/*Regular*/
-	--color-a: #073c00;
-	--color-b: #073c0020; /*073c0020*/
-	--color-c: #095700;
-	--color-d: #0e720040; /*0e720040*/
-	--color-e: #0e7200;
-	--color-gray: #0002;
+	--color-hover-grid: #0b6b00;
+	--color-border-selection-grid: #0f820040;
+	--color-gray: #00000088;
+	--color-border-main: #073c00;
+	--color-input: #073c00;
 }
 
 /*Page-wide styling*/
@@ -576,11 +575,11 @@ body {
 	grid-gap: 0px 0px;
 }
 .mainGrid > div, body, footer, .title {
-	border: 3px solid var(--color-a);
+	border: 3px solid var(--color-border-main);
 }
 .canvasContainer {
 	text-align: center;
-	background-color: var(--color-b) !important;
+	background-color: none !important;
 	width: calc(100% - 18px);
 }
 .selectionGrid {
@@ -599,17 +598,17 @@ body {
 	font-family: belerenbsc;
 	cursor: pointer;
 	border-radius: 36px;
-	border: 4px solid var(--color-d);
-	background-color: #0008 !important;
+	border: 4px solid var(--color-border-selection-grid);
+	/*background-color: #0008 !important;*/
 }
 .selectionGrid > div:hover {
-	border-color: var(--color-c);
+	border-color: var(--color-hover-grid);
 }
 .cardManipulationMenu, .extrasMenu {
 	margin-top: 4px;
 	padding: 24px;
 	border-radius: 36px;
-	border: 4px solid var(--color-d);
+	border: 4px solid var(--color-border-selection-grid);
 	background-color: var(--color-gray);
 }
 .cmm, .extras {
@@ -633,7 +632,7 @@ body {
 	border-radius: 0.25em;
 	padding-left: 0.25em;
 	width: inherit;
-	background-color: var(--color-a);
+	background-color: var(--color-input);
 	border: none;
 	cursor: pointer;
 	-moz-appearance: none;
@@ -665,7 +664,7 @@ body {
 	position: absolute;
 	top: 0px;
 	left: 0px;
-	background: var(--color-a);
+	background: var(--color-input);
 	cursor: pointer;
 }
 .checkbox input:checked ~ label:after {
@@ -691,7 +690,7 @@ body {
 input[type="text"], input[type="number"], textarea, input[type="file"] {
 	width: 100%;
 	border: none;
-	background: var(--color-a);
+	background: var(--color-input);
 	border-radius: 0.25em;
 	padding-left: 0.25em;
 }
@@ -699,7 +698,7 @@ input[type="text"], input[type="number"], textarea, input[type="file"] {
 input[type="color"] {
 	padding: 0px;
 	border: none;
-	background: var(--color-a);
+	background: var(--color-input);
 }
 
 /*Hyperlinks*/
@@ -780,9 +779,9 @@ a:hover, a:active {
 	text-align: center;
 }
 .symbolGrid > div {
-	border: 4px solid var(--color-a);
+	border: 4px solid var(--color-border-main);
 	border-radius: 36px;
-	background-color: var(--color-d) !important;
+	background-color: var(--color-border-selection-grid) !important;
 }
 
 /*Sitewide text (bottom of the page)*/