diff --git a/public/css/Cis4/Cis.css b/public/css/Cis4/Cis.css
index 8010d0746..ea59cb9d8 100644
--- a/public/css/Cis4/Cis.css
+++ b/public/css/Cis4/Cis.css
@@ -40,21 +40,21 @@ html {
 }
 
 .fhc-secondary-bg{
-	background-color: var(--fhc-secondary) !important;
-}
-
-.fhc-secondary-color {
-	color: var(--fhc-secondary) !important;
-}
-
-.fhc-tertiary-bg{
 	background-color: var(--fhc-tertiary) !important;
 }
 
-.fhc-tertiary-color {
+.fhc-secondary-color {
 	color: var(--fhc-tertiary) !important;
 }
 
+.fhc-tertiary-bg{
+	background-color: var(--fhc-secondary) !important;
+}
+
+.fhc-tertiary-color {
+	color: var(--fhc-secondary) !important;
+}
+
 .fhc-fourth-bg {
 	background-color: var(--fhc-fourth) !important;
 }
@@ -79,13 +79,13 @@ html {
 
 .fhc-secondary {
 	color: var(--fhc-text);
-	background-color: var(--fhc-secondary);
+	background-color: var(--fhc-tertiary);
 	border-color: var(--fhc-border);
 }
 
 .fhc-tertiary{
 	color: var(--fhc-text);
-	background-color: var(--fhc-tertiary);
+	background-color: var(--fhc-secondary);
 	border-color:var(--fhc-border);
 }
 
@@ -99,8 +99,8 @@ html {
 
 :root{	
 	/* sidebar colors */
-	--fhc-cis-sidebar-bg: var(--fhc-tertiary);
-	--fhc-cis-menu-bg: var(--fhc-tertiary);
+	--fhc-cis-sidebar-bg: var(--fhc-secondary);
+	--fhc-cis-menu-bg: var(--fhc-secondary);
 
 	--fhc-cis-header-px: 1rem;
 	--fhc-cis-header-py: .5rem;
@@ -112,14 +112,14 @@ html {
 	--fhc-cis-menu-lvl-1-bg-hover: var(--fhc-primary-highlight);
 	--fhc-cis-menu-lvl-1-color-hover: var(--fhc-text);
 
-	--fhc-cis-menu-lvl-2-bg: var(--fhc-tertiary);
+	--fhc-cis-menu-lvl-2-bg: var(--fhc-secondary);
 	--fhc-cis-menu-lvl-2-color: var(--fhc-text);
-	--fhc-cis-menu-lvl-2-bg-hover: var(--fhc-tertiary-highlight);
+	--fhc-cis-menu-lvl-2-bg-hover: var(--fhc-secondary-highlight);
 	--fhc-cis-menu-lvl-2-color-hover: var(--fhc-text);
 
-	--fhc-cis-menu-lvl-3-bg: var(--fhc-secondary);
+	--fhc-cis-menu-lvl-3-bg: var(--fhc-tertiary);
 	--fhc-cis-menu-lvl-3-color: var(--fhc-text);
-	--fhc-cis-menu-lvl-3-bg-hover: var(--fhc-secondary-highlight);
+	--fhc-cis-menu-lvl-3-bg-hover: var(--fhc-tertiary-highlight);
 	--fhc-cis-menu-lvl-3-color-hover: var(--fhc-text);
 
 	--fhc-cis-menu-lvl-4-bg: var(--fhc-fourth);
@@ -582,7 +582,7 @@ html {
   }
 }
 .fhc-header > h1 > small {
-  color: var(--fhc-secondary);
+  color: var(--fhc-tertiary);
   font-size: 1rem;
 }
 .fhc-header > h1 > small:before {
diff --git a/public/css/Fhc.css b/public/css/Fhc.css
index c5368930d..6827f2d3f 100644
--- a/public/css/Fhc.css
+++ b/public/css/Fhc.css
@@ -10,7 +10,7 @@
   font-size: calc(1.325rem + .9vw);
 }
 .fhc-header > :first-child > small {
-  color: var(--fhc-secondary);
+  color: var(--fhc-tertiary);
   font-size: .65em;
   padding-inline-start: 1em;
 }
diff --git a/public/css/components/NavigationComponent.css b/public/css/components/NavigationComponent.css
index bf38d3d8c..e922d4812 100644
--- a/public/css/components/NavigationComponent.css
+++ b/public/css/components/NavigationComponent.css
@@ -3,11 +3,11 @@
  */
 
  :root{
-	--nav-component-bg: var(--fhc-secondary);
+	--nav-component-bg: var(--fhc-tertiary);
 	--nav-component-border: var(--fhc-border);
 	--nav-component-color: var(--fhc-text);
 	--nav-left-component-border: var(--fhc-border);
-	--nav-left-component-bg: var(--fhc-secondary);
+	--nav-left-component-bg: var(--fhc-tertiary);
 	--nav-left-component-color: var(--fhc-primary);
 	--nav-left-component-hover: var(--fhc-secondary-highlight);
  }
diff --git a/public/css/theme/default.css b/public/css/theme/default.css
index 2d94847ee..7f39cff54 100644
--- a/public/css/theme/default.css
+++ b/public/css/theme/default.css
@@ -57,11 +57,11 @@
 	--fhc-primary: var(--fhc-blue-20);
 	--fhc-primary-highlight: var(--fhc-blue-40);
 
-	--fhc-tertiary: var(--fhc-white-20);
-	--fhc-tertiary-highlight: var(--fhc-white-40);
-
-	--fhc-secondary: var(--fhc-white-40);
-	--fhc-secondary-highlight: var(--fhc-white-60);
+	--fhc-secondary: var(--fhc-white-20);
+	--fhc-secondary-highlight: var(--fhc-white-40);
+	
+	--fhc-tertiary: var(--fhc-white-40);
+	--fhc-tertiary-highlight: var(--fhc-white-60);
 
 	--fhc-fourth: var(--fhc-white-60);
 	--fhc-fourth-highlight: var(--fhc-white-80);
@@ -106,11 +106,11 @@
 	--fhc-primary: var(--fhc-blue-primary-highlight);
 	--fhc-primary-highlight: var(--fhc-blue-primary);
 
-	--fhc-secondary: var(--fhc-black-70);
-	--fhc-secondary-highlight: var(--fhc-gray-40);
+	--fhc-secondary: var(--fhc-black-50);
+	--fhc-secondary-highlight: var(--fhc-black-70);
 
-	--fhc-tertiary: var(--fhc-black-50);
-	--fhc-tertiary-highlight: var(--fhc-black-70);
+	--fhc-tertiary: var(--fhc-black-70);
+	--fhc-tertiary-highlight: var(--fhc-gray-40);
 
 	--fhc-danger: var(--fhc-red-10);
 
@@ -163,11 +163,11 @@
 	--fhc-primary: var(--fhc-purple-primary-highlight);
 	--fhc-primary-highlight: var(--fhc-purple-primary);
 
-	--fhc-secondary: var(--fhc-purple-30);
-	--fhc-secondary-highlight: var(--fhc-purple-50);
+	--fhc-secondary: var(--fhc-purple-20);
+	--fhc-secondary-highlight: var(--fhc-purple-40);
 
-	--fhc-tertiary: var(--fhc-purple-20);
-	--fhc-tertiary-highlight: var(--fhc-purple-40);
+	--fhc-tertiary: var(--fhc-purple-30);
+	--fhc-tertiary-highlight: var(--fhc-purple-50);
 
 	/* background */
 	--fhc-background: var(--fhc-purple-5);
@@ -256,10 +256,10 @@ html.dark .tabulator .tabulator-row {
 }
 
 html.dark .tabulator .tabulator-cell {
-	background-color: var(--fhc-secondary) !important;
+	background-color: var(--fhc-tertiary) !important;
 	border-color: var(--fhc-border) !important;
 }
 
 html.dark .tabulator .tabulator-header .tabulator-col:hover {
-	background-color: var(--fhc-secondary) !important;
+	background-color: var(--fhc-tertiary) !important;
 }
\ No newline at end of file
diff --git a/public/js/components/Cis/Cms/Content_types/General.js b/public/js/components/Cis/Cms/Content_types/General.js
index 85716ef43..c57ccd8ca 100644
--- a/public/js/components/Cis/Cms/Content_types/General.js
+++ b/public/js/components/Cis/Cms/Content_types/General.js
@@ -111,7 +111,7 @@ export default {
 				element.style.backgroundColor = "var(--fhc-background)";
 			}
 			if(element.querySelector("*[style*=background-color]")){
-				element.style.backgroundColor = "var(--fhc-secondary)";
+				element.style.backgroundColor = "var(--fhc-tertiary)";
 			}
 		});