// main: theme.scss
@mixin overlay( $bottom: 0 ) {
  background-image: -moz-linear-gradient( -90deg, rgba(0,0,0,0) 0%, rgb(0,0,0) 100%);
  background-image: -webkit-linear-gradient( -90deg, rgba(0,0,0,0) 0%, rgb(0,0,0) 100%);
  background-image: -ms-linear-gradient( -90deg, rgba(0,0,0,0) 0%, rgb(0,0,0) 100%);
  position: absolute;
	left: 0;
	right: 0;
	bottom: $bottom;
}

@mixin triangleBottomRight( $border: 20px ) {
  &::before {
    content: '';
    border-left: $border solid transparent;
    border-top: $border solid transparent;
    position: absolute;
    left: -( $border * 2 );
    bottom: 0;
  }
}

@mixin triangleTopRight( $border: 20px ) {
  &::before {
    content: '';
    border-left: $border solid transparent;
    border-bottom: $border solid transparent;
    position: absolute;
    left: -( $border * 2 );
    top: 0;
  }
}

@mixin triangleTopleft( $border: 20px ) {
  &::before {
    content: '';
    border-right: $border solid transparent;
    border-bottom: $border solid transparent;
    position: absolute;
    right: -( $border * 2 );
    top: 0;
    left: auto;
  }
}
