:root { /* ----------------------------------------------------------------------------- * Gutter - Default * ----------------------------------------------------------------------------- */ --tec-grid-gutter: 48px; --tec-grid-gutter-negative: calc(var(--tec-grid-gutter) * -1); --tec-grid-gutter-half: calc(var(--tec-grid-gutter) / 2); --tec-grid-gutter-half-negative: calc(var(--tec-grid-gutter-half) * -1); --tec-grid-gutter-small: 42px; --tec-grid-gutter-small-negative: calc(var(--tec-grid-gutter-small) * -1); --tec-grid-gutter-small-half: calc(var(--tec-grid-gutter-small) / 2); --tec-grid-gutter-small-half-negative: calc(var(--tec-grid-gutter-small-half) * -1); /* ----------------------------------------------------------------------------- * Gutter - Page * ----------------------------------------------------------------------------- */ --tec-grid-gutter-page: 42px; --tec-grid-gutter-page-small: 19.5px; /* ----------------------------------------------------------------------------- * Grid Width - Default * ----------------------------------------------------------------------------- */ --tec-grid-width-default: 1176px; --tec-grid-width-min: 320px; --tec-grid-width: calc(var(--tec-grid-width-default) + 2 * var(--tec-grid-gutter-page)); /* ----------------------------------------------------------------------------- * Grid Width - Relative * ----------------------------------------------------------------------------- */ --tec-grid-width-1-of-2: 50%; --tec-grid-width-1-of-3: 33.333%; --tec-grid-width-1-of-4: 25%; --tec-grid-width-1-of-5: 20%; --tec-grid-width-1-of-7: 14.285%; --tec-grid-width-1-of-8: 12.5%; --tec-grid-width-1-of-9: 11.111%; }