// -------------------------------------------------------------------------------- // Columns // -------------------------------------------------------------------------------- .block-columns { } .block-columns > .content { display: grid; grid-template-columns: repeat(auto-fit, minmax(calc(#{$theme-width} / 3 - 5rem), 1fr)); grid-column-gap: 0.75rem; grid-row-gap: 0.75rem; } // Columns: Horizontal Alignment .block-columns > .content.halign-start, .block-columns > .content.halign-left { align-items: start; } .block-columns > .content.halign-end, .block-columns > .content.halign-right { align-items: end; } .block-columns > .content.halign-center, .block-columns > .content.halign-middle { align-items: center; } .block-columns > .content.halign-baseline, .block-columns > .content.halign-text { align-items: baseline; } .block-columns > .content.halign-stretch, .block-columns > .content.halign-fill { align-items: stretch; } .block-columns > .content.valign-start, .block-columns > .content.valign-left { justify-items: start; } .block-columns > .content.valign-end, .block-columns > .content.valign-right { justify-items: end; } .block-columns > .content.valign-center, .block-columns > .content.valign-middle { justify-items: center; } .block-columns > .content.valign-baseline, .block-columns > .content.valign-text { justify-items: baseline; } .block-columns > .content.valign-stretch, .block-columns > .content.valign-fill { justify-items: stretch; } // -------------------------------------------------------------------------------- // Individual Column // -------------------------------------------------------------------------------- .block-column { padding: 0 0; } .block-column ~ .block-column { margin-top: 0; } // -------------------------------------------------------------------------------- // Fix Headings inside Columns // -------------------------------------------------------------------------------- .block-column > .content > .block-heading { margin: 0; }