mudando as imagens

assets/css/style.css

@@ -36,6 +36,7 @@
         flex-direction: column;
     }
     .div-infobox{
+        
         width: 96%;
         height: 70%;
     }
@@ -129,6 +130,7 @@
     justify-content: center;
 }
 .infoboxes-wrapper{
+    margin: 5% 0;
     display: flex;
     width: 100%;
     justify-content: space-around;
@@ -159,11 +161,12 @@
     width: 35%;    
 }
 .imagem-note-wrapper{
+    gap: 10%;
     margin: 5% 0;
     display: flex;
     width: 100%;
     justify-content: space-around;
-    gap: 2%;
+
     background-color: #E0E0E0;;
 }
 .imagem-note{
@@ -171,6 +174,7 @@
     margin: 5% 0;
 }
 .page-footer{
+    list-style: none;
     flex-direction: row;
     display: flex;
     width: 100%;
@@ -186,9 +190,44 @@
     gap: 4%;
     background: #000000;
 }
-.text-footer{
+
+.page-footer{
     flex-direction: column;
     display: flex;
     align-items: center;
     justify-content: center;
+    color: #000000;
+}
+.text-footer{
+    text-transform: uppercase;
+    line-height: 12px;
+    font-size: 10px;
+    color: #bdbdbd ;
+}
+.icones-footer{
+    display: flex;
+    list-style: none;
+    margin-bottom: 16px;
+}
+.footer-li{
+    margin: 0 8px
+}
+
+@media screen and (min-width: 415px) {
+   .footer-image{
+    margin-left: 10%;
+    display:flex;
+    justify-content: center;
+    align-items: center;
+    width: 80%;
+   }
+}
+@media screen and (max-width: 414px){ 
+    .footer-image{
+        margin-left: 10%;
+        display:flex;
+        justify-content: center;
+        align-items: center;
+        width: 80%;
+       }
 }

index.html

@@ -20,8 +20,7 @@
     <main>
         <section>
             <img class="main-banner desktop-hidden" src="./assets/images/imagem-top.png" alt="Banner Principal Desktop">
-            <img class="main-banner mobile-hidden" src="./assets/images/imagem-top-mobile.png"
-                alt="Banner Principal Mobile">
+            <img class="main-banner mobile-hidden" src="./assets/images/imagem-top-mobile.png" alt="Banner Principal Mobile">
         </section>
 
         <section>
@@ -48,7 +47,7 @@
 
                     </div>
                     <div class="div-infobox">
-                        <img class="infobox-image" src="./assets/images/loja-online.png" alt="Logo da compra segura">
+                        <img class="infobox-image" src="./assets/images/Vector.png" alt="Logo da compra segura">
                         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla
                         interdum.
                     </div>
@@ -133,21 +132,20 @@
         </section>
     </main>
 
+    <section>
+        <img class="main-banner footer-image desktop-hidden" src="./assets/images/imagem-baixo.png"  alt="Banner Principal Desktop">
+    
+    </section>
     <footer class="page-footer">
-        <a href="/">
-            <img class="logo-footer" src="./assets/images/instagram.png" alt="Logo M3">
-        </a>
-        <a href="/">
-            <img class="logo-footer" src="./assets/images/facebook.png" alt="Logo M3">
-        </a>
-        <a href="/">
-            <img class="logo-footer" src="./assets/images/youtube.png" alt="Logo M3">
-        </a>
-<div>
-        <h2 class="text-footer">texto</h2>
-    </div>
-    </footer>
+        <ul class="icones-footer">
+            <li class="footer-li"><img src="/assets/images/instagram.png"><i></i></a></li>
+            <li class="footer-li"><img src="/assets/images/facebook.png"><i></i></a></li>
+            <li class="footer-li"><img src="/assets/images/youtube.png"></i></a></li>
+        </ul>
+        <p class="text-footer">
 
+        </p>
+    </footer>
 </body>
 
 </html>