diff --git a/src/Components/Banner/AddBanner.jsx b/src/Components/Banner/AddBanner.jsx
index 224fa15..e33f46c 100644
--- a/src/Components/Banner/AddBanner.jsx
+++ b/src/Components/Banner/AddBanner.jsx
@@ -31,7 +31,7 @@ import Header from "../Header";
 import ToastBox from "../ToastBox";
 import BannerMainCard from "./BannerMainCard";
 
-const AddBanner = ({ createApi, navigateLink, title }) => {
+const AddBanner = ({ createApi, navigateLink, title, center }) => {
   const toast = useToast();
   const navigate = useNavigate();
   const [isLoading, setIsLoading] = useState(false);
@@ -161,6 +161,7 @@ const AddBanner = ({ createApi, navigateLink, title }) => {
             heading={formData?.heading}
             subHeading={formData?.sub_heading}
             buttonTitle={formData?.CTO_button_title}
+            center={center}
             />
 
 
diff --git a/src/Components/Banner/BannerEdit.jsx b/src/Components/Banner/BannerEdit.jsx
index 918192e..af0c85e 100644
--- a/src/Components/Banner/BannerEdit.jsx
+++ b/src/Components/Banner/BannerEdit.jsx
@@ -38,7 +38,7 @@ import CommunityBannerCard from "../../Pages/Community/CommunityBannerCard";
 import BannerMainCard from "./BannerMainCard";
 import ToastBox from "../ToastBox";
 
-const BannerEdit = ({isLoading, data, updateBanner, navigateTo, refetch}) => {
+const BannerEdit = ({isLoading, data, updateBanner, navigateTo, refetch, center}) => {
   const { id } = useParams();
   const toast = useToast();
   const navigate = useNavigate();
@@ -203,6 +203,7 @@ const BannerEdit = ({isLoading, data, updateBanner, navigateTo, refetch}) => {
             heading={formData?.heading}
             subHeading={formData?.sub_heading}
             buttonTitle={formData?.CTO_button_title}
+            center={center}
             />
 
 
diff --git a/src/Components/Banner/BannerMainCard.jsx b/src/Components/Banner/BannerMainCard.jsx
index d2b673a..3a50a11 100644
--- a/src/Components/Banner/BannerMainCard.jsx
+++ b/src/Components/Banner/BannerMainCard.jsx
@@ -1,7 +1,7 @@
 import { Box, Button, Text } from '@chakra-ui/react'
 import React from 'react'
 
-const BannerMainCard = ({heading, subHeading, buttonTitle, imgLink}) => {
+const BannerMainCard = ({heading, subHeading, buttonTitle, imgLink, center}) => {
   return (
     <Box
     shadow={"md"}
@@ -15,10 +15,11 @@ const BannerMainCard = ({heading, subHeading, buttonTitle, imgLink}) => {
     ps={8}
     pt={14}
     >
-      <Text w={"70%"}fontSize={"19px"} className="fw-bolder" color={"#DE858E"} display={'block'} as={"span"}>
+    <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>
-      <Text w={"70%"} fontSize={"10px"} mt={1} className=" fw-normal" color={"#ffffff"} display={'block'} as={"span"}>
+      <Text textAlign={center ? "center":'start'} w={center ? "92%" : "74%"} fontSize={"10px"} mt={1} className=" fw-normal" color={"#ffffff"} display={'block'} as={"span"}>
         {subHeading}
       </Text>
       <Button
@@ -43,7 +44,7 @@ const BannerMainCard = ({heading, subHeading, buttonTitle, imgLink}) => {
     
   >
     {buttonTitle}
-  </Button>
+  </Button></Box>
 
   </Box>
   )
diff --git a/src/Components/Banner/BannerView.jsx b/src/Components/Banner/BannerView.jsx
index c1417fd..7dcd194 100644
--- a/src/Components/Banner/BannerView.jsx
+++ b/src/Components/Banner/BannerView.jsx
@@ -17,7 +17,7 @@ import {
 } from "@chakra-ui/react";
 import BannerMainCard from "./BannerMainCard";
 
-const BannerView = ({data, isLoading, editLink}) => {
+const BannerView = ({data, isLoading, editLink, center}) => {
   const banner = data?.data;
 
   return isLoading ? (
@@ -73,6 +73,7 @@ const BannerView = ({data, isLoading, editLink}) => {
             heading={banner?.Heading}
             subHeading={banner?.sub_heading}
             buttonTitle={banner?.CTO_button_title}
+            center={center}
             />
 
 
diff --git a/src/Pages/Banners/HomeBanner/HomeBannerEdit.jsx b/src/Pages/Banners/HomeBanner/HomeBannerEdit.jsx
index 25f4859..b307da0 100644
--- a/src/Pages/Banners/HomeBanner/HomeBannerEdit.jsx
+++ b/src/Pages/Banners/HomeBanner/HomeBannerEdit.jsx
@@ -11,7 +11,7 @@ const BannerHomeEdit = () => {
   //   refetch();
   // }, [id, refetch]);
   return (
-    <BannerEdit refetch={refetch} navigateTo="/banner/home" isLoading={isLoading} data={data} updateBanner={updateLearnBanner} />
+    <BannerEdit center={true} refetch={refetch} navigateTo="/banner/home" isLoading={isLoading} data={data} updateBanner={updateLearnBanner} />
   )
 }
 
diff --git a/src/Pages/Banners/HomeBanner/HomeBannerView.jsx b/src/Pages/Banners/HomeBanner/HomeBannerView.jsx
index 27f9e24..4d6ae03 100644
--- a/src/Pages/Banners/HomeBanner/HomeBannerView.jsx
+++ b/src/Pages/Banners/HomeBanner/HomeBannerView.jsx
@@ -9,7 +9,7 @@ const HomeBannerView = () => {
   const { data, error, isLoading } = useGetHomeBannerByIdQuery(id);
 
   
-  return <BannerView editLink={'/banner/home/edit'} isLoading={isLoading} data={data} />;
+  return <BannerView center={true} editLink={'/banner/home/edit'} isLoading={isLoading} data={data} />;
 };
 
 export default HomeBannerView;