diff --git a/src/components/_buttons.scss b/src/components/_buttons.scss
index 16b73d7..4a29bbb 100644
--- a/src/components/_buttons.scss
+++ b/src/components/_buttons.scss
@@ -8,38 +8,45 @@ button,
   display: inline;
   outline: none;
   border: solid 2px $primary;
-  @include border;
+  @include border();
   font-size: 1rem;
   padding: .75rem .75rem;
   cursor: pointer;
-  @include shadow;
+  @include shadow();
+
   &.btn-large {
     @include shadow(large);
     font-size: 2rem;
     padding: 1rem 1rem;
   }
+
   &.btn-small {
     @include shadow(small);
     font-size: .75rem;
     padding: .5rem;
   }
+
   &.btn-block {
     display: block;
     width: 100%;
   }
+
   &:hover {
     @include shadow(hover);
   }
+
   &:focus {
     border: 2px solid $secondary;
     -webkit-box-shadow: 2px 8px 4px -6px hsla(0, 0%, 0%, .3);
     -moz-box-shadow: 2px 8px 4px -6px hsla(0, 0%, 0%, .3);
     box-shadow: 2px 8px 4px -6px hsla(0, 0%, 0%, .3);
   }
+
   &:active {
     border-color: hsla(0, 0%, 0%, .2);
     transition: none;
   }
+
   &.disabled,
   &[disabled] {
     @extend .disabled;
diff --git a/src/components/_config.scss b/src/components/_config.scss
index 07587a6..ce7107f 100644
--- a/src/components/_config.scss
+++ b/src/components/_config.scss
@@ -1,5 +1,4 @@
 // Global PaperCSS Config
-
 // Imports
 @import url('https://fonts.googleapis.com/css?family=Neucha|Patrick+Hand+SC');
 
@@ -31,6 +30,10 @@ $warning-text: $primary;
 $danger-text: $primary;
 $muted-text: $primary;
 
+$shadow-color-regular: hsla(0,0,0%,.2);
+$shadow-color-hover: hsla(0,0,0%,.3);
+
+
 // Set class names to generate the css classes on build
 $colors: (primary, $primary, $primary-light, $primary-text),
          (secondary, $secondary, $secondary-light, $secondary-text),
@@ -60,6 +63,12 @@ $medium-screen: 992px;
 $small-screen: 768px;
 $xsmall-screen: 480px;
 
+// Sizes for shadows
+$shadow-small: 10px 19px 17px -13px $shadow-color-regular;
+$shadow-regular: 15px 28px 25px -18px $shadow-color-regular;
+$shadow-large: 20px 38px 34px -26px $shadow-color-regular;
+$shadow-hover: 2px 8px 8px -5px $shadow-color-hover;
+
 
 // Mixins
 @mixin resp($max:null, $min:null) {
@@ -129,3 +138,21 @@ $xsmall-screen: 480px;
   -ms-transform: translate($x, $y);
   transform: translate($x, $y);
 }
+
+@mixin shadow($type: regular) {
+  @if $type == hover {
+    box-shadow: $shadow-hover;
+    @include translate(0, 2px);
+  } @else if $type == small {
+    transition: all .5s ease;
+    box-shadow: $shadow-small;
+  } @else if $type == regular {
+    transition: all .5s ease;
+    box-shadow: $shadow-regular;
+  } @else if $type == large {
+    transition: all .5s ease;
+    box-shadow: $shadow-large;
+  } @else {
+    @error "@mixin shadow(input) does not exist"
+  }
+}
diff --git a/src/components/_shadows.scss b/src/components/_shadows.scss
index 2111067..e530ea6 100644
--- a/src/components/_shadows.scss
+++ b/src/components/_shadows.scss
@@ -1,29 +1,3 @@
-$shadow-color-regular: hsla(0,0,0%,.2);
-$shadow-color-hover: hsla(0,0,0%,.3);
-
-$shadow-small: 10px 19px 17px -13px $shadow-color-regular;
-$shadow-regular: 15px 28px 25px -18px $shadow-color-regular;
-$shadow-large: 20px 38px 34px -26px $shadow-color-regular;
-$shadow-hover: 2px 8px 8px -5px $shadow-color-hover;
-
-@mixin shadow($type: regular) {
-  @if $type == hover {
-    box-shadow: $shadow-hover;
-    transform: translate(0, 2px);
-  } @else if $type == small {
-    transition: all .5s ease;
-    box-shadow: $shadow-small;
-  } @else if $type == regular {
-    transition: all .5s ease;
-    box-shadow: $shadow-regular;
-  } @else if $type == large {
-    transition: all .5s ease;
-    box-shadow: $shadow-large;
-  } @else {
-    @error "@mixin shadow(input) does not exist"
-  }
-}
-
 .child-shadows > * {
   box-shadow: $shadow-regular;
   transition: all .5s ease;