styling changes

app/assets/stylesheets/user/structure.css.sass

@@ -1,27 +1,5 @@
 @import compass
-@import constants
-$side-spacing: 5px
-=user-button
-  cursor: pointer
-  border: 2px solid black
-  +border-radius(4px)
-  +box-shadow(#000 4px 4px 8px)
-  width: 34px
-  height: 34px
-  display: block
-  float: left
-  margin-left: 15px
-  background-color: $qbrown
-  text-align: center
-  line-height: 34px
-  background-repeat: no-repeat
-  background-position: center center
-  text-indent: -5000px
-  &.active
-    background-color: $qbrown-active
-  &.hide
-    display: none
-
+@import user/constants
 html
   background-image: $wood
   background-color: $background-brown
@@ -58,14 +36,21 @@ body
         margin-top: 5px
         margin-left: auto
         margin-right: auto
-        background-color: green
         width: 262px
         a
           +user-button
+          span
+            display: block
+            width: 28px
+            height: 26px
+            background-repeat: no-repeat
+            background-position: center center
           &.home-list-link
-            background-image: image-url('icons/list.png')
+            span
+              background-image: image-url('icons/list.png')
           &.home-menu-link
-            background-image: image-url('icons/menu.png')
+            span
+              background-image: image-url('icons/menu.png')
   //padding-top: 50px
   .navbar-fixed-top
     margin-left: -$side-spacing
@@ -82,11 +67,6 @@ body
   .order-count-cell
     white-space: nowrap
   .page-header
-    .supplier-name
-      float: right
-      margin-right: 8px
-    .table-number
-      float: right
 #list-needs-help-button
   button
     margin-left: 5px
@@ -99,11 +79,32 @@ body
     padding-left: 5px
 .user-top-button
   +user-button 
-  &#show-active-list
-    background-image: image-url('icons/list.png')
-  &#place-order-on-list
-    background-image: image-url('icons/menu.png')
-  &#list-needs-payment-button
-    background-image: image-url('icons/needs-payment.png')
-  &#list-needs-help-button
-    background-image: image-url('icons/needs-help.png')
+  span
+    display: block
+    width: 28px
+    height: 28px
+    background-position: center center
+    background-repeat: no-repeat
+.top-button-bar
+  +button-bar
+  height: 90px
+  .button-bar-content
+    padding-top: 10px
+    .supplier-name
+      float: right
+      margin-right: 8px
+    .table-number
+      float: right
+    #show-active-list
+      span
+        background-image: image-url('icons/list.png')
+    #place-order-on-list
+      span
+        background-image: image-url('icons/menu.png')
+    #list-needs-payment-button
+      span
+        background-image: image-url('icons/needs-payment.png')
+    #list-needs-help-button
+      span
+        background-image: image-url('icons/needs-help.png')
+