liser
Version:
functional css help to optimizing design work and building responsive websites
2,294 lines (2,262 loc) • 59.3 kB
CSS
.na1 {
margin: -var(--spacing-extra-small);
}
.na1s {
margin: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.na2 {
margin: -var(--spacing-small);
}
.na2s {
margin: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.na3 {
margin: -var(--spacing-medium);
}
.na3s {
margin: calc(
-0.5 * var(--spacing-large) - (var(--spacing-large) - var(--spacing-medium)) /
2
);
}
.na4 {
margin: -var(--spacing-large);
}
.na4s {
margin: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.na5 {
margin: -var(--spacing-extra-large);
}
.na5s {
margin: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.na6 {
margin: -var(--spacing-extra-extra-large);
}
.na6s {
margin: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.na7 {
margin: -var(--spacing-extra-extra-extra-large);
}
.nl1 {
margin-left: -var(--spacing-extra-small);
}
.nl1s {
margin-left: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nl2 {
margin-left: -var(--spacing-small);
}
.nl2s {
margin-left: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nl3 {
margin-left: -var(--spacing-medium);
}
.nl3s {
margin-left: calc(
-0.5 * var(--spacing-large) - (var(--spacing-large) - var(--spacing-medium)) /
2
);
}
.nl4 {
margin-left: -var(--spacing-large);
}
.nl4s {
margin-left: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nl5 {
margin-left: -var(--spacing-extra-large);
}
.nl5s {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nl6 {
margin-left: -var(--spacing-extra-extra-large);
}
.nl6s {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nl7 {
margin-left: -var(--spacing-extra-extra-extra-large);
}
.nr1 {
margin-right: -var(--spacing-extra-small);
}
.nr1s {
margin-right: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nr2 {
margin-right: -var(--spacing-small);
}
.nr2s {
margin-right: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nr3 {
margin-right: -var(--spacing-medium);
}
.nr3s {
margin-right: calc(
-0.5 * var(--spacing-large) - (var(--spacing-large) - var(--spacing-medium)) /
2
);
}
.nr4 {
margin-right: -var(--spacing-large);
}
.nr4s {
margin-right: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nr5 {
margin-right: -var(--spacing-extra-large);
}
.nr5s {
margin-right: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nr6 {
margin-right: -var(--spacing-extra-extra-large);
}
.nr6s {
margin-right: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nr7 {
margin-right: -var(--spacing-extra-extra-extra-large);
}
.nb1 {
margin-bottom: -var(--spacing-extra-small);
}
.nb1s {
margin-bottom: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nb2 {
margin-bottom: -var(--spacing-small);
}
.nb2s {
margin-bottom: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nb3 {
margin-bottom: -var(--spacing-medium);
}
.nb3s {
margin-bottom: calc(
-0.5 * var(--spacing-large) - (var(--spacing-large) - var(--spacing-medium)) /
2
);
}
.nb4 {
margin-bottom: -var(--spacing-large);
}
.nb4s {
margin-bottom: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nb5 {
margin-bottom: -var(--spacing-extra-large);
}
.nb5s {
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nb6 {
margin-bottom: -var(--spacing-extra-extra-large);
}
.nb6s {
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nb7 {
margin-bottom: -var(--spacing-extra-extra-extra-large);
}
.nt1 {
margin-top: -var(--spacing-extra-small);
}
.nt1s {
margin-top: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nt2 {
margin-top: -var(--spacing-small);
}
.nt2s {
margin-top: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nt3 {
margin-top: -var(--spacing-medium);
}
.nt3s {
margin-top: calc(
-0.5 * var(--spacing-large) - (var(--spacing-large) - var(--spacing-medium)) /
2
);
}
.nt4 {
margin-top: -var(--spacing-large);
}
.nt4s {
margin-top: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nt5 {
margin-top: -var(--spacing-extra-large);
}
.nt5s {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nt6 {
margin-top: -var(--spacing-extra-extra-large);
}
.nt6s {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nt7 {
margin-top: -var(--spacing-extra-extra-extra-large);
}
@media screen and (min-width: 30em) {
.na1-ns {
margin: -var(--spacing-extra-small);
}
.na1s-ns {
margin: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.na2-ns {
margin: -var(--spacing-small);
}
.na2s-ns {
margin: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.na3-ns {
margin: -var(--spacing-medium);
}
.na3s-ns {
margin: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.na4-ns {
margin: -var(--spacing-large);
}
.na4s-ns {
margin: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.na5-ns {
margin: -var(--spacing-extra-large);
}
.na5s-ns {
margin: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.na6-ns {
margin: -var(--spacing-extra-extra-large);
}
.na6s-ns {
margin: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.na7-ns {
margin: -var(--spacing-extra-extra-extra-large);
}
.nl1-ns {
margin-left: -var(--spacing-extra-small);
}
.nl1s-ns {
margin-left: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nl2-ns {
margin-left: -var(--spacing-small);
}
.nl2s-ns {
margin-left: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nl3-ns {
margin-left: -var(--spacing-medium);
}
.nl3s-ns {
margin-left: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nl4-ns {
margin-left: -var(--spacing-large);
}
.nl4s-ns {
margin-left: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nl5-ns {
margin-left: -var(--spacing-extra-large);
}
.nl5s-ns {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nl6-ns {
margin-left: -var(--spacing-extra-extra-large);
}
.nl6s-ns {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nl7-ns {
margin-left: -var(--spacing-extra-extra-extra-large);
}
.nr1-ns {
margin-right: -var(--spacing-extra-small);
}
.nr1s-ns {
margin-right: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nr2-ns {
margin-right: -var(--spacing-small);
}
.nr2s-ns {
margin-right: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nr3-ns {
margin-right: -var(--spacing-medium);
}
.nr3s-ns {
margin-right: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nr4-ns {
margin-right: -var(--spacing-large);
}
.nr4s-ns {
margin-right: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nr5-ns {
margin-right: -var(--spacing-extra-large);
}
.nr5s-ns {
margin-right: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nr6-ns {
margin-right: -var(--spacing-extra-extra-large);
}
.nr6s-ns {
margin-right: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nr7-ns {
margin-right: -var(--spacing-extra-extra-extra-large);
}
.nb1-ns {
margin-bottom: -var(--spacing-extra-small);
}
.nb1s-ns {
margin-bottom: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nb2-ns {
margin-bottom: -var(--spacing-small);
}
.nb2s-ns {
margin-bottom: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nb3-ns {
margin-bottom: -var(--spacing-medium);
}
.nb3s-ns {
margin-bottom: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nb4-ns {
margin-bottom: -var(--spacing-large);
}
.nb4s-ns {
margin-bottom: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nb5-ns {
margin-bottom: -var(--spacing-extra-large);
}
.nb5s-ns {
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nb6-ns {
margin-bottom: -var(--spacing-extra-extra-large);
}
.nb6s-ns {
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nb7-ns {
margin-bottom: -var(--spacing-extra-extra-extra-large);
}
.nt1-ns {
margin-top: -var(--spacing-extra-small);
}
.nt1s-ns {
margin-top: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nt2-ns {
margin-top: -var(--spacing-small);
}
.nt2s-ns {
margin-top: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nt3-ns {
margin-top: -var(--spacing-medium);
}
.nt3s-ns {
margin-top: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nt4-ns {
margin-top: -var(--spacing-large);
}
.nt4s-ns {
margin-top: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nt5-ns {
margin-top: -var(--spacing-extra-large);
}
.nt5s-ns {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nt6-ns {
margin-top: -var(--spacing-extra-extra-large);
}
.nt6s-ns {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nt7-ns {
margin-top: -var(--spacing-extra-extra-extra-large);
}
.nv1-ns {
margin-top: -var(--spacing-extra-small);
margin-bottom: -var(--spacing-extra-small);
}
.nv1s-ns {
margin-top: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nv2-ns {
margin-top: -var(--spacing-small);
margin-bottom: -var(--spacing-small);
}
.nv2s-ns {
margin-top: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nv3-ns {
margin-top: -var(--spacing-medium);
margin-bottom: -var(--spacing-medium);
}
.nv3s-ns {
margin-top: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nv4-ns {
margin-top: -var(--spacing-large);
margin-bottom: -var(--spacing-large);
}
.nv4s-ns {
margin-top: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nv5-ns {
margin-top: -var(--spacing-extra-large);
margin-bottom: -var(--spacing-extra-large);
}
.nv5s-ns {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nv6-ns {
margin-top: -var(--spacing-extra-extra-large);
margin-bottom: -var(--spacing-extra-extra-large);
}
.nv6s-ns {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nv7-ns {
margin-top: -var(--spacing-extra-extra-extra-large);
margin-bottom: -var(--spacing-extra-extra-extra-large);
}
.nh1-ns {
margin-left: -var(--spacing-extra-small);
margin-right: -var(--spacing-extra-small);
}
.nh1s-ns {
margin-left: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nh2-ns {
margin-left: -var(--spacing-small);
margin-right: -var(--spacing-small);
}
.nh2s-ns {
margin-left: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nh3-ns {
margin-left: -var(--spacing-medium);
margin-right: -var(--spacing-medium);
}
.nh3s-ns {
margin-left: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nh4-ns {
margin-left: -var(--spacing-large);
margin-right: -var(--spacing-large);
}
.nh4s-ns {
margin-left: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nh5-ns {
margin-left: -var(--spacing-extra-large);
margin-right: -var(--spacing-extra-large);
}
.nh5s-ns {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nh6-ns {
margin-left: -var(--spacing-extra-extra-large);
margin-right: -var(--spacing-extra-extra-large);
}
.nh6s-ns {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nh7-ns {
margin-left: -var(--spacing-extra-extra-extra-large);
margin-right: -var(--spacing-extra-extra-extra-large);
}
}
@media screen and (min-width: 30em) and (max-width: 60em) {
.na1-m {
margin: -var(--spacing-extra-small);
}
.na1s-m {
margin: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.na2-m {
margin: -var(--spacing-small);
}
.na2s-m {
margin: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.na3-m {
margin: -var(--spacing-medium);
}
.na3s-m {
margin: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.na4-m {
margin: -var(--spacing-large);
}
.na4s-m {
margin: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.na5-m {
margin: -var(--spacing-extra-large);
}
.na5s-m {
margin: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.na6-m {
margin: -var(--spacing-extra-extra-large);
}
.na6s-m {
margin: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.na7-m {
margin: -var(--spacing-extra-extra-extra-large);
}
.nl1-m {
margin-left: -var(--spacing-extra-small);
}
.nl1s-m {
margin-left: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nl2-m {
margin-left: -var(--spacing-small);
}
.nl2s-m {
margin-left: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nl3-m {
margin-left: -var(--spacing-medium);
}
.nl3s-m {
margin-left: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nl4-m {
margin-left: -var(--spacing-large);
}
.nl4s-m {
margin-left: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nl5-m {
margin-left: -var(--spacing-extra-large);
}
.nl5s-m {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nl6-m {
margin-left: -var(--spacing-extra-extra-large);
}
.nl6s-m {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nl7-m {
margin-left: -var(--spacing-extra-extra-extra-large);
}
.nr1-m {
margin-right: -var(--spacing-extra-small);
}
.nr1s-m {
margin-right: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nr2-m {
margin-right: -var(--spacing-small);
}
.nr2s-m {
margin-right: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nr3-m {
margin-right: -var(--spacing-medium);
}
.nr3s-m {
margin-right: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nr4-m {
margin-right: -var(--spacing-large);
}
.nr4s-m {
margin-right: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nr5-m {
margin-right: -var(--spacing-extra-large);
}
.nr5s-m {
margin-right: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nr6-m {
margin-right: -var(--spacing-extra-extra-large);
}
.nr6s-m {
margin-right: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nr7-m {
margin-right: -var(--spacing-extra-extra-extra-large);
}
.nb1-m {
margin-bottom: -var(--spacing-extra-small);
}
.nb1s-m {
margin-bottom: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nb2-m {
margin-bottom: -var(--spacing-small);
}
.nb2s-m {
margin-bottom: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nb3-m {
margin-bottom: -var(--spacing-medium);
}
.nb3s-m {
margin-bottom: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nb4-m {
margin-bottom: -var(--spacing-large);
}
.nb4s-m {
margin-bottom: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nb5-m {
margin-bottom: -var(--spacing-extra-large);
}
.nb5s-m {
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nb6-m {
margin-bottom: -var(--spacing-extra-extra-large);
}
.nb6s-m {
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nb7-m {
margin-bottom: -var(--spacing-extra-extra-extra-large);
}
.nt1-m {
margin-top: -var(--spacing-extra-small);
}
.nt1s-m {
margin-top: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nt2-m {
margin-top: -var(--spacing-small);
}
.nt2s-m {
margin-top: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nt3-m {
margin-top: -var(--spacing-medium);
}
.nt3s-m {
margin-top: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nt4-m {
margin-top: -var(--spacing-large);
}
.nt4s-m {
margin-top: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nt5-m {
margin-top: -var(--spacing-extra-large);
}
.nt5s-m {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nt6-m {
margin-top: -var(--spacing-extra-extra-large);
}
.nt6s-m {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nt7-m {
margin-top: -var(--spacing-extra-extra-extra-large);
}
.nv1-m {
margin-top: -var(--spacing-extra-small);
margin-bottom: -var(--spacing-extra-small);
}
.nv1s-m {
margin-top: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nv2-m {
margin-top: -var(--spacing-small);
margin-bottom: -var(--spacing-small);
}
.nv2s-m {
margin-top: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nv3-m {
margin-top: -var(--spacing-medium);
margin-bottom: -var(--spacing-medium);
}
.nv3s-m {
margin-top: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nv4-m {
margin-top: -var(--spacing-large);
margin-bottom: -var(--spacing-large);
}
.nv4s-m {
margin-top: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nv5-m {
margin-top: -var(--spacing-extra-large);
margin-bottom: -var(--spacing-extra-large);
}
.nv5s-m {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nv6-m {
margin-top: -var(--spacing-extra-extra-large);
margin-bottom: -var(--spacing-extra-extra-large);
}
.nv6s-m {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nv7-m {
margin-top: -var(--spacing-extra-extra-extra-large);
margin-bottom: -var(--spacing-extra-extra-extra-large);
}
.nh1-m {
margin-left: -var(--spacing-extra-small);
margin-right: -var(--spacing-extra-small);
}
.nh1s-m {
margin-left: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nh2-m {
margin-left: -var(--spacing-small);
margin-right: -var(--spacing-small);
}
.nh2s-m {
margin-left: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nh3-m {
margin-left: -var(--spacing-medium);
margin-right: -var(--spacing-medium);
}
.nh3s-m {
margin-left: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nh4-m {
margin-left: -var(--spacing-large);
margin-right: -var(--spacing-large);
}
.nh4s-m {
margin-left: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nh5-m {
margin-left: -var(--spacing-extra-large);
margin-right: -var(--spacing-extra-large);
}
.nh5s-m {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nh6-m {
margin-left: -var(--spacing-extra-extra-large);
margin-right: -var(--spacing-extra-extra-large);
}
.nh6s-m {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nh7-m {
margin-left: -var(--spacing-extra-extra-extra-large);
margin-right: -var(--spacing-extra-extra-extra-large);
}
}
@media screen and (max-width: 60em) and (orientation: landscape) {
.na1-ml {
margin: -var(--spacing-extra-small);
}
.na1s-ml {
margin: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.na2-ml {
margin: -var(--spacing-small);
}
.na2s-ml {
margin: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.na3-ml {
margin: -var(--spacing-medium);
}
.na3s-ml {
margin: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.na4-ml {
margin: -var(--spacing-large);
}
.na4s-ml {
margin: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.na5-ml {
margin: -var(--spacing-extra-large);
}
.na5s-ml {
margin: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.na6-ml {
margin: -var(--spacing-extra-extra-large);
}
.na6s-ml {
margin: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.na7-ml {
margin: -var(--spacing-extra-extra-extra-large);
}
.nl1-ml {
margin-left: -var(--spacing-extra-small);
}
.nl1s-ml {
margin-left: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nl2-ml {
margin-left: -var(--spacing-small);
}
.nl2s-ml {
margin-left: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nl3-ml {
margin-left: -var(--spacing-medium);
}
.nl3s-ml {
margin-left: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nl4-ml {
margin-left: -var(--spacing-large);
}
.nl4s-ml {
margin-left: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nl5-ml {
margin-left: -var(--spacing-extra-large);
}
.nl5s-ml {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nl6-ml {
margin-left: -var(--spacing-extra-extra-large);
}
.nl6s-ml {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nl7-ml {
margin-left: -var(--spacing-extra-extra-extra-large);
}
.nr1-ml {
margin-right: -var(--spacing-extra-small);
}
.nr1s-ml {
margin-right: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nr2-ml {
margin-right: -var(--spacing-small);
}
.nr2s-ml {
margin-right: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nr3-ml {
margin-right: -var(--spacing-medium);
}
.nr3s-ml {
margin-right: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nr4-ml {
margin-right: -var(--spacing-large);
}
.nr4s-ml {
margin-right: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nr5-ml {
margin-right: -var(--spacing-extra-large);
}
.nr5s-ml {
margin-right: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nr6-ml {
margin-right: -var(--spacing-extra-extra-large);
}
.nr6s-ml {
margin-right: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nr7-ml {
margin-right: -var(--spacing-extra-extra-extra-large);
}
.nb1-ml {
margin-bottom: -var(--spacing-extra-small);
}
.nb1s-ml {
margin-bottom: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nb2-ml {
margin-bottom: -var(--spacing-small);
}
.nb2s-ml {
margin-bottom: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nb3-ml {
margin-bottom: -var(--spacing-medium);
}
.nb3s-ml {
margin-bottom: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nb4-ml {
margin-bottom: -var(--spacing-large);
}
.nb4s-ml {
margin-bottom: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nb5-ml {
margin-bottom: -var(--spacing-extra-large);
}
.nb5s-ml {
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nb6-ml {
margin-bottom: -var(--spacing-extra-extra-large);
}
.nb6s-ml {
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nb7-ml {
margin-bottom: -var(--spacing-extra-extra-extra-large);
}
.nt1-ml {
margin-top: -var(--spacing-extra-small);
}
.nt1s-ml {
margin-top: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nt2-ml {
margin-top: -var(--spacing-small);
}
.nt2s-ml {
margin-top: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nt3-ml {
margin-top: -var(--spacing-medium);
}
.nt3s-ml {
margin-top: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nt4-ml {
margin-top: -var(--spacing-large);
}
.nt4s-ml {
margin-top: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nt5-ml {
margin-top: -var(--spacing-extra-large);
}
.nt5s-ml {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nt6-ml {
margin-top: -var(--spacing-extra-extra-large);
}
.nt6s-ml {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nt7-ml {
margin-top: -var(--spacing-extra-extra-extra-large);
}
.nv1-ml {
margin-top: -var(--spacing-extra-small);
margin-bottom: -var(--spacing-extra-small);
}
.nv1s-ml {
margin-top: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nv2-ml {
margin-top: -var(--spacing-small);
margin-bottom: -var(--spacing-small);
}
.nv2s-ml {
margin-top: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nv3-ml {
margin-top: -var(--spacing-medium);
margin-bottom: -var(--spacing-medium);
}
.nv3s-ml {
margin-top: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nv4-ml {
margin-top: -var(--spacing-large);
margin-bottom: -var(--spacing-large);
}
.nv4s-ml {
margin-top: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nv5-ml {
margin-top: -var(--spacing-extra-large);
margin-bottom: -var(--spacing-extra-large);
}
.nv5s-ml {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nv6-ml {
margin-top: -var(--spacing-extra-extra-large);
margin-bottom: -var(--spacing-extra-extra-large);
}
.nv6s-ml {
margin-top: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
margin-bottom: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nv7-ml {
margin-top: -var(--spacing-extra-extra-extra-large);
margin-bottom: -var(--spacing-extra-extra-extra-large);
}
.nh1-ml {
margin-left: -var(--spacing-extra-small);
margin-right: -var(--spacing-extra-small);
}
.nh1s-ml {
margin-left: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nh2-ml {
margin-left: -var(--spacing-small);
margin-right: -var(--spacing-small);
}
.nh2s-ml {
margin-left: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nh3-ml {
margin-left: -var(--spacing-medium);
margin-right: -var(--spacing-medium);
}
.nh3s-ml {
margin-left: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nh4-ml {
margin-left: -var(--spacing-large);
margin-right: -var(--spacing-large);
}
.nh4s-ml {
margin-left: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nh5-ml {
margin-left: -var(--spacing-extra-large);
margin-right: -var(--spacing-extra-large);
}
.nh5s-ml {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nh6-ml {
margin-left: -var(--spacing-extra-extra-large);
margin-right: -var(--spacing-extra-extra-large);
}
.nh6s-ml {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
margin-right: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nh7-ml {
margin-left: -var(--spacing-extra-extra-extra-large);
margin-right: -var(--spacing-extra-extra-extra-large);
}
}
@media screen and (min-width: 60em) {
.na1-l {
margin: -var(--spacing-extra-small);
}
.na1s-l {
margin: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.na2-l {
margin: -var(--spacing-small);
}
.na2s-l {
margin: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.na3-l {
margin: -var(--spacing-medium);
}
.na3s-l {
margin: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.na4-l {
margin: -var(--spacing-large);
}
.na4s-l {
margin: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.na5-l {
margin: -var(--spacing-extra-large);
}
.na5s-l {
margin: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.na6-l {
margin: -var(--spacing-extra-extra-large);
}
.na6s-l {
margin: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.na7-l {
margin: -var(--spacing-extra-extra-extra-large);
}
.nl1-l {
margin-left: -var(--spacing-extra-small);
}
.nl1s-l {
margin-left: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nl2-l {
margin-left: -var(--spacing-small);
}
.nl2s-l {
margin-left: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nl3-l {
margin-left: -var(--spacing-medium);
}
.nl3s-l {
margin-left: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nl4-l {
margin-left: -var(--spacing-large);
}
.nl4s-l {
margin-left: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)
) / 2
);
}
.nl5-l {
margin-left: -var(--spacing-extra-large);
}
.nl5s-l {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-large) -
(
var(--spacing-extra-extra-large) - var(--spacing-extra-large)
) / 2
);
}
.nl6-l {
margin-left: -var(--spacing-extra-extra-large);
}
.nl6s-l {
margin-left: calc(
-0.5 * var(--spacing-extra-extra-extra-large) -
(
var(--spacing-extra-extra-extra-large) -
var(--spacing-extra-extra-large)
) / 2
);
}
.nl7-l {
margin-left: -var(--spacing-extra-extra-extra-large);
}
.nr1-l {
margin-right: -var(--spacing-extra-small);
}
.nr1s-l {
margin-right: calc(
-0.5 * var(--spacing-small) -
(
var(--spacing-small) - var(--spacing-extra-small)
) / 2
);
}
.nr2-l {
margin-right: -var(--spacing-small);
}
.nr2s-l {
margin-right: calc(
-0.5 * var(--spacing-medium) -
(
var(--spacing-medium) - var(--spacing-small)
) / 2
);
}
.nr3-l {
margin-right: -var(--spacing-medium);
}
.nr3s-l {
margin-right: calc(
-0.5 * var(--spacing-large) -
(
var(--spacing-large) - var(--spacing-medium)
) / 2
);
}
.nr4-l {
margin-right: -var(--spacing-large);
}
.nr4s-l {
margin-right: calc(
-0.5 * var(--spacing-extra-large) -
(
var(--spacing-extra-large) - var(--spacing-large)