.photo-grid {
    margin: 5vh 3vw;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    width: 94vw;
    min-height: 50vh;
}

.img-wrapper {
    background-color: rgb(229, 161, 215);
    outline: 5px solid rgb(198, 140, 186);
    margin: 0.5rem;
    border-radius: 10px;
    overflow: hidden;
}

.img-wrapper img {
    object-fit: contain;
    width: 100%;
    height: 100%;
    border-radius: 10px
}

@media (max-width: 1500px) {
    .photo-grid {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1300px) {
    .photo-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 900px) {
    .photo-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 650px) {
    .photo-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 450px) {
    .photo-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 333px) {
    .photo-grid {
        grid-template-columns: repeat(1, 1fr);
    }
}