.GridGallery {
    margin-top: 3rem;
    // scss
    .gallery-grid{
        display: block;
        position: relative;
        overflow: hidden;
        height: 25vh;
        width: 100%;
        border-radius: var(--xshop-border-radius);
        img{
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: var(--xshop-border-radius);
        }
        h4{
            transition: 400ms;
            position: absolute;
            left: 10%;
            right: 10%;
            top: 10%;
            bottom: 10%;
            background: #ffffff77;
            z-index: 3;
            display: flex;
            align-items: center;
            justify-content: center;
            backdrop-filter: blur(5px);
            opacity: 0;
            color: var(--xshop-text);
            border-radius: var(--xshop-border-radius);
        }

        &:hover{
            h4{
                opacity: 1;
            }
        }
    }
}