diff --git a/website/client/src/assets/scss/tiers.scss b/website/client/src/assets/scss/tiers.scss
index 52028395bd..9e9dfc46fd 100644
--- a/website/client/src/assets/scss/tiers.scss
+++ b/website/client/src/assets/scss/tiers.scss
@@ -1,41 +1,83 @@
 .tier1 {
   color: #c42870;
+
+  &:hover, &:active, &:focus {
+    color: #c42870;
+  }
 }
 
 .tier2 {
   color: #b01515;
+
+  &:hover, &:active, &:focus {
+    color: #b01515;
+  }
 }
 
 .tier3 {
   color: #d70e14;
+
+  :hover, :active, :focus {
+    color: #d70e14;
+  }
 }
 
 .tier4 {
   color: #c24d00;
+
+  &:hover, &:active, :focus {
+    color: #c24d00;
+  }
 }
 
 .tier5 {
   color: #9e650f;
+
+  :hover, :active, :focus {
+    color: #9e650f;
+  }
 }
 
 .tier6 {
   color: #2b8363;
+
+  :hover, :active, &:focus {
+    color: #2b8363;
+  }
 }
 
 .tier7 {
   color: #167e87;
+
+  &:hover, &:active, &:focus {
+    color: #167e87;
+  }
 }
 
 .tier8 {
   color: #277eab;
+
+  &:hover, &:active, &:focus {
+    color: #277eab;
+  }
 }
 
 .tier9 {
   color: #6133b4;
+
+  &:hover, &:active, &:focus {
+    color: #6133b4;
+  }
 }
 
 .tierNPC, .npc {
   color: #77f4c7;
   fill: #77f4c7;
   stroke: #005737;
+
+  &:hover, &:active, &:focus {
+    color: #77f4c7;
+    fill: #77f4c7;
+    stroke: #005737;
+  }
 }