@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

html
  background-image: $wood
  background-color: $background-brown
body
  padding-left: $side-spacing
  padding-right: $side-spacing
  //background-image: image-url('textures/wood6.png')
  background-color: transparent
  .home-panel
    margin-left: 20px
    margin-right: 20px
    margin-top: 40px
    +box-shadow(#000 10px 10px 16px)
    background-color: rgba(240, 240, 240, 0.6)
    +border-radius(10px)
    .home-header
      padding-top: 14px
      padding-bottom: 8px
      text-align: center
      //background-color: #eee
      //+border-top-radius(10px)
      //+opacity(0.7)
      min-height: 100px
    .home-center
      padding: 10px
      text-align: center
      background-color: black
    .home-footer
      //background-color: #eee
      //+border-bottom-radius(10px)
      //+opacity(0.7)
      min-height: 42px
      .home-footer-content
        margin-top: 5px
        margin-left: auto
        margin-right: auto
        background-color: green
        width: 262px
        a
          +user-button
          &.home-list-link
            background-image: image-url('icons/list.png')
          &.home-menu-link
            background-image: image-url('icons/menu.png')
  //padding-top: 50px
  .navbar-fixed-top
    margin-left: -$side-spacing
    margin-right: -$side-spacing
    margin-bottom: 3px
  .page-header
    margin-top: 4px
    margin-bottom: 6px
    padding-bottom: 0
  .order-product-count
    width: 30px
    text-align: right
    margin-bottom: 0
  .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
  i
    padding-left: 5px
#list-needs-payment-button
  button
    margin-left: 5px
  i
    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')