diff --git a/public/themes/default.css b/public/themes/default.css
index 731ca04d..a7c1ceb5 100644
--- a/public/themes/default.css
+++ b/public/themes/default.css
@@ -51,7 +51,7 @@
     /* global colors */
     --app-bg-color: black;
     --app-accent-color: rgb(88, 193, 66);
-    --app-accent-bg-color: rgba(88, 193, 66, 0.2);
+    --app-accent-bg-color: rgba(88, 193, 66, 0.25);
     --app-error-color: rgb(229, 77, 46);
     --app-warning-color: rgb(224, 185, 86);
     --app-success-color: rgb(78, 154, 6);
@@ -222,5 +222,5 @@
     --modal-bg-color: var(--app-bg-color);
     --modal-header-bottom-border-color: rgba(241, 246, 243, 0.15);
 
-    --logo-button-hover-bg-color: #1e1e1e;
+    --logo-button-hover-bg-color: var(--app-accent-bg-color);
 }
diff --git a/public/themes/light.css b/public/themes/light.css
index d6b22832..70179e14 100644
--- a/public/themes/light.css
+++ b/public/themes/light.css
@@ -23,6 +23,7 @@
 
     /* tab color */
     --tab-white: rgb(0, 0, 0, 0.6);
+    --tab-mint: rgb(70, 235, 156);
 
     /* button colors */
     --button-text-color: rgb(50, 50, 50); /* Dark gray for light theme */
@@ -72,6 +73,4 @@
 
     /* toggle colors */
     --toggle-thumb-color: var(--app-bg-color);
-
-    --logo-button-hover-bg-color: #f0f0f0;
 }
diff --git a/src/app/common/elements/mainview.less b/src/app/common/elements/mainview.less
index 224c6a2d..e5ff15b7 100644
--- a/src/app/common/elements/mainview.less
+++ b/src/app/common/elements/mainview.less
@@ -9,6 +9,10 @@
         display: none;
     }
 
+    .header-container {
+        border-bottom: 1px solid var(--app-border-color);
+    }
+
     .header {
         -webkit-app-region: drag;
         display: flex;
@@ -18,7 +22,6 @@
         vertical-align: middle;
         padding: 0 10px 0 10px;
         margin: 0;
-        border-bottom: 1px solid var(--app-border-color);
 
         .title {
             font-size: var(--title-font-size);
@@ -42,10 +45,10 @@
 
 // This ensures the tab bar does not collide with the floating logo. The floating logo sits above the sidebar when it is not collapsed, so no additional margin is needed in that case.
 // More margin is given on macOS to account for the traffic light buttons
-#main.platform-darwin.mainsidebar-collapsed .header {
-    margin-left: var(--floating-logo-width-darwin);
+#main.platform-darwin.mainsidebar-collapsed .header-container {
+    padding-left: var(--floating-logo-width-darwin);
 }
 
-#main:not(.platform-darwin).mainsidebar-collapsed .header {
-    margin-left: var(--floating-logo-width);
+#main:not(.platform-darwin).mainsidebar-collapsed .header-container {
+    padding-left: var(--floating-logo-width);
 }
diff --git a/src/app/common/elements/mainview.tsx b/src/app/common/elements/mainview.tsx
index aa6ae65c..65a3ef65 100644
--- a/src/app/common/elements/mainview.tsx
+++ b/src/app/common/elements/mainview.tsx
@@ -23,7 +23,7 @@ class MainView extends React.Component<{
                 className={cn("mainview", this.props.className)}
                 style={{ maxWidth: `calc(100vw - ${maxWidthSubtractor}px)` }}
             >
-                <div className="header-container bottom-border">
+                <div className="header-container">
                     <header className="header">
                         <div className="title text-primary">{this.props.title}</div>
                         <div className="close-div hoverEffect" title="Close (Escape)" onClick={this.props.onClose}>