/* chat gpt's version */
.grid {
    margin: 0 auto;
}

.grid-sizer,
.grid-item {
    width: 100%;
}

.grid-sizer {
    height: 0;
}

.grid-item {
    padding: 0.75rem;
    box-sizing: border-box;
    /*transition: top 0.4s ease-out, left 0.4s ease-out;*/
}

.grid-item--wide {
    width: 100%;
}

/* md: 2 columns */
@media (min-width: 768px) {
    .grid-item,
    .grid-sizer {
        width: 50%;
    }

    .grid-item--wide {
        width: 100%;
    }
}

/* lg: 3 columns */
@media (min-width: 992px) {
    .grid-item,
    .grid-sizer {
        width: 33.333333%;
    }

    .grid-item--wide {
        width: 66.666666%;
    }
}

/* xl: 4 columns */
/*@media (min-width: 1200px) {*/
/*    .grid-item,*/
/*    .grid-sizer {*/
/*        width: 25%;*/
/*    }*/

/*    .grid-item--wide {*/
/*        width: 50%;*/
/*    }*/
/*}*/