diff --git a/newVersion/assets/screenshotPage1.jpg b/newVersion/assets/screenshotPage1.jpg
new file mode 100644
index 0000000..25abc4b
Binary files /dev/null and b/newVersion/assets/screenshotPage1.jpg differ
diff --git a/newVersion/assets/screenshotPage1.png b/newVersion/assets/screenshotPage1.png
deleted file mode 100644
index 19254d1..0000000
Binary files a/newVersion/assets/screenshotPage1.png and /dev/null differ
diff --git a/newVersion/assets/screenshotPage1a.jpg b/newVersion/assets/screenshotPage1a.jpg
new file mode 100644
index 0000000..293574a
Binary files /dev/null and b/newVersion/assets/screenshotPage1a.jpg differ
diff --git a/newVersion/assets/screenshotPage2a.jpg b/newVersion/assets/screenshotPage2a.jpg
new file mode 100644
index 0000000..45508e8
Binary files /dev/null and b/newVersion/assets/screenshotPage2a.jpg differ
diff --git a/newVersion/assets/screenshotPage2a.png b/newVersion/assets/screenshotPage2a.png
deleted file mode 100644
index 04e340e..0000000
Binary files a/newVersion/assets/screenshotPage2a.png and /dev/null differ
diff --git a/newVersion/assets/screenshotPage3.jpg b/newVersion/assets/screenshotPage3.jpg
new file mode 100644
index 0000000..e088ef6
Binary files /dev/null and b/newVersion/assets/screenshotPage3.jpg differ
diff --git a/newVersion/assets/screenshotPage3.png b/newVersion/assets/screenshotPage3.png
deleted file mode 100644
index db4c00c..0000000
Binary files a/newVersion/assets/screenshotPage3.png and /dev/null differ
diff --git a/newVersion/assets/screenshotPage3a.jpg b/newVersion/assets/screenshotPage3a.jpg
new file mode 100644
index 0000000..06ad6e3
Binary files /dev/null and b/newVersion/assets/screenshotPage3a.jpg differ
diff --git a/newVersion/assets/screenshotPage3a.png b/newVersion/assets/screenshotPage3a.png
deleted file mode 100644
index 3efe329..0000000
Binary files a/newVersion/assets/screenshotPage3a.png and /dev/null differ
diff --git a/newVersion/assets/screenshotPage4.jpg b/newVersion/assets/screenshotPage4.jpg
new file mode 100644
index 0000000..d29e019
Binary files /dev/null and b/newVersion/assets/screenshotPage4.jpg differ
diff --git a/newVersion/assets/screenshotPage4.png b/newVersion/assets/screenshotPage4.png
deleted file mode 100644
index 18c48e0..0000000
Binary files a/newVersion/assets/screenshotPage4.png and /dev/null differ
diff --git a/newVersion/assets/screenshotPage4a.jpg b/newVersion/assets/screenshotPage4a.jpg
new file mode 100644
index 0000000..f6fe325
Binary files /dev/null and b/newVersion/assets/screenshotPage4a.jpg differ
diff --git a/newVersion/assets/screenshotPage4a.png b/newVersion/assets/screenshotPage4a.png
deleted file mode 100644
index 5ee22fe..0000000
Binary files a/newVersion/assets/screenshotPage4a.png and /dev/null differ
diff --git a/newVersion/css/examplesStyle.css b/newVersion/css/examplesStyle.css
index 9d7aca0..369c3bf 100644
--- a/newVersion/css/examplesStyle.css
+++ b/newVersion/css/examplesStyle.css
@@ -21,14 +21,14 @@ body {
 
 #step-3 {
     position: fixed;
-    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage2a.png');
+    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage2a.jpg');
     background-repeat: no-repeat;
     background-size: cover;
 }
 
 #step-4 {
     position: fixed;
-    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage3a.png');
+    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage3a.jpg');
     background-repeat: no-repeat;
     background-size: cover;
 }
@@ -42,14 +42,14 @@ body {
 
 #step-6 {
     position: fixed;
-    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage4a.png');
+    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage4a.jpg');
     background-repeat: no-repeat;
     background-size: cover;
 }
 
 #step-7 {
     position: fixed;
-    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage1a.png');
+    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage1a.jpg');
     background-repeat: no-repeat;
     background-size: cover;
 }
diff --git a/newVersion/css/homeStyle.css b/newVersion/css/homeStyle.css
index da4dd89..5abbcc6 100644
--- a/newVersion/css/homeStyle.css
+++ b/newVersion/css/homeStyle.css
@@ -13,7 +13,7 @@ body {
 
 #step-2 {
     position: fixed;
-    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage1.png');
+    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage1.jpg');
     background-repeat: no-repeat;
     background-size: cover;
 }
@@ -27,14 +27,14 @@ body {
 
 #step-4 {
     position: fixed;
-    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage3.png');
+    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage3.jpg');
     background-repeat: no-repeat;
     background-size: cover;
 }
 
 #step-5 {
     position: fixed;
-    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage4.png');
+    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage4.jpg');
     background-repeat: no-repeat;
     background-size: cover;
 }
diff --git a/newVersion/css/infoStyle.css b/newVersion/css/infoStyle.css
index 8d72598..ac5beea 100644
--- a/newVersion/css/infoStyle.css
+++ b/newVersion/css/infoStyle.css
@@ -28,7 +28,7 @@ body {
 
 #step-4 {
     position: fixed;
-    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage3.png');
+    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage3.jpg');
     background-repeat: no-repeat;
     background-size: cover;
 }
@@ -42,14 +42,14 @@ body {
 
 #step-6 {
     position: fixed;
-    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage4.png');
+    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage4.jpg');
     background-repeat: no-repeat;
     background-size: cover;
 }
 
 #step-7 {
     position: fixed;
-    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage1.png');
+    background: linear-gradient(to right, rgba( 0, 0, 0, 255 ) 30%, rgba( 0, 0, 0, 0 )), url( '/assets/screenshotPage1.jpg');
     background-repeat: no-repeat;
     background-size: cover;
 }
diff --git a/newVersion/index.html b/newVersion/index.html
index 694d924..6bb38e3 100644
--- a/newVersion/index.html
+++ b/newVersion/index.html
@@ -44,10 +44,10 @@
         </div>
         
         <div class="background-images" id="images">
-            <img src="/assets/screenshotPage1.png" id="img1" style="z-index: -6; opacity: 1;">
+            <img src="/assets/screenshotPage1.jpg" id="img1" style="z-index: -6; opacity: 1;">
             <img src="/assets/screenshotPage2.png" id="img2" class="hidables" style="z-index: -5;">
-            <img src="/assets/screenshotPage3.png" id="img3" class="hidables" style="z-index: -4;">
-            <img src="/assets/screenshotPage4.png" id="img4" class="hidables" style="z-index: -3;">
+            <img src="/assets/screenshotPage3.jpg" id="img3" class="hidables" style="z-index: -4;">
+            <img src="/assets/screenshotPage4.jpg" id="img4" class="hidables" style="z-index: -3;">
             <img src="/assets/screenshotPage5.png" id="img5" class="hidables" style="z-index: -2;">
             <img src="/assets/screenshotPage6.png" id="img6" class="hidables" style="z-index: -1;">
         </div>