diff --git a/components/core/Featurebar/Featurebar.module.css b/components/core/Featurebar/Featurebar.module.css
deleted file mode 100644
index f8aa6ba4d..000000000
--- a/components/core/Featurebar/Featurebar.module.css
+++ /dev/null
@@ -1,9 +0,0 @@
-.separator {
-  @apply mx-3 bg-secondary;
-  width: 1px;
-  height: 20px;
-}
-
-.separator:before {
-  content: '';
-}
diff --git a/components/core/Featurebar/Featurebar.tsx b/components/core/Featurebar/Featurebar.tsx
index 0f77fece6..22d637113 100644
--- a/components/core/Featurebar/Featurebar.tsx
+++ b/components/core/Featurebar/Featurebar.tsx
@@ -1,6 +1,5 @@
 import cn from 'classnames'
 import { FC } from 'react'
-import s from './Featurebar.module.css'
 
 interface Props {
   className?: string
@@ -18,15 +17,16 @@ const Featurebar: FC<Props> = ({
   hide,
 }) => {
   const rootClassName = cn(
-    'transition-transform transform duration-500 ease-out p-6 bg-primary text-base text-sm md:flex flex-row justify-center items-center font-medium fixed bottom-0 w-full z-10',
+    'transition-transform transform duration-500 text-center ease-out p-6 bg-primary text-base text-sm md:flex md:text-left flex-row justify-center items-center font-medium fixed bottom-0 w-full z-10',
     { 'translate-y-full': hide },
     className
   )
   return (
     <div className={rootClassName}>
-      <span>{title}</span>
-      <span className={s.separator} />
-      <span>{description}</span>
+      <span className="block md:inline">{title}</span>
+      <span className="block mb-6 md:inline md:mb-0 md:ml-2">
+        {description}
+      </span>
       {action && action}
     </div>
   )