
@mixin apply_transition($transition-property, $transition-duration, $transition-timing) {
  transition-property: $transition-property;
  transition-duration: $transition-duration;
  transition-timing-function: $transition-timing;
}

@mixin boxsizing() {
  box-sizing: border-box;
}

@mixin centerit() {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}



$color_ui: #222;
$color_ui_inverse: #fff;

$color_brand: #b657b5;


// -- secondary colors

$color_brand_faded: #996b99;

$color_ui_inverse_faded: #e7e5e5;

$color_ui_inverse: #ddd;
$color_ui_faded: #828080;

$color_highlight: #db4343;
