/* Root theme & Gaps */

.vb-grid.max-width { max-width: var(--max-width); }
.vb-grid.max-width-in { max-width: var(--max-width-in); }
.content_banner { min-height: var(--content_banner_height); }



/* Basic Grid Setup */
.vb-grid, .vb-cell { --g-w1: var(--g-w0); --g-w2: var(--g-w1); --g-w3: var(--g-w2); --g-w4: var(--g-w3); --g-w5: var(--g-w4); }
.vb-cell { --c-s1: var(--c-s0); --c-s2: var(--c-s1); --c-s3: var(--c-s2); --c-s4: var(--c-s3); --c-s5: var(--c-s4); }

.vb-grid, .vb-cell.is-grid { display: grid; grid-template-columns: var(--g-w0); }
@media (max-width: 1199px) { .vb-grid, .vb-cell.is-grid { grid-template-columns: var(--g-w1); } }
@media (max-width: 991px) { .vb-grid, .vb-cell.is-grid { grid-template-columns: var(--g-w2); } }
@media (max-width: 767px) { .vb-grid, .vb-cell.is-grid { grid-template-columns: var(--g-w3); } }
@media (max-width: 575px) { .vb-grid, .vb-cell.is-grid { grid-template-columns: var(--g-w4); } }
@media (max-width: 459px) { .vb-grid, .vb-cell.is-grid { grid-template-columns: var(--g-w5); } }

/* Cell & Content Spans (Chained Fallbacks) */
.vb-cell, .vb-content { 
    grid-column: span var(--c-c0, 1); 
    grid-row: span var(--c-r0, 1); 
}
@media (max-width: 1199px) { 
    .vb-cell, .vb-content { 
        grid-column: span var(--c-c1, var(--c-c0, 1)); 
        grid-row: span var(--c-r1, var(--c-r0, 1)); 
    } 
}
@media (max-width: 991px) { 
    .vb-cell, .vb-content { 
        grid-column: span var(--c-c2, var(--c-c1, var(--c-c0, 1))); 
        grid-row: span var(--c-r2, var(--c-r1, var(--c-r0, 1))); 
    } 
}
@media (max-width: 767px) { 
    .vb-cell, .vb-content { 
        grid-column: span var(--c-c3, var(--c-c2, var(--c-c1, var(--c-c0, 1)))); 
        grid-row: span var(--c-r3, var(--c-r2, var(--c-r1, var(--c-r0, 1)))); 
    } 
}
@media (max-width: 575px) { 
    .vb-cell, .vb-content { 
        grid-column: span var(--c-c4, var(--c-c3, var(--c-c2, var(--c-c1, var(--c-c0, 1))))); 
        grid-row: span var(--c-r4, var(--c-r3, var(--c-r2, var(--c-r1, var(--c-r0, 1))))); 
    } 
}
@media (max-width: 459px) { 
    .vb-cell, .vb-content { 
        grid-column: span var(--c-c5, var(--c-c4, var(--c-c3, var(--c-c2, var(--c-c1, var(--c-c0, 1)))))); 
        grid-row: span var(--c-r5, var(--c-r4, var(--c-r3, var(--c-r2, var(--c-r1, var(--c-r0, 1)))))); 
    } 
}

/* Layout Wrappers */

.vb-wrap {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
.vb-grid { width: 100%; }
.vb-cell {
    align-self: stretch;
    min-width:0;
    min-height: 0;
}
.vb-cell.is-flex {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    height: 100%;
}
.vb-cell.is-grid {
    display: grid;
}

.vb-content {
    position: relative;
    display: flex;
    /*align-self: stretch;*/
    flex-direction: column;
    min-width:0;
    min-height: 0;
    width: 100%;/* aspect-ratio */
}

.content-sticky > * { position: sticky; top:var(--sticky-top); }