diff --git a/data/de/homepage.yml b/data/de/homepage.yml
index 737d01f..e467090 100644
--- a/data/de/homepage.yml
+++ b/data/de/homepage.yml
@@ -93,7 +93,7 @@ slider:
 ############################# success #############################
 success_banner:
   enable : true
-  image : "media/success/success_banner.png"
+  image : "media/success/success_banner.webp"
   feature_item:
     # feature item loop
     - name : "Mathematikolympiade"
@@ -157,7 +157,7 @@ cta:
 ######################## Success story #############################
 success_story:
   enable : true
-  bg_image : "media/backgrounds/success-story.jpg"
+  bg_image : "media/backgrounds/success-story.webp"
   title : "Über die Schule"
   content : "Das Georg-Cantor-Gymnasium wurde im Jahre 1988 als eine mathematisch-naturwissenschaftliche Schule gegründet. Über die vielen Jahre kamen viele Veränderungen auf die Schule zu. Nach der Verleihung des Namen ''Georg-Cantor'', umformung zu einem Gymnasium, dem Umzug in ein neues Gebäude u.v.m ist die Schule heute ein erfolgreiches, modernes und produktives Gymnasium mit mathematisch-naturwissenschaftlichem Schwerpunkt, und dem Gütesiegel begabungsfördernde Schule vom Landesinstitut für Schulqualität und Lehrbildung."
   # video link
diff --git a/data/en/homepage.yml b/data/en/homepage.yml
index 59f3aa8..c7d98ab 100644
--- a/data/en/homepage.yml
+++ b/data/en/homepage.yml
@@ -98,11 +98,11 @@ cta:
 ######################## Success story #############################
 success_story:
   enable : true
-  bg_image : "media/backgrounds/success-story.jpg"
+  bg_image : "media/backgrounds/success-story.webp"
   title : "Success Stories"
   content : "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat pariatur. Excepteur sint occaecat.
-            
-            
+
+
   ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
   dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris"
   # video link
@@ -115,7 +115,7 @@ event:
   title : "Upcoming Events"
   # event item comes from "content/**/event" folder.
 
-  
+
 ########################### funfacts ############################
 funfacts:
   enable : true
@@ -144,4 +144,4 @@ funfacts:
 blog:
   enable : true
   title : "Latest News"
-  # blog item comes from "content/**/blog" folder.
\ No newline at end of file
+  # blog item comes from "content/**/blog" folder.
diff --git a/static/media/backgrounds/success-story.webp b/static/media/backgrounds/success-story.webp
new file mode 100644
index 0000000..052ec57
Binary files /dev/null and b/static/media/backgrounds/success-story.webp differ
diff --git a/static/media/success/success_banner.webp b/static/media/success/success_banner.webp
new file mode 100644
index 0000000..caaa276
Binary files /dev/null and b/static/media/success/success_banner.webp differ