php-gallery/css/gallery.css

/*
  -=-=-= GALLERY =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
*/
.info-text {
  margin: 0 0 2rem;
}

.gallery-root {
  margin: 0 0 2rem; padding: 0;

  background-color: var(--bg); color: var(--fg);

  border: 0.2rem solid var(--green);
  outline: 0.5rem solid var(--bg);

  border-radius: var(--rad);
  box-shadow: var(--shadow);
}

.gallery-item {
  margin: 0.5rem; padding: 0;

  /*max-width: 232.5px; max-height: 232.5px;*/
  height: auto; max-width: 315px;

  background-color: var(--bg-2);
  border-radius: var(--rad);

  position: relative;

  flex: 1 0 150px;

  transition: transform 0.15s cubic-bezier(.19,1,.22,1);
}
.gallery-item:hover {
  transform: scale(1.1) rotate(5deg);
  box-shadow: var(--shadow);
}
.gallery-item:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.gallery-image {
  margin: 0; padding: 0;

  /*max-width: 232.5px; max-height: 232.5px;*/
  width: 100%; height: 100%;

  top: 0; bottom: 0; left: 0; right: 0;

  position: absolute;

  object-fit: cover;
  object-position: center;

  border-radius: var(--rad);
}

/*@media (max-width: 701px) {
  .gallery-item {
    margin: 0;

    width: 33.33%; height: auto;

    flex: none;

    border-radius: 0;

    transform: none;
  }
  .gallery-item:after {
    content: "";
    display: block;
    padding-bottom: 100%;
  }

  .gallery-image {
    border-radius: 0;
  }
}*/