:root{ --grid-offset: 8.25vw; --grid-gutter: 0.75vw; } .row{ @apply grid-container; .row, .row-fluid{ @apply px-0 ml-0 w-full; } } /* .row{ @apply px-5 mx-auto w-full; @screen md{ @apply max-w-screen-md; } @screen lg{ @apply max-w-screen-lg; } @screen xl{ @apply max-w-screen-xl; } @screen 2xl{ @apply max-w-screen-2xl; } .row, .row-fluid{ @apply px-0; } } */ .row-fluid{ @apply px-2.5; .row, .row-fluid{ @apply px-0; } } .columns{ @apply flex flex-wrap -mx-2.5; } .column{ @apply px-2.5; } .grid-container, .block-container{ width: calc(100vw - var(--grid-offset)); margin-left: calc(var(--grid-offset) - var(--grid-gutter)); margin-right: calc(var(--grid-gutter) * 2); @apply px-[var(--grid-gutter)]; .grid-container, .block-container{ @apply w-full ml-0 mr-0 px-0; } } @layer utilities{ .grid-container-offset{ @apply ml-[120px] mr-auto max-w-none; } }