/*
 * Group Grid Listing
 */

.groupGridWrap {

    .groupGridList {

        margin-bottom: 30px;

        li {

            @media @desktop {
                .grid(3);
            }

            @media @tablet {
                .grid(2);
            }

            @media @mobile {
                margin-bottom: var(--gutter_width);
            }

            .imageWrap, .groupGridDescription {
                margin: 0 0 var(--gutter_width);
            }

            .groupGridTitle {
                margin: 0 0 ~'calc(var(--gutter_width) / 2)';
                line-height: 1;

                a {
                    color: var(--text_color);
                    text-decoration: none;
                }
            }

            .groupGridTitle, .groupGridDescription {
                padding: 0 var(--gutter_width);
            }

            .groupGridReadMore {
                .button;
                margin: 0 var(--gutter_width) var(--gutter_width);
            }
        }
    }
}
