diff --git a/common/common.scss b/common/common.scss
index 0e126692..0eea6d13 100644
--- a/common/common.scss
+++ b/common/common.scss
@@ -537,35 +537,4 @@ html body #main-outlet {
   box-shadow: none;
 }
 
-.names span.group--Tech a {
-    color: #DC2E17;
-}
-
-.names span.group--Staff a {
-    color: #DC2E17;
-}
-
-.names span.group--BoG a {
-    color: #DC2E17;
-}
-
-.names span.group--Supervisor a {
-    color: #DC2E17;
-}
-
-.names span.group--vatsim_staff a {
-    color: #DC2E17;
-}
-
-.names span.group--community_team a {
-    color: #DC2E17;
-}
-
-.names span.group--VSOA a {
-    color: #DC2E17;
-}
-
-.names span.group--virtualairline a {
-    color: #DC2E17;
-}
-
+@import "vatsim";
diff --git a/scss/vatsim/_group-colors.scss b/scss/vatsim/_group-colors.scss
new file mode 100644
index 00000000..43aa9835
--- /dev/null
+++ b/scss/vatsim/_group-colors.scss
@@ -0,0 +1,6 @@
+@each $group, $color in $vatsim-group-colors {
+  .names .group--#{$group} a {
+    color: #{$color};
+  }
+}
+
diff --git a/scss/vatsim/_index.scss b/scss/vatsim/_index.scss
new file mode 100644
index 00000000..4902ac2d
--- /dev/null
+++ b/scss/vatsim/_index.scss
@@ -0,0 +1,5 @@
+@import "variables";
+@import "group-colors";
+@import "mobile-categories";
+@import "overrides";
+
diff --git a/scss/vatsim/_mobile-categories.scss b/scss/vatsim/_mobile-categories.scss
new file mode 100644
index 00000000..eb587ff8
--- /dev/null
+++ b/scss/vatsim/_mobile-categories.scss
@@ -0,0 +1,20 @@
+.mobile-view {
+  .subcategory-list {
+
+    .parent-category {
+      display: inline-block;
+      padding: 6px 12px;
+      background-color: var(--secondary);
+      border-radius: 0.5em;
+    }
+
+    .category-list-item {
+      background-color: var(--secondary);
+      border-top: 0 !important;
+      border-bottom: 0 !important;
+      outline: 1px solid var(--secondary);
+      border-radius: 12px;
+    }
+
+  }
+}
diff --git a/scss/vatsim/_overrides.scss b/scss/vatsim/_overrides.scss
new file mode 100644
index 00000000..4868d13e
--- /dev/null
+++ b/scss/vatsim/_overrides.scss
@@ -0,0 +1,8 @@
+.navigation-container {
+    margin-top: 0;
+}
+
+.mobile-view .navigation-categories .navigation-container {
+    margin-top: 1em;
+}
+
diff --git a/scss/vatsim/_variables.scss b/scss/vatsim/_variables.scss
new file mode 100644
index 00000000..bf664e45
--- /dev/null
+++ b/scss/vatsim/_variables.scss
@@ -0,0 +1,12 @@
+$vatsim-staff-color: #dc2e17;
+
+$vatsim-group-colors: (
+  "Tech":           $vatsim-staff-color,
+  "Staff":          $vatsim-staff-color,
+  "BoG":            $vatsim-staff-color,
+  "Supervisor":     $vatsim-staff-color,
+  "vatsim_staff":   $vatsim-staff-color,
+  "community_team": $vatsim-staff-color,
+  "VSOA":           $vatsim-staff-color,
+  "virtualairline": $vatsim-staff-color
+);