diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue
index 08ea469..486545d 100644
--- a/src/components/Sidebar.vue
+++ b/src/components/Sidebar.vue
@@ -7,10 +7,10 @@
             href="#0"
             class="flex items-center no-underline focus:underline px-4 py-2 text-sm"
             :class="{
-              'bg-grey-darker text-white': link.active,
-              'border-transparent hover:bg-grey hover:text-blue-dark': !link.active,
-              'text-grey-dark cursor-not-allowed': link.disabled,
-              'text-grey-darker': !link.disabled,
+              'bg-grey-darker text-white hover:text-white': link.active,
+              'border-transparent hover:bg-grey': !link.active,
+              'text-grey-dark cursor-not-allowed hover:text-grey-dark_': link.disabled,
+              'text-grey-darker hover:text-blue-dark': !link.disabled && !link.active,
             }"
           >
             <svg class="h-6 w-6 fill-current" role="presentation"><use :xlink:href="`/img/icons.symbol.svg#${link.icon}`"></use></svg>
diff --git a/tailwind.js b/tailwind.js
index 6d2d1b6..81a7dcd 100644
--- a/tailwind.js
+++ b/tailwind.js
@@ -9,7 +9,7 @@ var colors = {
   'blue-darker': '#004f86',
   'blue-light': '#29aae1',
   'green': '#398002',
-  'grey': '#B7B7B7',
+  'grey': '#bbb',
   'grey-dark': '#888888',
   'grey-darker': '#555555',
   'grey-darkest': '#333333',