diff --git a/components/home/HeroBanner.tsx b/components/home/HeroBanner.tsx
index 452b287..c9858d5 100644
--- a/components/home/HeroBanner.tsx
+++ b/components/home/HeroBanner.tsx
@@ -18,6 +18,15 @@ export default function HomeHeroBanner() {
         //     bgImage: '/assets/img/home/banner/banner-1.webp',
         //     image: '/assets/img/all-images/hero/hero-img11.png',
         // },
+        {
+            // title: 'Tamil Cultural Nite 2025',
+            // date: 'SERVING',
+            // location: 'WATERLOO – KITCHENER – CAMBRIDGE- GUELPH – BRANTFORD AND SURROUNDING AREAS SINCE 1989',
+            bgImage: '/assets/img/home/banner/banner.webp',
+            // image: '/assets/img/all-images/hero/hero-img12.png',
+            // buttonText: "Book Now",
+            // buttonLink: "/upcoming-event/tamil-cultural-nite-2025",
+        },
         {
             title: 'Tamil Cultural Nite 2025',
             date: 'SERVING',
@@ -77,56 +86,51 @@ export default function HomeHeroBanner() {
                             backgroundPosition: 'center bottom',
                         }}
                     >
-                        <div className="container">
+                        <div className="container" style={index === 0 ? { paddingTop: '180px' } : {}}>
                             <div className="row align-items-center">
                                 <div className="col-lg-7">
                                     <div className="hero8-header">
-                                        <h5>
-                                            {/* <img src="/assets/img/icons/sub-logo1.svg" alt="" /> */}
-                                            Where Culture Meets the Beat
-                                        </h5>
-                                        <div className="space16" />
-                                        <h1 className="text-anime-style-3" dangerouslySetInnerHTML={{ __html: slide.title || '' }}></h1>
+                                        {slide.title && (
+                                            <>
+                                                <h5>
+                                                    Where Culture Meets the Beat
+                                                </h5>
+                                                <div className="space16" />
+                                                <h1 className="text-anime-style-3" dangerouslySetInnerHTML={{ __html: slide.title }}></h1>
+                                            </>
+                                        )}
                                         <div className="space32" />
-                                        <div className="btn-area1">
-                                            <Link href={slide.buttonLink} className="vl-btn9">
-                                                <span className="demo">{slide.buttonText}</span>
-                                            </Link>
-                                            {/* <Link href="/event-schedule" className="vl-btn9 btn2">
-                                                <span className="demo">Schedules</span>
-                                            </Link> */}
-                                        </div>
+                                        {slide.buttonLink && slide.buttonText && (
+                                            <div className="btn-area1">
+                                                <Link href={slide.buttonLink} className="vl-btn9">
+                                                    <span className="demo">{slide.buttonText}</span>
+                                                </Link>
+                                            </div>
+                                        )}
                                     </div>
                                 </div>
-                                {/* <div className="col-lg-5">
-                                    <div className="img1">
-                                        <img src={slide.image} alt="" />
-                                    </div>
-                                </div> */}
                             </div>
-                            <div className="row">
-                                <div className="col-lg-12">
-                                    <div className="timer-bg-area">
-                                        <div className="row d-flex justify-content-center align-items-center" >
-                                            {/* <div className="col-lg-7">
-                                                <div className="timer-btn-area">
-                                                    <Countdown style={1} />
-                                                </div>
-                                            </div> */}
-                                            <div className="col-lg-12 text-center d-flex justify-content-center align-items-center">
-                                                <div className="heading12">
-                                                    <h3>{slide.date}</h3>
-                                                    {/* <div className="space16" /> */}
-                                                    <p>
-                                                        <img src="/assets/img/icons/location1.svg" alt="" />
-                                                        {slide.location}
-                                                    </p>
+                            {(slide.date || slide.location) && (
+                                <div className="row">
+                                    <div className="col-lg-12">
+                                        <div className="timer-bg-area">
+                                            <div className="row d-flex justify-content-center align-items-center" >
+                                                <div className="col-lg-12 text-center d-flex justify-content-center align-items-center">
+                                                    <div className="heading12">
+                                                        {slide.date && <h3>{slide.date}</h3>}
+                                                        {slide.location && (
+                                                            <p>
+                                                                <img src="/assets/img/icons/location1.svg" alt="" />
+                                                                {slide.location}
+                                                            </p>
+                                                        )}
+                                                    </div>
                                                 </div>
                                             </div>
                                         </div>
                                     </div>
                                 </div>
-                            </div>
+                            )}
                         </div>
                     </div>
                 </SwiperSlide>
diff --git a/public/assets/img/home/banner/banner.webp b/public/assets/img/home/banner/banner.webp
new file mode 100644
index 0000000..50cfa9f
Binary files /dev/null and b/public/assets/img/home/banner/banner.webp differ