diff --git a/packages/freesewing.shared/components/popout.js b/packages/freesewing.shared/components/popout.js
index e2900449dc3..e951e55f53f 100644
--- a/packages/freesewing.shared/components/popout.js
+++ b/packages/freesewing.shared/components/popout.js
@@ -35,7 +35,7 @@ const Popout = (props) => {
   return (
     <div className={`relative my-8 bg-${color} bg-opacity-5`}>
       <div className={`
-        border-l-4 px-8 py-2 shadow border-${color}`}>
+        border-y-4 sm:border-0 sm:border-l-4 px-6 sm:px-8 py-4 sm:py-2 shadow border-${color}`}>
         <div className={`font-bold uppercase text-${color}`}>
           {type}
         </div>