На мобильном - горизонтальный вид галереи выглядит лучше, чем вертикальный

Question

Моя галерея на мобильных телефонах выглядит гораздо хуже в вертикальном положении, чем в горизонтальном.

  .order-gallery ul li {
  display: inline;
}

.order-gallery ul {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  list-style-type: none;
  text-align: center;
  padding: 0;
}

.order-gallery li {
  flex: 1 33%;
  padding: 0 20px;
}

.order-gallery li img {
  max-width: 100%;
}

.panel-body {
  background: rgba(21, 21, 21, 0.5);
  padding: 15px;

<div class="panel-body order-gallery">
  <ul>
    <li>
      <img pp-type="imagemodal" pp-imagemodal-src="https://placehold.it/600x400" src="https://placehold.it/200x100">
    </li>
    <li>
      <img pp-type="imagemodal" pp-imagemodal-src="https://placehold.it/600x400" src="https://placehold.it/200x100">
    </li>
    <li>
      <img pp-type="imagemodal" pp-imagemodal-src="https://placehold.it/600x400" src="https://placehold.it/200x100">
    </li>
    <li>
      <img pp-type="imagemodal" pp-imagemodal-src="https://placehold.it/600x400" src="https://placehold.it/200x100">
    </li>
  </ul>
</div>

Горизонтальный вид: https://imgur.com/a/1XrZ07K

Вертикальный вид: https://imgur.com/a/YRD7siT