From 3b8ab6b7a6ed31f743f58caec7de136c6bf2c054 Mon Sep 17 00:00:00 2001
From: Harry Roberts <harry@csswizardry.com>
Date: Mon, 25 Mar 2013 20:14:41 +0000
Subject: [PATCH] Update to v2.0.0

---
 csswizardry-grids.scss |  14 +-
 demo.css               | 584 ++++++++++++++++++++---------------------
 demo.scss              |  12 +-
 index.html             |  38 +--
 4 files changed, 324 insertions(+), 324 deletions(-)

diff --git a/csswizardry-grids.scss b/csswizardry-grids.scss
index 6e1ae7d..d7bf962 100644
--- a/csswizardry-grids.scss
+++ b/csswizardry-grids.scss
@@ -33,7 +33,7 @@
  * These namespaces are then used in the library to give you the ability to
  * manipulate your layouts based around them, for example:
  *
-   <div class="grid__item  one-whole  lap-one-half  desk-one-third">
+   <div class="grid__item  one-whole  lap--one-half  desk--one-third">
  *
  * This would give you a grid item which is 100% width unless it is on a lap
  * device, at which point it become 50% wide, or it is on a desktop device, at
@@ -53,11 +53,11 @@
  * quickly be able to piece together any combinations you can imagine, for
  * example:
  *
-   `class="grid__item  one-whole  lap-one-half  desk-one-third  push--desk-one-third"`
+   `class="grid__item  one-whole  lap--one-half  desk--one-third  push--desk--one-third"`
  *
-   `class="grid__item  one-quarter  palm-one-half  push--palm-one-half"`
+   `class="grid__item  one-quarter  palm--one-half  push--palm--one-half"`
  *
-   `class="grid__item  palm-one-third  desk-five-twelfths"`
+   `class="grid__item  palm--one-third  desk--five-twelfths"`
  */
 
 
@@ -413,7 +413,7 @@ $class-type:            unquote(".");
 
     @each $name in $breakpoint-has-widths {
         @include grid-media-query($name) {
-           @include device-type('#{$name}-');
+           @include device-type('#{$name}--');
         }
     }
 
@@ -534,7 +534,7 @@ $class-type:            unquote(".");
     @if $responsive == true{
         @each $name in $breakpoint-has-push {
             @include grid-media-query($name) {
-               @include  push-setup('#{$name}-');
+               @include  push-setup('#{$name}--');
             }
         }
     }
@@ -656,7 +656,7 @@ $class-type:            unquote(".");
     @if $responsive == true{
         @each $name in $breakpoint-has-pull {
             @include grid-media-query($name) {
-               @include  pull-setup('#{$name}-');
+               @include  pull-setup('#{$name}--');
             }
         }
     }
diff --git a/demo.css b/demo.css
index d9bc398..ac55424 100644
--- a/demo.css
+++ b/demo.css
@@ -28,7 +28,7 @@
  * These namespaces are then used in the library to give you the ability to
  * manipulate your layouts based around them, for example:
  *
-   <div class="grid__item  one-whole  lap-one-half  desk-one-third">
+   <div class="grid__item  one-whole  lap--one-half  desk--one-third">
  *
  * This would give you a grid item which is 100% width unless it is on a lap
  * device, at which point it become 50% wide, or it is on a desktop device, at
@@ -48,11 +48,11 @@
  * quickly be able to piece together any combinations you can imagine, for
  * example:
  *
-   `class="grid__item  one-whole  lap-one-half  desk-one-third  push--desk-one-third"`
+   `class="grid__item  one-whole  lap--one-half  desk--one-third  push--desk--one-third"`
  *
-   `class="grid__item  one-quarter  palm-one-half  push--palm-one-half"`
+   `class="grid__item  one-quarter  palm--one-half  push--palm--one-half"`
  *
-   `class="grid__item  palm-one-third  desk-five-twelfths"`
+   `class="grid__item  palm--one-third  desk--five-twelfths"`
  */
 /*------------------------------------*\
     $VARIABLES
@@ -334,123 +334,123 @@
   /**
    * Whole
    */
-  .palm-one-whole {
+  .palm--one-whole {
     width: 100%;
   }
 
   /**
    * Halves
    */
-  .palm-one-half, .palm-two-quarters, .palm-three-sixths, .palm-four-eighths, .palm-five-tenths, .palm-six-twelfths {
+  .palm--one-half, .palm--two-quarters, .palm--three-sixths, .palm--four-eighths, .palm--five-tenths, .palm--six-twelfths {
     width: 50%;
   }
 
   /**
    * Thirds
    */
-  .palm-one-third, .palm-two-sixths, .palm-four-twelfths {
+  .palm--one-third, .palm--two-sixths, .palm--four-twelfths {
     width: 33.333%;
   }
 
-  .palm-two-thirds, .palm-four-sixths, .palm-eight-twelfths {
+  .palm--two-thirds, .palm--four-sixths, .palm--eight-twelfths {
     width: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .palm-one-quarter, .palm-two-eighths, .palm-three-twelfths {
+  .palm--one-quarter, .palm--two-eighths, .palm--three-twelfths {
     width: 25%;
   }
 
-  .palm-three-quarters, .palm-six-eighths, .palm-nine-twelfths {
+  .palm--three-quarters, .palm--six-eighths, .palm--nine-twelfths {
     width: 75%;
   }
 
   /**
    * Fifths
    */
-  .palm-one-fifth, .palm-two-tenths {
+  .palm--one-fifth, .palm--two-tenths {
     width: 20%;
   }
 
-  .palm-two-fifths, .palm-four-tenths {
+  .palm--two-fifths, .palm--four-tenths {
     width: 40%;
   }
 
-  .palm-three-fifths, .palm-six-tenths {
+  .palm--three-fifths, .palm--six-tenths {
     width: 60%;
   }
 
-  .palm-four-fifths, .palm-eight-tenths {
+  .palm--four-fifths, .palm--eight-tenths {
     width: 80%;
   }
 
   /**
    * Sixths
    */
-  .palm-one-sixth, .palm-two-twelfths {
+  .palm--one-sixth, .palm--two-twelfths {
     width: 16.666%;
   }
 
-  .palm-five-sixths, .palm-ten-twelfths {
+  .palm--five-sixths, .palm--ten-twelfths {
     width: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .palm-one-eighth {
+  .palm--one-eighth {
     width: 12.5%;
   }
 
-  .palm-three-eighths {
+  .palm--three-eighths {
     width: 37.5%;
   }
 
-  .palm-five-eighths {
+  .palm--five-eighths {
     width: 62.5%;
   }
 
-  .palm-seven-eighths {
+  .palm--seven-eighths {
     width: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .palm-one-tenth {
+  .palm--one-tenth {
     width: 10%;
   }
 
-  .palm-three-tenths {
+  .palm--three-tenths {
     width: 30%;
   }
 
-  .palm-seven-tenths {
+  .palm--seven-tenths {
     width: 70%;
   }
 
-  .palm-nine-tenths {
+  .palm--nine-tenths {
     width: 90%;
   }
 
   /**
    * Twelfths
    */
-  .palm-one-twelfth {
+  .palm--one-twelfth {
     width: 8.333%;
   }
 
-  .palm-five-twelfths {
+  .palm--five-twelfths {
     width: 41.666%;
   }
 
-  .palm-seven-twelfths {
+  .palm--seven-twelfths {
     width: 58.333%;
   }
 
-  .palm-eleven-twelfths {
+  .palm--eleven-twelfths {
     width: 91.666%;
   }
 }
@@ -458,123 +458,123 @@
   /**
    * Whole
    */
-  .lap-one-whole {
+  .lap--one-whole {
     width: 100%;
   }
 
   /**
    * Halves
    */
-  .lap-one-half, .lap-two-quarters, .lap-three-sixths, .lap-four-eighths, .lap-five-tenths, .lap-six-twelfths, .footer__item {
+  .lap--one-half, .lap--two-quarters, .lap--three-sixths, .lap--four-eighths, .lap--five-tenths, .lap--six-twelfths, .footer__item {
     width: 50%;
   }
 
   /**
    * Thirds
    */
-  .lap-one-third, .lap-two-sixths, .lap-four-twelfths {
+  .lap--one-third, .lap--two-sixths, .lap--four-twelfths {
     width: 33.333%;
   }
 
-  .lap-two-thirds, .lap-four-sixths, .lap-eight-twelfths {
+  .lap--two-thirds, .lap--four-sixths, .lap--eight-twelfths {
     width: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .lap-one-quarter, .lap-two-eighths, .lap-three-twelfths {
+  .lap--one-quarter, .lap--two-eighths, .lap--three-twelfths {
     width: 25%;
   }
 
-  .lap-three-quarters, .lap-six-eighths, .lap-nine-twelfths {
+  .lap--three-quarters, .lap--six-eighths, .lap--nine-twelfths {
     width: 75%;
   }
 
   /**
    * Fifths
    */
-  .lap-one-fifth, .lap-two-tenths {
+  .lap--one-fifth, .lap--two-tenths {
     width: 20%;
   }
 
-  .lap-two-fifths, .lap-four-tenths {
+  .lap--two-fifths, .lap--four-tenths {
     width: 40%;
   }
 
-  .lap-three-fifths, .lap-six-tenths {
+  .lap--three-fifths, .lap--six-tenths {
     width: 60%;
   }
 
-  .lap-four-fifths, .lap-eight-tenths {
+  .lap--four-fifths, .lap--eight-tenths {
     width: 80%;
   }
 
   /**
    * Sixths
    */
-  .lap-one-sixth, .lap-two-twelfths {
+  .lap--one-sixth, .lap--two-twelfths {
     width: 16.666%;
   }
 
-  .lap-five-sixths, .lap-ten-twelfths {
+  .lap--five-sixths, .lap--ten-twelfths {
     width: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .lap-one-eighth {
+  .lap--one-eighth {
     width: 12.5%;
   }
 
-  .lap-three-eighths {
+  .lap--three-eighths {
     width: 37.5%;
   }
 
-  .lap-five-eighths {
+  .lap--five-eighths {
     width: 62.5%;
   }
 
-  .lap-seven-eighths {
+  .lap--seven-eighths {
     width: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .lap-one-tenth {
+  .lap--one-tenth {
     width: 10%;
   }
 
-  .lap-three-tenths, .sub-content {
+  .lap--three-tenths, .sub-content {
     width: 30%;
   }
 
-  .lap-seven-tenths, .content {
+  .lap--seven-tenths, .content {
     width: 70%;
   }
 
-  .lap-nine-tenths {
+  .lap--nine-tenths {
     width: 90%;
   }
 
   /**
    * Twelfths
    */
-  .lap-one-twelfth {
+  .lap--one-twelfth {
     width: 8.333%;
   }
 
-  .lap-five-twelfths {
+  .lap--five-twelfths {
     width: 41.666%;
   }
 
-  .lap-seven-twelfths {
+  .lap--seven-twelfths {
     width: 58.333%;
   }
 
-  .lap-eleven-twelfths {
+  .lap--eleven-twelfths {
     width: 91.666%;
   }
 }
@@ -582,123 +582,123 @@
   /**
    * Whole
    */
-  .portable-one-whole {
+  .portable--one-whole {
     width: 100%;
   }
 
   /**
    * Halves
    */
-  .portable-one-half, .portable-two-quarters, .portable-three-sixths, .portable-four-eighths, .portable-five-tenths, .portable-six-twelfths {
+  .portable--one-half, .portable--two-quarters, .portable--three-sixths, .portable--four-eighths, .portable--five-tenths, .portable--six-twelfths {
     width: 50%;
   }
 
   /**
    * Thirds
    */
-  .portable-one-third, .portable-two-sixths, .portable-four-twelfths {
+  .portable--one-third, .portable--two-sixths, .portable--four-twelfths {
     width: 33.333%;
   }
 
-  .portable-two-thirds, .portable-four-sixths, .portable-eight-twelfths {
+  .portable--two-thirds, .portable--four-sixths, .portable--eight-twelfths {
     width: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .portable-one-quarter, .portable-two-eighths, .portable-three-twelfths {
+  .portable--one-quarter, .portable--two-eighths, .portable--three-twelfths {
     width: 25%;
   }
 
-  .portable-three-quarters, .portable-six-eighths, .portable-nine-twelfths {
+  .portable--three-quarters, .portable--six-eighths, .portable--nine-twelfths {
     width: 75%;
   }
 
   /**
    * Fifths
    */
-  .portable-one-fifth, .portable-two-tenths {
+  .portable--one-fifth, .portable--two-tenths {
     width: 20%;
   }
 
-  .portable-two-fifths, .portable-four-tenths {
+  .portable--two-fifths, .portable--four-tenths {
     width: 40%;
   }
 
-  .portable-three-fifths, .portable-six-tenths {
+  .portable--three-fifths, .portable--six-tenths {
     width: 60%;
   }
 
-  .portable-four-fifths, .portable-eight-tenths {
+  .portable--four-fifths, .portable--eight-tenths {
     width: 80%;
   }
 
   /**
    * Sixths
    */
-  .portable-one-sixth, .portable-two-twelfths {
+  .portable--one-sixth, .portable--two-twelfths {
     width: 16.666%;
   }
 
-  .portable-five-sixths, .portable-ten-twelfths {
+  .portable--five-sixths, .portable--ten-twelfths {
     width: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .portable-one-eighth {
+  .portable--one-eighth {
     width: 12.5%;
   }
 
-  .portable-three-eighths {
+  .portable--three-eighths {
     width: 37.5%;
   }
 
-  .portable-five-eighths {
+  .portable--five-eighths {
     width: 62.5%;
   }
 
-  .portable-seven-eighths {
+  .portable--seven-eighths {
     width: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .portable-one-tenth {
+  .portable--one-tenth {
     width: 10%;
   }
 
-  .portable-three-tenths {
+  .portable--three-tenths {
     width: 30%;
   }
 
-  .portable-seven-tenths {
+  .portable--seven-tenths {
     width: 70%;
   }
 
-  .portable-nine-tenths {
+  .portable--nine-tenths {
     width: 90%;
   }
 
   /**
    * Twelfths
    */
-  .portable-one-twelfth {
+  .portable--one-twelfth {
     width: 8.333%;
   }
 
-  .portable-five-twelfths {
+  .portable--five-twelfths {
     width: 41.666%;
   }
 
-  .portable-seven-twelfths {
+  .portable--seven-twelfths {
     width: 58.333%;
   }
 
-  .portable-eleven-twelfths {
+  .portable--eleven-twelfths {
     width: 91.666%;
   }
 }
@@ -706,123 +706,123 @@
   /**
    * Whole
    */
-  .desk-one-whole {
+  .desk--one-whole {
     width: 100%;
   }
 
   /**
    * Halves
    */
-  .desk-one-half, .desk-two-quarters, .desk-three-sixths, .desk-four-eighths, .desk-five-tenths, .desk-six-twelfths {
+  .desk--one-half, .desk--two-quarters, .desk--three-sixths, .desk--four-eighths, .desk--five-tenths, .desk--six-twelfths {
     width: 50%;
   }
 
   /**
    * Thirds
    */
-  .desk-one-third, .desk-two-sixths, .desk-four-twelfths {
+  .desk--one-third, .desk--two-sixths, .desk--four-twelfths {
     width: 33.333%;
   }
 
-  .desk-two-thirds, .desk-four-sixths, .desk-eight-twelfths {
+  .desk--two-thirds, .desk--four-sixths, .desk--eight-twelfths {
     width: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .desk-one-quarter, .desk-two-eighths, .desk-three-twelfths, .footer__item {
+  .desk--one-quarter, .desk--two-eighths, .desk--three-twelfths, .footer__item {
     width: 25%;
   }
 
-  .desk-three-quarters, .desk-six-eighths, .desk-nine-twelfths {
+  .desk--three-quarters, .desk--six-eighths, .desk--nine-twelfths {
     width: 75%;
   }
 
   /**
    * Fifths
    */
-  .desk-one-fifth, .desk-two-tenths {
+  .desk--one-fifth, .desk--two-tenths {
     width: 20%;
   }
 
-  .desk-two-fifths, .desk-four-tenths, .sub-content {
+  .desk--two-fifths, .desk--four-tenths, .sub-content {
     width: 40%;
   }
 
-  .desk-three-fifths, .desk-six-tenths, .content {
+  .desk--three-fifths, .desk--six-tenths, .content {
     width: 60%;
   }
 
-  .desk-four-fifths, .desk-eight-tenths {
+  .desk--four-fifths, .desk--eight-tenths {
     width: 80%;
   }
 
   /**
    * Sixths
    */
-  .desk-one-sixth, .desk-two-twelfths {
+  .desk--one-sixth, .desk--two-twelfths {
     width: 16.666%;
   }
 
-  .desk-five-sixths, .desk-ten-twelfths {
+  .desk--five-sixths, .desk--ten-twelfths {
     width: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .desk-one-eighth {
+  .desk--one-eighth {
     width: 12.5%;
   }
 
-  .desk-three-eighths {
+  .desk--three-eighths {
     width: 37.5%;
   }
 
-  .desk-five-eighths {
+  .desk--five-eighths {
     width: 62.5%;
   }
 
-  .desk-seven-eighths {
+  .desk--seven-eighths {
     width: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .desk-one-tenth {
+  .desk--one-tenth {
     width: 10%;
   }
 
-  .desk-three-tenths {
+  .desk--three-tenths {
     width: 30%;
   }
 
-  .desk-seven-tenths {
+  .desk--seven-tenths {
     width: 70%;
   }
 
-  .desk-nine-tenths {
+  .desk--nine-tenths {
     width: 90%;
   }
 
   /**
    * Twelfths
    */
-  .desk-one-twelfth {
+  .desk--one-twelfth {
     width: 8.333%;
   }
 
-  .desk-five-twelfths {
+  .desk--five-twelfths {
     width: 41.666%;
   }
 
-  .desk-seven-twelfths {
+  .desk--seven-twelfths {
     width: 58.333%;
   }
 
-  .desk-eleven-twelfths {
+  .desk--eleven-twelfths {
     width: 91.666%;
   }
 }
@@ -966,123 +966,123 @@
   /**
    * Whole
    */
-  .push--palm-one-whole {
+  .push--palm--one-whole {
     left: 100%;
   }
 
   /**
    * Halves
    */
-  .push--palm-one-half, .push--palm-two-quarters, .push--palm-three-sixths, .push--palm-four-eighths, .push--palm-five-tenths, .push--palm-six-twelfths {
+  .push--palm--one-half, .push--palm--two-quarters, .push--palm--three-sixths, .push--palm--four-eighths, .push--palm--five-tenths, .push--palm--six-twelfths {
     left: 50%;
   }
 
   /**
    * Thirds
    */
-  .push--palm-one-third, .push--palm-two-sixths, .push--palm-four-twelfths {
+  .push--palm--one-third, .push--palm--two-sixths, .push--palm--four-twelfths {
     left: 33.333%;
   }
 
-  .push--palm-two-thirds, .push--palm-four-sixths, .push--palm-eight-twelfths {
+  .push--palm--two-thirds, .push--palm--four-sixths, .push--palm--eight-twelfths {
     left: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .push--palm-one-quarter, .push--palm-two-eighths, .push--palm-three-twelfths {
+  .push--palm--one-quarter, .push--palm--two-eighths, .push--palm--three-twelfths {
     left: 25%;
   }
 
-  .push--palm-three-quarters, .push--palm-six-eighths, .push--palm-nine-twelfths {
+  .push--palm--three-quarters, .push--palm--six-eighths, .push--palm--nine-twelfths {
     left: 75%;
   }
 
   /**
    * Fifths
    */
-  .push--palm-one-fifth, .push--palm-two-tenths {
+  .push--palm--one-fifth, .push--palm--two-tenths {
     left: 20%;
   }
 
-  .push--palm-two-fifths, .push--palm-four-tenths {
+  .push--palm--two-fifths, .push--palm--four-tenths {
     left: 40%;
   }
 
-  .push--palm-three-fifths, .push--palm-six-tenths {
+  .push--palm--three-fifths, .push--palm--six-tenths {
     left: 60%;
   }
 
-  .push--palm-four-fifths, .push--palm-eight-tenths {
+  .push--palm--four-fifths, .push--palm--eight-tenths {
     left: 80%;
   }
 
   /**
    * Sixths
    */
-  .push--palm-one-sixth, .push--palm-two-twelfths {
+  .push--palm--one-sixth, .push--palm--two-twelfths {
     left: 16.666%;
   }
 
-  .push--palm-five-sixths, .push--palm-ten-twelfths {
+  .push--palm--five-sixths, .push--palm--ten-twelfths {
     left: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .push--palm-one-eighth {
+  .push--palm--one-eighth {
     left: 12.5%;
   }
 
-  .push--palm-three-eighths {
+  .push--palm--three-eighths {
     left: 37.5%;
   }
 
-  .push--palm-five-eighths {
+  .push--palm--five-eighths {
     left: 62.5%;
   }
 
-  .push--palm-seven-eighths {
+  .push--palm--seven-eighths {
     left: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .push--palm-one-tenth {
+  .push--palm--one-tenth {
     left: 10%;
   }
 
-  .push--palm-three-tenths {
+  .push--palm--three-tenths {
     left: 30%;
   }
 
-  .push--palm-seven-tenths {
+  .push--palm--seven-tenths {
     left: 70%;
   }
 
-  .push--palm-nine-tenths {
+  .push--palm--nine-tenths {
     left: 90%;
   }
 
   /**
    * Twelfths
    */
-  .push--palm-one-twelfth {
+  .push--palm--one-twelfth {
     left: 8.333%;
   }
 
-  .push--palm-five-twelfths {
+  .push--palm--five-twelfths {
     left: 41.666%;
   }
 
-  .push--palm-seven-twelfths {
+  .push--palm--seven-twelfths {
     left: 58.333%;
   }
 
-  .push--palm-eleven-twelfths {
+  .push--palm--eleven-twelfths {
     left: 91.666%;
   }
 }
@@ -1090,123 +1090,123 @@
   /**
    * Whole
    */
-  .push--lap-one-whole {
+  .push--lap--one-whole {
     left: 100%;
   }
 
   /**
    * Halves
    */
-  .push--lap-one-half, .push--lap-two-quarters, .push--lap-three-sixths, .push--lap-four-eighths, .push--lap-five-tenths, .push--lap-six-twelfths {
+  .push--lap--one-half, .push--lap--two-quarters, .push--lap--three-sixths, .push--lap--four-eighths, .push--lap--five-tenths, .push--lap--six-twelfths {
     left: 50%;
   }
 
   /**
    * Thirds
    */
-  .push--lap-one-third, .push--lap-two-sixths, .push--lap-four-twelfths {
+  .push--lap--one-third, .push--lap--two-sixths, .push--lap--four-twelfths {
     left: 33.333%;
   }
 
-  .push--lap-two-thirds, .push--lap-four-sixths, .push--lap-eight-twelfths {
+  .push--lap--two-thirds, .push--lap--four-sixths, .push--lap--eight-twelfths {
     left: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .push--lap-one-quarter, .push--lap-two-eighths, .push--lap-three-twelfths {
+  .push--lap--one-quarter, .push--lap--two-eighths, .push--lap--three-twelfths {
     left: 25%;
   }
 
-  .push--lap-three-quarters, .push--lap-six-eighths, .push--lap-nine-twelfths {
+  .push--lap--three-quarters, .push--lap--six-eighths, .push--lap--nine-twelfths {
     left: 75%;
   }
 
   /**
    * Fifths
    */
-  .push--lap-one-fifth, .push--lap-two-tenths {
+  .push--lap--one-fifth, .push--lap--two-tenths {
     left: 20%;
   }
 
-  .push--lap-two-fifths, .push--lap-four-tenths {
+  .push--lap--two-fifths, .push--lap--four-tenths {
     left: 40%;
   }
 
-  .push--lap-three-fifths, .push--lap-six-tenths {
+  .push--lap--three-fifths, .push--lap--six-tenths {
     left: 60%;
   }
 
-  .push--lap-four-fifths, .push--lap-eight-tenths {
+  .push--lap--four-fifths, .push--lap--eight-tenths {
     left: 80%;
   }
 
   /**
    * Sixths
    */
-  .push--lap-one-sixth, .push--lap-two-twelfths {
+  .push--lap--one-sixth, .push--lap--two-twelfths {
     left: 16.666%;
   }
 
-  .push--lap-five-sixths, .push--lap-ten-twelfths {
+  .push--lap--five-sixths, .push--lap--ten-twelfths {
     left: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .push--lap-one-eighth {
+  .push--lap--one-eighth {
     left: 12.5%;
   }
 
-  .push--lap-three-eighths {
+  .push--lap--three-eighths {
     left: 37.5%;
   }
 
-  .push--lap-five-eighths {
+  .push--lap--five-eighths {
     left: 62.5%;
   }
 
-  .push--lap-seven-eighths {
+  .push--lap--seven-eighths {
     left: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .push--lap-one-tenth {
+  .push--lap--one-tenth {
     left: 10%;
   }
 
-  .push--lap-three-tenths {
+  .push--lap--three-tenths {
     left: 30%;
   }
 
-  .push--lap-seven-tenths {
+  .push--lap--seven-tenths {
     left: 70%;
   }
 
-  .push--lap-nine-tenths {
+  .push--lap--nine-tenths {
     left: 90%;
   }
 
   /**
    * Twelfths
    */
-  .push--lap-one-twelfth {
+  .push--lap--one-twelfth {
     left: 8.333%;
   }
 
-  .push--lap-five-twelfths {
+  .push--lap--five-twelfths {
     left: 41.666%;
   }
 
-  .push--lap-seven-twelfths {
+  .push--lap--seven-twelfths {
     left: 58.333%;
   }
 
-  .push--lap-eleven-twelfths {
+  .push--lap--eleven-twelfths {
     left: 91.666%;
   }
 }
@@ -1214,123 +1214,123 @@
   /**
    * Whole
    */
-  .push--portable-one-whole {
+  .push--portable--one-whole {
     left: 100%;
   }
 
   /**
    * Halves
    */
-  .push--portable-one-half, .push--portable-two-quarters, .push--portable-three-sixths, .push--portable-four-eighths, .push--portable-five-tenths, .push--portable-six-twelfths {
+  .push--portable--one-half, .push--portable--two-quarters, .push--portable--three-sixths, .push--portable--four-eighths, .push--portable--five-tenths, .push--portable--six-twelfths {
     left: 50%;
   }
 
   /**
    * Thirds
    */
-  .push--portable-one-third, .push--portable-two-sixths, .push--portable-four-twelfths {
+  .push--portable--one-third, .push--portable--two-sixths, .push--portable--four-twelfths {
     left: 33.333%;
   }
 
-  .push--portable-two-thirds, .push--portable-four-sixths, .push--portable-eight-twelfths {
+  .push--portable--two-thirds, .push--portable--four-sixths, .push--portable--eight-twelfths {
     left: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .push--portable-one-quarter, .push--portable-two-eighths, .push--portable-three-twelfths {
+  .push--portable--one-quarter, .push--portable--two-eighths, .push--portable--three-twelfths {
     left: 25%;
   }
 
-  .push--portable-three-quarters, .push--portable-six-eighths, .push--portable-nine-twelfths {
+  .push--portable--three-quarters, .push--portable--six-eighths, .push--portable--nine-twelfths {
     left: 75%;
   }
 
   /**
    * Fifths
    */
-  .push--portable-one-fifth, .push--portable-two-tenths {
+  .push--portable--one-fifth, .push--portable--two-tenths {
     left: 20%;
   }
 
-  .push--portable-two-fifths, .push--portable-four-tenths {
+  .push--portable--two-fifths, .push--portable--four-tenths {
     left: 40%;
   }
 
-  .push--portable-three-fifths, .push--portable-six-tenths {
+  .push--portable--three-fifths, .push--portable--six-tenths {
     left: 60%;
   }
 
-  .push--portable-four-fifths, .push--portable-eight-tenths {
+  .push--portable--four-fifths, .push--portable--eight-tenths {
     left: 80%;
   }
 
   /**
    * Sixths
    */
-  .push--portable-one-sixth, .push--portable-two-twelfths {
+  .push--portable--one-sixth, .push--portable--two-twelfths {
     left: 16.666%;
   }
 
-  .push--portable-five-sixths, .push--portable-ten-twelfths {
+  .push--portable--five-sixths, .push--portable--ten-twelfths {
     left: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .push--portable-one-eighth {
+  .push--portable--one-eighth {
     left: 12.5%;
   }
 
-  .push--portable-three-eighths {
+  .push--portable--three-eighths {
     left: 37.5%;
   }
 
-  .push--portable-five-eighths {
+  .push--portable--five-eighths {
     left: 62.5%;
   }
 
-  .push--portable-seven-eighths {
+  .push--portable--seven-eighths {
     left: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .push--portable-one-tenth {
+  .push--portable--one-tenth {
     left: 10%;
   }
 
-  .push--portable-three-tenths {
+  .push--portable--three-tenths {
     left: 30%;
   }
 
-  .push--portable-seven-tenths {
+  .push--portable--seven-tenths {
     left: 70%;
   }
 
-  .push--portable-nine-tenths {
+  .push--portable--nine-tenths {
     left: 90%;
   }
 
   /**
    * Twelfths
    */
-  .push--portable-one-twelfth {
+  .push--portable--one-twelfth {
     left: 8.333%;
   }
 
-  .push--portable-five-twelfths {
+  .push--portable--five-twelfths {
     left: 41.666%;
   }
 
-  .push--portable-seven-twelfths {
+  .push--portable--seven-twelfths {
     left: 58.333%;
   }
 
-  .push--portable-eleven-twelfths {
+  .push--portable--eleven-twelfths {
     left: 91.666%;
   }
 }
@@ -1338,123 +1338,123 @@
   /**
    * Whole
    */
-  .push--desk-one-whole {
+  .push--desk--one-whole {
     left: 100%;
   }
 
   /**
    * Halves
    */
-  .push--desk-one-half, .push--desk-two-quarters, .push--desk-three-sixths, .push--desk-four-eighths, .push--desk-five-tenths, .push--desk-six-twelfths {
+  .push--desk--one-half, .push--desk--two-quarters, .push--desk--three-sixths, .push--desk--four-eighths, .push--desk--five-tenths, .push--desk--six-twelfths {
     left: 50%;
   }
 
   /**
    * Thirds
    */
-  .push--desk-one-third, .push--desk-two-sixths, .push--desk-four-twelfths {
+  .push--desk--one-third, .push--desk--two-sixths, .push--desk--four-twelfths {
     left: 33.333%;
   }
 
-  .push--desk-two-thirds, .push--desk-four-sixths, .push--desk-eight-twelfths {
+  .push--desk--two-thirds, .push--desk--four-sixths, .push--desk--eight-twelfths {
     left: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .push--desk-one-quarter, .push--desk-two-eighths, .push--desk-three-twelfths {
+  .push--desk--one-quarter, .push--desk--two-eighths, .push--desk--three-twelfths {
     left: 25%;
   }
 
-  .push--desk-three-quarters, .push--desk-six-eighths, .push--desk-nine-twelfths {
+  .push--desk--three-quarters, .push--desk--six-eighths, .push--desk--nine-twelfths {
     left: 75%;
   }
 
   /**
    * Fifths
    */
-  .push--desk-one-fifth, .push--desk-two-tenths {
+  .push--desk--one-fifth, .push--desk--two-tenths {
     left: 20%;
   }
 
-  .push--desk-two-fifths, .push--desk-four-tenths {
+  .push--desk--two-fifths, .push--desk--four-tenths {
     left: 40%;
   }
 
-  .push--desk-three-fifths, .push--desk-six-tenths {
+  .push--desk--three-fifths, .push--desk--six-tenths {
     left: 60%;
   }
 
-  .push--desk-four-fifths, .push--desk-eight-tenths {
+  .push--desk--four-fifths, .push--desk--eight-tenths {
     left: 80%;
   }
 
   /**
    * Sixths
    */
-  .push--desk-one-sixth, .push--desk-two-twelfths {
+  .push--desk--one-sixth, .push--desk--two-twelfths {
     left: 16.666%;
   }
 
-  .push--desk-five-sixths, .push--desk-ten-twelfths {
+  .push--desk--five-sixths, .push--desk--ten-twelfths {
     left: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .push--desk-one-eighth {
+  .push--desk--one-eighth {
     left: 12.5%;
   }
 
-  .push--desk-three-eighths {
+  .push--desk--three-eighths {
     left: 37.5%;
   }
 
-  .push--desk-five-eighths {
+  .push--desk--five-eighths {
     left: 62.5%;
   }
 
-  .push--desk-seven-eighths {
+  .push--desk--seven-eighths {
     left: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .push--desk-one-tenth {
+  .push--desk--one-tenth {
     left: 10%;
   }
 
-  .push--desk-three-tenths {
+  .push--desk--three-tenths {
     left: 30%;
   }
 
-  .push--desk-seven-tenths {
+  .push--desk--seven-tenths {
     left: 70%;
   }
 
-  .push--desk-nine-tenths {
+  .push--desk--nine-tenths {
     left: 90%;
   }
 
   /**
    * Twelfths
    */
-  .push--desk-one-twelfth {
+  .push--desk--one-twelfth {
     left: 8.333%;
   }
 
-  .push--desk-five-twelfths {
+  .push--desk--five-twelfths {
     left: 41.666%;
   }
 
-  .push--desk-seven-twelfths {
+  .push--desk--seven-twelfths {
     left: 58.333%;
   }
 
-  .push--desk-eleven-twelfths {
+  .push--desk--eleven-twelfths {
     left: 91.666%;
   }
 }
@@ -1598,123 +1598,123 @@
   /**
    * Whole
    */
-  .pull--palm-one-whole {
+  .pull--palm--one-whole {
     right: 100%;
   }
 
   /**
    * Halves
    */
-  .pull--palm-one-half, .pull--palm-two-quarters, .pull--palm-three-sixths, .pull--palm-four-eighths, .pull--palm-five-tenths, .pull--palm-six-twelfths {
+  .pull--palm--one-half, .pull--palm--two-quarters, .pull--palm--three-sixths, .pull--palm--four-eighths, .pull--palm--five-tenths, .pull--palm--six-twelfths {
     right: 50%;
   }
 
   /**
    * Thirds
    */
-  .pull--palm-one-third, .pull--palm-two-sixths, .pull--palm-four-twelfths {
+  .pull--palm--one-third, .pull--palm--two-sixths, .pull--palm--four-twelfths {
     right: 33.333%;
   }
 
-  .pull--palm-two-thirds, .pull--palm-four-sixths, .pull--palm-eight-twelfths {
+  .pull--palm--two-thirds, .pull--palm--four-sixths, .pull--palm--eight-twelfths {
     right: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .pull--palm-one-quarter, .pull--palm-two-eighths, .pull--palm-three-twelfths {
+  .pull--palm--one-quarter, .pull--palm--two-eighths, .pull--palm--three-twelfths {
     right: 25%;
   }
 
-  .pull--palm-three-quarters, .pull--palm-six-eighths, .pull--palm-nine-twelfths {
+  .pull--palm--three-quarters, .pull--palm--six-eighths, .pull--palm--nine-twelfths {
     right: 75%;
   }
 
   /**
    * Fifths
    */
-  .pull--palm-one-fifth, .pull--palm-two-tenths {
+  .pull--palm--one-fifth, .pull--palm--two-tenths {
     right: 20%;
   }
 
-  .pull--palm-two-fifths, .pull--palm-four-tenths {
+  .pull--palm--two-fifths, .pull--palm--four-tenths {
     right: 40%;
   }
 
-  .pull--palm-three-fifths, .pull--palm-six-tenths {
+  .pull--palm--three-fifths, .pull--palm--six-tenths {
     right: 60%;
   }
 
-  .pull--palm-four-fifths, .pull--palm-eight-tenths {
+  .pull--palm--four-fifths, .pull--palm--eight-tenths {
     right: 80%;
   }
 
   /**
    * Sixths
    */
-  .pull--palm-one-sixth, .pull--palm-two-twelfths {
+  .pull--palm--one-sixth, .pull--palm--two-twelfths {
     right: 16.666%;
   }
 
-  .pull--palm-five-sixths, .pull--palm-ten-twelfths {
+  .pull--palm--five-sixths, .pull--palm--ten-twelfths {
     right: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .pull--palm-one-eighth {
+  .pull--palm--one-eighth {
     right: 12.5%;
   }
 
-  .pull--palm-three-eighths {
+  .pull--palm--three-eighths {
     right: 37.5%;
   }
 
-  .pull--palm-five-eighths {
+  .pull--palm--five-eighths {
     right: 62.5%;
   }
 
-  .pull--palm-seven-eighths {
+  .pull--palm--seven-eighths {
     right: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .pull--palm-one-tenth {
+  .pull--palm--one-tenth {
     right: 10%;
   }
 
-  .pull--palm-three-tenths {
+  .pull--palm--three-tenths {
     right: 30%;
   }
 
-  .pull--palm-seven-tenths {
+  .pull--palm--seven-tenths {
     right: 70%;
   }
 
-  .pull--palm-nine-tenths {
+  .pull--palm--nine-tenths {
     right: 90%;
   }
 
   /**
    * Twelfths
    */
-  .pull--palm-one-twelfth {
+  .pull--palm--one-twelfth {
     right: 8.333%;
   }
 
-  .pull--palm-five-twelfths {
+  .pull--palm--five-twelfths {
     right: 41.666%;
   }
 
-  .pull--palm-seven-twelfths {
+  .pull--palm--seven-twelfths {
     right: 58.333%;
   }
 
-  .pull--palm-eleven-twelfths {
+  .pull--palm--eleven-twelfths {
     right: 91.666%;
   }
 }
@@ -1722,123 +1722,123 @@
   /**
    * Whole
    */
-  .pull--lap-one-whole {
+  .pull--lap--one-whole {
     right: 100%;
   }
 
   /**
    * Halves
    */
-  .pull--lap-one-half, .pull--lap-two-quarters, .pull--lap-three-sixths, .pull--lap-four-eighths, .pull--lap-five-tenths, .pull--lap-six-twelfths {
+  .pull--lap--one-half, .pull--lap--two-quarters, .pull--lap--three-sixths, .pull--lap--four-eighths, .pull--lap--five-tenths, .pull--lap--six-twelfths {
     right: 50%;
   }
 
   /**
    * Thirds
    */
-  .pull--lap-one-third, .pull--lap-two-sixths, .pull--lap-four-twelfths {
+  .pull--lap--one-third, .pull--lap--two-sixths, .pull--lap--four-twelfths {
     right: 33.333%;
   }
 
-  .pull--lap-two-thirds, .pull--lap-four-sixths, .pull--lap-eight-twelfths {
+  .pull--lap--two-thirds, .pull--lap--four-sixths, .pull--lap--eight-twelfths {
     right: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .pull--lap-one-quarter, .pull--lap-two-eighths, .pull--lap-three-twelfths {
+  .pull--lap--one-quarter, .pull--lap--two-eighths, .pull--lap--three-twelfths {
     right: 25%;
   }
 
-  .pull--lap-three-quarters, .pull--lap-six-eighths, .pull--lap-nine-twelfths {
+  .pull--lap--three-quarters, .pull--lap--six-eighths, .pull--lap--nine-twelfths {
     right: 75%;
   }
 
   /**
    * Fifths
    */
-  .pull--lap-one-fifth, .pull--lap-two-tenths {
+  .pull--lap--one-fifth, .pull--lap--two-tenths {
     right: 20%;
   }
 
-  .pull--lap-two-fifths, .pull--lap-four-tenths {
+  .pull--lap--two-fifths, .pull--lap--four-tenths {
     right: 40%;
   }
 
-  .pull--lap-three-fifths, .pull--lap-six-tenths {
+  .pull--lap--three-fifths, .pull--lap--six-tenths {
     right: 60%;
   }
 
-  .pull--lap-four-fifths, .pull--lap-eight-tenths {
+  .pull--lap--four-fifths, .pull--lap--eight-tenths {
     right: 80%;
   }
 
   /**
    * Sixths
    */
-  .pull--lap-one-sixth, .pull--lap-two-twelfths {
+  .pull--lap--one-sixth, .pull--lap--two-twelfths {
     right: 16.666%;
   }
 
-  .pull--lap-five-sixths, .pull--lap-ten-twelfths {
+  .pull--lap--five-sixths, .pull--lap--ten-twelfths {
     right: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .pull--lap-one-eighth {
+  .pull--lap--one-eighth {
     right: 12.5%;
   }
 
-  .pull--lap-three-eighths {
+  .pull--lap--three-eighths {
     right: 37.5%;
   }
 
-  .pull--lap-five-eighths {
+  .pull--lap--five-eighths {
     right: 62.5%;
   }
 
-  .pull--lap-seven-eighths {
+  .pull--lap--seven-eighths {
     right: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .pull--lap-one-tenth {
+  .pull--lap--one-tenth {
     right: 10%;
   }
 
-  .pull--lap-three-tenths {
+  .pull--lap--three-tenths {
     right: 30%;
   }
 
-  .pull--lap-seven-tenths {
+  .pull--lap--seven-tenths {
     right: 70%;
   }
 
-  .pull--lap-nine-tenths {
+  .pull--lap--nine-tenths {
     right: 90%;
   }
 
   /**
    * Twelfths
    */
-  .pull--lap-one-twelfth {
+  .pull--lap--one-twelfth {
     right: 8.333%;
   }
 
-  .pull--lap-five-twelfths {
+  .pull--lap--five-twelfths {
     right: 41.666%;
   }
 
-  .pull--lap-seven-twelfths {
+  .pull--lap--seven-twelfths {
     right: 58.333%;
   }
 
-  .pull--lap-eleven-twelfths {
+  .pull--lap--eleven-twelfths {
     right: 91.666%;
   }
 }
@@ -1846,123 +1846,123 @@
   /**
    * Whole
    */
-  .pull--portable-one-whole {
+  .pull--portable--one-whole {
     right: 100%;
   }
 
   /**
    * Halves
    */
-  .pull--portable-one-half, .pull--portable-two-quarters, .pull--portable-three-sixths, .pull--portable-four-eighths, .pull--portable-five-tenths, .pull--portable-six-twelfths {
+  .pull--portable--one-half, .pull--portable--two-quarters, .pull--portable--three-sixths, .pull--portable--four-eighths, .pull--portable--five-tenths, .pull--portable--six-twelfths {
     right: 50%;
   }
 
   /**
    * Thirds
    */
-  .pull--portable-one-third, .pull--portable-two-sixths, .pull--portable-four-twelfths {
+  .pull--portable--one-third, .pull--portable--two-sixths, .pull--portable--four-twelfths {
     right: 33.333%;
   }
 
-  .pull--portable-two-thirds, .pull--portable-four-sixths, .pull--portable-eight-twelfths {
+  .pull--portable--two-thirds, .pull--portable--four-sixths, .pull--portable--eight-twelfths {
     right: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .pull--portable-one-quarter, .pull--portable-two-eighths, .pull--portable-three-twelfths {
+  .pull--portable--one-quarter, .pull--portable--two-eighths, .pull--portable--three-twelfths {
     right: 25%;
   }
 
-  .pull--portable-three-quarters, .pull--portable-six-eighths, .pull--portable-nine-twelfths {
+  .pull--portable--three-quarters, .pull--portable--six-eighths, .pull--portable--nine-twelfths {
     right: 75%;
   }
 
   /**
    * Fifths
    */
-  .pull--portable-one-fifth, .pull--portable-two-tenths {
+  .pull--portable--one-fifth, .pull--portable--two-tenths {
     right: 20%;
   }
 
-  .pull--portable-two-fifths, .pull--portable-four-tenths {
+  .pull--portable--two-fifths, .pull--portable--four-tenths {
     right: 40%;
   }
 
-  .pull--portable-three-fifths, .pull--portable-six-tenths {
+  .pull--portable--three-fifths, .pull--portable--six-tenths {
     right: 60%;
   }
 
-  .pull--portable-four-fifths, .pull--portable-eight-tenths {
+  .pull--portable--four-fifths, .pull--portable--eight-tenths {
     right: 80%;
   }
 
   /**
    * Sixths
    */
-  .pull--portable-one-sixth, .pull--portable-two-twelfths {
+  .pull--portable--one-sixth, .pull--portable--two-twelfths {
     right: 16.666%;
   }
 
-  .pull--portable-five-sixths, .pull--portable-ten-twelfths {
+  .pull--portable--five-sixths, .pull--portable--ten-twelfths {
     right: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .pull--portable-one-eighth {
+  .pull--portable--one-eighth {
     right: 12.5%;
   }
 
-  .pull--portable-three-eighths {
+  .pull--portable--three-eighths {
     right: 37.5%;
   }
 
-  .pull--portable-five-eighths {
+  .pull--portable--five-eighths {
     right: 62.5%;
   }
 
-  .pull--portable-seven-eighths {
+  .pull--portable--seven-eighths {
     right: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .pull--portable-one-tenth {
+  .pull--portable--one-tenth {
     right: 10%;
   }
 
-  .pull--portable-three-tenths {
+  .pull--portable--three-tenths {
     right: 30%;
   }
 
-  .pull--portable-seven-tenths {
+  .pull--portable--seven-tenths {
     right: 70%;
   }
 
-  .pull--portable-nine-tenths {
+  .pull--portable--nine-tenths {
     right: 90%;
   }
 
   /**
    * Twelfths
    */
-  .pull--portable-one-twelfth {
+  .pull--portable--one-twelfth {
     right: 8.333%;
   }
 
-  .pull--portable-five-twelfths {
+  .pull--portable--five-twelfths {
     right: 41.666%;
   }
 
-  .pull--portable-seven-twelfths {
+  .pull--portable--seven-twelfths {
     right: 58.333%;
   }
 
-  .pull--portable-eleven-twelfths {
+  .pull--portable--eleven-twelfths {
     right: 91.666%;
   }
 }
@@ -1970,123 +1970,123 @@
   /**
    * Whole
    */
-  .pull--desk-one-whole {
+  .pull--desk--one-whole {
     right: 100%;
   }
 
   /**
    * Halves
    */
-  .pull--desk-one-half, .pull--desk-two-quarters, .pull--desk-three-sixths, .pull--desk-four-eighths, .pull--desk-five-tenths, .pull--desk-six-twelfths {
+  .pull--desk--one-half, .pull--desk--two-quarters, .pull--desk--three-sixths, .pull--desk--four-eighths, .pull--desk--five-tenths, .pull--desk--six-twelfths {
     right: 50%;
   }
 
   /**
    * Thirds
    */
-  .pull--desk-one-third, .pull--desk-two-sixths, .pull--desk-four-twelfths {
+  .pull--desk--one-third, .pull--desk--two-sixths, .pull--desk--four-twelfths {
     right: 33.333%;
   }
 
-  .pull--desk-two-thirds, .pull--desk-four-sixths, .pull--desk-eight-twelfths {
+  .pull--desk--two-thirds, .pull--desk--four-sixths, .pull--desk--eight-twelfths {
     right: 66.666%;
   }
 
   /**
    * Quarters
    */
-  .pull--desk-one-quarter, .pull--desk-two-eighths, .pull--desk-three-twelfths {
+  .pull--desk--one-quarter, .pull--desk--two-eighths, .pull--desk--three-twelfths {
     right: 25%;
   }
 
-  .pull--desk-three-quarters, .pull--desk-six-eighths, .pull--desk-nine-twelfths {
+  .pull--desk--three-quarters, .pull--desk--six-eighths, .pull--desk--nine-twelfths {
     right: 75%;
   }
 
   /**
    * Fifths
    */
-  .pull--desk-one-fifth, .pull--desk-two-tenths {
+  .pull--desk--one-fifth, .pull--desk--two-tenths {
     right: 20%;
   }
 
-  .pull--desk-two-fifths, .pull--desk-four-tenths {
+  .pull--desk--two-fifths, .pull--desk--four-tenths {
     right: 40%;
   }
 
-  .pull--desk-three-fifths, .pull--desk-six-tenths {
+  .pull--desk--three-fifths, .pull--desk--six-tenths {
     right: 60%;
   }
 
-  .pull--desk-four-fifths, .pull--desk-eight-tenths {
+  .pull--desk--four-fifths, .pull--desk--eight-tenths {
     right: 80%;
   }
 
   /**
    * Sixths
    */
-  .pull--desk-one-sixth, .pull--desk-two-twelfths {
+  .pull--desk--one-sixth, .pull--desk--two-twelfths {
     right: 16.666%;
   }
 
-  .pull--desk-five-sixths, .pull--desk-ten-twelfths {
+  .pull--desk--five-sixths, .pull--desk--ten-twelfths {
     right: 83.333%;
   }
 
   /**
    * Eighths
    */
-  .pull--desk-one-eighth {
+  .pull--desk--one-eighth {
     right: 12.5%;
   }
 
-  .pull--desk-three-eighths {
+  .pull--desk--three-eighths {
     right: 37.5%;
   }
 
-  .pull--desk-five-eighths {
+  .pull--desk--five-eighths {
     right: 62.5%;
   }
 
-  .pull--desk-seven-eighths {
+  .pull--desk--seven-eighths {
     right: 87.5%;
   }
 
   /**
    * Tenths
    */
-  .pull--desk-one-tenth {
+  .pull--desk--one-tenth {
     right: 10%;
   }
 
-  .pull--desk-three-tenths {
+  .pull--desk--three-tenths {
     right: 30%;
   }
 
-  .pull--desk-seven-tenths {
+  .pull--desk--seven-tenths {
     right: 70%;
   }
 
-  .pull--desk-nine-tenths {
+  .pull--desk--nine-tenths {
     right: 90%;
   }
 
   /**
    * Twelfths
    */
-  .pull--desk-one-twelfth {
+  .pull--desk--one-twelfth {
     right: 8.333%;
   }
 
-  .pull--desk-five-twelfths {
+  .pull--desk--five-twelfths {
     right: 41.666%;
   }
 
-  .pull--desk-seven-twelfths {
+  .pull--desk--seven-twelfths {
     right: 58.333%;
   }
 
-  .pull--desk-eleven-twelfths {
+  .pull--desk--eleven-twelfths {
     right: 91.666%;
   }
 }
diff --git a/demo.scss b/demo.scss
index 4b80aeb..9573aea 100644
--- a/demo.scss
+++ b/demo.scss
@@ -64,14 +64,14 @@ a{
 
     .content{
         @extend .grid__item;
-        @extend .desk-three-fifths;
-        @extend .lap-seven-tenths;
+        @extend .desk--three-fifths;
+        @extend .lap--seven-tenths;
     }
 
     .sub-content{
         @extend .grid__item;
-        @extend .desk-two-fifths;
-        @extend .lap-three-tenths;
+        @extend .desk--two-fifths;
+        @extend .lap--three-tenths;
     }
 
 .footer{
@@ -80,6 +80,6 @@ a{
 
     .footer__item{
         @extend .grid__item;
-        @extend .lap-one-half;
-        @extend .desk-one-quarter;
+        @extend .lap--one-half;
+        @extend .desk--one-quarter;
     }
diff --git a/index.html b/index.html
index a812217..e4f0c6e 100644
--- a/index.html
+++ b/index.html
@@ -32,18 +32,18 @@ <h1>csswizardry-grids</h1>
 
     <div class="grid">
 
-        <div class="grid__item  one-half  palm-one-whole">
+        <div class="grid__item  one-half  palm--one-whole">
 
             <div class="grid"> 
                 <div class="grid__item">
                     <p class="demo-block">Grid 1.1</p>
                 </div><!--
 
-             --><div class="grid__item  lap-one-whole  one-third">
+             --><div class="grid__item  lap--one-whole  one-third">
                     <p class="demo-block">Grid 1.2</p>
                 </div><!--
 
-             --><div class="grid__item  lap-one-whole  two-thirds">
+             --><div class="grid__item  lap--one-whole  two-thirds">
                     <p class="demo-block">Grid 1.3</p>
                 </div>
 
@@ -51,7 +51,7 @@ <h1>csswizardry-grids</h1>
 
         </div><!--
 
-     --><div class="grid__item  one-half  palm-one-whole">
+     --><div class="grid__item  one-half  palm--one-whole">
         
             <div class="grid">
 
@@ -63,15 +63,15 @@ <h1>csswizardry-grids</h1>
                     <p class="demo-block">Grid 2.2</p>
                 </div><!--
 
-             --><div class="grid__item  lap-one-half  desk-one-third">
+             --><div class="grid__item  lap--one-half  desk--one-third">
                     <p class="demo-block">Grid 2.3</p>
                 </div><!--
 
-             --><div class="grid__item  lap-one-half  desk-one-third">
+             --><div class="grid__item  lap--one-half  desk--one-third">
                     <p class="demo-block">Grid 2.4</p>
                 </div><!--
 
-             --><div class="grid__item  desk-one-third">
+             --><div class="grid__item  desk--one-third">
                     <p class="demo-block">Grid 2.5</p>
                 </div>
 
@@ -79,19 +79,19 @@ <h1>csswizardry-grids</h1>
 
         </div><!--
 
-     --><div class="grid__item  one-quarter  palm-one-half  push--palm-one-quarter">
+     --><div class="grid__item  one-quarter  palm--one-half  push--palm--one-quarter">
             <p class="demo-block">Grid 3.0</p>
         </div><!--
 
-     --><div class="grid__item  three-quarters  palm-one-whole">
+     --><div class="grid__item  three-quarters  palm--one-whole">
 
             <div class="grid--rev">
 
-                <div class="grid__item  one-half  palm-two-fifths">
+                <div class="grid__item  one-half  palm--two-fifths">
                     <p class="demo-block">Grid 4.1</p>
                 </div><!--
 
-             --><div class="grid__item  one-half  palm-two-fifths  pull--palm-one-fifth">
+             --><div class="grid__item  one-half  palm--two-fifths  pull--palm--one-fifth">
                     <p class="demo-block">Grid 4.2</p>
                 </div>
 
@@ -103,19 +103,19 @@ <h1>csswizardry-grids</h1>
 
             <div class="grid--full">
 
-                <div class="grid__item  palm-one-half  lap-one-half  desk-one-quarter">
+                <div class="grid__item  palm--one-half  lap--one-half  desk--one-quarter">
                     <p class="demo-block">Grid 5.1</p>
                 </div><!--
 
-             --><div class="grid__item  palm-one-half  lap-one-half  desk-one-quarter">
+             --><div class="grid__item  palm--one-half  lap--one-half  desk--one-quarter">
                     <p class="demo-block">Grid 5.2</p>
                 </div><!--
 
-             --><div class="grid__item  palm-three-fifths  lap-one-quarter  desk-one-quarter  push--lap-one-quarter">
+             --><div class="grid__item  palm--three-fifths  lap--one-quarter  desk--one-quarter  push--lap--one-quarter">
                     <p class="demo-block">Grid 5.3</p>
                 </div><!--
 
-             --><div class="grid__item  palm-two-fifths  lap-one-quarter  desk-one-quarter  push--lap-one-quarter">
+             --><div class="grid__item  palm--two-fifths  lap--one-quarter  desk--one-quarter  push--lap--one-quarter">
                     <p class="demo-block">Grid 5.4</p>
                 </div>
 
@@ -127,19 +127,19 @@ <h1>csswizardry-grids</h1>
 
             <div class="grid--rev  grid--full">
 
-                <div class="grid__item  palm-three-fifths  lap-one-quarter  desk-one-quarter">
+                <div class="grid__item  palm--three-fifths  lap--one-quarter  desk--one-quarter">
                     <p class="demo-block">Grid 6.1</p>
                 </div><!--
 
-             --><div class="grid__item  palm-two-fifths  lap-one-quarter  desk-one-quarter  pull--lap-one-half">
+             --><div class="grid__item  palm--two-fifths  lap--one-quarter  desk--one-quarter  pull--lap--one-half">
                     <p class="demo-block">Grid 6.2</p>
                 </div><!--
 
-             --><div class="grid__item  lap-one-whole  desk-one-quarter">
+             --><div class="grid__item  lap--one-whole  desk--one-quarter">
                     <p class="demo-block">Grid 6.3</p>
                 </div><!--
 
-             --><div class="grid__item  lap-one-half  desk-one-quarter  pull--lap-one-quarter">
+             --><div class="grid__item  lap--one-half  desk--one-quarter  pull--lap--one-quarter">
                     <p class="demo-block">Grid 6.4</p>
                 </div>