Registration modals styling WIP

app/assets/stylesheets/darkswarm/registration.css.sass

@@ -2,26 +2,25 @@
 @import mixins
 
 #registration-modal
-  .header
+  header
     text-align: center
-    background-color: #efefef
-    padding-bottom: 1rem
+    // background-color: #efefef
+    @media all and (max-width: 64em)
+      text-align: left
   .container
     background-color: #ffffff
-  .content
-    // margin-bottom: 15px
 
   i
     font-size: 150%
 
-  .buttons
-
   .field
-    margin-bottom: 15px
+    margin-bottom: 1em
 
-  input.chunky
+  .chunky
     padding: 8px
-    font-size: 105%
+    font-size: 1rem
+    margin: 0
+    width: 100%
 
   label.indent-checkbox
     display: block
@@ -33,9 +32,9 @@
   label
     margin-bottom: 3px
 
-  ol, ul
-    // font-size: 80%
+  ol, ul, p
     font-size: 0.875rem
+  ol, ul
     padding: 0
     margin: 0
   ol
@@ -44,22 +43,24 @@
   .highlight-box
     background: white
     padding: 1rem 1.2rem
-    @media all and (max-width: 640px)
+    @media all and (max-width: 64em)
       margin-top: 1rem
 
   #progress-bar
     margin-bottom: 15px
     .item
-      padding: 12px 0px
+      font-size: 0.75rem
+      padding: 10px 0px
       text-transform: uppercase
       text-align: center
-      background-color: #333
-      border: 2px solid #333
+      background-color: $clr-blue
+      border: 2px solid $clr-blue
       color: #fff
     .item.active
-      background-color: #cccccc
-      border: 2px solid #333
-      color: #333
+      background-color: $disabled-light
+      border: 2px solid $clr-blue
+      color: $clr-blue
+      font-weight: 700
       @include box-shadow(inset 0 0 1px 0 #fff)