@charset "utf-8";

@mixin _setArrow($arrowsize, $borderColor, $borderWidth){
  display: inline-block;
  height: $arrowsize;
  width: $arrowsize;
  border-width: $borderWidth $borderWidth 0 0;
  border-color: $borderColor;
  border-style: solid;
}

@mixin setTopArrow($arrowsize, $borderColor, $borderWidth) {
  @include _setArrow($arrowsize, $borderColor, $borderWidth);
  transform: matrix(0.71,-0.71,0.71,0.71,0,0); // rotate(-45deg)
}

@mixin setRightArrow($arrowsize, $borderColor,$borderWidth) {
  @include _setArrow($arrowsize, $borderColor, $borderWidth);
  transform: matrix(0.71,0.71,-0.71,0.71,0,0); // rotate(45deg);
}

@mixin setDownArrow($arrowsize, $borderColor,$borderWidth) {
  @include _setArrow($arrowsize, $borderColor, $borderWidth);
  transform: matrix(-0.71,0.71,-0.71,-0.71,0,0); // rotate(135deg);
}

@mixin setLeftArrow($arrowsize, $borderColor,$borderWidth) {
  @include _setArrow($arrowsize, $borderColor, $borderWidth);
  transform: matrix(-0.71,-0.71,0.71,-0.71,0,0); // rotate(-135deg);
}