Integrate light theme's `menu-color` using a media query

public/css/icinga/base.less

@@ -107,6 +107,8 @@
     --menu-flyout-bg-color: #F5F9FA;
     --tab-hover-bg-color: fade(#F5F9FA, 50%);
 
+    --menu-color: #676767;
+
     --menu-bg-color: #DEECF1;
     --menu-hover-bg-color: fade(#DEECF1, 50%);
     --menu-search-hover-bg-color: darken(#DEECF1, 20%);

public/css/icinga/layout.less

@@ -145,7 +145,7 @@
 }
 
 #mobile-menu-toggle {
-  color: @menu-color;
+  .var(color, menu-color);
   text-align: right;
 
   > button {
@@ -335,7 +335,7 @@
     .var(background-color, menu-bg-color);
     border-radius: 0 .25em .25em 0;
     box-shadow: 0 0 .25em 0 rgba(0, 0, 0, .2);
-    color: @menu-color;
+    .var(color, menu-color);
     width: 20em;
     position: fixed;
     z-index: 1;

public/css/icinga/menu.less

@@ -65,7 +65,7 @@
 
 #menu .nav-level-1 > .nav-item {
   line-height: 2.167em; // 26 px
-  color: @menu-color;
+  .var(color, menu-color);
 
   &.active {
     color: @menu-active-color;
@@ -210,7 +210,7 @@
   background: transparent url('../img/icons/search_white.png') no-repeat 1em center;
   background-size: 1em auto;
   border: none;
-  color: @menu-color;
+  .var(color, menu-color);
   line-height: 2.167em;
   padding: .25em;
   padding-left: @icon-width + .75em;
@@ -281,7 +281,7 @@
       }
 
       &.active > a {
-        color: @menu-color;
+        .var(color, menu-color);
       }
 
       // Hide activity caret when displayed as flyout
@@ -390,7 +390,7 @@
 .search-reset {
   background: none;
   border: 0;
-  color: @menu-color;
+  .var(color, menu-color);
   cursor: pointer;
   display: none;
   height: 100%;

public/css/icinga/tabs.less

@@ -27,7 +27,7 @@
   }
 
   > a {
-    color: @menu-color;
+    .var(color, menu-color);
 
     &:hover {
       text-decoration: none;

public/css/themes/icinga-light-theme.less

@@ -5,7 +5,6 @@
 @gray-lighter: #EEEEEE;
 @gray-lightest: #F7F7F7;
 
-@menu-color: #676767;
 @menu-active-bg-color: #EDF7FC;
 
 @menu-2ndlvl-color: #7E8182;