diff --git a/src/components/home/BenefitsCard.tsx b/src/components/home/BenefitsCard.tsx
index 8410441a10..6600106766 100644
--- a/src/components/home/BenefitsCard.tsx
+++ b/src/components/home/BenefitsCard.tsx
@@ -8,7 +8,7 @@ const BenefitsCard = (): JSX.Element => {
       <div className="md:flex md:flex-wrap justify-center gap-10 w-[100%]">
         {benefits.map((item) => (
           <a
-            className="group border border-solid border-tailCall-border-dark-300 rounded-3xl md:w-[40%] lg:w-[45%] md:px-10 px-4 py-2 pt-4 lg:flex benefits-drop-shadow hover:border-[#FDEA2E] md:mb-0 mb-6 cursor-pointer hover:no-underline"
+            className="group border border-solid border-tailCall-border-dark-300 rounded-3xl md:w-[40%] lg:w-[45%] md:px-10 px-4 py-2 pt-4 lg:flex benefits-drop-shadow hover:border-[#FDEA2E] md:mb-0 mb-6 cursor-pointer hover:no-underline flex flex-col lg:flex-row"
             key={item.id}
             href={item.redirection_url}
             target="_blank"