style-forge.helpers/src/margin.css

Style-Forge.Helpers: essential CSS helper classes for spacing, alignment, visibility, and more in web development.

.m { margin: var(--sf-rem) }
.m\:a { margin: auto }
.m\:0 { margin: 0 }
.m\:xs { margin: var(--sf-rem-xs) }
.m\:sm { margin: var(--sf-rem-sm) }
.m\:s { margin: var(--sf-rem-s) }
.m\:ms { margin: var(--sf-rem-ms) }
.m\:ls { margin: var(--sf-rem-ls) }
.m\:md { margin: var(--sf-rem-md) }
.m\:lg { margin: var(--sf-rem-lg) }
.m\:xl { margin: var(--sf-rem-xl) }
.m\:2xl { margin: var(--sf-rem-2xl) }
.m\:3xl { margin: var(--sf-rem-3xl) }
.m\:4xl { margin: var(--sf-rem-4xl) }
.m\:5xl { margin: var(--sf-rem-5xl) }
.m\:6xl { margin: var(--sf-rem-6xl) }
.m\:7xl { margin: var(--sf-rem-7xl) }
.m\:8xl { margin: var(--sf-rem-8xl) }
.m\:9xl { margin: var(--sf-rem-9xl) }
.m\:10xl { margin: var(--sf-rem-10xl) }
.m\:11xl { margin: var(--sf-rem-11xl) }
.m\:12xl { margin: var(--sf-rem-12xl) }

.mt { margin-block-start: var(--sf-rem) }
.mt\:a { margin-block-start: auto }
.mt\:0 { margin-block-start: 0 }
.mt\:xs { margin-block-start: var(--sf-rem-xs) }
.mt\:sm { margin-block-start: var(--sf-rem-sm) }
.mt\:s { margin-block-start: var(--sf-rem-s) }
.mt\:ms { margin-block-start: var(--sf-rem-ms) }
.mt\:ls { margin-block-start: var(--sf-rem-ls) }
.mt\:md { margin-block-start: var(--sf-rem-md) }
.mt\:lg { margin-block-start: var(--sf-rem-lg) }
.mt\:xl { margin-block-start: var(--sf-rem-xl) }
.mt\:2xl { margin-block-start: var(--sf-rem-2xl) }
.mt\:3xl { margin-block-start: var(--sf-rem-3xl) }
.mt\:4xl { margin-block-start: var(--sf-rem-4xl) }
.mt\:5xl { margin-block-start: var(--sf-rem-5xl) }
.mt\:6xl { margin-block-start: var(--sf-rem-6xl) }
.mt\:7xl { margin-block-start: var(--sf-rem-7xl) }
.mt\:8xl { margin-block-start: var(--sf-rem-8xl) }
.mt\:9xl { margin-block-start: var(--sf-rem-9xl) }
.mt\:10xl { margin-block-start: var(--sf-rem-10xl) }
.mt\:11xl { margin-block-start: var(--sf-rem-11xl) }
.mt\:12xl { margin-block-start: var(--sf-rem-12xl) }

.mr { margin-inline-end: var(--sf-rem) }
.mr\:a { margin-inline-end: auto }
.mr\:0 { margin-inline-end: 0 }
.mr\:xs { margin-inline-end: var(--sf-rem-xs) }
.mr\:sm { margin-inline-end: var(--sf-rem-sm) }
.mr\:s { margin-inline-end: var(--sf-rem-s) }
.mr\:ms { margin-inline-end: var(--sf-rem-ms) }
.mr\:ls { margin-inline-end: var(--sf-rem-ls) }
.mr\:md { margin-inline-end: var(--sf-rem-md) }
.mr\:lg { margin-inline-end: var(--sf-rem-lg) }
.mr\:xl { margin-inline-end: var(--sf-rem-xl) }
.mr\:2xl { margin-inline-end: var(--sf-rem-2xl) }
.mr\:3xl { margin-inline-end: var(--sf-rem-3xl) }
.mr\:4xl { margin-inline-end: var(--sf-rem-4xl) }
.mr\:5xl { margin-inline-end: var(--sf-rem-5xl) }
.mr\:6xl { margin-inline-end: var(--sf-rem-6xl) }
.mr\:7xl { margin-inline-end: var(--sf-rem-7xl) }
.mr\:8xl { margin-inline-end: var(--sf-rem-8xl) }
.mr\:9xl { margin-inline-end: var(--sf-rem-9xl) }
.mr\:10xl { margin-inline-end: var(--sf-rem-10xl) }
.mr\:11xl { margin-inline-end: var(--sf-rem-11xl) }
.mr\:12xl { margin-inline-end: var(--sf-rem-12xl) }

.mb { margin-block-end: var(--sf-rem) }
.mb\:a { margin-block-end: auto }
.mb\:0 { margin-block-end: 0 }
.mb\:xs { margin-block-end: var(--sf-rem-xs) }
.mb\:sm { margin-block-end: var(--sf-rem-sm) }
.mb\:s { margin-block-end: var(--sf-rem-s) }
.mb\:ms { margin-block-end: var(--sf-rem-ms) }
.mb\:ls { margin-block-end: var(--sf-rem-ls) }
.mb\:md { margin-block-end: var(--sf-rem-md) }
.mb\:lg { margin-block-end: var(--sf-rem-lg) }
.mb\:xl { margin-block-end: var(--sf-rem-xl) }
.mb\:2xl { margin-block-end: var(--sf-rem-2xl) }
.mb\:3xl { margin-block-end: var(--sf-rem-3xl) }
.mb\:4xl { margin-block-end: var(--sf-rem-4xl) }
.mb\:5xl { margin-block-end: var(--sf-rem-5xl) }
.mb\:6xl { margin-block-end: var(--sf-rem-6xl) }
.mb\:7xl { margin-block-end: var(--sf-rem-7xl) }
.mb\:8xl { margin-block-end: var(--sf-rem-8xl) }
.mb\:9xl { margin-block-end: var(--sf-rem-9xl) }
.mb\:10xl { margin-block-end: var(--sf-rem-10xl) }
.mb\:11xl { margin-block-end: var(--sf-rem-11xl) }
.mb\:12xl { margin-block-end: var(--sf-rem-12xl) }

.ml { margin-inline-start: var(--sf-rem) }
.ml\:a { margin-inline-start: auto }
.ml\:0 { margin-inline-start: 0 }
.ml\:xs { margin-inline-start: var(--sf-rem-xs) }
.ml\:sm { margin-inline-start: var(--sf-rem-sm) }
.ml\:s { margin-inline-start: var(--sf-rem-s) }
.ml\:ms { margin-inline-start: var(--sf-rem-ms) }
.ml\:ls { margin-inline-start: var(--sf-rem-ls) }
.ml\:md { margin-inline-start: var(--sf-rem-md) }
.ml\:lg { margin-inline-start: var(--sf-rem-lg) }
.ml\:xl { margin-inline-start: var(--sf-rem-xl) }
.ml\:2xl { margin-inline-start: var(--sf-rem-2xl) }
.ml\:3xl { margin-inline-start: var(--sf-rem-3xl) }
.ml\:4xl { margin-inline-start: var(--sf-rem-4xl) }
.ml\:5xl { margin-inline-start: var(--sf-rem-5xl) }
.ml\:6xl { margin-inline-start: var(--sf-rem-6xl) }
.ml\:7xl { margin-inline-start: var(--sf-rem-7xl) }
.ml\:8xl { margin-inline-start: var(--sf-rem-8xl) }
.ml\:9xl { margin-inline-start: var(--sf-rem-9xl) }
.ml\:10xl { margin-inline-start: var(--sf-rem-10xl) }
.ml\:11xl { margin-inline-start: var(--sf-rem-11xl) }
.ml\:12xl { margin-inline-start: var(--sf-rem-12xl) }

.mx { margin-inline: var(--sf-rem) }
.mx\:a { margin-inline: auto }
.mx\:0 { margin-inline: 0 }
.mx\:xs { margin-inline: var(--sf-rem-xs) }
.mx\:sm { margin-inline: var(--sf-rem-sm) }
.mx\:s { margin-inline: var(--sf-rem-s) }
.mx\:ms { margin-inline: var(--sf-rem-ms) }
.mx\:ls { margin-inline: var(--sf-rem-ls) }
.mx\:md { margin-inline: var(--sf-rem-md) }
.mx\:lg { margin-inline: var(--sf-rem-lg) }
.mx\:xl { margin-inline: var(--sf-rem-xl) }
.mx\:2xl { margin-inline: var(--sf-rem-2xl) }
.mx\:3xl { margin-inline: var(--sf-rem-3xl) }
.mx\:4xl { margin-inline: var(--sf-rem-4xl) }
.mx\:5xl { margin-inline: var(--sf-rem-5xl) }
.mx\:6xl { margin-inline: var(--sf-rem-6xl) }
.mx\:7xl { margin-inline: var(--sf-rem-7xl) }
.mx\:8xl { margin-inline: var(--sf-rem-8xl) }
.mx\:9xl { margin-inline: var(--sf-rem-9xl) }
.mx\:10xl { margin-inline: var(--sf-rem-10xl) }
.mx\:11xl { margin-inline: var(--sf-rem-11xl) }
.mx\:12xl { margin-inline: var(--sf-rem-12xl) }

.my { margin-block: var(--sf-rem) }
.my\:a { margin-block: auto }
.my\:0 { margin-block: 0 }
.my\:xs { margin-block: var(--sf-rem-xs) }
.my\:sm { margin-block: var(--sf-rem-sm) }
.my\:s { margin-block: var(--sf-rem-s) }
.my\:ms { margin-block: var(--sf-rem-ms) }
.my\:ls { margin-block: var(--sf-rem-ls) }
.my\:md { margin-block: var(--sf-rem-md) }
.my\:lg { margin-block: var(--sf-rem-lg) }
.my\:xl { margin-block: var(--sf-rem-xl) }
.my\:2xl { margin-block: var(--sf-rem-2xl) }
.my\:3xl { margin-block: var(--sf-rem-3xl) }
.my\:4xl { margin-block: var(--sf-rem-4xl) }
.my\:5xl { margin-block: var(--sf-rem-5xl) }
.my\:6xl { margin-block: var(--sf-rem-6xl) }
.my\:7xl { margin-block: var(--sf-rem-7xl) }
.my\:8xl { margin-block: var(--sf-rem-8xl) }
.my\:9xl { margin-block: var(--sf-rem-9xl) }
.my\:10xl { margin-block: var(--sf-rem-10xl) }
.my\:11xl { margin-block: var(--sf-rem-11xl) }
.my\:12xl { margin-block: var(--sf-rem-12xl) }

.m\:n { margin: calc(var(--sf-rem) * -1) }
.m\:n\:xs { margin: calc(var(--sf-rem-xs) * -1) }
.m\:n\:sm { margin: calc(var(--sf-rem-sm) * -1) }
.m\:n\:s { margin: calc(var(--sf-rem-s) * -1) }
.m\:n\:ms { margin: calc(var(--sf-rem-ms) * -1) }
.m\:n\:ls { margin: calc(var(--sf-rem-ls) * -1) }
.m\:n\:md { margin: calc(var(--sf-rem-md) * -1) }
.m\:n\:lg { margin: calc(var(--sf-rem-lg) * -1) }
.m\:n\:xl { margin: calc(var(--sf-rem-xl) * -1) }
.m\:n\:2xl { margin: calc(var(--sf-rem-2xl) * -1) }
.m\:n\:3xl { margin: calc(var(--sf-rem-3xl) * -1) }
.m\:n\:4xl { margin: calc(var(--sf-rem-4xl) * -1) }
.m\:n\:5xl { margin: calc(var(--sf-rem-5xl) * -1) }
.m\:n\:6xl { margin: calc(var(--sf-rem-6xl) * -1) }
.m\:n\:7xl { margin: calc(var(--sf-rem-7xl) * -1) }
.m\:n\:8xl { margin: calc(var(--sf-rem-8xl) * -1) }
.m\:n\:9xl { margin: calc(var(--sf-rem-9xl) * -1) }
.m\:n\:10xl { margin: calc(var(--sf-rem-10xl) * -1) }
.m\:n\:11xl { margin: calc(var(--sf-rem-11xl) * -1) }
.m\:n\:12xl { margin: calc(var(--sf-rem-12xl) * -1) }

.mt\:n { margin-block-start: calc(var(--sf-rem) * -1) }
.mt\:n\:xs { margin-block-start: calc(var(--sf-rem-xs) * -1) }
.mt\:n\:sm { margin-block-start: calc(var(--sf-rem-sm) * -1) }
.mt\:n\:s { margin-block-start: calc(var(--sf-rem-s) * -1) }
.mt\:n\:ms { margin-block-start: calc(var(--sf-rem-ms) * -1) }
.mt\:n\:ls { margin-block-start: calc(var(--sf-rem-ls) * -1) }
.mt\:n\:md { margin-block-start: calc(var(--sf-rem-md) * -1) }
.mt\:n\:lg { margin-block-start: calc(var(--sf-rem-lg) * -1) }
.mt\:n\:xl { margin-block-start: calc(var(--sf-rem-xl) * -1) }
.mt\:n\:2xl { margin-block-start: calc(var(--sf-rem-2xl) * -1) }
.mt\:n\:3xl { margin-block-start: calc(var(--sf-rem-3xl) * -1) }
.mt\:n\:4xl { margin-block-start: calc(var(--sf-rem-4xl) * -1) }
.mt\:n\:5xl { margin-block-start: calc(var(--sf-rem-5xl) * -1) }
.mt\:n\:6xl { margin-block-start: calc(var(--sf-rem-6xl) * -1) }
.mt\:n\:7xl { margin-block-start: calc(var(--sf-rem-7xl) * -1) }
.mt\:n\:8xl { margin-block-start: calc(var(--sf-rem-8xl) * -1) }
.mt\:n\:9xl { margin-block-start: calc(var(--sf-rem-9xl) * -1) }
.mt\:n\:10xl { margin-block-start: calc(var(--sf-rem-10xl) * -1) }
.mt\:n\:11xl { margin-block-start: calc(var(--sf-rem-11xl) * -1) }
.mt\:n\:12xl { margin-block-start: calc(var(--sf-rem-12xl) * -1) }

.mr\:n { margin-inline-end: calc(var(--sf-rem) * -1) }
.mr\:n\:xs { margin-inline-end: calc(var(--sf-rem-xs) * -1) }
.mr\:n\:sm { margin-inline-end: calc(var(--sf-rem-sm) * -1) }
.mr\:n\:s { margin-inline-end: calc(var(--sf-rem-s) * -1) }
.mr\:n\:ms { margin-inline-end: calc(var(--sf-rem-ms) * -1) }
.mr\:n\:ls { margin-inline-end: calc(var(--sf-rem-ls) * -1) }
.mr\:n\:md { margin-inline-end: calc(var(--sf-rem-md) * -1) }
.mr\:n\:lg { margin-inline-end: calc(var(--sf-rem-lg) * -1) }
.mr\:n\:xl { margin-inline-end: calc(var(--sf-rem-xl) * -1) }
.mr\:n\:2xl { margin-inline-end: calc(var(--sf-rem-2xl) * -1) }
.mr\:n\:3xl { margin-inline-end: calc(var(--sf-rem-3xl) * -1) }
.mr\:n\:4xl { margin-inline-end: calc(var(--sf-rem-4xl) * -1) }
.mr\:n\:5xl { margin-inline-end: calc(var(--sf-rem-5xl) * -1) }
.mr\:n\:6xl { margin-inline-end: calc(var(--sf-rem-6xl) * -1) }
.mr\:n\:7xl { margin-inline-end: calc(var(--sf-rem-7xl) * -1) }
.mr\:n\:8xl { margin-inline-end: calc(var(--sf-rem-8xl) * -1) }
.mr\:n\:9xl { margin-inline-end: calc(var(--sf-rem-9xl) * -1) }
.mr\:n\:10xl { margin-inline-end: calc(var(--sf-rem-10xl) * -1) }
.mr\:n\:11xl { margin-inline-end: calc(var(--sf-rem-11xl) * -1) }
.mr\:n\:12xl { margin-inline-end: calc(var(--sf-rem-12xl) * -1) }

.mb\:n { margin-block-end: calc(var(--sf-rem) * -1) }
.mb\:n\:xs { margin-block-end: calc(var(--sf-rem-xs) * -1) }
.mb\:n\:sm { margin-block-end: calc(var(--sf-rem-sm) * -1) }
.mb\:n\:s { margin-block-end: calc(var(--sf-rem-s) * -1) }
.mb\:n\:ms { margin-block-end: calc(var(--sf-rem-ms) * -1) }
.mb\:n\:ls { margin-block-end: calc(var(--sf-rem-ls) * -1) }
.mb\:n\:md { margin-block-end: calc(var(--sf-rem-md) * -1) }
.mb\:n\:lg { margin-block-end: calc(var(--sf-rem-lg) * -1) }
.mb\:n\:xl { margin-block-end: calc(var(--sf-rem-xl) * -1) }
.mb\:n\:2xl { margin-block-end: calc(var(--sf-rem-2xl) * -1) }
.mb\:n\:3xl { margin-block-end: calc(var(--sf-rem-3xl) * -1) }
.mb\:n\:4xl { margin-block-end: calc(var(--sf-rem-4xl) * -1) }
.mb\:n\:5xl { margin-block-end: calc(var(--sf-rem-5xl) * -1) }
.mb\:n\:6xl { margin-block-end: calc(var(--sf-rem-6xl) * -1) }
.mb\:n\:7xl { margin-block-end: calc(var(--sf-rem-7xl) * -1) }
.mb\:n\:8xl { margin-block-end: calc(var(--sf-rem-8xl) * -1) }
.mb\:n\:9xl { margin-block-end: calc(var(--sf-rem-9xl) * -1) }
.mb\:n\:10xl { margin-block-end: calc(var(--sf-rem-10xl) * -1) }
.mb\:n\:11xl { margin-block-end: calc(var(--sf-rem-11xl) * -1) }
.mb\:n\:12xl { margin-block-end: calc(var(--sf-rem-12xl) * -1) }

.ml\:n { margin-inline-start: calc(var(--sf-rem) * -1) }
.ml\:n\:xs { margin-inline-start: calc(var(--sf-rem-xs) * -1) }
.ml\:n\:sm { margin-inline-start: calc(var(--sf-rem-sm) * -1) }
.ml\:n\:s { margin-inline-start: calc(var(--sf-rem-s) * -1) }
.ml\:n\:ms { margin-inline-start: calc(var(--sf-rem-ms) * -1) }
.ml\:n\:ls { margin-inline-start: calc(var(--sf-rem-ls) * -1) }
.ml\:n\:md { margin-inline-start: calc(var(--sf-rem-md) * -1) }
.ml\:n\:lg { margin-inline-start: calc(var(--sf-rem-lg) * -1) }
.ml\:n\:xl { margin-inline-start: calc(var(--sf-rem-xl) * -1) }
.ml\:n\:2xl { margin-inline-start: calc(var(--sf-rem-2xl) * -1) }
.ml\:n\:3xl { margin-inline-start: calc(var(--sf-rem-3xl) * -1) }
.ml\:n\:4xl { margin-inline-start: calc(var(--sf-rem-4xl) * -1) }
.ml\:n\:5xl { margin-inline-start: calc(var(--sf-rem-5xl) * -1) }
.ml\:n\:6xl { margin-inline-start: calc(var(--sf-rem-6xl) * -1) }
.ml\:n\:7xl { margin-inline-start: calc(var(--sf-rem-7xl) * -1) }
.ml\:n\:8xl { margin-inline-start: calc(var(--sf-rem-8xl) * -1) }
.ml\:n\:9xl { margin-inline-start: calc(var(--sf-rem-9xl) * -1) }
.ml\:n\:10xl { margin-inline-start: calc(var(--sf-rem-10xl) * -1) }
.ml\:n\:11xl { margin-inline-start: calc(var(--sf-rem-11xl) * -1) }
.ml\:n\:12xl { margin-inline-start: calc(var(--sf-rem-12xl) * -1) }

.mx\:n { margin-inline: calc(var(--sf-rem) * -1) }
.mx\:n\:xs { margin-inline: calc(var(--sf-rem-xs) * -1) }
.mx\:n\:sm { margin-inline: calc(var(--sf-rem-sm) * -1) }
.mx\:n\:s { margin-inline: calc(var(--sf-rem-s) * -1) }
.mx\:n\:ms { margin-inline: calc(var(--sf-rem-ms) * -1) }
.mx\:n\:ls { margin-inline: calc(var(--sf-rem-ls) * -1) }
.mx\:n\:md { margin-inline: calc(var(--sf-rem-md) * -1) }
.mx\:n\:lg { margin-inline: calc(var(--sf-rem-lg) * -1) }
.mx\:n\:xl { margin-inline: calc(var(--sf-rem-xl) * -1) }
.mx\:n\:2xl { margin-inline: calc(var(--sf-rem-2xl) * -1) }
.mx\:n\:3xl { margin-inline: calc(var(--sf-rem-3xl) * -1) }
.mx\:n\:4xl { margin-inline: calc(var(--sf-rem-4xl) * -1) }
.mx\:n\:5xl { margin-inline: calc(var(--sf-rem-5xl) * -1) }
.mx\:n\:6xl { margin-inline: calc(var(--sf-rem-6xl) * -1) }
.mx\:n\:7xl { margin-inline: calc(var(--sf-rem-7xl) * -1) }
.mx\:n\:8xl { margin-inline: calc(var(--sf-rem-8xl) * -1) }
.mx\:n\:9xl { margin-inline: calc(var(--sf-rem-9xl) * -1) }
.mx\:n\:10xl { margin-inline: calc(var(--sf-rem-10xl) * -1) }
.mx\:n\:11xl { margin-inline: calc(var(--sf-rem-11xl) * -1) }
.mx\:n\:12xl { margin-inline: calc(var(--sf-rem-12xl) * -1) }

.my\:n { margin-block: calc(var(--sf-rem) * -1) }
.my\:n\:xs { margin-block: calc(var(--sf-rem-xs) * -1) }
.my\:n\:sm { margin-block: calc(var(--sf-rem-sm) * -1) }
.my\:n\:s { margin-block: calc(var(--sf-rem-s) * -1) }
.my\:n\:ms { margin-block: calc(var(--sf-rem-ms) * -1) }
.my\:n\:ls { margin-block: calc(var(--sf-rem-ls) * -1) }
.my\:n\:md { margin-block: calc(var(--sf-rem-md) * -1) }
.my\:n\:lg { margin-block: calc(var(--sf-rem-lg) * -1) }
.my\:n\:xl { margin-block: calc(var(--sf-rem-xl) * -1) }
.my\:n\:2xl { margin-block: calc(var(--sf-rem-2xl) * -1) }
.my\:n\:3xl { margin-block: calc(var(--sf-rem-3xl) * -1) }
.my\:n\:4xl { margin-block: calc(var(--sf-rem-4xl) * -1) }
.my\:n\:5xl { margin-block: calc(var(--sf-rem-5xl) * -1) }
.my\:n\:6xl { margin-block: calc(var(--sf-rem-6xl) * -1) }
.my\:n\:7xl { margin-block: calc(var(--sf-rem-7xl) * -1) }
.my\:n\:8xl { margin-block: calc(var(--sf-rem-8xl) * -1) }
.my\:n\:9xl { margin-block: calc(var(--sf-rem-9xl) * -1) }
.my\:n\:10xl { margin-block: calc(var(--sf-rem-10xl) * -1) }
.my\:n\:11xl { margin-block: calc(var(--sf-rem-11xl) * -1) }
.my\:n\:12xl { margin-block: calc(var(--sf-rem-12xl) * -1) }

/* /// */

html.var .m { margin: 8px }
html.var .m\:a { margin: auto }
html.var .m\:0 { margin: 0 }
html.var .m\:xs { margin: 4px }
html.var .m\:sm { margin: 8px }
html.var .m\:s { margin: 10px }
html.var .m\:ms { margin: 12px }
html.var .m\:ls { margin: 14px }
html.var .m\:md { margin: 16px }
html.var .m\:lg { margin: 18px }
html.var .m\:xl { margin: 20px }
html.var .m\:2xl { margin: 24px }
html.var .m\:3xl { margin: 32px }
html.var .m\:4xl { margin: 40px }
html.var .m\:5xl { margin: 48px }
html.var .m\:6xl { margin: 56px }
html.var .m\:7xl { margin: 64px }
html.var .m\:8xl { margin: 72px }
html.var .m\:9xl { margin: 80px }
html.var .m\:10xl { margin: 88px }
html.var .m\:11xl { margin: 96px }
html.var .m\:12xl { margin: 104px }

html.var .mt { margin-top: 8px }
html.var .mt\:a { margin-top: auto }
html.var .mt\:0 { margin-top: 0 }
html.var .mt\:xs { margin-top: 4px }
html.var .mt\:sm { margin-top: 8px }
html.var .mt\:s { margin-top: 10px }
html.var .mt\:ms { margin-top: 12px }
html.var .mt\:ls { margin-top: 14px }
html.var .mt\:md { margin-top: 16px }
html.var .mt\:lg { margin-top: 18px }
html.var .mt\:xl { margin-top: 20px }
html.var .mt\:2xl { margin-top: 24px }
html.var .mt\:3xl { margin-top: 32px }
html.var .mt\:4xl { margin-top: 40px }
html.var .mt\:5xl { margin-top: 48px }
html.var .mt\:6xl { margin-top: 56px }
html.var .mt\:7xl { margin-top: 64px }
html.var .mt\:8xl { margin-top: 72px }
html.var .mt\:9xl { margin-top: 80px }
html.var .mt\:10xl { margin-top: 88px }
html.var .mt\:11xl { margin-top: 96px }
html.var .mt\:12xl { margin-top: 104px }

html.var .mr { margin-right: 8px }
html.var .mr\:a { margin-right: auto }
html.var .mr\:0 { margin-right: 0 }
html.var .mr\:xs { margin-right: 4px }
html.var .mr\:sm { margin-right: 8px }
html.var .mr\:s { margin-right: 10px }
html.var .mr\:ms { margin-right: 12px }
html.var .mr\:ls { margin-right: 14px }
html.var .mr\:md { margin-right: 16px }
html.var .mr\:lg { margin-right: 18px }
html.var .mr\:xl { margin-right: 20px }
html.var .mr\:2xl { margin-right: 24px }
html.var .mr\:3xl { margin-right: 32px }
html.var .mr\:4xl { margin-right: 40px }
html.var .mr\:5xl { margin-right: 48px }
html.var .mr\:6xl { margin-right: 56px }
html.var .mr\:7xl { margin-right: 64px }
html.var .mr\:8xl { margin-right: 72px }
html.var .mr\:9xl { margin-right: 80px }
html.var .mr\:10xl { margin-right: 88px }
html.var .mr\:11xl { margin-right: 96px }
html.var .mr\:12xl { margin-right: 104px }

html.var .mb { margin-bottom: 8px }
html.var .mb\:a { margin-bottom: auto }
html.var .mb\:0 { margin-bottom: 0 }
html.var .mb\:xs { margin-bottom: 4px }
html.var .mb\:sm { margin-bottom: 8px }
html.var .mb\:s { margin-bottom: 10px }
html.var .mb\:ms { margin-bottom: 12px }
html.var .mb\:ls { margin-bottom: 14px }
html.var .mb\:md { margin-bottom: 16px }
html.var .mb\:lg { margin-bottom: 18px }
html.var .mb\:xl { margin-bottom: 20px }
html.var .mb\:2xl { margin-bottom: 24px }
html.var .mb\:3xl { margin-bottom: 32px }
html.var .mb\:4xl { margin-bottom: 40px }
html.var .mb\:5xl { margin-bottom: 48px }
html.var .mb\:6xl { margin-bottom: 56px }
html.var .mb\:7xl { margin-bottom: 64px }
html.var .mb\:8xl { margin-bottom: 72px }
html.var .mb\:9xl { margin-bottom: 80px }
html.var .mb\:10xl { margin-bottom: 88px }
html.var .mb\:11xl { margin-bottom: 96px }
html.var .mb\:12xl { margin-bottom: 104px }

html.var .ml { margin-left: 8px }
html.var .ml\:a { margin-left: auto }
html.var .ml\:0 { margin-left: 0 }
html.var .ml\:xs { margin-left: 4px }
html.var .ml\:sm { margin-left: 8px }
html.var .ml\:s { margin-left: 10px }
html.var .ml\:ms { margin-left: 12px }
html.var .ml\:ls { margin-left: 14px }
html.var .ml\:md { margin-left: 16px }
html.var .ml\:lg { margin-left: 18px }
html.var .ml\:xl { margin-left: 20px }
html.var .ml\:2xl { margin-left: 24px }
html.var .ml\:3xl { margin-left: 32px }
html.var .ml\:4xl { margin-left: 40px }
html.var .ml\:5xl { margin-left: 48px }
html.var .ml\:6xl { margin-left: 56px }
html.var .ml\:7xl { margin-left: 64px }
html.var .ml\:8xl { margin-left: 72px }
html.var .ml\:9xl { margin-left: 80px }
html.var .ml\:10xl { margin-left: 88px }
html.var .ml\:11xl { margin-left: 96px }
html.var .ml\:12xl { margin-left: 104px }

html.var .mx { margin-left: 8px; margin-right: 8px }
html.var .mx\:a { margin-left: auto; margin-right: auto }
html.var .mx\:0 { margin-left: 0; margin-right: 0 }
html.var .mx\:xs { margin-left: 4px; margin-right: 4px }
html.var .mx\:sm { margin-left: 8px; margin-right: 8px }
html.var .mx\:s { margin-left: 10px; margin-right: 10px }
html.var .mx\:ms { margin-left: 12px; margin-right: 12px }
html.var .mx\:ls { margin-left: 14px; margin-right: 14px }
html.var .mx\:md { margin-left: 16px; margin-right: 16px }
html.var .mx\:lg { margin-left: 18px; margin-right: 18px }
html.var .mx\:xl { margin-left: 20px; margin-right: 20px }
html.var .mx\:2xl { margin-left: 24px; margin-right: 24px }
html.var .mx\:3xl { margin-left: 32px; margin-right: 32px }
html.var .mx\:4xl { margin-left: 40px; margin-right: 40px }
html.var .mx\:5xl { margin-left: 48px; margin-right: 48px }
html.var .mx\:6xl { margin-left: 56px; margin-right: 56px }
html.var .mx\:7xl { margin-left: 64px; margin-right: 64px }
html.var .mx\:8xl { margin-left: 72px; margin-right: 72px }
html.var .mx\:9xl { margin-left: 80px; margin-right: 80px }
html.var .mx\:10xl { margin-left: 88px; margin-right: 88px }
html.var .mx\:11xl { margin-left: 96px; margin-right: 96px }
html.var .mx\:12xl { margin-left: 104px; margin-right: 104px }

html.var .my { margin-top: 1em; margin-bottom: 1em }
html.var .my\:a { margin-top: auto; margin-bottom: auto }
html.var .my\:0 { margin-top: 0; margin-bottom: 0 }
html.var .my\:xs { margin-top: 4px; margin-bottom: 4px }
html.var .my\:sm { margin-top: 8px; margin-bottom: 8px }
html.var .my\:s { margin-top: 10px; margin-bottom: 10px }
html.var .my\:ms { margin-top: 12px; margin-bottom: 12px }
html.var .my\:ls { margin-top: 14px; margin-bottom: 14px }
html.var .my\:md { margin-top: 16px; margin-bottom: 16px }
html.var .my\:lg { margin-top: 18px; margin-bottom: 18px }
html.var .my\:xl { margin-top: 20px; margin-bottom: 20px }
html.var .my\:2xl { margin-top: 24px; margin-bottom: 24px }
html.var .my\:3xl { margin-top: 32px; margin-bottom: 32px }
html.var .my\:4xl { margin-top: 40px; margin-bottom: 40px }
html.var .my\:5xl { margin-top: 48px; margin-bottom: 48px }
html.var .my\:6xl { margin-top: 56px; margin-bottom: 56px }
html.var .my\:7xl { margin-top: 64px; margin-bottom: 64px }
html.var .my\:8xl { margin-top: 72px; margin-bottom: 72px }
html.var .my\:9xl { margin-top: 80px; margin-bottom: 80px }
html.var .my\:10xl { margin-top: 88px; margin-bottom: 88px }
html.var .my\:11xl { margin-top: 96px; margin-bottom: 96px }
html.var .my\:12xl { margin-top: 104px; margin-bottom: 104px }

html.var .mt\:n { margin-left: -8px }
html.var .mt\:n\:xs { margin-top: -4px }
html.var .mt\:n\:sm { margin-top: -8px }
html.var .mt\:n\:s { margin-top: -10px }
html.var .mt\:n\:ms { margin-top: -12px }
html.var .mt\:n\:ls { margin-top: -14px }
html.var .mt\:n\:md { margin-top: -16px }
html.var .mt\:n\:lg { margin-top: -18px }
html.var .mt\:n\:xl { margin-top: -20px }
html.var .mt\:n\:2xl { margin-top: -24px }
html.var .mt\:n\:3xl { margin-top: -32px }
html.var .mt\:n\:4xl { margin-top: -40px }
html.var .mt\:n\:5xl { margin-top: -48px }
html.var .mt\:n\:6xl { margin-top: -56px }
html.var .mt\:n\:7xl { margin-top: -64px }
html.var .mt\:n\:8xl { margin-top: -72px }
html.var .mt\:n\:9xl { margin-top: -80px }
html.var .mt\:n\:10xl { margin-top: -88px }
html.var .mt\:n\:11xl { margin-top: -96px }
html.var .mt\:n\:12xl { margin-top: -104px }

html.var .mr\:n { margin-left: -8px }
html.var .mr\:n\:xs { margin-right: -4px }
html.var .mr\:n\:sm { margin-right: -8px }
html.var .mr\:n\:s { margin-right: -10px }
html.var .mr\:n\:ms { margin-right: -12px }
html.var .mr\:n\:ls { margin-right: -14px }
html.var .mr\:n\:md { margin-right: -16px }
html.var .mr\:n\:lg { margin-right: -18px }
html.var .mr\:n\:xl { margin-right: -20px }
html.var .mr\:n\:2xl { margin-right: -24px }
html.var .mr\:n\:3xl { margin-right: -32px }
html.var .mr\:n\:4xl { margin-right: -40px }
html.var .mr\:n\:5xl { margin-right: -48px }
html.var .mr\:n\:6xl { margin-right: -56px }
html.var .mr\:n\:7xl { margin-right: -64px }
html.var .mr\:n\:8xl { margin-right: -72px }
html.var .mr\:n\:9xl { margin-right: -80px }
html.var .mr\:n\:10xl { margin-right: -88px }
html.var .mr\:n\:11xl { margin-right: -96px }
html.var .mr\:n\:12xl { margin-right: -104px }

html.var .mb\:n { margin-left: -8px }
html.var .mb\:n\:xs { margin-bottom: -4px }
html.var .mb\:n\:sm { margin-bottom: -8px }
html.var .mb\:n\:s { margin-bottom: -10px }
html.var .mb\:n\:ms { margin-bottom: -12px }
html.var .mb\:n\:ls { margin-bottom: -14px }
html.var .mb\:n\:md { margin-bottom: -16px }
html.var .mb\:n\:lg { margin-bottom: -18px }
html.var .mb\:n\:xl { margin-bottom: -20px }
html.var .mb\:n\:2xl { margin-bottom: -24px }
html.var .mb\:n\:3xl { margin-bottom: -32px }
html.var .mb\:n\:4xl { margin-bottom: -40px }
html.var .mb\:n\:5xl { margin-bottom: -48px }
html.var .mb\:n\:6xl { margin-bottom: -56px }
html.var .mb\:n\:7xl { margin-bottom: -64px }
html.var .mb\:n\:8xl { margin-bottom: -72px }
html.var .mb\:n\:9xl { margin-bottom: -80px }
html.var .mb\:n\:10xl { margin-bottom: -88px }
html.var .mb\:n\:11xl { margin-bottom: -96px }
html.var .mb\:n\:12xl { margin-bottom: -104px }

html.var .ml\:n { margin-left: -8px }
html.var .ml\:n\:xs { margin-left: -4px }
html.var .ml\:n\:sm { margin-left: -8px }
html.var .ml\:n\:s { margin-left: -10px }
html.var .ml\:n\:ms { margin-left: -12px }
html.var .ml\:n\:ls { margin-left: -14px }
html.var .ml\:n\:md { margin-left: -16px }
html.var .ml\:n\:lg { margin-left: -18px }
html.var .ml\:n\:xl { margin-left: -20px }
html.var .ml\:n\:2xl { margin-left: -24px }
html.var .ml\:n\:3xl { margin-left: -32px }
html.var .ml\:n\:4xl { margin-left: -40px }
html.var .ml\:n\:5xl { margin-left: -48px }
html.var .ml\:n\:6xl { margin-left: -56px }
html.var .ml\:n\:7xl { margin-left: -64px }
html.var .ml\:n\:8xl { margin-left: -72px }
html.var .ml\:n\:9xl { margin-left: -80px }
html.var .ml\:n\:10xl { margin-left: -88px }
html.var .ml\:n\:11xl { margin-left: -96px }
html.var .ml\:n\:12xl { margin-left: -104px }

html.var .mx\:n { margin-left: -8px; margin-right: -8px }
html.var .mx\:n\:xs { margin-left: -4px; margin-right: -4px }
html.var .mx\:n\:sm { margin-left: -8px; margin-right: -8px }
html.var .mx\:n\:s { margin-left: -10px; margin-right: -10px }
html.var .mx\:n\:ms { margin-left: -12px; margin-right: -12px }
html.var .mx\:n\:ls { margin-left: -14px; margin-right: -14px }
html.var .mx\:n\:md { margin-left: -16px; margin-right: -16px }
html.var .mx\:n\:lg { margin-left: -18px; margin-right: -18px }
html.var .mx\:n\:xl { margin-left: -20px; margin-right: -20px }
html.var .mx\:n\:2xl { margin-left: -24px; margin-right: -24px }
html.var .mx\:n\:3xl { margin-left: -32px; margin-right: -32px }
html.var .mx\:n\:4xl { margin-left: -40px; margin-right: -40px }
html.var .mx\:n\:5xl { margin-left: -48px; margin-right: -48px }
html.var .mx\:n\:6xl { margin-left: -56px; margin-right: -56px }
html.var .mx\:n\:7xl { margin-left: -64px; margin-right: -64px }
html.var .mx\:n\:8xl { margin-left: -72px; margin-right: -72px }
html.var .mx\:n\:9xl { margin-left: -80px; margin-right: -80px }
html.var .mx\:n\:10xl { margin-left: -88px; margin-right: -88px }
html.var .mx\:n\:11xl { margin-left: -96px; margin-right: -96px }
html.var .mx\:n\:12xl { margin-left: -104px; margin-right: -104px }

html.var .my\:n { margin-top: -8px; margin-bottom: -8px }
html.var .my\:n\:xs { margin-top: -4px; margin-bottom: -4px }
html.var .my\:n\:sm { margin-top: -8px; margin-bottom: -8px }
html.var .my\:n\:s { margin-top: -10px; margin-bottom: -10px }
html.var .my\:n\:ms { margin-top: -12px; margin-bottom: -12px }
html.var .my\:n\:ls { margin-top: -14px; margin-bottom: -14px }
html.var .my\:n\:md { margin-top: -16px; margin-bottom: -16px }
html.var .my\:n\:lg { margin-top: -18px; margin-bottom: -18px }
html.var .my\:n\:xl { margin-top: -20px; margin-bottom: -20px }
html.var .my\:n\:2xl { margin-top: -24px; margin-bottom: -24px }
html.var .my\:n\:3xl { margin-top: -32px; margin-bottom: -32px }
html.var .my\:n\:4xl { margin-top: -40px; margin-bottom: -40px }
html.var .my\:n\:5xl { margin-top: -48px; margin-bottom: -48px }
html.var .my\:n\:6xl { margin-top: -56px; margin-bottom: -56px }
html.var .my\:n\:7xl { margin-top: -64px; margin-bottom: -64px }
html.var .my\:n\:8xl { margin-top: -72px; margin-bottom: -72px }
html.var .my\:n\:9xl { margin-top: -80px; margin-bottom: -80px }
html.var .my\:n\:10xl { margin-top: -88px; margin-bottom: -88px }
html.var .my\:n\:11xl { margin-top: -96px; margin-bottom: -96px }
html.var .my\:n\:12xl { margin-top: -104px; margin-bottom: -104px }