footer mobile terminado

Author: Wagner3UB

css/style.css

@@ -301,6 +301,7 @@ footer{
   background-color: var(--black);
   padding-top: 60px;
   position: relative;
+  background-image: url(../img/codeblue32.png);
 }
 footer article.container{
   border-top: 1px solid var(--white);
@@ -310,6 +311,12 @@ footer article.container{
 footer figure{
   width: 50%;
 }
+footer .code{
+  margin-top: 30px;
+  width: 30%;
+  opacity: .1;
+  filter: grayscale(1);
+}
 footer figcaption{
   font-size: 16px;
   line-height: 22.8px;
@@ -335,7 +342,6 @@ footer figcaption{
 .menu-footer ul li:first-child{
   color: var(--green);
   font-family: "Poppins", Helvetica, Arial, sans-serif;
-  font
 }
 .menu-footer a{
   color: var(--white);
@@ -360,6 +366,9 @@ footer figcaption{
 .bottonbar .container h4:last-child{
   text-align: right;
 }
+.bottonbar .container h4 a:hover{
+  color:var(--green);
+}
 
 
 @media screen and (max-width: 376px){
@@ -521,4 +530,44 @@ footer figcaption{
   .popular {
     display: none;
   }
+
+  /* FOOTER */
+  footer article.container{
+    flex-flow: column;
+  }
+  footer figure{
+    width: 100%;
+  }
+  footer figure img{
+    display: block;
+    width: 141px;
+  }
+  footer figcaption{
+    width: 100%;
+  }
+  .menu-footer{
+    width: 100%;
+    flex-wrap: wrap;
+    justify-content: flex-start;
+    padding-bottom: 122px;
+  }
+  .menu-footer ul{
+    width: 50%;
+  }
+  .menu-footer ul:nth-of-type(2){
+    order: 1;
+  }
+  .menu-footer ul li{
+    margin-bottom: 15px;
+  }
+  .menu-footer ul li:first-of-type{
+    margin-bottom: 25px;
+  }
+  .menu-footer ul li:last-of-type{
+    margin-bottom: 40px;
+  }
+  .bottonbar .container{
+    flex-wrap: wrap;
+    justify-content: center;
+  }
 }

img/codeblue.png

@@ -307,19 +307,19 @@ <h3>Juicy Lemon</h3>
         <figcaption>Your natural candle made for your home and for your wellness.</figcaption>
       </figure>
       <article class="menu-footer">
-        <ul class="discovery">
+        <ul>
           <li>Discovery</li>
           <li><a href="#">New season</a></li>
           <li><a href="#">Most searched</a></li>
           <li><a href="#">Most selled</a></li>
         </ul>
-        <ul class="about">
+        <ul>
           <li>About</li>
           <li><a href="#">Help</a></li>
           <li><a href="#">Shipping</a></li>
           <li><a href="#">Affiliate</a></li>
         </ul>
-        <ul class="info">
+        <ul>
           <li>Info</li>
           <li><a href="#">Contact us</a></li>
           <li><a href="#">Privacy Policies</a></li>
@@ -329,8 +329,8 @@ <h3>Juicy Lemon</h3>
     </article>
     <section class="bottonbar">
       <div class="container">
-        <h4>©Candleaf All Rights Reserved.</h4>
-        <h4>Coded by Wagner Trezub</h4>
+        <h4><a href="https://codeblue.com.br/" target="_blank">©Codeblue</a> All Rights Reserved.</h4>
+        <h4>Coded by <a href="https://www.linkedin.com/in/wagner-trezub/" target="_blank">Wagner Trezub</a></h4>
       </div>
     </section>
   </footer>