@mixin arrow-button(
  $size,
  $color-lines,
  $color-bg
) {

  $size-line: $size/15;
  position: relative;

  box-sizing: border-box;
  width: $size;
  height: $size;

  border: solid $size-line $color-lines;
  border-radius: $size;

  background-color: $color-bg;

  &:before {
    //content: '';
    //display: block;
    //
    //position: absolute;
    //top:($size/3) - ($size-line*2);
    //left:($size/4) - ($size-line*2);
    //
    ////box-sizing: border-box;
    //width: $size/2;
    //height: $size/3;
    //
    //border:solid $size-line $color-lines;
  }
  &:after {
    content: '';
    display: block;

    position: absolute;
    top: $size/3;
    left:$size*0.2643;

    box-sizing: border-box;
    width: $size/3;
    height: $size/3;

    border-top:solid $size-line $color-lines;
    border-left:solid $size-line $color-lines;

    transform: rotate(45deg);
  }
}