Styled footer a touch

public/styles/components/_footer.scss

@@ -3,22 +3,25 @@
  *    Site Footer!
  *
  *  Dependencies:
+ *    styles/settings/colors.scss
+ *    styles/settings/typography.scss
  *    styles/tools/flex.scss
+ *    styles/tools/_box-shadow.scss
  *
  *  Version:
  *    1.0.0 - 2018/05/16
  */
 $c-footer--link-color: red;
-$c-footer--shadow: 1.5em;
+$c-footer--link-hover-color: blue;
 
 .c-footer {
+  @extend %t-dp--shadow-3d;
   padding-top: 8em;
   padding-bottom: 10em;
   position: relative;
   overflow: hidden;
   background-image: url('./../images/banners/palms.svg');
   background-size: cover;
-  @include t-box-shadow(0px, $c-footer--shadow, $c-footer--shadow, 0px, rgba(0, 0, 0, 0.25), true);
 
   &__inner {
     text-align: center;
@@ -36,11 +39,16 @@ $c-footer--shadow: 1.5em;
   }
 
   &__link {
+    color: $s-color--footer__link;
 
-   + #{&} {
-    display: inline-block;
-    padding-left: 1em;
-   }
+    &:hover {
+      color: $s-color--footer__link-hover;
+    }
+
+    + #{&} {
+      display: inline-block;
+      margin-left: 1em;
+    }
   }
 
   &__part {