diff --git a/site/assets/scss/_nav.scss b/site/assets/scss/_nav.scss
index 5e87acf09963..249c745771dd 100644
--- a/site/assets/scss/_nav.scss
+++ b/site/assets/scss/_nav.scss
@@ -71,7 +71,8 @@
 }
 
 .bd-announcement {
-  color: $white;
+  font-size: 14px;
+  color: #fff;
   background-color: $bd-purple;
   a {
     color: $white;
diff --git a/site/layouts/partials/announcement.html b/site/layouts/partials/announcement.html
index 1f7df8c9d649..27b8d0806d04 100644
--- a/site/layouts/partials/announcement.html
+++ b/site/layouts/partials/announcement.html
@@ -1,4 +1,4 @@
-<div class="d-block px-3 py-2 text-center text-bold bd-announcement">
+<div class="d-block p-3 text-center text-bold bd-announcement small text-white">
   Bootstrap 4 has reached end of life.
   <a href="https://getbootstrap.com/migration/" target="_blank" rel="noopener">Upgrade to the latest</a>
   or consider