/* NON GENERIC OPTIONS
 * Following options are only usefull for one css property.
 */
/* static */
.gc-2xs {
  column-gap: var(--sp-2xs);
}

.gr-2xs {
  row-gap: var(--sp-2xs);
}

/* growing */
.gc-2xs-xs {
  column-gap: var(--sp-2xs-xs);
}

.gr-2xs-xs {
  row-gap: var(--sp-2xs-xs);
}

/* static */
.gc-xs {
  column-gap: var(--sp-xs);
}

.gr-xs {
  row-gap: var(--sp-xs);
}

/* growing */
.gc-xs-s {
  column-gap: var(--sp-xs-s);
}

.gr-xs-s {
  row-gap: var(--sp-xs-s);
}

/* shrinking */
.gc-xs-2xs {
  column-gap: var(--sp-xs-2xs);
}

.gr-xs-2xs {
  row-gap: var(--sp-xs-2xs);
}

/* static */
.gc-s {
  column-gap: var(--sp-s);
}

.gr-s {
  row-gap: var(--sp-s);
}

/* growing */
.gc-s-m {
  column-gap: var(--sp-s-m);
}

.gr-s-m {
  row-gap: var(--sp-s-m);
}

/* shrinking */
.gc-s-xs {
  column-gap: var(--sp-s-xs);
}

.gr-s-xs {
  row-gap: var(--sp-s-xs);
}

/* static */
.gc-m {
  column-gap: var(--sp-m);
}

.gr-m {
  row-gap: var(--sp-m);
}

/* growing */
.gc-m-l {
  column-gap: var(--sp-m-l);
}

.gr-m-l {
  row-gap: var(--sp-m-l);
}

/* shrinking */
.gc-m-s {
  column-gap: var(--sp-m-s);
}

.gr-m-s {
  row-gap: var(--sp-m-s);
}

/* static */
.gc-l {
  column-gap: var(--sp-l);
}

.gr-l {
  row-gap: var(--sp-l);
}

/* growing */
.gc-l-xl {
  column-gap: var(--sp-l-xl);
}

.gr-l-xl {
  row-gap: var(--sp-l-xl);
}

/* shrinking */
.gc-l-m {
  column-gap: var(--sp-l-m);
}

.gr-l-m {
  row-gap: var(--sp-l-m);
}

/* static */
.gc-xl {
  column-gap: var(--sp-xl);
}

.gr-xl {
  row-gap: var(--sp-xl);
}

/* growing */
.gc-xl-2xl {
  column-gap: var(--sp-xl-2xl);
}

.gr-xl-2xl {
  row-gap: var(--sp-xl-2xl);
}

/* shrinking */
.gc-xl-l {
  column-gap: var(--sp-xl-l);
}

.gr-xl-l {
  row-gap: var(--sp-xl-l);
}

/* static */
.gc-2xl {
  column-gap: var(--sp-2xl);
}

.gr-2xl {
  row-gap: var(--sp-2xl);
}

/* growing */
.gc-2xl-3xl {
  column-gap: var(--sp-2xl-3xl);
}

.gr-2xl-3xl {
  row-gap: var(--sp-2xl-3xl);
}

/* shrinking */
.gc-2xl-xl {
  column-gap: var(--sp-2xl-xl);
}

.gr-2xl-xl {
  row-gap: var(--sp-2xl-xl);
}

/* static */
.gc-3xl {
  column-gap: var(--sp-3xl);
}

.gr-3xl {
  row-gap: var(--sp-3xl);
}

/* growing */
.gc-3xl-4xl {
  column-gap: var(--sp-3xl-4xl);
}

.gr-3xl-4xl {
  row-gap: var(--sp-3xl-4xl);
}

/* shrinking */
.gc-3xl-2xl {
  column-gap: var(--sp-3xl-2xl);
}

.gr-3xl-2xl {
  row-gap: var(--sp-3xl-2xl);
}

/* static */
.gc-4xl {
  column-gap: var(--sp-4xl);
}

.gr-4xl {
  row-gap: var(--sp-4xl);
}

/* shrinking */
.gc-4xl-3xl {
  column-gap: var(--sp-4xl-3xl);
}

.gr-4xl-3xl {
  row-gap: var(--sp-4xl-3xl);
}