@media (max-width: 1900px) {

    html {
        font-size: 1.09375vw;
    }

}


@media (max-width: 800px) {

    html {
        font-size: 16px;
    }

    .gSmallContent {
        max-width: calc(100vw / 24 * 20);
        /* like gContent */
    }

    .section {
        padding: calc(var(--layoutColumnWidth) * 2) var(--layoutColumnWidth);
    }

    .header {
        position: sticky;
        top: 0;
        z-index: 1;
        background: #fff;
    }

    .header .gWideContent {

        display: grid;
        grid-template-columns: min-content 1fr;
    }

    .headerButton {
        display: block;
        background-image: url(../../images/icons/burger.svg);
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        width: 2em;
        aspect-ratio: 1;
        cursor: pointer;
        margin-left: auto;
        user-select: none;
    }

    .topHeader span {
        display: none;
    }

    .open .headerButton {
        background-image: url(../../images/icons/close.svg);
    }

    .header .headerNav {
        display: none;
        gap: 2em;
        grid-row: 2;
        grid-column: 1 / 3;
        flex-direction: column;
        padding: 2em 0;
    }

    .header.open .headerNav {
        display: flex;
    }


    .introSlide {
        grid-template-columns: 1fr;
    }

    .introSlideImage {
        grid-row: 1;
    }

    .flexSpaceBetween {
        flex-direction: column;
    }

    .grid3x,
    .grid4x,
    .cols2_smallLeft,
    .cols2_smallRight,
    .cols2,
    .cols3,
    .cols2withLateralColumn {
        grid-template-columns: 1fr;
    }


    .whiteBox.withImage {
        grid-template-columns: 1fr;
    }

    .whiteBoxImage {
        aspect-ratio: 16 / 9;
        grid-row: 1;
    }

    .footerGrid {
        grid-template-columns: 1fr;
    }

    .smallIntro .introSlideImage {
        margin: 0;
        height: auto;
    }

    .introSlideText {
        margin-top: 0.5em;
    }

    .servicesGrid.grid3x {
        grid-template-columns: 1fr 1fr;
    }

    .storeLocatorFilters {
        grid-template-columns: 1fr;
        gap: 1em;
    }

    .storeLocatorCols {
        grid-template-columns: 1fr;
    }

    #storeLocatorMap {
        aspect-ratio: 1;
    }

}

@media (max-width: 500px) {

    .servicesGrid.grid3x {
        grid-template-columns: 1fr;
    }
}