use vars in more color styles

css/nav.css

@@ -58,9 +58,9 @@ nav a, nav h1, nav label {
 	#hamitems {
 		display: block;
 		position: absolute;
-		top: 55px;
+		top: 43px;
 		right: 0;
-		background-color: black;
+		background-color: var(--nav-bg-color);
 	}
 
 	#hamitems a {
@@ -79,12 +79,13 @@ nav a, nav h1, nav label {
 		padding: 0 0.5em;
 		border: 0;
 		transition: height 250ms cubic-bezier(0.23, 1, 0.32, 1);
+		visibility: hidden;
 	}
 
 	#hamburger:checked ~ #hamitems a {
 		height: 2.5em;
 		padding: 0.5em;
-		border: 1px solid #333;
 		transition: height 250ms cubic-bezier(0.23, 1, 0.32, 1);
+		visibility: visible;
 	}
 }

css/style.css

@@ -1,6 +1,7 @@
 :root {
-	--fail-color: #f00;
-	--success-color: #0f0;
+	--negative-color: #f00;
+	--positive-color: #0f0;
+	--lightbg-text-color: black;
 	--main-bg-color: #404040;
 	--main-text-color: white;
 	--main-card-bg-color: #202020;