diff --git a/docs_theme/assets/index.css b/docs_theme/assets/index.css
index 6a05be25e..472de17e0 100644
--- a/docs_theme/assets/index.css
+++ b/docs_theme/assets/index.css
@@ -66,6 +66,7 @@ h3 {
 }
 
 header {
+  background-color: --mid-purple;
   background-image: linear-gradient(211deg, var(--mid-purple) 0%, var(--dark-purple) 100%);
   color: var(--white);
   border: 0px solid transparent;
@@ -202,6 +203,7 @@ nav a:visited:hover {
 nav a.cta {
   display: inline-block;
   color: var(--white);
+  background-color: --mid-purple;
   background-image: linear-gradient(259deg, var(--mid-purple) 0%, var(--dark-purple) 100%);
   box-shadow: 0 2px 8px 0 var(--blacker-shadow);
   border-radius: 50px;
@@ -213,6 +215,7 @@ nav a.cta {
 
 nav a.cta:hover {
   text-decoration: none;
+  background-color: --mid-purple;
   background-image: linear-gradient(259deg, var(--bright-purple) 0%, var(--dark-purple) 100%);
   box-shadow: 0 4px 16px 0 var(--black-shadow);
   color: var(--off-white);
diff --git a/docs_theme/assets/theme.css b/docs_theme/assets/theme.css
index 9c78ded8d..29b32c68c 100644
--- a/docs_theme/assets/theme.css
+++ b/docs_theme/assets/theme.css
@@ -76,7 +76,8 @@ div.rst-content {
 }
 
 .wy-nav-top {
-  background-image: linear-gradient(-211deg, var(--light-purple) 0%, var(--dark-purple) 100%);
+  background-color: --mid-purple;
+  background-image: linear-gradient(-211deg, var(--mid-purple) 0%, var(--dark-purple) 100%);
 }
 
 .wy-nav-top .fa-bars {
@@ -172,6 +173,7 @@ a.icon-home:before {
 
 
 .wy-nav-side {
+  background-color: --mid-purple;
   background-image: linear-gradient(211deg, var(--mid-purple) 0%, var(--dark-purple) 100%);
   font-weight: 300;
   height: 100%;