/**
* Position utilities.
*
* naming convention: gl-{property-value}
*/
@mixin gl-relative {
  position: relative;
}

@mixin gl-absolute {
  position: absolute;
}

@mixin gl-static {
  position: static;
}

@mixin gl-fixed {
  position: fixed;
}

@mixin gl-sticky {
  position: sticky;
}

/**
* Placement utilities.
*
* For absolute or fixed positioned elements
*
* naming convention: gl-{position}-{spacing-scale-index}
*/

/**
* Placement utilities
*
* naming convention: gl-{position}-{value}
*/
@mixin gl-top-auto {
  top: auto;
}

@mixin gl-top-0 {
  top: 0;
}

@mixin gl-top-1 {
  top: $gl-spacing-scale-1;
}

@mixin gl-top-2 {
  top: $gl-spacing-scale-2;
}

@mixin gl-top-3 {
  top: $gl-spacing-scale-3;
}

@mixin gl-top-4 {
  top: $gl-spacing-scale-4;
}

@mixin gl-top-5 {
  top: $gl-spacing-scale-5;
}

@mixin gl-top-6 {
  top: $gl-spacing-scale-6;
}

@mixin gl-top-7 {
  top: $gl-spacing-scale-7;
}

@mixin gl-top-8 {
  top: $gl-spacing-scale-8;
}

@mixin gl-top-half {
  top: 50%;
}

@mixin gl-right-auto {
  right: auto;
}

@mixin gl-right-0 {
  right: 0;
}

@mixin gl-right-1 {
  right: $gl-spacing-scale-1;
}

@mixin gl-right-2 {
  right: $gl-spacing-scale-2;
}

@mixin gl-right-3 {
  right: $gl-spacing-scale-3;
}

@mixin gl-right-4 {
  right: $gl-spacing-scale-4;
}

@mixin gl-right-5 {
  right: $gl-spacing-scale-5;
}

@mixin gl-right-6 {
  right: $gl-spacing-scale-6;
}

@mixin gl-right-7 {
  right: $gl-spacing-scale-7;
}

@mixin gl-bottom-0 {
  bottom: 0;
}

@mixin gl-bottom-1 {
  bottom: $gl-spacing-scale-1;
}

@mixin gl-bottom-2 {
  bottom: $gl-spacing-scale-2;
}

@mixin gl-bottom-3 {
  bottom: $gl-spacing-scale-3;
}

@mixin gl-bottom-4 {
  bottom: $gl-spacing-scale-4;
}

@mixin gl-bottom-5 {
  bottom: $gl-spacing-scale-5;
}

@mixin gl-bottom-6 {
  bottom: $gl-spacing-scale-6;
}

@mixin gl-bottom-7 {
  bottom: $gl-spacing-scale-7;
}

@mixin gl-left-auto {
  left: auto;
}

@mixin gl-left-0 {
  left: 0;
}

@mixin gl-left-1 {
  left: $gl-spacing-scale-1;
}

@mixin gl-left-2 {
  left: $gl-spacing-scale-2;
}

@mixin gl-left-3 {
  left: $gl-spacing-scale-3;
}

@mixin gl-left-4 {
  left: $gl-spacing-scale-4;
}

@mixin gl-left-5 {
  left: $gl-spacing-scale-5;
}

@mixin gl-left-6 {
  left: $gl-spacing-scale-6;
}

@mixin gl-left-7 {
  left: $gl-spacing-scale-7;
}

@mixin gl-left-50p {
  left: 50%;
}

@mixin gl-top-n5 {
  top: -$gl-spacing-scale-5;
}

@mixin gl-float-left {
  float: left;
}

@mixin gl-float-right {
  float: right;
}