span.icon
  @extend .fa
  //@extend .fa-lg
  &.dashboard
    @extend .fa-list-alt
  &.menu
    @extend .fa-coffee
  &.needs-help
    @extend .fa-bell
  &.needs-payment
    @extend .fa-money
  &.sections
    @extend .fa-th-large
  &.tables
    //@extend .fa-pause
    width: 16px
    height: 16px
    background-image: image-url("icons/table-white.svg")
  &.lists
    @extend .fa-sticky-note-o
  &.employees
    @extend .fa-users
  &.schedule
    @extend .fa-calendar
  &.settings
    @extend .fa-gears

  &.section-areas
    @extend .fa-object-group
  &.section-elements
    @extend .fa-image
// CUSTOM ICONS
.top-menu
  .icon.tables
    background-image: image-url("icons/table-green.svg")
.active
  span.icon
    &.tables
      background-image: image-url("icons/table-current.svg")
.side-menu
  .icon
// STACK FIXES
.fa-stack
  .revoke
    color: #b94a48
.fa-shifted-stack .fa-shifted:last-child
  margin-left: -1.15rem
button, .button
  .fa-shifted-stack
    .fa-shifted:last-child
      margin-left: -0.85rem
  .fa-stack.fa-stack-sized
    width: auto
    height: auto
    line-height: 0 // For some reason this works on supplier dashboard for list
    vertical-align: -15%
    .fa-stack-small
      font-size: 0.5em
    .fa:last-child
      margin-left: -1.35rem
      vertical-align: -20%
      &.fa-stack-small
        margin-left: -1.35rem
        vertical-align: 30%
    .fa-stack-check:last-child
      @extend .fa
      @extend .fa-check
      color: #ffd600
      margin-left: -2rem
      vertical-align: 0
      text-shadow: 1px 4px 1px rgba(0, 0, 0, 0.45)