// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

$num:0;
*{margin:$num;padding:$num;}
@mixin arrow($dir , $bordersize , $color){
  width:0;
  height:0;
  @if $dir == top {
     border-bottom:$bordersize solid $color;
     border-left:$bordersize solid transparent;
     border-right:$bordersize solid transparent;
  }@else if $dir == right {
     border-left:$bordersize solid $color;
     border-top:$bordersize solid transparent;
     border-bottom:$bordersize solid transparent;
  }@else if $dir == bottom {
     border-top:$bordersize solid $color;
     border-left:$bordersize solid transparent;
     border-right:$bordersize solid transparent;
  }@else {
     border-right:$bordersize solid $color;
     border-top:$bordersize solid transparent;
     border-bottom:$bordersize solid transparent;
  }
}
.example-top {
  @include arrow(top , 20px , #f00);
}
.example-right {
  @include arrow(right , 30px , green);
}
.example-bottom {
  @include arrow(bottom , 40px , blue);
}
.example-left {
  @include arrow(left , 10px , #ff00aa);
}