// Amount
.quantity-holder
  display: inline-block
  +grid-height-s
  +grid-width-s(2.25)

  input[type="text"], input[type="tel"]
    border: 1px solid #D6CFC9
    +border-right-radius(0)
    float: left
    width: 80%
    +grid-height-s
    padding: 0 8px

    font-size: 1.4em
    +grid-line-height-s

  .quantity-btns
    position: relative
    float: left
    width: 20%
    height: 100%
    +border-right-radius($border-radius)
    background: #D6CFC9

    .quantity-btn
      position: relative
      display: block
      width: 100%
      height: 50%
      cursor: pointer
      &.add
        border-bottom: 1px solid #E7E4E1
      &.remove
        border-top: 1px solid #E7E4E1
      &:after
        content: ''
        display: block
        position: absolute
        z-index: 10
        @extend %icon-sprite
      &.add:after
        +icon-sprite(2,2,8px,5px,$center: true)
      &.remove:after
        +icon-sprite(2,1,8px,5px,$center: true)