diff --git a/pages/index.tsx b/pages/index.tsx
index 7e202e306..22174f791 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -4,11 +4,11 @@ import { Navbar } from "components";
 export default function Home() {
   return (
     <>
-      <Navbar />
       <Featurebar
         title="Free Standard Shipping on orders over $99.99"
         description="Due to COVID-19, some orders may experience processing and delivery delays."
       />
+      <Navbar />
       <Container className="py-12">
         <Button>Click Me!</Button>
       </Container>
diff --git a/ui/Featurebar/Featurebar.module.css b/ui/Featurebar/Featurebar.module.css
index a51eaa7bb..2207da147 100644
--- a/ui/Featurebar/Featurebar.module.css
+++ b/ui/Featurebar/Featurebar.module.css
@@ -3,9 +3,13 @@
 }
 
 .title {
-  @apply text-indigo-500 font-medium;
+  @apply text-white font-medium;
+}
+
+.separator {
+  @apply mx-2 font-medium text-xs leading-6;
 }
 
 .description {
-  @apply ml-2 text-white font-medium;
+  @apply text-white font-medium;
 }
diff --git a/ui/Featurebar/Featurebar.tsx b/ui/Featurebar/Featurebar.tsx
index 5af3ebde7..87a69d0f1 100644
--- a/ui/Featurebar/Featurebar.tsx
+++ b/ui/Featurebar/Featurebar.tsx
@@ -17,6 +17,7 @@ const Featurebar: FunctionComponent<Props> = ({
   return (
     <div className={rootClassName}>
       <span className={s.title}>{title}</span>
+      <span className={s.separator}>|</span>
       <span className={s.description}>{description}</span>
     </div>
   );