.button {
  @mixin button gray;

  border-radius: 0;
  cursor: pointer;

  &-small {
    font-size: 1.7em !important;
    box-shadow: none;
    padding: 0.1em;
    background-color: $color-mineShaft;
    border: 2px solid black;
  }

  &-tiny {
    font-size: 14px !important;
    box-shadow: none;
    padding: 2px;
    background-color: $color-mineShaft;
    border: 1px solid black;
    min-width: 20px;

    &:active {
      transform: translate(0, 1px);
    }
  }

  &-disabled,
  &-disabled:hover {
    opacity: 0.2;
    cursor: default;
    background-color: $color-mineShaft;
  }

  &-avatar {
    @mixin icon user-circle;
  }

  &-open {
    @mixin icon open;
  }

  &-delete {
    @mixin icon trash-o;
  }

  &-link {
    @mixin icon link;
  }

  &-follow {
    @mixin icon follow;
  }

  &-play {
    @mixin icon play;
  }

  &-pause {
    @mixin icon pause;
  }

  &-fast-forward {
    @mixin icon fast-forward;
  }

  &-step-forward {
    @mixin icon step-forward;
  }

  &-forward {
    @mixin icon forward;
  }

  &-merge {
    @mixin icon long-arrow-up;

    &::before {
      display: block;
      transform: rotate(-35deg);
    }
  }

  /* &-merge {
    @mixin icon level-up;
  } */

  &-fork {
    @mixin icon level-down;
  }
}
