@mixin pointer-no-highlight() {
  cursor: pointer;

  &:hover, &:focus, &:active {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    user-select: none;
  }
}

@mixin hover() {
  @media (hover: hover) {
    &:hover {
      @content;
    }
  }
}

@function to-rem($value) {
  $rem-value: ($value / 16) + rem;

  @return $rem-value;
}