From c6c6ee317533fc850acfc6610d72ccd971c4194f Mon Sep 17 00:00:00 2001
From: Luiz Felipe Silva <felipesilva9627@hotmail.com>
Date: Wed, 9 Nov 2022 16:58:48 -0300
Subject: [PATCH] feat(home): footer concluido.

---
 index.html               | 28 ++++++++++++++++++++++++++
 src/assets/css/style.css | 43 +++++++++++++++++++++++++++++++++++-----
 2 files changed, 66 insertions(+), 5 deletions(-)

diff --git a/index.html b/index.html
index 9a7e9f2..8076194 100644
--- a/index.html
+++ b/index.html
@@ -121,5 +121,33 @@
         </div>
       </section>
     </main>
+
+    <footer class="footer">
+      <div class="media-social">
+        <ul class="media-list">
+          <li class="media">
+            <a href="#" target="_blank">
+              <img src="./src/assets/svg/instagram.svg" alt="Instagram">
+            </a>
+          </li>
+
+          <li class="media">
+            <a href="#" target="_blank">
+              <img src="./src/assets/svg/facebook.svg" alt="Facebook">
+            </a>
+          </li>
+
+          <li class="media">
+            <a href="#" target="_blank">
+              <img src="./src/assets/svg/youtube.svg" alt="YouTube">
+            </a>
+          </li>
+        </ul>
+      </div>
+
+      <p>
+        Copyright © 2020 - Loja  Comércio Eletrônico | CNPJ: 000.000.000/0001-00
+      </p>
+    </footer>
   </body>
 </html>
\ No newline at end of file
diff --git a/src/assets/css/style.css b/src/assets/css/style.css
index 279915b..ac336e9 100644
--- a/src/assets/css/style.css
+++ b/src/assets/css/style.css
@@ -169,6 +169,37 @@ header {
   flex-wrap: wrap;
 }
 
+/* FOOTER */
+
+.footer {
+  background-color: #000;
+  height: 128px;
+  padding: 38px 0;
+}
+
+.media-social {
+  display: flex;
+  justify-content: center;
+}
+
+.media-list {
+  display: flex;
+  list-style: none;
+}
+
+.media {
+  margin: 0 8px 17px 8px;
+}
+
+.footer p {
+  font-size: 10px;
+  font-weight: 400;
+  line-height: 12px;
+  color: #BDBDBD;
+  text-transform: uppercase;
+  text-align: center;
+}
+
 /* RESPONSIVIDADE -> NOTEBOOK */
 
 @media screen and (min-width: 993px) and (max-width: 1280px) {
@@ -195,6 +226,12 @@ header {
   .section3 {
     grid-template-columns: repeat(2, max-content);
   }
+
+  .text-card h2 {
+    font-weight: 600;
+    font-size: 32px;
+    line-height: 20px;
+  }
 }
 
 @media screen and (min-width: 769px) and (max-width: 992px) {
@@ -242,11 +279,7 @@ header {
     padding: 0 26px;
   }
 
-  .text-card h2 {
-    font-weight: 600;
-    font-size: 32px;
-    line-height: 20px;
-  }
+  
 
   .text-card p {
     font-size: 16px;