1 files changed, 48 insertions, 35 deletions

diff --git a/static/css/light.css b/static/css/light.css
index 4f41d5f..27df3c4 100644
--- a/static/css/light.css
+++ b/static/css/light.css
@@ -28,17 +28,8 @@
   --switch-sun: var(--color13);
 }
 
-html {
-  background: var(--bg);
-}
-
-body {
-  background: var(--body-bg);
-  color: var(--fg);
-  border: 4px outset var(--fg);
-}
-
-a{
+/* general */
+a {
   color: var(--link);
 }
 
@@ -66,49 +57,44 @@ h5 {
   color: var(--fg-acc5);
 }
 
-/* switch */
-.slider {
-  background-color: var(--switch-bg);
-}
-
-#theme-switcher-container i.fa-moon {
-  color: var(--switch-moon);
-}
-
-#theme-switcher-container i.fa-sun {
-  color: var(--switch-sun);
-}
-
-.slider:before {
-  background-color: var(--switch-slider);
+body {
+  background: var(--bg);
+  color: var(--fg);
 }
 
-.switch input:checked + .slider {
-  background-color: var(--switch-toggled-bg);
+main {
+  background: linear-gradient(var(--bg) 0.5em, 1em, var(--body-bg) 1.5em calc(100% - 1.5em), calc(100% - 1em), var(--bg) calc(100% - 0.5em));
 }
 
-.switch input:focus + .slider {
-  box-shadow: 0 0 0.1em var(--switch-ol);
+/* nav bar */
+body > header {
+  background: linear-gradient(var(--body-bg) calc(100% - 1.5em), calc(100% - 1em), var(--bg) calc(100% - 0.5em));
 }
 
-/* menu bar (header) */
-.menubar li {
+nav li {
   background: var(--navitem-bg);
 }
 
-.menubar a {
+nav a {
   color: var(--navitem-link);
 }
 
-.menubar li:hover {
+nav li:hover {
   background: var(--navitem-bg-hl);
   color: var(--fg-hl);
 }
 
-.menubar li:hover > a {
+nav li:hover > a {
   color: var(--navitem-link-hl);
 }
 
+
+/* footer */
+body > footer {
+  background: linear-gradient(var(--bg) calc(100% - 1.5em), calc(100% - 1em), var(--body-bg) calc(100% - 0.5em));
+}
+
+
 /* image gallery (not really being used rn) */
 div.gallery {
   border: 1px solid var(--fg-hl);
@@ -117,3 +103,30 @@ div.gallery {
 div.gallery:hover {
   border: var(--fg-acc5);
 }
+
+
+/* switch */
+.slider {
+  background-color: var(--switch-bg);
+}
+
+.theme-switch-container i.fa-moon {
+  color: var(--switch-moon);
+}
+
+.theme-switch-container i.fa-sun {
+  color: var(--switch-sun);
+}
+
+.slider:before {
+  background-color: var(--switch-slider);
+}
+
+.switch input:checked + .slider {
+  background-color: var(--switch-toggled-bg);
+}
+
+.switch input:focus + .slider {
+  box-shadow: 0 0 0.1em var(--switch-ol);
+}
+