Adiciona footer

assets/styles/main.css

@@ -119,7 +119,7 @@ body{
 }
 .middlecards{
     display:flex;
-    margin: 129px 72px;
+    margin: 129px 72px 0 72px;
     gap:16px;
     background: #FFFFFF;
 }
@@ -133,7 +133,62 @@ body{
     font-weight: 400;
     font-size: 16px;
     line-height: 24px;
-    min-width: 0;
+    min-width: 367px;
+}
+.bottombanner{
+    display:flex;
+    flex-direction: column;
+    align-items: center;
+    margin-top: 108px;
+    text-align: center;
+}
+.bottombanner-subtitle{
+    font-weight: 600;
+    font-size: 32px;
+    line-height: 39px;
+}
+.bottombanner-text{
+    text-align: center;
+    font-weight: 400;
+    font-size: 16px;
+    line-height: 24px;
+    max-width: 550px;
+    margin-bottom: 50px;
+}
+.bottombanner-desktop{
+    display: block;
+    width: 100%;
+}
+.bottombanner-mobile{
+    display:none;
+}
+.footer{
+    width: 100%;
+    background-color: #000000;
+    margin-top: 116px;
+    padding: 38px;
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    gap: 17px;
+    
+}
+.footer a{
+    text-decoration: none;
+}
+.footer nav figure{
+    display: flex;
+    gap:21px;
+    
+}
+.footerimg{
+}
+.footer-text{
+    font-weight: 400;
+    font-size: 10px;
+    line-height: 12px;
+    text-transform: uppercase;
+    color: #BDBDBD;
 }
 
 
@@ -145,6 +200,12 @@ body{
         width: 100%;
         display: block;
     }
+    .bottombanner-desktop{
+        display: none;
+    }
+    .bottombanner-mobile{
+        display:block;
+    }
 }
 
 

index.html

@@ -108,11 +108,29 @@
                     Donec finibus turpis vitae lectus interdum rutrum vitae sed augue.
                 </p>
                 <figure>
-                    <img src="./assets/images/img/bottom-bannerdesktop.png" alt="">
+                    <img class="bottombanner-desktop" src="./assets/images/img/bottom-bannerdesktop.png" alt="Banner de baixo desktop">
-                    <img src="./assets/images/img/bottom-bannermobile.png" alt="">
+                    <img class="bottombanner-mobile" src="./assets/images/img/bottom-bannermobile.png" alt="Banner de baixo mobile">
                 </figure>
             </section>
         </main>
+        <footer class="footer">
+            <nav>
+                <figure>
+                    <a href="#">
+                        <img class="footerimg" src="./assets/images/img/iglogo.png" alt="Ícone Instagram">
+                    </a>
+                    <a href="#">
+                        <img class="footerimg" src="./assets/images/img/fblogo.png" alt="Ícone Facebook">
+                    </a>
+                    <a href="#">
+                        <img class="footerimg" src="./assets/images/img/ytlogo.png" alt="Ícone Youtube">
+                    </a>
+                </figure>
+            </nav>
+                <p class="footer-text">
+                    Copyright © 2020 - Loja  Comércio Eletrônico CNPJ: 000.000.000/0001-00
+                </p>
             
+        </footer>
 </body>
 </html>