base

assets/css/partials/_site-footer.scss

@@ -0,0 +1,94 @@
+#site-footer{
+
+   background-color: black;
+   padding: calc(var(--padding-body)*2) var(--padding-body);
+
+
+   .logo {
+    margin-top: calc(var(--spacing)*0.25);
+    margin-bottom: calc(var(--spacing)*1);
+        svg{
+            width: 100px;
+        }
+   }
+
+   p{
+    margin: calc(var(--spacing)*0.5) 0;
+    a{
+        text-decoration: none;
+        &:hover{
+            text-decoration: underline;
+            color: currentColor;
+        }
+    }
+   }
+
+   .p__small{
+    font-size: var(--fs-x-small);
+    color: var(--grey-600);
+   }
+
+   .footer__mentions{
+        p{       
+            font-size: var(--fs-small);
+            color: var(--color-txt)
+        }
+    }
+
+
+
+   @media #{$small}{ 
+    margin-top: calc(var(--spacing)*2);
+
+ 
+    .footer__socials{
+        margin-top: calc(var(--spacing)*0.75);
+        padding-top: calc(var(--spacing)*0.25);
+        border-top: var(--border-light);
+
+        .list-socials{
+            margin-top: calc(var(--spacing)*0.5);
+            margin-bottom: calc(var(--spacing)*0.75);
+        }
+    }
+    .footer__mentions{
+       
+        border-top: var(--border-light);
+        padding-top: calc(var(--spacing)*0.25);
+        p{       
+            font-size: var(--fs-small);
+            text-align: center;
+        }
+    }
+   }
+
+
+   @media #{$small-up}{
+
+    .site-footer__container{
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        column-gap:  calc(var(--spacing)*2);
+    
+        max-width: 1200px;
+        margin: 0 auto;
+    }
+
+    .footer__socials .container{
+        max-width: 400px;
+        columns: 2;
+        margin-top: calc(var(--spacing)*1);
+    }
+    
+    .footer__mentions{
+        grid-column: span 2;
+        p{       
+            margin-top: calc(var(--spacing)*1);
+        }
+
+    }
+
+   }
+
+
+}