adicionando banner principal desktop e mobile e logo display block

index.html

@@ -17,7 +17,10 @@
     </a>
   </header>
     <main>
-
+      <section>
+        <img class="main-banner  main-banner-desktop" src="assents/imagens/banner-desktop.png" alt="Banner Principal">
+        <img class="main-banner  main-banner-mobile" src="assents/imagens/banner-mobile.png" alt="Banner Principal">
+      </section>
     </main>
 
 

main.styles/style.css

@@ -5,10 +5,35 @@
 
   
 }
-
+/*///////////// HEADER /////////////////// */
 .page-header {
   background: #000000;
   display: flex;
   justify-content: center;
   padding: 28px 0;
 }
+
+.header-logo {
+  display: block;
+}
+
+/*///////////// SECTION 01 + @media desktop e mobile /////////////////// */
+
+.main-banner {
+  display: block;
+  width: 100%;
+  
+}
+
+@media screen and (max-width: 414px){
+  .main-banner-desktop {
+    display: none;
+  }
+}
+
+@media screen and (min-width: 415px ) {
+  .main-banner-mobile{
+    display: none;
+  }
+  
+}