.gallery-img{
    max-width: 100%;
    height: auto;
}

.gallery{
    margin: 0 0.65rem;
}

.gallery-item {
    height: auto;
    /* margin: 0.5rem; */
    border: 2px black solid;
    /* border-radius: 50%; */
}

.gallery-item img {
    width:  100%;
    height: 100%;
    object-fit: cover;
}

@media (min-width: 640px) {
    .gallery{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(5, 300px);
        grid-auto-flow: row dense;
    }

    .gallery-item:first-child{
        grid-row: span 1;
    }

    .gallery-item:nth-child(2){
        grid-column: 2 / 3;
        grid-row: span 2;
    }

    .gallery-item:nth-child(6),
    .gallery-item:nth-child(8){
        grid-row: span 2;
    }
}

@media (min-width: 960px) {
    .gallery{
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        grid-template-rows: repeat(3, auto-flow);
        grid-auto-flow: row dense;
    }

    .gallery-item:first-child,
    .gallery-item:nth-child(7),
    .gallery-item:nth-child(5),
    .gallery-item:nth-child(10),
    .gallery-item:nth-child(14){
        grid-column: span 2;
        grid-row: span 1;
    }

    .gallery-item:nth-child(2){
        grid-column: span 2;
        grid-row: span 2;
    }
    .sm-p-10{
        padding: 10px;
    }
}