diff --git a/images/hero-image.jpg b/images/hero-image.jpg
deleted file mode 100644
index 200eebe..0000000
Binary files a/images/hero-image.jpg and /dev/null differ
diff --git a/images/hero-image.png b/images/hero-image.png
new file mode 100644
index 0000000..cf7cf6f
Binary files /dev/null and b/images/hero-image.png differ
diff --git a/index.html b/index.html
index 8550825..b22854a 100644
--- a/index.html
+++ b/index.html
@@ -445,7 +445,7 @@
     </header>
 
     <!-- Hero Section -->
-    <section class="hero" style="background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('images/hero-image.jpg') center/cover no-repeat;">
+    <section class="hero" style="background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('images/hero-image.png') center/cover no-repeat;">
         <div class="container">
             <div class="hero-content">
                 <h1>Our Children, Our Future</h1>