diff --git a/public/assets/css/left/left.css b/public/assets/css/left/left.css
index af5af42317..8133653f06 100644
--- a/public/assets/css/left/left.css
+++ b/public/assets/css/left/left.css
@@ -4,7 +4,7 @@
       width: var(--nav-size);
       height: calc(100vh - (3 * var(--unit-size)));
       position: fixed;
-      background-color: rgba(0, 0, 0, 0.40);
+      background-color: var(--bg5);
       margin-top: calc(3 * var(--main-size));
 }
 .navbar .left-nav {
@@ -31,7 +31,7 @@
 }
 .navbar a {
       display: block;
-      color: #91B9D0;
+      color: var(--accent);
       font-size: var(--medium-size);
 }
 .navbar .left-nav a {
@@ -44,11 +44,11 @@
       margin-top: var(--unit-size);
 }
 .navbar a:hover {
-      color: #F6F6F6;
+      color: var(--fg);
       transition: all 0.8s ease;
 }
 .navbar a:focus {
-      color: #F6F6F6;
+      color: var(--fg);
       transition: all 0.8s ease;
 }
 
@@ -71,7 +71,7 @@
 .profile {
       display: flex;
       flex-wrap: wrap;
-      background-color: rgba(0, 0, 0, 0.20);
+      background-color: var(--bg4);
       padding: var(--unit-size);
       font-size: var(--small-size);
       margin-bottom: var(--unit-size);
@@ -104,7 +104,7 @@
 }
 
 .info .tags i {
-      color: #91B9D0;
+      color: var(--accent);
 }
 
 .info .tags i:last-child {
diff --git a/public/assets/css/left/left_mid.css b/public/assets/css/left/left_mid.css
index daf0f9d82b..6373ffc14b 100644
--- a/public/assets/css/left/left_mid.css
+++ b/public/assets/css/left/left_mid.css
@@ -4,11 +4,7 @@
       width: var(--nav-size);
       height: calc(100vh - (3 * var(--unit-size)));
       position: fixed;
-      background: rgb(51,61,71);
-      background: -moz-linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
-      background: -webkit-linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
-      background: linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
-      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#333d47",endColorstr="#272e36",GradientType=1);
+      background: var(--bg1);
       margin-top: calc(3 * var(--main-size));
 }
 .navbar .left-nav {
@@ -35,7 +31,7 @@
 }
 .navbar a {
       display: block;
-      color: #91B9D0;
+      color: var(--accent);
       font-size: var(--medium-size);
 }
 .navbar .left-nav a {
@@ -48,11 +44,11 @@
       margin-top: var(--unit-size);
 }
 .navbar a:hover {
-      color: #F6F6F6;
+      color: var(--fg);
       transition: all 0.8s ease;
 }
 .navbar a:focus {
-      color: #F6F6F6;
+      color: var(--fg);
       transition: all 0.8s ease;
 }
 
@@ -84,7 +80,7 @@
 .profile {
       display: flex;
       flex-wrap: wrap;
-      background-color: rgba(0, 0, 0, 0.20);
+      background-color: var(--bg2);
       padding: var(--unit-size);
       font-size: var(--small-size);
       margin-bottom: var(--unit-size);
@@ -117,7 +113,7 @@
 }
 
 .info .tags i {
-      color: #91B9D0;
+      color: var(--accent);
 }
 
 .info .tags i:last-child {
diff --git a/public/assets/css/left/left_small.css b/public/assets/css/left/left_small.css
index 01bdd4872f..0db801ae46 100644
--- a/public/assets/css/left/left_small.css
+++ b/public/assets/css/left/left_small.css
@@ -4,11 +4,7 @@
       width: var(--nav-size);
       height: calc(100vh - (3 * var(--unit-size)));
       position: fixed;
-      background: rgb(51,61,71);
-      background: -moz-linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
-      background: -webkit-linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
-      background: linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
-      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#333d47",endColorstr="#272e36",GradientType=1);
+      background: var(--bg1);
       margin-top: calc(3 * var(--main-size));
 }
 .navbar .left-nav {
@@ -35,7 +31,7 @@
 }
 .navbar a {
       display: block;
-      color: #91B9D0;
+      color: var(--accent);
       font-size: var(--medium-size);
 }
 .navbar .left-nav a {
@@ -48,11 +44,11 @@
       margin-top: var(--unit-size);
 }
 .navbar a:hover {
-      color: #F6F6F6;
+      color: var(--fg);
       transition: all 0.8s ease;
 }
 .navbar a:focus {
-      color: #F6F6F6;
+      color: var(--fg);
       transition: all 0.8s ease;
 }
 
@@ -84,7 +80,7 @@
 .profile {
       display: flex;
       flex-wrap: wrap;
-      background-color: rgba(0, 0, 0, 0.20);
+      background-color: var(--bg2);
       padding: var(--unit-size);
       font-size: var(--small-size);
       margin-bottom: var(--unit-size);
@@ -117,7 +113,7 @@
 }
 
 .info .tags i {
-      color: #91B9D0;
+      color: var(--accent);
 }
 
 .info .tags i:last-child {
diff --git a/public/assets/css/settings/settings.css b/public/assets/css/settings/settings.css
index 5dcfcc9e23..8c98f6d471 100644
--- a/public/assets/css/settings/settings.css
+++ b/public/assets/css/settings/settings.css
@@ -12,7 +12,7 @@
 .set-nav {
       order: 1;
       display: flex;
-      justify-content: space-between;
+      justify-content: space-evenly;
       flex-wrap: wrap;
       width: 100%;
       background-color: var(--bg5);
diff --git a/public/assets/css/settings/settings_mid.css b/public/assets/css/settings/settings_mid.css
index b0559fa9f2..d78b5c7214 100644
--- a/public/assets/css/settings/settings_mid.css
+++ b/public/assets/css/settings/settings_mid.css
@@ -12,7 +12,7 @@
 .set-nav {
       order: 1;
       display: flex;
-      justify-content: space-between;
+      justify-content: space-evenly;
       flex-wrap: wrap;
       width: 100%;
       background-color: var(--bg5);
@@ -24,7 +24,7 @@
 .set-nav ul {
       display: flex;
       align-items: stretch;
-      justify-content: space-evenly;
+      justify-content: space-around;
       width: 100%;
       margin-left: var(--side-margin);
       margin-right: var(--side-margin);
diff --git a/public/assets/css/settings/settings_small.css b/public/assets/css/settings/settings_small.css
index 0f55234049..e189a8775f 100644
--- a/public/assets/css/settings/settings_small.css
+++ b/public/assets/css/settings/settings_small.css
@@ -24,7 +24,7 @@
 .set-nav ul {
       display: flex;
       align-items: stretch;
-      justify-content: space-evenly;
+      justify-content: space-around;
       width: 100%;
       margin-left: var(--side-margin);
       margin-right: var(--side-margin);