// EQUAL FONT
.equal-font{
  @include equal-font-size($equal-font-size);
}

// BRANDBOOK COLOR VARS (used only for documentation)
.brandbook-theme-color{
  @include design-theme-color('color',$brandbook-theme-colors);
}
.brandbook-theme-bg{
  @include design-theme-color('background-color',$brandbook-theme-colors);
}

// THEME COLOR VARS
.design-theme-color{
  @include design-theme-color('color',$theme-colors);
}
.design-theme-fill{
  @include design-theme-color('fill',$theme-colors);
}
.design-theme-bg{
  @include design-theme-color('background-color',$theme-colors);
}
.design-theme-border{
  @include design-theme-color('border-color',$theme-colors);
}

// OPACITY
@for $i from 1 through 9 {
    .opacity-#{$i} {
        opacity: #{$i} / 10;
    }
}

// Z-INDEX
.z-index-1 {
  z-index: 1;
}
.z-index-8 {
  z-index: 8;
}
.z-index-9 {
  z-index: 9;
}
.z-index-99 {
  z-index: 99;
}