From 6c1e8984db6b9345fab38a5f046a713d893c914c Mon Sep 17 00:00:00 2001
From: Eleonora Otz <nora_otz@hotmail.com>
Date: Sun, 9 Oct 2022 20:41:47 -0300
Subject: [PATCH] Adiciona banners principais desktop e mobile

---
 assets/styles/main.css | 16 ++++++++++++++++
 index.html             | 11 ++++++++++-
 2 files changed, 26 insertions(+), 1 deletion(-)
diff --git a/assets/styles/main.css b/assets/styles/main.css
index 9dbdeae..bad2273 100644
--- a/assets/styles/main.css
+++ b/assets/styles/main.css
@@ -21,8 +21,24 @@
     display: block;
 }
 
+.main-banner {
+width: 100%;
+}
+
 @media screen and (max-width: 392px) {
     .header-logo {
         width: 180px
     }
+}
+
+@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 164afbf..f87956e 100644
--- a/index.html
+++ b/index.html
@@ -17,10 +17,19 @@
     </head>
 
     <body>
+        <!-- Header da landing page M3 Academy -->
        <header class="page-header">
             <a href="/">
                 <img class="header-logo" src="./assets/images/m3-academy-logo.svg" alt="Logo M3 m3-academy-logo" />
             </a>
-       </header> 
+       </header>
+
+        <!-- Banner principal -->
+        <div>
+            <figure class="main-banner">
+                <img class="main-banner main-banner-desktop" src="./assets/images/main-banner-desktop.png" alt="Banner principal" />
+                <img class="main-banner main-banner-mobile"  src="./assets/images/main-banner-mobile.png" alt="Banner principal" />
+            </figure>
+        </div>
     </body>
 </html>
\ No newline at end of file
