ghost/admin/app/styles/spirit/_coordinates.css
/*
Base:
top
right
bottom
left
Value:
-(n) = (n * grid)
Media Query Extensions:
-ns = not-small
-m = medium
-l = large
*/
.top-0 { top: 0; }
.top-1 { top: calc(var(--grid-size) * 1); }
.top-2 { top: calc(var(--grid-size) * 2); }
.top-3 { top: calc(var(--grid-size) * 3); }
.top-4 { top: calc(var(--grid-size) * 4); }
.top-5 { top: calc(var(--grid-size) * 5); }
.top-6 { top: calc(var(--grid-size) * 6); }
.top-7 { top: calc(var(--grid-size) * 7); }
.top-8 { top: calc(var(--grid-size) * 8); }
.top-9 { top: calc(var(--grid-size) * 9); }
.top-10 { top: calc(var(--grid-size) * 10); }
.top-11 { top: calc(var(--grid-size) * 11); }
.top-12 { top: calc(var(--grid-size) * 12); }
.top-13 { top: calc(var(--grid-size) * 13); }
.top-14 { top: calc(var(--grid-size) * 14); }
.top-15 { top: calc(var(--grid-size) * 15); }
.top-16 { top: calc(var(--grid-size) * 16); }
.top-17 { top: calc(var(--grid-size) * 17); }
.top-18 { top: calc(var(--grid-size) * 18); }
.top-19 { top: calc(var(--grid-size) * 19); }
.top-20 { top: calc(var(--grid-size) * 20); }
.top-25 { top: calc(var(--grid-size) * 25); }
.top-30 { top: calc(var(--grid-size) * 30); }
.top-40 { top: calc(var(--grid-size) * 40); }
.top-50 { top: calc(var(--grid-size) * 50); }
.right-0 { right: 0; }
.right-1 { right: calc(var(--grid-size) * 1); }
.right-2 { right: calc(var(--grid-size) * 2); }
.right-3 { right: calc(var(--grid-size) * 3); }
.right-4 { right: calc(var(--grid-size) * 4); }
.right-5 { right: calc(var(--grid-size) * 5); }
.right-6 { right: calc(var(--grid-size) * 6); }
.right-7 { right: calc(var(--grid-size) * 7); }
.right-8 { right: calc(var(--grid-size) * 8); }
.right-9 { right: calc(var(--grid-size) * 9); }
.right-10 { right: calc(var(--grid-size) * 10); }
.right-11 { right: calc(var(--grid-size) * 11); }
.right-12 { right: calc(var(--grid-size) * 12); }
.right-13 { right: calc(var(--grid-size) * 13); }
.right-14 { right: calc(var(--grid-size) * 14); }
.right-15 { right: calc(var(--grid-size) * 15); }
.right-16 { right: calc(var(--grid-size) * 16); }
.right-17 { right: calc(var(--grid-size) * 17); }
.right-18 { right: calc(var(--grid-size) * 18); }
.right-19 { right: calc(var(--grid-size) * 19); }
.right-20 { right: calc(var(--grid-size) * 20); }
.right-25 { right: calc(var(--grid-size) * 25); }
.right-30 { right: calc(var(--grid-size) * 30); }
.right-40 { right: calc(var(--grid-size) * 40); }
.right-50 { right: calc(var(--grid-size) * 50); }
.bottom-0 { bottom: 0; }
.bottom-1 { bottom: calc(var(--grid-size) * 1); }
.bottom-2 { bottom: calc(var(--grid-size) * 2); }
.bottom-3 { bottom: calc(var(--grid-size) * 3); }
.bottom-4 { bottom: calc(var(--grid-size) * 4); }
.bottom-5 { bottom: calc(var(--grid-size) * 5); }
.bottom-6 { bottom: calc(var(--grid-size) * 6); }
.bottom-7 { bottom: calc(var(--grid-size) * 7); }
.bottom-8 { bottom: calc(var(--grid-size) * 8); }
.bottom-9 { bottom: calc(var(--grid-size) * 9); }
.bottom-10 { bottom: calc(var(--grid-size) * 10); }
.bottom-11 { bottom: calc(var(--grid-size) * 11); }
.bottom-12 { bottom: calc(var(--grid-size) * 12); }
.bottom-13 { bottom: calc(var(--grid-size) * 13); }
.bottom-14 { bottom: calc(var(--grid-size) * 14); }
.bottom-15 { bottom: calc(var(--grid-size) * 15); }
.bottom-16 { bottom: calc(var(--grid-size) * 16); }
.bottom-17 { bottom: calc(var(--grid-size) * 17); }
.bottom-18 { bottom: calc(var(--grid-size) * 18); }
.bottom-19 { bottom: calc(var(--grid-size) * 19); }
.bottom-20 { bottom: calc(var(--grid-size) * 20); }
.bottom-25 { bottom: calc(var(--grid-size) * 25); }
.bottom-30 { bottom: calc(var(--grid-size) * 30); }
.bottom-40 { bottom: calc(var(--grid-size) * 40); }
.bottom-50 { bottom: calc(var(--grid-size) * 50); }
.left-0 { left: 0; }
.left-1 { left: calc(var(--grid-size) * 1); }
.left-2 { left: calc(var(--grid-size) * 2); }
.left-3 { left: calc(var(--grid-size) * 3); }
.left-4 { left: calc(var(--grid-size) * 4); }
.left-5 { left: calc(var(--grid-size) * 5); }
.left-6 { left: calc(var(--grid-size) * 6); }
.left-7 { left: calc(var(--grid-size) * 7); }
.left-8 { left: calc(var(--grid-size) * 8); }
.left-9 { left: calc(var(--grid-size) * 9); }
.left-10 { left: calc(var(--grid-size) * 10); }
.left-11 { left: calc(var(--grid-size) * 11); }
.left-12 { left: calc(var(--grid-size) * 12); }
.left-13 { left: calc(var(--grid-size) * 13); }
.left-14 { left: calc(var(--grid-size) * 14); }
.left-15 { left: calc(var(--grid-size) * 15); }
.left-16 { left: calc(var(--grid-size) * 16); }
.left-17 { left: calc(var(--grid-size) * 17); }
.left-18 { left: calc(var(--grid-size) * 18); }
.left-19 { left: calc(var(--grid-size) * 19); }
.left-20 { left: calc(var(--grid-size) * 20); }
.left-25 { left: calc(var(--grid-size) * 25); }
.left-30 { left: calc(var(--grid-size) * 30); }
.left-40 { left: calc(var(--grid-size) * 40); }
.left-50 { left: calc(var(--grid-size) * 50); }
.absolute--fill {
top: 0;
right: 0;
bottom: 0;
left: 0;
}
@media (--breakpoint-not-small) {
.top-0-ns { top: 0; }
.top-1-ns { top: calc(var(--grid-size) * 1); }
.top-2-ns { top: calc(var(--grid-size) * 2); }
.top-3-ns { top: calc(var(--grid-size) * 3); }
.top-4-ns { top: calc(var(--grid-size) * 4); }
.top-5-ns { top: calc(var(--grid-size) * 5); }
.top-6-ns { top: calc(var(--grid-size) * 6); }
.top-7-ns { top: calc(var(--grid-size) * 7); }
.top-8-ns { top: calc(var(--grid-size) * 8); }
.top-9-ns { top: calc(var(--grid-size) * 9); }
.top-10-ns { top: calc(var(--grid-size) * 10); }
.top-11-ns { top: calc(var(--grid-size) * 11); }
.top-12-ns { top: calc(var(--grid-size) * 12); }
.top-13-ns { top: calc(var(--grid-size) * 13); }
.top-14-ns { top: calc(var(--grid-size) * 14); }
.top-15-ns { top: calc(var(--grid-size) * 15); }
.top-16-ns { top: calc(var(--grid-size) * 16); }
.top-17-ns { top: calc(var(--grid-size) * 17); }
.top-18-ns { top: calc(var(--grid-size) * 18); }
.top-19-ns { top: calc(var(--grid-size) * 19); }
.top-20-ns { top: calc(var(--grid-size) * 20); }
.top-25-ns { top: calc(var(--grid-size) * 25); }
.top-30-ns { top: calc(var(--grid-size) * 30); }
.top-40-ns { top: calc(var(--grid-size) * 40); }
.top-50-ns { top: calc(var(--grid-size) * 50); }
.right-0-ns { right: 0; }
.right-1-ns { right: calc(var(--grid-size) * 1); }
.right-2-ns { right: calc(var(--grid-size) * 2); }
.right-3-ns { right: calc(var(--grid-size) * 3); }
.right-4-ns { right: calc(var(--grid-size) * 4); }
.right-5-ns { right: calc(var(--grid-size) * 5); }
.right-6-ns { right: calc(var(--grid-size) * 6); }
.right-7-ns { right: calc(var(--grid-size) * 7); }
.right-8-ns { right: calc(var(--grid-size) * 8); }
.right-9-ns { right: calc(var(--grid-size) * 9); }
.right-10-ns { right: calc(var(--grid-size) * 10); }
.right-11-ns { right: calc(var(--grid-size) * 11); }
.right-12-ns { right: calc(var(--grid-size) * 12); }
.right-13-ns { right: calc(var(--grid-size) * 13); }
.right-14-ns { right: calc(var(--grid-size) * 14); }
.right-15-ns { right: calc(var(--grid-size) * 15); }
.right-16-ns { right: calc(var(--grid-size) * 16); }
.right-17-ns { right: calc(var(--grid-size) * 17); }
.right-18-ns { right: calc(var(--grid-size) * 18); }
.right-19-ns { right: calc(var(--grid-size) * 19); }
.right-20-ns { right: calc(var(--grid-size) * 20); }
.right-25-ns { right: calc(var(--grid-size) * 25); }
.right-30-ns { right: calc(var(--grid-size) * 30); }
.right-40-ns { right: calc(var(--grid-size) * 40); }
.right-50-ns { right: calc(var(--grid-size) * 50); }
.bottom-0-ns { bottom: 0; }
.bottom-1-ns { bottom: calc(var(--grid-size) * 1); }
.bottom-2-ns { bottom: calc(var(--grid-size) * 2); }
.bottom-3-ns { bottom: calc(var(--grid-size) * 3); }
.bottom-4-ns { bottom: calc(var(--grid-size) * 4); }
.bottom-5-ns { bottom: calc(var(--grid-size) * 5); }
.bottom-6-ns { bottom: calc(var(--grid-size) * 6); }
.bottom-7-ns { bottom: calc(var(--grid-size) * 7); }
.bottom-8-ns { bottom: calc(var(--grid-size) * 8); }
.bottom-9-ns { bottom: calc(var(--grid-size) * 9); }
.bottom-10-ns { bottom: calc(var(--grid-size) * 10); }
.bottom-11-ns { bottom: calc(var(--grid-size) * 11); }
.bottom-12-ns { bottom: calc(var(--grid-size) * 12); }
.bottom-13-ns { bottom: calc(var(--grid-size) * 13); }
.bottom-14-ns { bottom: calc(var(--grid-size) * 14); }
.bottom-15-ns { bottom: calc(var(--grid-size) * 15); }
.bottom-16-ns { bottom: calc(var(--grid-size) * 16); }
.bottom-17-ns { bottom: calc(var(--grid-size) * 17); }
.bottom-18-ns { bottom: calc(var(--grid-size) * 18); }
.bottom-19-ns { bottom: calc(var(--grid-size) * 19); }
.bottom-20-ns { bottom: calc(var(--grid-size) * 20); }
.bottom-25-ns { bottom: calc(var(--grid-size) * 25); }
.bottom-30-ns { bottom: calc(var(--grid-size) * 30); }
.bottom-40-ns { bottom: calc(var(--grid-size) * 40); }
.bottom-50-ns { bottom: calc(var(--grid-size) * 50); }
.left-0-ns { left: 0; }
.left-1-ns { left: calc(var(--grid-size) * 1); }
.left-2-ns { left: calc(var(--grid-size) * 2); }
.left-3-ns { left: calc(var(--grid-size) * 3); }
.left-4-ns { left: calc(var(--grid-size) * 4); }
.left-5-ns { left: calc(var(--grid-size) * 5); }
.left-6-ns { left: calc(var(--grid-size) * 6); }
.left-7-ns { left: calc(var(--grid-size) * 7); }
.left-8-ns { left: calc(var(--grid-size) * 8); }
.left-9-ns { left: calc(var(--grid-size) * 9); }
.left-10-ns { left: calc(var(--grid-size) * 10); }
.left-11-ns { left: calc(var(--grid-size) * 11); }
.left-12-ns { left: calc(var(--grid-size) * 12); }
.left-13-ns { left: calc(var(--grid-size) * 13); }
.left-14-ns { left: calc(var(--grid-size) * 14); }
.left-15-ns { left: calc(var(--grid-size) * 15); }
.left-16-ns { left: calc(var(--grid-size) * 16); }
.left-17-ns { left: calc(var(--grid-size) * 17); }
.left-18-ns { left: calc(var(--grid-size) * 18); }
.left-19-ns { left: calc(var(--grid-size) * 19); }
.left-20-ns { left: calc(var(--grid-size) * 20); }
.left-25-ns { left: calc(var(--grid-size) * 25); }
.left-30-ns { left: calc(var(--grid-size) * 30); }
.left-40-ns { left: calc(var(--grid-size) * 40); }
.left-50-ns { left: calc(var(--grid-size) * 50); }
.absolute--fill-ns {
top: 0;
right: 0;
bottom: 0;
left: 0;
}
}
@media (--breakpoint-medium) {
.top-0-m { top: 0; }
.top-1-m { top: calc(var(--grid-size) * 1); }
.top-2-m { top: calc(var(--grid-size) * 2); }
.top-3-m { top: calc(var(--grid-size) * 3); }
.top-4-m { top: calc(var(--grid-size) * 4); }
.top-5-m { top: calc(var(--grid-size) * 5); }
.top-6-m { top: calc(var(--grid-size) * 6); }
.top-7-m { top: calc(var(--grid-size) * 7); }
.top-8-m { top: calc(var(--grid-size) * 8); }
.top-9-m { top: calc(var(--grid-size) * 9); }
.top-10-m { top: calc(var(--grid-size) * 10); }
.top-11-m { top: calc(var(--grid-size) * 11); }
.top-12-m { top: calc(var(--grid-size) * 12); }
.top-13-m { top: calc(var(--grid-size) * 13); }
.top-14-m { top: calc(var(--grid-size) * 14); }
.top-15-m { top: calc(var(--grid-size) * 15); }
.top-16-m { top: calc(var(--grid-size) * 16); }
.top-17-m { top: calc(var(--grid-size) * 17); }
.top-18-m { top: calc(var(--grid-size) * 18); }
.top-19-m { top: calc(var(--grid-size) * 19); }
.top-20-m { top: calc(var(--grid-size) * 20); }
.top-25-m { top: calc(var(--grid-size) * 25); }
.top-30-m { top: calc(var(--grid-size) * 30); }
.top-40-m { top: calc(var(--grid-size) * 40); }
.top-50-m { top: calc(var(--grid-size) * 50); }
.right-0-m { right: 0; }
.right-1-m { right: calc(var(--grid-size) * 1); }
.right-2-m { right: calc(var(--grid-size) * 2); }
.right-3-m { right: calc(var(--grid-size) * 3); }
.right-4-m { right: calc(var(--grid-size) * 4); }
.right-5-m { right: calc(var(--grid-size) * 5); }
.right-6-m { right: calc(var(--grid-size) * 6); }
.right-7-m { right: calc(var(--grid-size) * 7); }
.right-8-m { right: calc(var(--grid-size) * 8); }
.right-9-m { right: calc(var(--grid-size) * 9); }
.right-10-m { right: calc(var(--grid-size) * 10); }
.right-11-m { right: calc(var(--grid-size) * 11); }
.right-12-m { right: calc(var(--grid-size) * 12); }
.right-13-m { right: calc(var(--grid-size) * 13); }
.right-14-m { right: calc(var(--grid-size) * 14); }
.right-15-m { right: calc(var(--grid-size) * 15); }
.right-16-m { right: calc(var(--grid-size) * 16); }
.right-17-m { right: calc(var(--grid-size) * 17); }
.right-18-m { right: calc(var(--grid-size) * 18); }
.right-19-m { right: calc(var(--grid-size) * 19); }
.right-20-m { right: calc(var(--grid-size) * 20); }
.right-25-m { right: calc(var(--grid-size) * 25); }
.right-30-m { right: calc(var(--grid-size) * 30); }
.right-40-m { right: calc(var(--grid-size) * 40); }
.right-50-m { right: calc(var(--grid-size) * 50); }
.bottom-0-m { bottom: 0; }
.bottom-1-m { bottom: calc(var(--grid-size) * 1); }
.bottom-2-m { bottom: calc(var(--grid-size) * 2); }
.bottom-3-m { bottom: calc(var(--grid-size) * 3); }
.bottom-4-m { bottom: calc(var(--grid-size) * 4); }
.bottom-5-m { bottom: calc(var(--grid-size) * 5); }
.bottom-6-m { bottom: calc(var(--grid-size) * 6); }
.bottom-7-m { bottom: calc(var(--grid-size) * 7); }
.bottom-8-m { bottom: calc(var(--grid-size) * 8); }
.bottom-9-m { bottom: calc(var(--grid-size) * 9); }
.bottom-10-m { bottom: calc(var(--grid-size) * 10); }
.bottom-11-m { bottom: calc(var(--grid-size) * 11); }
.bottom-12-m { bottom: calc(var(--grid-size) * 12); }
.bottom-13-m { bottom: calc(var(--grid-size) * 13); }
.bottom-14-m { bottom: calc(var(--grid-size) * 14); }
.bottom-15-m { bottom: calc(var(--grid-size) * 15); }
.bottom-16-m { bottom: calc(var(--grid-size) * 16); }
.bottom-17-m { bottom: calc(var(--grid-size) * 17); }
.bottom-18-m { bottom: calc(var(--grid-size) * 18); }
.bottom-19-m { bottom: calc(var(--grid-size) * 19); }
.bottom-20-m { bottom: calc(var(--grid-size) * 20); }
.bottom-25-m { bottom: calc(var(--grid-size) * 25); }
.bottom-30-m { bottom: calc(var(--grid-size) * 30); }
.bottom-40-m { bottom: calc(var(--grid-size) * 40); }
.bottom-50-m { bottom: calc(var(--grid-size) * 50); }
.left-0-m { left: 0; }
.left-1-m { left: calc(var(--grid-size) * 1); }
.left-2-m { left: calc(var(--grid-size) * 2); }
.left-3-m { left: calc(var(--grid-size) * 3); }
.left-4-m { left: calc(var(--grid-size) * 4); }
.left-5-m { left: calc(var(--grid-size) * 5); }
.left-6-m { left: calc(var(--grid-size) * 6); }
.left-7-m { left: calc(var(--grid-size) * 7); }
.left-8-m { left: calc(var(--grid-size) * 8); }
.left-9-m { left: calc(var(--grid-size) * 9); }
.left-10-m { left: calc(var(--grid-size) * 10); }
.left-11-m { left: calc(var(--grid-size) * 11); }
.left-12-m { left: calc(var(--grid-size) * 12); }
.left-13-m { left: calc(var(--grid-size) * 13); }
.left-14-m { left: calc(var(--grid-size) * 14); }
.left-15-m { left: calc(var(--grid-size) * 15); }
.left-16-m { left: calc(var(--grid-size) * 16); }
.left-17-m { left: calc(var(--grid-size) * 17); }
.left-18-m { left: calc(var(--grid-size) * 18); }
.left-19-m { left: calc(var(--grid-size) * 19); }
.left-20-m { left: calc(var(--grid-size) * 20); }
.left-25-m { left: calc(var(--grid-size) * 25); }
.left-30-m { left: calc(var(--grid-size) * 30); }
.left-40-m { left: calc(var(--grid-size) * 40); }
.left-50-m { left: calc(var(--grid-size) * 50); }
.absolute--fill-m {
top: 0;
right: 0;
bottom: 0;
left: 0;
}
}
@media (--breakpoint-large) {
.top-0-l { top: 0; }
.top-1-l { top: calc(var(--grid-size) * 1); }
.top-2-l { top: calc(var(--grid-size) * 2); }
.top-3-l { top: calc(var(--grid-size) * 3); }
.top-4-l { top: calc(var(--grid-size) * 4); }
.top-5-l { top: calc(var(--grid-size) * 5); }
.top-6-l { top: calc(var(--grid-size) * 6); }
.top-7-l { top: calc(var(--grid-size) * 7); }
.top-8-l { top: calc(var(--grid-size) * 8); }
.top-9-l { top: calc(var(--grid-size) * 9); }
.top-10-l { top: calc(var(--grid-size) * 10); }
.top-11-l { top: calc(var(--grid-size) * 11); }
.top-12-l { top: calc(var(--grid-size) * 12); }
.top-13-l { top: calc(var(--grid-size) * 13); }
.top-14-l { top: calc(var(--grid-size) * 14); }
.top-15-l { top: calc(var(--grid-size) * 15); }
.top-16-l { top: calc(var(--grid-size) * 16); }
.top-17-l { top: calc(var(--grid-size) * 17); }
.top-18-l { top: calc(var(--grid-size) * 18); }
.top-19-l { top: calc(var(--grid-size) * 19); }
.top-20-l { top: calc(var(--grid-size) * 20); }
.top-25-l { top: calc(var(--grid-size) * 25); }
.top-30-l { top: calc(var(--grid-size) * 30); }
.top-40-l { top: calc(var(--grid-size) * 40); }
.top-50-l { top: calc(var(--grid-size) * 50); }
.right-0-l { right: 0; }
.right-1-l { right: calc(var(--grid-size) * 1); }
.right-2-l { right: calc(var(--grid-size) * 2); }
.right-3-l { right: calc(var(--grid-size) * 3); }
.right-4-l { right: calc(var(--grid-size) * 4); }
.right-5-l { right: calc(var(--grid-size) * 5); }
.right-6-l { right: calc(var(--grid-size) * 6); }
.right-7-l { right: calc(var(--grid-size) * 7); }
.right-8-l { right: calc(var(--grid-size) * 8); }
.right-9-l { right: calc(var(--grid-size) * 9); }
.right-10-l { right: calc(var(--grid-size) * 10); }
.right-11-l { right: calc(var(--grid-size) * 11); }
.right-12-l { right: calc(var(--grid-size) * 12); }
.right-13-l { right: calc(var(--grid-size) * 13); }
.right-14-l { right: calc(var(--grid-size) * 14); }
.right-15-l { right: calc(var(--grid-size) * 15); }
.right-16-l { right: calc(var(--grid-size) * 16); }
.right-17-l { right: calc(var(--grid-size) * 17); }
.right-18-l { right: calc(var(--grid-size) * 18); }
.right-19-l { right: calc(var(--grid-size) * 19); }
.right-20-l { right: calc(var(--grid-size) * 20); }
.right-25-l { right: calc(var(--grid-size) * 25); }
.right-30-l { right: calc(var(--grid-size) * 30); }
.right-40-l { right: calc(var(--grid-size) * 40); }
.right-50-l { right: calc(var(--grid-size) * 50); }
.bottom-0-l { bottom: 0; }
.bottom-1-l { bottom: calc(var(--grid-size) * 1); }
.bottom-2-l { bottom: calc(var(--grid-size) * 2); }
.bottom-3-l { bottom: calc(var(--grid-size) * 3); }
.bottom-4-l { bottom: calc(var(--grid-size) * 4); }
.bottom-5-l { bottom: calc(var(--grid-size) * 5); }
.bottom-6-l { bottom: calc(var(--grid-size) * 6); }
.bottom-7-l { bottom: calc(var(--grid-size) * 7); }
.bottom-8-l { bottom: calc(var(--grid-size) * 8); }
.bottom-9-l { bottom: calc(var(--grid-size) * 9); }
.bottom-10-l { bottom: calc(var(--grid-size) * 10); }
.bottom-11-l { bottom: calc(var(--grid-size) * 11); }
.bottom-12-l { bottom: calc(var(--grid-size) * 12); }
.bottom-13-l { bottom: calc(var(--grid-size) * 13); }
.bottom-14-l { bottom: calc(var(--grid-size) * 14); }
.bottom-15-l { bottom: calc(var(--grid-size) * 15); }
.bottom-16-l { bottom: calc(var(--grid-size) * 16); }
.bottom-17-l { bottom: calc(var(--grid-size) * 17); }
.bottom-18-l { bottom: calc(var(--grid-size) * 18); }
.bottom-19-l { bottom: calc(var(--grid-size) * 19); }
.bottom-20-l { bottom: calc(var(--grid-size) * 20); }
.bottom-25-l { bottom: calc(var(--grid-size) * 25); }
.bottom-30-l { bottom: calc(var(--grid-size) * 30); }
.bottom-40-l { bottom: calc(var(--grid-size) * 40); }
.bottom-50-l { bottom: calc(var(--grid-size) * 50); }
.left-0-l { left: 0; }
.left-1-l { left: calc(var(--grid-size) * 1); }
.left-2-l { left: calc(var(--grid-size) * 2); }
.left-3-l { left: calc(var(--grid-size) * 3); }
.left-4-l { left: calc(var(--grid-size) * 4); }
.left-5-l { left: calc(var(--grid-size) * 5); }
.left-6-l { left: calc(var(--grid-size) * 6); }
.left-7-l { left: calc(var(--grid-size) * 7); }
.left-8-l { left: calc(var(--grid-size) * 8); }
.left-9-l { left: calc(var(--grid-size) * 9); }
.left-10-l { left: calc(var(--grid-size) * 10); }
.left-11-l { left: calc(var(--grid-size) * 11); }
.left-12-l { left: calc(var(--grid-size) * 12); }
.left-13-l { left: calc(var(--grid-size) * 13); }
.left-14-l { left: calc(var(--grid-size) * 14); }
.left-15-l { left: calc(var(--grid-size) * 15); }
.left-16-l { left: calc(var(--grid-size) * 16); }
.left-17-l { left: calc(var(--grid-size) * 17); }
.left-18-l { left: calc(var(--grid-size) * 18); }
.left-19-l { left: calc(var(--grid-size) * 19); }
.left-20-l { left: calc(var(--grid-size) * 20); }
.left-25-l { left: calc(var(--grid-size) * 25); }
.left-30-l { left: calc(var(--grid-size) * 30); }
.left-40-l { left: calc(var(--grid-size) * 40); }
.left-50-l { left: calc(var(--grid-size) * 50); }
.absolute--fill-l {
top: 0;
right: 0;
bottom: 0;
left: 0;
}
}