:root {
  /****************************************************************
  * Transition Property
  * Variables for controlling which CSS properties transition.
  * transition-property: var(--transition);
  *****************************************************************/
  --transition: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, translate, scale, rotate, filter, backdrop-filter;
  --transition-colors: color, background-color, border-color, text-decoration-color, fill, stroke;
  --transition-transform: transform, translate, scale, rotate;

  /****************************************************************
  * Transition Timing
  * Variables for controlling the timing of CSS transitions.
  * transition-duration|transition-delay: var(--time-75);
  *****************************************************************/
  --time-75:   75ms;
  --time-100:  100ms;
  --time-150:  150ms;
  --time-200:  200ms;
  --time-300:  300ms;
  --time-500:  500ms;
  --time-700:  700ms;
  --time-1000: 1000ms;
}