Progress commit

public/css/home.css

@@ -88,7 +88,6 @@
 main {
   display: flex;
   flex-direction: column;
-  min-height: calc(100% - var(--navbar-height) - var(--footer-height));
 }
 main > * {
   padding: 3rem;

public/css/style.css

@@ -1,6 +1,5 @@
 :root {
   --navbar-height: 96px;
-  --footer-height: 24px;
 
   --teal: 162, 223, 203;
   --black: 25, 23, 30;
@@ -43,7 +42,6 @@ header {
 footer {
   background-color: var(--footer-color);
   border-top: var(--borders);
-  height: var(--footer-height);
 }
 
 .color-teal {
@@ -96,9 +94,14 @@ nav {
   padding: 0 1rem;
 }
 
-.nav-socials > a > svg {
-  padding: 0.5rem;
+.nav-socials > a > ion-icon {
+  color: rgba(var(--lightblue), .86);
+  background-color: rgba(var(--brown), .86);
+  border-radius: 100%;
   border: var(--borders);
+  box-sizing: content-box;
+  padding: 0.5rem;
+  margin: 1rem 0.5rem;
 }
 
 .flex-adaptive {
@@ -109,6 +112,21 @@ nav {
   flex: 1;
 }
 
+footer {
+  padding: 3rem 1.5rem;
+}
+footer h3 {
+  font-size: 2rem;
+}
+footer > div {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+}
+footer > div > * {
+  width: 50%;
+}
+
 /* -xs */
 @media (min-width: 576px) {
   .container {
@@ -129,6 +147,15 @@ nav {
   .flex-adaptive {
     flex-direction: row;
   }
+  footer > div {
+    flex-direction: row;
+  }
+  footer > div > :first-child {
+    text-align: left;
+  }
+  footer > div > :last-child {
+    text-align: right;
+  }
 }
 /* -lg */
 @media (min-width: 1200px) {