diff --git a/sass/badges.scss b/sass/badges.scss
index c76d7ab..3b48a22 100644
--- a/sass/badges.scss
+++ b/sass/badges.scss
@@ -8,7 +8,7 @@
   font-size: 12px;
   line-height: 1;
   color: #333;
-  background-color: rgba(0,0,0,.15);
+  background-color: rgba(0, 0, 0, .15);
   border-radius: 100px;
 
   // Inverted badges have no background.
diff --git a/sass/base.scss b/sass/base.scss
index 5d1d4e4..0e12e88 100644
--- a/sass/base.scss
+++ b/sass/base.scss
@@ -27,7 +27,7 @@ body {
 a {
   color: $primary-color;
   text-decoration: none;
-  -webkit-tap-highlight-color: rgba(0,0,0,0); // Removes the dark touch outlines on links in webkit browsers.
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); // Removes the dark touch outlines on links in webkit browsers.
 
   &:active {
     color: darken($primary-color, 10%);
diff --git a/sass/buttons.scss b/sass/buttons.scss
index 7abec8a..0e38be5 100644
--- a/sass/buttons.scss
+++ b/sass/buttons.scss
@@ -142,7 +142,7 @@ input[type="button"] {
 .btn .badge {
   margin: -2px -4px -2px 4px;
   font-size: 12px;
-  background-color: rgba(0,0,0,.15);
+  background-color: rgba(0, 0, 0, .15);
 }
 
 // Buttons with inverted badges
diff --git a/sass/docs.scss b/sass/docs.scss
index dd4186a..c5cfac7 100644
--- a/sass/docs.scss
+++ b/sass/docs.scss
@@ -1,5 +1,5 @@
-@import "variables.scss";
-@import "mixins.scss";
+@import 'variables.scss';
+@import 'mixins.scss';
 
 // Clearfix mixin for docs
 
@@ -78,7 +78,7 @@ body {
   }
   .version {
     margin-top: 15px;
-    color: rgba(255,255,255,.5);
+    color: rgba(255, 255, 255, .5);
     text-align: center;
   }
 }
@@ -117,7 +117,7 @@ body {
   position: relative;
   padding-top: 15px;
   padding-bottom: 15px;
-  border-bottom: 1px solid rgba(255,255,255,.1);
+  border-bottom: 1px solid rgba(255, 255, 255, .1);
 }
 .docs-title {
   position: absolute;
@@ -145,7 +145,7 @@ body {
     z-index: 20;
     height: 0;
     overflow: hidden;
-    background-color: rgba(0,0,0,.9);
+    background-color: rgba(0, 0, 0, .9);
     opacity: 0;
 
     &.active {
@@ -239,9 +239,9 @@ body {
     padding-bottom: 10px;
     background-color: #fff;
     background-clip: padding-box;
-    border: 1px solid rgba(0,0,0,.2);
+    border: 1px solid rgba(0, 0, 0, .2);
     border-radius: 3px;
-    @include box-shadow(0 0 8px rgba(0,0,0,.05));
+    @include box-shadow(0 0 8px rgba(0, 0, 0, .05));
 
     &.active {
       display: block;
@@ -258,7 +258,7 @@ body {
       top: -11px;
       margin-left: -11px;
       border-right: 11px solid transparent;
-      border-bottom: 11px solid rgba(0,0,0,.3);
+      border-bottom: 11px solid rgba(0, 0, 0, .3);
       border-left: 11px solid transparent;
     }
     &:after {
@@ -266,7 +266,7 @@ body {
       margin-left: -10px;
       border-right: 10px solid transparent;
       border-bottom: 10px solid #fff;
-      border-left: 10px solid transparent
+      border-left: 10px solid transparent;
     }
     .docs-component-item {
       display: block;
@@ -302,7 +302,7 @@ body {
 
     &:hover {
       background-color: #fff;
-      @include box-shadow(0 0 50px rgba(255,255,255,.3));
+      @include box-shadow(0 0 50px rgba(255, 255, 255, .3));
     }
     &:active {
       opacity: .5;
@@ -343,7 +343,7 @@ body {
   font-size: 13px !important;
   line-height: 18px !important;
   background: transparent !important;
-  border-top: 1px solid rgba(255,255,255,.1) !important;
+  border-top: 1px solid rgba(255, 255, 255, .1) !important;
   border-right: 0 !important;
   border-bottom: 0 !important;
   border-left: 0 !important;
@@ -358,7 +358,7 @@ body {
   width: auto !important;
   height: auto !important;
   margin-left: 145px !important;
-  color: rgba(255,255,255,.65) !important;
+  color: rgba(255, 255, 255, .65) !important;
   font-family: "Open Sans", sans-serif !important;
 }
 .carbonad-text {
@@ -379,9 +379,9 @@ body {
 @media screen and (min-width: 768px) {
   .carbonad {
     width: 360px !important;
-    border-right: 1px solid rgba(255,255,255,.1) !important;
-    border-bottom: 1px solid rgba(255,255,255,.1) !important;
-    border-left: 1px solid rgba(255,255,255,.1) !important;
+    border-right: 1px solid rgba(255, 255, 255, .1) !important;
+    border-bottom: 1px solid rgba(255, 255, 255, .1) !important;
+    border-left: 1px solid rgba(255, 255, 255, .1) !important;
     border-radius: 3px !important;
   }
 }
@@ -519,14 +519,14 @@ body {
 // Overrides for the homepage's footer
 .docs-header .docs-footer {
   margin-top: 0;
-  border-top: 1px solid rgba(255,255,255,.1);
+  border-top: 1px solid rgba(255, 255, 255, .1);
 
   .docs-footer-text,
   .docs-footer-links {
-    color: rgba(255,255,255,.5);
+    color: rgba(255, 255, 255, .5);
 
     a {
-      color: rgba(255,255,255,.8);
+      color: rgba(255, 255, 255, .8);
     }
   }
 }
@@ -686,7 +686,7 @@ code {
   width: 100%;
   text-align: center;
   font-size: 24px;
-  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
+  text-shadow: 0 0 10px rgba(0, 0, 0, .5);
   color: #fff;
 }
 .component-example-fullbleed,
@@ -827,7 +827,7 @@ code {
     bottom: 0;
     left: 0;
     z-index: 11;
-    background-color: rgba(0,0,0,.3);
+    background-color: rgba(0, 0, 0, .3);
     content: '';
   }
 }
@@ -867,7 +867,7 @@ code {
     color: #fff;
     text-align: center;
     font-size: 24px;
-    text-shadow: 0 0 10px rgba(0,0,0,.5);
+    text-shadow: 0 0 10px rgba(0, 0, 0, .5);
   }
 }
 
@@ -890,7 +890,7 @@ code {
     height: 813px;
     margin-left: -20px;
     font-family: "Helvetica Neue", sans-serif;
-    background-image: url("../img/device-sprite.png");
+    background-image: url('../img/device-sprite.png');
     background-size: 300%;
     background-repeat: no-repeat;
     background-position: 0 0;
@@ -1008,7 +1008,7 @@ hr {
 // --------------------------------------------------
 
 .platform-ios {
-  @import "theme-ios.scss";
+  @import 'theme-ios.scss';
 
   .device {
     background-position: -395px 0;
@@ -1019,7 +1019,7 @@ hr {
   }
 }
 .platform-android {
-  @import "theme-android.scss";
+  @import 'theme-android.scss';
 
   .device {
     font-family: 'Roboto', sans-serif;
diff --git a/sass/mixins.scss b/sass/mixins.scss
index bd8659b..b59f682 100644
--- a/sass/mixins.scss
+++ b/sass/mixins.scss
@@ -23,7 +23,7 @@
   &:before,
   &:after {
     display: table; // 2
-    content: " "; // 1
+    content: ' '; // 1
   }
   &:after {
     clear: both;
@@ -39,23 +39,23 @@
 // Gradients
 @mixin linear-gradient($color-from, $color-to) {
   background-color: $color-from; // Old browsers
-  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,$color-from), color-stop(100%,$color-to)); // Chrome, Safari4+
+  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, $color-from), color-stop(100%, $color-to)); // Chrome, Safari4+
   background-image: -webkit-linear-gradient(top, $color-from 0%, $color-to 100%);           // Chrome10+, Safari5.1+
   background-image:    -moz-linear-gradient(top, $color-from 0%, $color-to 100%);           // FF3.6+
   background-image:     -ms-linear-gradient(top, $color-from 0%, $color-to 100%);           // IE10+
   background-image:      -o-linear-gradient(top, $color-from 0%, $color-to 100%);           // Opera 11.10+
   background-image:         linear-gradient(to bottom, $color-from 0%, $color-to 100%);     // W3C
-  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#{$color-from}', endColorstr='#{$color-to}', GradientType=0 ); // IE6-9
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$color-from}', endColorstr='#{$color-to}', GradientType=0); // IE6-9
 }
 @mixin directional-gradient($color-from, $color-to, $deg: 45deg) {
   background-color: $color-from; // Old browsers
-  background-image: -webkit-gradient(linear, left bottom, right top, color-stop(0%,$color-from), color-stop(100%,$color-to)); // Chrome, Safari4+
+  background-image: -webkit-gradient(linear, left bottom, right top, color-stop(0%, $color-from), color-stop(100%, $color-to)); // Chrome, Safari4+
   background-image: -webkit-linear-gradient(45deg, $color-from 0%, $color-to 100%);           // Chrome10+, Safari5.1+
   background-image:    -moz-linear-gradient(45deg, $color-from 0%, $color-to 100%);           // FF3.6+
   background-image:     -ms-linear-gradient(45deg, $color-from 0%, $color-to 100%);           // IE10+
   background-image:      -o-linear-gradient(45deg, $color-from 0%, $color-to 100%);           // Opera 11.10+
   background-image:         linear-gradient(45deg, $color-from 0%, $color-to 100%);     // W3C
-  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#{$color-from}', endColorstr='#{$color-to}', GradientType=1 ); // IE6-9
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$color-from}', endColorstr='#{$color-to}', GradientType=1); // IE6-9
 }
 
 
diff --git a/sass/normalize.scss b/sass/normalize.scss
index 7126853..748c6d1 100644
--- a/sass/normalize.scss
+++ b/sass/normalize.scss
@@ -131,7 +131,7 @@ dfn {
 //
 
 h1 {
-  margin: 0.67em 0;
+  margin: .67em 0;
   font-size: 2em;
 }
 
diff --git a/sass/popovers.scss b/sass/popovers.scss
index e91ae39..1bd5a54 100644
--- a/sass/popovers.scss
+++ b/sass/popovers.scss
@@ -55,7 +55,7 @@
   bottom: 0;
   left: 0;
   z-index: 15;
-  background-color: rgba(0,0,0,.3);
+  background-color: rgba(0, 0, 0, .3);
 }
 
 // Block level buttons in popovers
diff --git a/sass/ratchet.scss b/sass/ratchet.scss
index 806f6d0..5365b51 100644
--- a/sass/ratchet.scss
+++ b/sass/ratchet.scss
@@ -1,30 +1,30 @@
 
 // Variables
-@import "variables.scss";
+@import 'variables.scss';
 
 // Mixins
-@import "mixins.scss";
+@import 'mixins.scss';
 
 // Normalize & Base CSS
-@import "normalize.scss";
-@import "base.scss";
-@import "type.scss";
+@import 'normalize.scss';
+@import 'base.scss';
+@import 'type.scss';
 
 // Components
-@import "buttons.scss";
-@import "bars.scss";
-@import "badges.scss";
-@import "cards.scss";
-@import "table-views.scss";
-@import "forms.scss";
-@import "segmented-controls.scss";
-@import "popovers.scss";
+@import 'buttons.scss';
+@import 'bars.scss';
+@import 'badges.scss';
+@import 'cards.scss';
+@import 'table-views.scss';
+@import 'forms.scss';
+@import 'segmented-controls.scss';
+@import 'popovers.scss';
 
 // Javascript components
-@import "modals.scss";
-@import "sliders.scss";
-@import "toggles.scss";
-@import "push.scss";
+@import 'modals.scss';
+@import 'sliders.scss';
+@import 'toggles.scss';
+@import 'push.scss';
 
 // Ratchicons
-@import "ratchicons.scss";
+@import 'ratchicons.scss';
diff --git a/sass/theme-android.scss b/sass/theme-android.scss
index 5c276e7..2337159 100644
--- a/sass/theme-android.scss
+++ b/sass/theme-android.scss
@@ -1,4 +1,4 @@
-@import "mixins.scss";
+@import 'mixins.scss';
 
 //
 // Android theme
@@ -21,13 +21,13 @@ $line-height-default: 22px !global;
 //
 // Main theme colors
 $primary-color:  #33b5e5 !global;
-$chrome-color:   #dddddd !global;
+$chrome-color:   #ddd !global;
 $text-color:     #222 !global;
 
 // Action colors
 $default-color:  #999 !global;
-$positive-color: #99cc00 !global;
-$negative-color: #ff4444 !global;
+$positive-color: #9c0 !global;
+$negative-color: #f44 !global;
 
 // Bars
 $bar-base-height: 50px !global;
@@ -90,7 +90,7 @@ a {
   background-color: #cecece;
   border: 0;
   border-radius: $border-radius;
-  @include box-shadow(inset 0 -1px 0 rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 1px rgba(0,0,0,.25));
+  @include box-shadow(inset 0 -1px 0 rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 1px rgba(0, 0, 0, .25));
 
   // Active & filled button styles
   &:active,
@@ -98,7 +98,7 @@ a {
     color: $text-color;
     background-color: $default-color;
     border: 0;
-    @include box-shadow(inset 0 -1px 0 rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.2));
+    @include box-shadow(inset 0 -1px 0 rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .2));
   }
 }
 
@@ -200,7 +200,7 @@ a {
 .btn-link {
   color: $primary-color;
   background-color: transparent;
-  border: none;
+  border: 0;
   @include box-shadow(none);
 
   &:active,
@@ -220,7 +220,7 @@ a {
 // Buttons with badges
 .btn {
   .badge {
-    background-color: rgba(0,0,0,.15);
+    background-color: rgba(0, 0, 0, .15);
 
     &.badge-inverted {
       background-color: transparent;
@@ -241,7 +241,7 @@ a {
   height: $bar-base-height;
   background-color: $chrome-color;
   border-bottom: $border-default;
-  @include box-shadow(inset 0 -2px 0 #d2d2d2, 0 3px 3px rgba(0,0,0,.07));
+  @include box-shadow(inset 0 -2px 0 #d2d2d2, 0 3px 3px rgba(0, 0, 0, .07));
 
   // Modifier class to dock any bar below .bar-nav
   &.bar-header-secondary {
@@ -496,7 +496,7 @@ input[type="color"],
   height: 40px;
   padding: 10px 15px;
   border: 1px solid rgba(0, 0, 0, .2);
-  @include box-shadow(0 1px 1px rgba(0,0,0,.1));
+  @include box-shadow(0 1px 1px rgba(0, 0, 0, .1));
 }
 
 input[type="search"] {
@@ -552,14 +552,14 @@ textarea,
   background-color: #cecece;
   border: 0;
   border-radius: $border-radius;
-  @include box-shadow(0 1px 1px rgba(0,0,0,.25));
+  @include box-shadow(0 1px 1px rgba(0, 0, 0, .25));
 
   .control-item {
     padding-top: 10px;
     padding-bottom: 10px;
     color: $text-color;
     border-left: 1px solid #999;
-    @include box-shadow(inset 0 -1px 0 rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.2));
+    @include box-shadow(inset 0 -1px 0 rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .2));
 
     // Remove border-left and shadow from first section
     &:first-child {
@@ -639,7 +639,7 @@ textarea,
   -webkit-transition: -webkit-transform .1s ease-in-out, opacity .2s ease-in-out;
      -moz-transition: -moz-transform .1s ease-in-out, opacity .2s ease-in-out;
           transition: transform .1s ease-in-out, opacity .2s ease-in-out;
-  @include box-shadow(0 0 3px rgba(0,0,0,.2));
+  @include box-shadow(0 0 3px rgba(0, 0, 0, .2));
   @include transform(scale(.75));
 
   &:before {
@@ -692,7 +692,7 @@ textarea,
     background-color: #bebebe;
     border: 1px solid #b5b5b5;
     border-radius: 2px;
-    @include box-shadow(inset 0 1px 0 rgba(255,255,255,.3), inset 0 -1px 0 rgba(0,0,0,.1));
+    @include box-shadow(inset 0 1px 0 rgba(255, 255, 255, .3), inset 0 -1px 0 rgba(0, 0, 0, .1));
   }
   &:before {
     top: 1px;
@@ -711,7 +711,7 @@ textarea,
       margin-right: 2px;
       background-color: $primary-color;
       border-color: $primary-color;
-      @include transform(translate3d(50px,0,0));
+      @include transform(translate3d(50px, 0, 0));
     }
     &:before {
       right: 14px;
diff --git a/sass/theme-ios.scss b/sass/theme-ios.scss
index 14bcd82..be608d6 100644
--- a/sass/theme-ios.scss
+++ b/sass/theme-ios.scss
@@ -1,4 +1,4 @@
-@import "mixins.scss";
+@import 'mixins.scss';
 
 //
 // iOS theme
@@ -14,7 +14,7 @@
 //
 // Main theme colors
 $primary-color:  #007aff !global;
-$chrome-color:   rgba(247,247,247,.98) !global;
+$chrome-color:   rgba(247, 247, 247, .98) !global;
 
 // Action colors
 $default-color:  #929292 !global;
@@ -149,7 +149,7 @@ p {
 .btn-link {
   color: $primary-color;
   background-color: transparent;
-  border: none;
+  border: 0;
 
   &:active,
   &.active {
@@ -161,7 +161,7 @@ p {
 // Buttons with badges
 .btn {
   .badge {
-    background-color: rgba(0,0,0,.15);
+    background-color: rgba(0, 0, 0, .15);
 
     &.badge-inverted {
       background-color: transparent;
@@ -182,7 +182,7 @@ p {
 .bar {
   background-color: $chrome-color;
   border-bottom: 0;
-  @include box-shadow(0 0 1px rgba(0,0,0,.85));
+  @include box-shadow(0 0 1px rgba(0, 0, 0, .85));
 
   // Modifier class to dock any bar below .bar-nav
   &.bar-header-secondary {
@@ -352,7 +352,7 @@ input[type="color"],
 input[type="search"] {
   height: 34px;
   text-align: center;
-  background-color: rgba(0,0,0,.1);
+  background-color: rgba(0, 0, 0, .1);
   border: 0;
   border-radius: 6px;
 }
@@ -480,7 +480,7 @@ textarea,
 
 .popover {
   border-radius: 12px;
-  @include transition(-webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in-out);
+  @include transition(-webkit-transform .2s ease-in-out, opacity .2s ease-in-out);
 
   &:before {
     border-bottom: 15px solid $chrome-color;
@@ -494,7 +494,7 @@ textarea,
 
 // Popovers with `bar-nav`
 .popover .bar-nav {
-  border-bottom: 1px solid rgba(0,0,0,.15);
+  border-bottom: 1px solid rgba(0, 0, 0, .15);
 }
 
 // Popovers with `table-views`
@@ -532,7 +532,7 @@ textarea,
     -webkit-transition-property: -webkit-transform, border, width;
        -moz-transition-property: -moz-transform, border, width;
             transition-property: transform, border, width;
-    @include box-shadow(0 3px 3px rgba(0,0,0,.08));
+    @include box-shadow(0 3px 3px rgba(0, 0, 0, .08));
   }
   &:before {
     display: none;
@@ -544,7 +544,7 @@ textarea,
     @include box-shadow(inset 0 0 0 13px $positive-color);
 
     .toggle-handle {
-      @include transform(translate3d(17px,0,0));
+      @include transform(translate3d(17px, 0, 0));
     }
 
     .toggle-handle {
@@ -585,7 +585,7 @@ textarea,
 // Overlay animation for the slide transition
 @at-root {
   @-webkit-keyframes fadeOverlay {
-    from { @include box-shadow(0 0 10px rgba(0,0,0,0), -320px 0 0 rgba(0,0,0,0)); }
-    to   { @include box-shadow(0 0 10px rgba(0,0,0,.3), -320px 0 0 rgba(0,0,0,.1)); }
+    from { @include box-shadow(0 0 10px rgba(0, 0, 0, 0), -320px 0 0 rgba(0, 0, 0, 0)); }
+    to   { @include box-shadow(0 0 10px rgba(0, 0, 0, .3), -320px 0 0 rgba(0, 0, 0, .1)); }
   }
 }
diff --git a/sass/toggles.scss b/sass/toggles.scss
index 2ecb096..59052b7 100644
--- a/sass/toggles.scss
+++ b/sass/toggles.scss
@@ -36,7 +36,7 @@
     font-size: 13px;
     color: #999;
     text-transform: uppercase;
-    content: "Off";
+    content: 'Off';
   }
 
   // Active state for toggle
@@ -46,13 +46,13 @@
 
     .toggle-handle {
       border-color: $positive-color;
-      @include transform(translate3d(44px,0,0));
+      @include transform(translate3d(44px, 0, 0));
     }
     &:before {
       right: auto;
       left: 15px;
       color: #fff;
-      content: "On";
+      content: 'On';
     }
   }
   // Hide the checkbox
diff --git a/sass/variables.scss b/sass/variables.scss
index e65831e..a997ec0 100644
--- a/sass/variables.scss
+++ b/sass/variables.scss
@@ -48,7 +48,7 @@ $button-font-size: 12px !default;
 // Transitions
 // --------------------------------------------------
 
-$timing-fuction: cubic-bezier(.1,.5,.1,1) !default; // Inspired by @c2prods
+$timing-fuction: cubic-bezier(.1, .5, .1, 1) !default; // Inspired by @c2prods
 
 
 // Borders