assets/styles/main.css

@@ -111,6 +111,7 @@ body{
 
 .middle-image{
     width: 58.5vmin;
+    display: block;
 }
 
 .bottom-cards{
@@ -145,3 +146,64 @@ body{
     width: 85%;
 }
 
+.bottom-infocard{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.bottom-infocard-text{
+    text-align: center;
+    margin-bottom: 2.65%;
+    width: 29%;
+}
+
+.bottom-infocard-title{
+    font-weight: 600;
+    font-size: 32px;
+    line-height: 39px;
+}
+
+.bottom-infocard-description{
+    font-size: 16px;
+    line-height: 24px;
+}
+
+.bottom-infocard-images{
+    margin-bottom: 6.1%;
+}
+
+.bottom-infocard-image{
+    width: 140.4vmin;
+    display: block;
+}
+
+.page-footer{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 2% 0;
+    background: #000000;
+}
+
+.footer-icons{
+    display: flex;
+    list-style-type: none;
+    align-items: center;
+    margin-bottom: 1%;
+}
+
+.footer-icon{
+    margin: 0 8px;
+}
+
+.footer-icon-image{
+    width: 2.48vmin;
+}
+
+.footer-text{
+    font-size: 10px;
+    line-height: 12px;
+    text-transform: uppercase;
+    color: #BDBDBD;
+}

index.html

@@ -112,7 +112,48 @@
                   Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. 
                   </p>
               </div>
-          </section>
+        </section>
+
+        <section class="bottom-infocard">
+            <div class="bottom-infocard-text">
+                <h2 class="bottom-infocard-title">Lorem ipsum dolor sit amet</h2>
+                <p class="bottom-infocard-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate sapien non libero faucibus interdum. In eget tincidunt ipsum. 
+                    Quisque  a tellus at lectus blandit tempor. Ut tristique auctor mi eget hendrerit. Curabitur venenatis felis vitae sagittis venenatis.
+                    Donec finibus turpis vitae lectus interdum rutrum vitae sed augue.</p>
+            </div>
+            <figure class="bottom-infocard-images">
+                <img class="bottom-infocard-image" src="/assets/images/Banner-Bottom-Desktop.png" alt="Banner do Infocard de Baixo">
+            </figure>
+        </section>
+
     </main>
+    <footer class="page-footer">
+        <ul class="footer-icons">
+          <li class="footer-icon">
+            <a href="/" target="_blank">
+                <figure>
+                    <img class="footer-icon-image" src="/assets/images/Instagram-Icon.png" alt="Ícone do Instagram">
+                </figure>
+            </a>
+          </li>
+          <li class="footer-icon">
+            <a href="/" target="_blank">
+                <figure>
+                    <img class="footer-icon-image" src="/assets/images/Facebook-Icon.png" alt="Ícone do Facebook">
+                </figure>
+            </a>
+          </li>
+          <li class="footer-icon">
+            <a href="/" target="_blank">
+                <figure>
+                    <img class="footer-icon-image" src="/assets/images/Youtube-Icon.png" alt="Ícone do Youtube">
+                </figure>
+            </a>
+          </li>
+        </ul>
+        <p class="footer-text">
+          Copyright © 2020 - Loja  Comércio Eletrônico | CNPJ: 000.000.000/0001-00
+        </p>
+    </footer>
 </body>
 </html>