diff --git a/src/assets/images/drag-and-drop.gif b/src/assets/images/drag-and-drop.gif
index d1c353e..e1c193f 100644
Binary files a/src/assets/images/drag-and-drop.gif and b/src/assets/images/drag-and-drop.gif differ
diff --git a/src/assets/images/recipe-demo.gif b/src/assets/images/recipe-demo.gif
index 56895ac..c375965 100644
Binary files a/src/assets/images/recipe-demo.gif and b/src/assets/images/recipe-demo.gif differ
diff --git a/src/assets/images/sql-query-demo.gif b/src/assets/images/sql-query-demo.gif
index aaab6ca..32b67f4 100644
Binary files a/src/assets/images/sql-query-demo.gif and b/src/assets/images/sql-query-demo.gif differ
diff --git a/src/components/Features0.jsx b/src/components/Features0.jsx
index ac88edd..a95ea64 100644
--- a/src/components/Features0.jsx
+++ b/src/components/Features0.jsx
@@ -5,9 +5,7 @@ import { CheckArrowIcon } from "../assets/icons/CheckArrowIcon";
 
 export const Features0 = () => {
     return (
-        <section
-            className="w-full bg-customDarkBg2 mt-20 mb-8 sm:mt-16 sm:mb-16 xl:mt-0"
-        >
+        <section className="w-full bg-customDarkBg2 mt-20 mb-8 sm:mt-16 sm:mb-16 xl:mt-0">
             <motion.div
                 initial={{ opacity: 0 }}
                 whileInView={{ opacity: 1 }}
@@ -39,7 +37,8 @@ export const Features0 = () => {
                                 <li className="mb-4 flex">
                                     <CheckArrowIcon />
                                     <span>
-                                        File formats: .csv, .xlsx, .tsv, .tab, .xls, .ods, .xlsm, .xlsb
+                                        File formats: .csv, .xlsx, .tsv, .tab,
+                                        .xls, .ods, .xlsm, .xlsb
                                     </span>
                                 </li>
                                 <li className="mb-4 flex">
@@ -52,8 +51,8 @@ export const Features0 = () => {
                                 <li className="mb-4 flex">
                                     <CheckArrowIcon />
                                     <span>
-                                        Begins scanning and analysis of compatible file data
-                                        after import
+                                        Begins scanning and analysis of
+                                        compatible file data after import
                                     </span>
                                 </li>
                                 <li className="mb-4 flex">
diff --git a/src/components/Features1.jsx b/src/components/Features1.jsx
index ee69d2e..8932bc5 100644
--- a/src/components/Features1.jsx
+++ b/src/components/Features1.jsx
@@ -53,6 +53,8 @@ export const Features1 = () => {
                     </div>
                     <div className="w-full md:w-3/4 mb-8 md:mb-0 mx-auto lg:w-1/2 flex flex-wrap lg:-mx-4 sm:pr-8 justify-center">
                         <img
+                            decoding="async"  
+                            loading="lazy"
                             src={recipedemo.src}
                             alt="Recipe Demo"
                             className="rounded-xl custom-border-gray"
diff --git a/src/components/Features2.jsx b/src/components/Features2.jsx
index 9f181f5..bdfa4fa 100644
--- a/src/components/Features2.jsx
+++ b/src/components/Features2.jsx
@@ -14,6 +14,8 @@ export const Features2 = () => (
             <div className="flex flex-wrap items-center 2xl:w-[1450px] xl:w-[1300px] w-11/12 mx-auto md:pl-4 xl:pr-16 xl:pl-16">
                 <div className="w-full md:w-1/2 mb-8 md:mb-0 lg:pl-16 flex justify-center mx-auto pt-16 lg:pt-0">
                     <img
+                        decoding="async"  
+                        loading="lazy"
                         src={uploadtockan.src}
                         alt="CKAN Upload Demo"
                         className="rounded-xl custom-border-gray"
diff --git a/src/components/Features3.jsx b/src/components/Features3.jsx
index 29fac72..7b77e4a 100644
--- a/src/components/Features3.jsx
+++ b/src/components/Features3.jsx
@@ -60,6 +60,8 @@ export const Features3 = () => {
                     </div>
                     <div className="w-full md:w-3/4 mb-8 md:mb-0 mx-auto lg:w-1/2 flex flex-wrap lg:-mx-4 sm:pr-8 justify-center">
                         <img
+                            decoding="async"  
+                            loading="lazy"
                             src={recipedemo.src}
                             alt="Recipe Demo"
                             className="rounded-xl custom-border-gray"