body.pageantPage {
    .container-top-full-a {
        padding: 4vw;
    }
    .container-top-full-b {
        padding: 4vw;
    }
    hero {
        h1 {
            color:var(--white-2);
            font-size:var(--size-5);
            font-family: 'bodoni_modaregular', serif;
            text-transform:uppercase;
        }
    }
}


.mod-imagegrid.shopByCategory {
    .imagegrid-item {
        img {

        }
        .imagegrid-button-wrapper {
            a {
                justify-content:start;
                padding:0;
                font-size:var(--size-1);
                font-weight:600;
            }
        }
        display:grid;
        row-gap: 32px;
    }
}
@media screen and ( width < 992px ) {
    .mod-imagegrid.shopByCategory {
        .imagegrid-container {
            flex-flow:row wrap;
            .imagegrid-item {
                &.items-1 {
                    flex-basis:100%;

                }
                &.items-2 {
                    flex-basis: calc(50% - (var(--flex-gap) * 1 / 2));

                }
                &.items-3 {
                    flex-basis: calc(50% - (var(--flex-gap) * 1 / 2));
                }
                &.items-4 {
                    flex-basis: calc(33.333% - (var(--flex-gap) * 2 / 3));
                }
            }
        }
    }
}
@media screen and ( width < 768px ) {
    .mod-imagegrid.shopByCategory {
        .imagegrid-container {
            flex-flow:row wrap;
            .imagegrid-item {
                &.items-1 {
                    flex-basis:100%;

                }
                &.items-2 {
                    flex-basis: calc(50% - (var(--flex-gap) * 1 / 2));

                }
                &.items-3 {
                    flex-basis: calc(50% - (var(--flex-gap) * 1 / 2));
                }
                &.items-4 {
                    flex-basis: calc(50% - (var(--flex-gap) * 1 / 2));
                }
            }
        }
    }
}
@media screen and ( width < 500px ) {
    .mod-imagegrid.shopByCategory {
        .imagegrid-container {
            flex-flow:row wrap;
            .imagegrid-item {
                &.items-1 {
                    flex-basis:100%;

                }
                &.items-2 {
                    flex-basis:100%;

                }
                &.items-3 {
                    flex-basis:100%;
                }
                &.items-4 {
                    flex-basis:100%;
                }
            }
        }
    }
}

