diff --git a/src/Components/Banner/BannerMainCard.jsx b/src/Components/Banner/BannerMainCard.jsx
index 3a50a11..0e2826a 100644
--- a/src/Components/Banner/BannerMainCard.jsx
+++ b/src/Components/Banner/BannerMainCard.jsx
@@ -2,6 +2,14 @@ import { Box, Button, Text } from '@chakra-ui/react'
 import React from 'react'
 
 const BannerMainCard = ({heading, subHeading, buttonTitle, imgLink, center}) => {
+
+
+  const words = heading.split(' ');
+  const firstThreeWords = words.slice(0, 3).join(' ');
+  const remainingWords = words.slice(3).join(' ');
+
+
+
   return (
     <Box
     shadow={"md"}
@@ -16,8 +24,10 @@ const BannerMainCard = ({heading, subHeading, buttonTitle, imgLink, center}) =>
     pt={14}
     >
     <Box w={center ? "92%" : "100%"} display={'flex'} flexDirection={'column'} alignItems={center ? 'center' : "start"}>
-      <Text textAlign={center ? "center":'start'} w={center ? "80%" : "74%"}fontSize={"19px"} className="fw-bolder" color={"#DE858E"} display={'block'} as={"span"}>
-        {heading}
+      <Text textAlign={center ? "center":'start'} w={center ? "80%" : "74%"}fontSize={"19px"} className="fw-bolder" color={"#FFFFFF"} display={'block'} as={"span"}>
+      <span style={{ color: '#DE858E' }}>{firstThreeWords}</span>
+      {' '}
+      <span>{remainingWords}</span>
       </Text>
       <Text textAlign={center ? "center":'start'} w={center ? "92%" : "74%"} fontSize={"10px"} mt={1} className=" fw-normal" color={"#ffffff"} display={'block'} as={"span"}>
         {subHeading}