diff --git a/src/components/button/button.scss b/src/components/button/button.scss
index 84757d32dc..f1d2f3a15d 100644
--- a/src/components/button/button.scss
+++ b/src/components/button/button.scss
@@ -74,24 +74,6 @@ $button-bar-button-icon-size:     20px !default;
 }
 
 
-// Button Type and Color Generation
-// --------------------------------------------------
-
-@each $color, $value in $colors {
-  .button-#{$color} {
-    @include button-default(get-color($color, base),
-                            get-color($color, dark),
-                            inverse-tone($color),
-                            get-color($color, dark),
-                            get-color($color, inverse));
-
-    @include button-clear(get-color($color, dark));
-
-    @include button-outline(get-color($color, dark));
-  }
-}
-
-
 // Button Defaults
 // --------------------------------------------------
 
@@ -169,10 +151,6 @@ $button-bar-button-icon-size:     20px !default;
   box-shadow: none;
 }
 
-.padding > .button.button-block:first-child {
-  margin-top: 0;
-}
-
 .button-block {
   display: block;
   clear: both;
@@ -193,6 +171,24 @@ $button-bar-button-icon-size:     20px !default;
 }
 
 
+// Button Color Generation
+// --------------------------------------------------
+
+@each $color, $value in $colors {
+  .button-#{$color} {
+    @include button-default(get-color($color, base),
+                            get-color($color, dark),
+                            inverse-tone($color),
+                            get-color($color, dark),
+                            get-color($color, inverse));
+
+    @include button-clear(get-color($color, dark));
+
+    @include button-outline(get-color($color, dark));
+  }
+}
+
+
 
 // Button Misc
 // --------------------------------------------------
@@ -215,3 +211,7 @@ input.button.button-block  {
   width: 100%;
 }
 
+.padding > .button.button-block:first-child {
+  margin-top: 0;
+}
+