diff --git a/aio/src/styles/1-layouts/_sidenav.scss b/aio/src/styles/1-layouts/_sidenav.scss
index 24e868f275..2d97514fcb 100644
--- a/aio/src/styles/1-layouts/_sidenav.scss
+++ b/aio/src/styles/1-layouts/_sidenav.scss
@@ -104,7 +104,7 @@ button.vertical-menu-item {
 }
 
 .heading {
-  color: $blue-grey-700;
+  color: $darkgray;
   cursor: pointer;
   position: relative;
   text-transform: uppercase;
diff --git a/aio/src/styles/_constants.scss b/aio/src/styles/_constants.scss
index 2977007348..9ab6f9cb68 100755
--- a/aio/src/styles/_constants.scss
+++ b/aio/src/styles/_constants.scss
@@ -22,7 +22,7 @@ $offwhite: #FAFAFA;
 $backgroundgray: #F1F1F1;
 $lightgray: #DBDBDB;
 $mist: #ECEFF1;
-$mediumgray: #7E7E7E;
+$mediumgray: #6e6e6e;
 $darkgray: #333;
 $black: #0A1014;
 $orange: #FF9800;