alpha-grid/dist/agrid.min.css

Simple 12 column grid system build on css grid and inspired by Bootstrap

[class*=agrid]{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));padding-inline:var(--agrid-x-padding, 0px);margin-inline:var(--agrid-x-margin, 0px);-webkit-transition:gap 300ms ease-in-out;transition:gap 300ms ease-in-out;gap:var(--agrid-gap, 0.5rem)}[class*=agrid]>*{grid-column-start:var(--agrid-column-start, auto);-webkit-box-ordinal-group:NaN;-ms-flex-order:var(--agrid-order, 0);order:var(--agrid-order, 0)}.agrid-1{grid-template-columns:repeat(1,minmax(0,1fr))}.agrid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.agrid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.agrid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.agrid-5{grid-template-columns:repeat(5,minmax(0,1fr))}.agrid-6{grid-template-columns:repeat(6,minmax(0,1fr))}.agrid-7{grid-template-columns:repeat(7,minmax(0,1fr))}.agrid-8{grid-template-columns:repeat(8,minmax(0,1fr))}.agrid-9{grid-template-columns:repeat(9,minmax(0,1fr))}.agrid-10{grid-template-columns:repeat(10,minmax(0,1fr))}.agrid-11{grid-template-columns:repeat(11,minmax(0,1fr))}.acol-1{grid-column-end:span 1}.acol-2{grid-column-end:span 2}.acol-3{grid-column-end:span 3}.acol-4{grid-column-end:span 4}.acol-5{grid-column-end:span 5}.acol-6{grid-column-end:span 6}.acol-7{grid-column-end:span 7}.acol-8{grid-column-end:span 8}.acol-9{grid-column-end:span 9}.acol-10{grid-column-end:span 10}.acol-11{grid-column-end:span 11}.acol-12{grid-column-end:span 12}:where(.agrid > *){grid-column-end:span 12}.offset-1{--agrid-column-start:2}.offset-2{--agrid-column-start:3}.offset-3{--agrid-column-start:4}.offset-4{--agrid-column-start:5}.offset-5{--agrid-column-start:6}.offset-6{--agrid-column-start:7}.offset-7{--agrid-column-start:8}.offset-8{--agrid-column-start:9}.offset-9{--agrid-column-start:10}.offset-10{--agrid-column-start:11}.offset-11{--agrid-column-start:12}:where([class*="lg:offset"]),:where([class*="md:offset"]),:where([class*="sm:offset"]),:where([class*="xl:offset"]),:where([class*="xs:offset"]),:where([class*="xxl:offset"]),:where([class*="xxxl:offset"]){--agrid-column-start:auto}.order-first{--agrid-order:-1}.order-last{--agrid-order:12}.order-1{--agrid-order:1}.order-2{--agrid-order:2}.order-3{--agrid-order:3}.order-4{--agrid-order:4}.order-5{--agrid-order:5}.order-6{--agrid-order:6}.order-7{--agrid-order:7}.order-8{--agrid-order:8}.order-9{--agrid-order:9}.order-10{--agrid-order:10}.order-11{--agrid-order:11}.xs\:order-first{--agrid-order:-1}.xs\:order-last{--agrid-order:12}.sm\:order-first{--agrid-order:-1}.sm\:order-last{--agrid-order:12}.md\:order-first{--agrid-order:-1}.md\:order-last{--agrid-order:12}.lg\:order-first{--agrid-order:-1}.lg\:order-last{--agrid-order:12}.xl\:order-first{--agrid-order:-1}.xl\:order-last{--agrid-order:12}.xxl\:order-first{--agrid-order:-1}.xxl\:order-last{--agrid-order:12}.xxxl\:order-first{--agrid-order:-1}.xxxl\:order-last{--agrid-order:12}.gap-1{--agrid-gap:0.25rem}.gap-2{--agrid-gap:0.5rem}.gap-3{--agrid-gap:0.75rem}.gap-4{--agrid-gap:1rem}.gap-5{--agrid-gap:1.25rem}.gap-6{--agrid-gap:1.5rem}.gap-7{--agrid-gap:1.75rem}.gap-8{--agrid-gap:2rem}.gap-9{--agrid-gap:2.25rem}.gap-10{--agrid-gap:2.5rem}.gap-11{--agrid-gap:2.75rem}.gap-12{--agrid-gap:3rem}@media (min-width:576px){.xs\:agrid-1{grid-template-columns:repeat(1,minmax(0,1fr))}.xs\:agrid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.xs\:agrid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.xs\:agrid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.xs\:agrid-5{grid-template-columns:repeat(5,minmax(0,1fr))}.xs\:agrid-6{grid-template-columns:repeat(6,minmax(0,1fr))}.xs\:agrid-7{grid-template-columns:repeat(7,minmax(0,1fr))}.xs\:agrid-8{grid-template-columns:repeat(8,minmax(0,1fr))}.xs\:agrid-9{grid-template-columns:repeat(9,minmax(0,1fr))}.xs\:agrid-10{grid-template-columns:repeat(10,minmax(0,1fr))}.xs\:agrid-11{grid-template-columns:repeat(11,minmax(0,1fr))}.xs\:acol-1{grid-column-end:span 1}.xs\:acol-2{grid-column-end:span 2}.xs\:acol-3{grid-column-end:span 3}.xs\:acol-4{grid-column-end:span 4}.xs\:acol-5{grid-column-end:span 5}.xs\:acol-6{grid-column-end:span 6}.xs\:acol-7{grid-column-end:span 7}.xs\:acol-8{grid-column-end:span 8}.xs\:acol-9{grid-column-end:span 9}.xs\:acol-10{grid-column-end:span 10}.xs\:acol-11{grid-column-end:span 11}.xs\:acol-12{grid-column-end:span 12}.xs\:offset-1{--agrid-column-start:2}.xs\:offset-2{--agrid-column-start:3}.xs\:offset-3{--agrid-column-start:4}.xs\:offset-4{--agrid-column-start:5}.xs\:offset-5{--agrid-column-start:6}.xs\:offset-6{--agrid-column-start:7}.xs\:offset-7{--agrid-column-start:8}.xs\:offset-8{--agrid-column-start:9}.xs\:offset-9{--agrid-column-start:10}.xs\:offset-10{--agrid-column-start:11}.xs\:offset-11{--agrid-column-start:12}.xs\:order-1{--agrid-order:1}.xs\:order-2{--agrid-order:2}.xs\:order-3{--agrid-order:3}.xs\:order-4{--agrid-order:4}.xs\:order-5{--agrid-order:5}.xs\:order-6{--agrid-order:6}.xs\:order-7{--agrid-order:7}.xs\:order-8{--agrid-order:8}.xs\:order-9{--agrid-order:9}.xs\:order-10{--agrid-order:10}.xs\:order-11{--agrid-order:11}.xs\:gap-1{--agrid-gap:0.25rem}.xs\:gap-2{--agrid-gap:0.5rem}.xs\:gap-3{--agrid-gap:0.75rem}.xs\:gap-4{--agrid-gap:1rem}.xs\:gap-5{--agrid-gap:1.25rem}.xs\:gap-6{--agrid-gap:1.5rem}.xs\:gap-7{--agrid-gap:1.75rem}.xs\:gap-8{--agrid-gap:2rem}.xs\:gap-9{--agrid-gap:2.25rem}.xs\:gap-10{--agrid-gap:2.5rem}.xs\:gap-11{--agrid-gap:2.75rem}.xs\:gap-12{--agrid-gap:3rem}}@media (min-width:640px){.sm\:agrid-1{grid-template-columns:repeat(1,minmax(0,1fr))}.sm\:agrid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:agrid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:agrid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sm\:agrid-5{grid-template-columns:repeat(5,minmax(0,1fr))}.sm\:agrid-6{grid-template-columns:repeat(6,minmax(0,1fr))}.sm\:agrid-7{grid-template-columns:repeat(7,minmax(0,1fr))}.sm\:agrid-8{grid-template-columns:repeat(8,minmax(0,1fr))}.sm\:agrid-9{grid-template-columns:repeat(9,minmax(0,1fr))}.sm\:agrid-10{grid-template-columns:repeat(10,minmax(0,1fr))}.sm\:agrid-11{grid-template-columns:repeat(11,minmax(0,1fr))}:where([class*="agrid"]){--agrid-gap:0.75rem}.sm\:acol-1{grid-column-end:span 1}.sm\:acol-2{grid-column-end:span 2}.sm\:acol-3{grid-column-end:span 3}.sm\:acol-4{grid-column-end:span 4}.sm\:acol-5{grid-column-end:span 5}.sm\:acol-6{grid-column-end:span 6}.sm\:acol-7{grid-column-end:span 7}.sm\:acol-8{grid-column-end:span 8}.sm\:acol-9{grid-column-end:span 9}.sm\:acol-10{grid-column-end:span 10}.sm\:acol-11{grid-column-end:span 11}.sm\:acol-12{grid-column-end:span 12}.sm\:offset-1{--agrid-column-start:2}.sm\:offset-2{--agrid-column-start:3}.sm\:offset-3{--agrid-column-start:4}.sm\:offset-4{--agrid-column-start:5}.sm\:offset-5{--agrid-column-start:6}.sm\:offset-6{--agrid-column-start:7}.sm\:offset-7{--agrid-column-start:8}.sm\:offset-8{--agrid-column-start:9}.sm\:offset-9{--agrid-column-start:10}.sm\:offset-10{--agrid-column-start:11}.sm\:offset-11{--agrid-column-start:12}.sm\:order-1{--agrid-order:1}.sm\:order-2{--agrid-order:2}.sm\:order-3{--agrid-order:3}.sm\:order-4{--agrid-order:4}.sm\:order-5{--agrid-order:5}.sm\:order-6{--agrid-order:6}.sm\:order-7{--agrid-order:7}.sm\:order-8{--agrid-order:8}.sm\:order-9{--agrid-order:9}.sm\:order-10{--agrid-order:10}.sm\:order-11{--agrid-order:11}.sm\:gap-1{--agrid-gap:0.25rem}.sm\:gap-2{--agrid-gap:0.5rem}.sm\:gap-3{--agrid-gap:0.75rem}.sm\:gap-4{--agrid-gap:1rem}.sm\:gap-5{--agrid-gap:1.25rem}.sm\:gap-6{--agrid-gap:1.5rem}.sm\:gap-7{--agrid-gap:1.75rem}.sm\:gap-8{--agrid-gap:2rem}.sm\:gap-9{--agrid-gap:2.25rem}.sm\:gap-10{--agrid-gap:2.5rem}.sm\:gap-11{--agrid-gap:2.75rem}.sm\:gap-12{--agrid-gap:3rem}}@media (min-width:768px){.md\:agrid-1{grid-template-columns:repeat(1,minmax(0,1fr))}.md\:agrid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:agrid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:agrid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:agrid-5{grid-template-columns:repeat(5,minmax(0,1fr))}.md\:agrid-6{grid-template-columns:repeat(6,minmax(0,1fr))}.md\:agrid-7{grid-template-columns:repeat(7,minmax(0,1fr))}.md\:agrid-8{grid-template-columns:repeat(8,minmax(0,1fr))}.md\:agrid-9{grid-template-columns:repeat(9,minmax(0,1fr))}.md\:agrid-10{grid-template-columns:repeat(10,minmax(0,1fr))}.md\:agrid-11{grid-template-columns:repeat(11,minmax(0,1fr))}:where([class*="agrid"]){--agrid-gap:1rem}.md\:acol-1{grid-column-end:span 1}.md\:acol-2{grid-column-end:span 2}.md\:acol-3{grid-column-end:span 3}.md\:acol-4{grid-column-end:span 4}.md\:acol-5{grid-column-end:span 5}.md\:acol-6{grid-column-end:span 6}.md\:acol-7{grid-column-end:span 7}.md\:acol-8{grid-column-end:span 8}.md\:acol-9{grid-column-end:span 9}.md\:acol-10{grid-column-end:span 10}.md\:acol-11{grid-column-end:span 11}.md\:acol-12{grid-column-end:span 12}.md\:offset-1{--agrid-column-start:2}.md\:offset-2{--agrid-column-start:3}.md\:offset-3{--agrid-column-start:4}.md\:offset-4{--agrid-column-start:5}.md\:offset-5{--agrid-column-start:6}.md\:offset-6{--agrid-column-start:7}.md\:offset-7{--agrid-column-start:8}.md\:offset-8{--agrid-column-start:9}.md\:offset-9{--agrid-column-start:10}.md\:offset-10{--agrid-column-start:11}.md\:offset-11{--agrid-column-start:12}.md\:order-1{--agrid-order:1}.md\:order-2{--agrid-order:2}.md\:order-3{--agrid-order:3}.md\:order-4{--agrid-order:4}.md\:order-5{--agrid-order:5}.md\:order-6{--agrid-order:6}.md\:order-7{--agrid-order:7}.md\:order-8{--agrid-order:8}.md\:order-9{--agrid-order:9}.md\:order-10{--agrid-order:10}.md\:order-11{--agrid-order:11}.md\:gap-1{--agrid-gap:0.25rem}.md\:gap-2{--agrid-gap:0.5rem}.md\:gap-3{--agrid-gap:0.75rem}.md\:gap-4{--agrid-gap:1rem}.md\:gap-5{--agrid-gap:1.25rem}.md\:gap-6{--agrid-gap:1.5rem}.md\:gap-7{--agrid-gap:1.75rem}.md\:gap-8{--agrid-gap:2rem}.md\:gap-9{--agrid-gap:2.25rem}.md\:gap-10{--agrid-gap:2.5rem}.md\:gap-11{--agrid-gap:2.75rem}.md\:gap-12{--agrid-gap:3rem}}@media (min-width:1024px){.lg\:agrid-1{grid-template-columns:repeat(1,minmax(0,1fr))}.lg\:agrid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:agrid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:agrid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:agrid-5{grid-template-columns:repeat(5,minmax(0,1fr))}.lg\:agrid-6{grid-template-columns:repeat(6,minmax(0,1fr))}.lg\:agrid-7{grid-template-columns:repeat(7,minmax(0,1fr))}.lg\:agrid-8{grid-template-columns:repeat(8,minmax(0,1fr))}.lg\:agrid-9{grid-template-columns:repeat(9,minmax(0,1fr))}.lg\:agrid-10{grid-template-columns:repeat(10,minmax(0,1fr))}.lg\:agrid-11{grid-template-columns:repeat(11,minmax(0,1fr))}:where([class*="agrid"]){--agrid-gap:1.25rem}.lg\:acol-1{grid-column-end:span 1}.lg\:acol-2{grid-column-end:span 2}.lg\:acol-3{grid-column-end:span 3}.lg\:acol-4{grid-column-end:span 4}.lg\:acol-5{grid-column-end:span 5}.lg\:acol-6{grid-column-end:span 6}.lg\:acol-7{grid-column-end:span 7}.lg\:acol-8{grid-column-end:span 8}.lg\:acol-9{grid-column-end:span 9}.lg\:acol-10{grid-column-end:span 10}.lg\:acol-11{grid-column-end:span 11}.lg\:acol-12{grid-column-end:span 12}.lg\:offset-1{--agrid-column-start:2}.lg\:offset-2{--agrid-column-start:3}.lg\:offset-3{--agrid-column-start:4}.lg\:offset-4{--agrid-column-start:5}.lg\:offset-5{--agrid-column-start:6}.lg\:offset-6{--agrid-column-start:7}.lg\:offset-7{--agrid-column-start:8}.lg\:offset-8{--agrid-column-start:9}.lg\:offset-9{--agrid-column-start:10}.lg\:offset-10{--agrid-column-start:11}.lg\:offset-11{--agrid-column-start:12}.lg\:order-1{--agrid-order:1}.lg\:order-2{--agrid-order:2}.lg\:order-3{--agrid-order:3}.lg\:order-4{--agrid-order:4}.lg\:order-5{--agrid-order:5}.lg\:order-6{--agrid-order:6}.lg\:order-7{--agrid-order:7}.lg\:order-8{--agrid-order:8}.lg\:order-9{--agrid-order:9}.lg\:order-10{--agrid-order:10}.lg\:order-11{--agrid-order:11}.lg\:gap-1{--agrid-gap:0.25rem}.lg\:gap-2{--agrid-gap:0.5rem}.lg\:gap-3{--agrid-gap:0.75rem}.lg\:gap-4{--agrid-gap:1rem}.lg\:gap-5{--agrid-gap:1.25rem}.lg\:gap-6{--agrid-gap:1.5rem}.lg\:gap-7{--agrid-gap:1.75rem}.lg\:gap-8{--agrid-gap:2rem}.lg\:gap-9{--agrid-gap:2.25rem}.lg\:gap-10{--agrid-gap:2.5rem}.lg\:gap-11{--agrid-gap:2.75rem}.lg\:gap-12{--agrid-gap:3rem}}@media (min-width:1280px){.xl\:agrid-1{grid-template-columns:repeat(1,minmax(0,1fr))}.xl\:agrid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.xl\:agrid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.xl\:agrid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.xl\:agrid-5{grid-template-columns:repeat(5,minmax(0,1fr))}.xl\:agrid-6{grid-template-columns:repeat(6,minmax(0,1fr))}.xl\:agrid-7{grid-template-columns:repeat(7,minmax(0,1fr))}.xl\:agrid-8{grid-template-columns:repeat(8,minmax(0,1fr))}.xl\:agrid-9{grid-template-columns:repeat(9,minmax(0,1fr))}.xl\:agrid-10{grid-template-columns:repeat(10,minmax(0,1fr))}.xl\:agrid-11{grid-template-columns:repeat(11,minmax(0,1fr))}.xl\:acol-1{grid-column-end:span 1}.xl\:acol-2{grid-column-end:span 2}.xl\:acol-3{grid-column-end:span 3}.xl\:acol-4{grid-column-end:span 4}.xl\:acol-5{grid-column-end:span 5}.xl\:acol-6{grid-column-end:span 6}.xl\:acol-7{grid-column-end:span 7}.xl\:acol-8{grid-column-end:span 8}.xl\:acol-9{grid-column-end:span 9}.xl\:acol-10{grid-column-end:span 10}.xl\:acol-11{grid-column-end:span 11}.xl\:acol-12{grid-column-end:span 12}.xl\:offset-1{--agrid-column-start:2}.xl\:offset-2{--agrid-column-start:3}.xl\:offset-3{--agrid-column-start:4}.xl\:offset-4{--agrid-column-start:5}.xl\:offset-5{--agrid-column-start:6}.xl\:offset-6{--agrid-column-start:7}.xl\:offset-7{--agrid-column-start:8}.xl\:offset-8{--agrid-column-start:9}.xl\:offset-9{--agrid-column-start:10}.xl\:offset-10{--agrid-column-start:11}.xl\:offset-11{--agrid-column-start:12}.xl\:order-1{--agrid-order:1}.xl\:order-2{--agrid-order:2}.xl\:order-3{--agrid-order:3}.xl\:order-4{--agrid-order:4}.xl\:order-5{--agrid-order:5}.xl\:order-6{--agrid-order:6}.xl\:order-7{--agrid-order:7}.xl\:order-8{--agrid-order:8}.xl\:order-9{--agrid-order:9}.xl\:order-10{--agrid-order:10}.xl\:order-11{--agrid-order:11}.xl\:gap-1{--agrid-gap:0.25rem}.xl\:gap-2{--agrid-gap:0.5rem}.xl\:gap-3{--agrid-gap:0.75rem}.xl\:gap-4{--agrid-gap:1rem}.xl\:gap-5{--agrid-gap:1.25rem}.xl\:gap-6{--agrid-gap:1.5rem}.xl\:gap-7{--agrid-gap:1.75rem}.xl\:gap-8{--agrid-gap:2rem}.xl\:gap-9{--agrid-gap:2.25rem}.xl\:gap-10{--agrid-gap:2.5rem}.xl\:gap-11{--agrid-gap:2.75rem}.xl\:gap-12{--agrid-gap:3rem}}@media (min-width:1440px){.xxl\:agrid-1{grid-template-columns:repeat(1,minmax(0,1fr))}.xxl\:agrid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.xxl\:agrid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.xxl\:agrid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.xxl\:agrid-5{grid-template-columns:repeat(5,minmax(0,1fr))}.xxl\:agrid-6{grid-template-columns:repeat(6,minmax(0,1fr))}.xxl\:agrid-7{grid-template-columns:repeat(7,minmax(0,1fr))}.xxl\:agrid-8{grid-template-columns:repeat(8,minmax(0,1fr))}.xxl\:agrid-9{grid-template-columns:repeat(9,minmax(0,1fr))}.xxl\:agrid-10{grid-template-columns:repeat(10,minmax(0,1fr))}.xxl\:agrid-11{grid-template-columns:repeat(11,minmax(0,1fr))}.xxl\:acol-1{grid-column-end:span 1}.xxl\:acol-2{grid-column-end:span 2}.xxl\:acol-3{grid-column-end:span 3}.xxl\:acol-4{grid-column-end:span 4}.xxl\:acol-5{grid-column-end:span 5}.xxl\:acol-6{grid-column-end:span 6}.xxl\:acol-7{grid-column-end:span 7}.xxl\:acol-8{grid-column-end:span 8}.xxl\:acol-9{grid-column-end:span 9}.xxl\:acol-10{grid-column-end:span 10}.xxl\:acol-11{grid-column-end:span 11}.xxl\:acol-12{grid-column-end:span 12}.xxl\:offset-1{--agrid-column-start:2}.xxl\:offset-2{--agrid-column-start:3}.xxl\:offset-3{--agrid-column-start:4}.xxl\:offset-4{--agrid-column-start:5}.xxl\:offset-5{--agrid-column-start:6}.xxl\:offset-6{--agrid-column-start:7}.xxl\:offset-7{--agrid-column-start:8}.xxl\:offset-8{--agrid-column-start:9}.xxl\:offset-9{--agrid-column-start:10}.xxl\:offset-10{--agrid-column-start:11}.xxl\:offset-11{--agrid-column-start:12}.xxl\:order-1{--agrid-order:1}.xxl\:order-2{--agrid-order:2}.xxl\:order-3{--agrid-order:3}.xxl\:order-4{--agrid-order:4}.xxl\:order-5{--agrid-order:5}.xxl\:order-6{--agrid-order:6}.xxl\:order-7{--agrid-order:7}.xxl\:order-8{--agrid-order:8}.xxl\:order-9{--agrid-order:9}.xxl\:order-10{--agrid-order:10}.xxl\:order-11{--agrid-order:11}.xxl\:gap-1{--agrid-gap:0.25rem}.xxl\:gap-2{--agrid-gap:0.5rem}.xxl\:gap-3{--agrid-gap:0.75rem}.xxl\:gap-4{--agrid-gap:1rem}.xxl\:gap-5{--agrid-gap:1.25rem}.xxl\:gap-6{--agrid-gap:1.5rem}.xxl\:gap-7{--agrid-gap:1.75rem}.xxl\:gap-8{--agrid-gap:2rem}.xxl\:gap-9{--agrid-gap:2.25rem}.xxl\:gap-10{--agrid-gap:2.5rem}.xxl\:gap-11{--agrid-gap:2.75rem}.xxl\:gap-12{--agrid-gap:3rem}}@media (min-width:1536px){.xxxl\:agrid-1{grid-template-columns:repeat(1,minmax(0,1fr))}.xxxl\:agrid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.xxxl\:agrid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.xxxl\:agrid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.xxxl\:agrid-5{grid-template-columns:repeat(5,minmax(0,1fr))}.xxxl\:agrid-6{grid-template-columns:repeat(6,minmax(0,1fr))}.xxxl\:agrid-7{grid-template-columns:repeat(7,minmax(0,1fr))}.xxxl\:agrid-8{grid-template-columns:repeat(8,minmax(0,1fr))}.xxxl\:agrid-9{grid-template-columns:repeat(9,minmax(0,1fr))}.xxxl\:agrid-10{grid-template-columns:repeat(10,minmax(0,1fr))}.xxxl\:agrid-11{grid-template-columns:repeat(11,minmax(0,1fr))}:where([class*="agrid"]){--agrid-gap:1.5rem}.xxxl\:acol-1{grid-column-end:span 1}.xxxl\:acol-2{grid-column-end:span 2}.xxxl\:acol-3{grid-column-end:span 3}.xxxl\:acol-4{grid-column-end:span 4}.xxxl\:acol-5{grid-column-end:span 5}.xxxl\:acol-6{grid-column-end:span 6}.xxxl\:acol-7{grid-column-end:span 7}.xxxl\:acol-8{grid-column-end:span 8}.xxxl\:acol-9{grid-column-end:span 9}.xxxl\:acol-10{grid-column-end:span 10}.xxxl\:acol-11{grid-column-end:span 11}.xxxl\:acol-12{grid-column-end:span 12}.xxxl\:offset-1{--agrid-column-start:2}.xxxl\:offset-2{--agrid-column-start:3}.xxxl\:offset-3{--agrid-column-start:4}.xxxl\:offset-4{--agrid-column-start:5}.xxxl\:offset-5{--agrid-column-start:6}.xxxl\:offset-6{--agrid-column-start:7}.xxxl\:offset-7{--agrid-column-start:8}.xxxl\:offset-8{--agrid-column-start:9}.xxxl\:offset-9{--agrid-column-start:10}.xxxl\:offset-10{--agrid-column-start:11}.xxxl\:offset-11{--agrid-column-start:12}.xxxl\:order-1{--agrid-order:1}.xxxl\:order-2{--agrid-order:2}.xxxl\:order-3{--agrid-order:3}.xxxl\:order-4{--agrid-order:4}.xxxl\:order-5{--agrid-order:5}.xxxl\:order-6{--agrid-order:6}.xxxl\:order-7{--agrid-order:7}.xxxl\:order-8{--agrid-order:8}.xxxl\:order-9{--agrid-order:9}.xxxl\:order-10{--agrid-order:10}.xxxl\:order-11{--agrid-order:11}.xxxl\:gap-1{--agrid-gap:0.25rem}.xxxl\:gap-2{--agrid-gap:0.5rem}.xxxl\:gap-3{--agrid-gap:0.75rem}.xxxl\:gap-4{--agrid-gap:1rem}.xxxl\:gap-5{--agrid-gap:1.25rem}.xxxl\:gap-6{--agrid-gap:1.5rem}.xxxl\:gap-7{--agrid-gap:1.75rem}.xxxl\:gap-8{--agrid-gap:2rem}.xxxl\:gap-9{--agrid-gap:2.25rem}.xxxl\:gap-10{--agrid-gap:2.5rem}.xxxl\:gap-11{--agrid-gap:2.75rem}.xxxl\:gap-12{--agrid-gap:3rem}}