diff --git a/assests/style/main.css b/assests/style/main.css
index 1c382d9..dce38f2 100644
--- a/assests/style/main.css
+++ b/assests/style/main.css
@@ -20,4 +20,18 @@
 .main-banner {
     width: 100%;
     display: block;
+}
+
+
+
+@media screen and (max-width: 414px) {
+    .main-banner-desktop{
+        display: none;
+    }
+}
+
+@media screen and (min-width: 415px) {
+    .main-banner-mobile {
+        display: none;
+    }
 }
\ No newline at end of file
diff --git a/index.html b/index.html
index 528b1c9..0e99a4b 100644
--- a/index.html
+++ b/index.html
@@ -16,7 +16,8 @@
 
     <main>
         <section>
-            <img class="main-banner" src="./assests/images/main-banner-desktop.png" alt="Banner principal">
+            <img class="main-banner main-banner-desktop" src="./assests/images/main-banner-desktop.png" alt="Banner principal desktop">
+            <img class="main-banner main-banner-mobile" src="./assests/images/main-banner-mobile.png" alt="Banner principal mobile">
         </section>
     </main>