.packing-list-grid {
  margin-top: 40px;
  display: grid;
  /* grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); */
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  gap: 1rem;
  grid-template-areas:
    "a b c d e"
    "f hero hero hero g"
    "h i j k l"
    "m n o p q";
}

.packing-hero-text {
  grid-area: hero;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  color: var(--text-offwhite-color);
}


.packing-hero-text > div > h1 {
  font-size: 4em;
  text-shadow: 1px 2px #E9762B;
  line-height: 50px;
}

.packing-hero-text > a {
  color: var(--text-offwhite-color);
  text-align: center;
  text-decoration-color: #E9762B;
}

.grid-cell {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.grid-cell > p {
  color: var(--text-offwhite-color);
  text-align: center;
}

.grid-cell > img {
  min-width: 120px;  
  image-rendering: pixelated;
  image-rendering: -moz-crisp-edges;
  image-rendering: crisp-edges;
  filter: drop-shadow(1px 1px 4px hsl(10.09deg 50.22% 53.73%));
}

.grid-cell:nth-child(1) {
  grid-area: a;
}

.grid-cell:nth-child(2) {
  grid-area: b;
}

.grid-cell:nth-child(3) {
  grid-area: c;
}

.grid-cell:nth-child(4) {
  grid-area: d;
}

.grid-cell:nth-child(5) {
  grid-area: e;
}

.grid-cell:nth-child(6) {
  grid-area: f;
}

.grid-cell:nth-child(7) {
  grid-area: g;
}

@media only screen and (max-width: 947px) {
  .packing-hero-text > div {
      text-align: center;
  }
}

@media only screen and (max-width: 715px) {
  .packing-list-grid {
    margin-top: 40px;
    display: grid;
    /* grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); */
    grid-template-columns: 1fr 1fr 1fr ;
    gap: 1rem;
    grid-template-areas:
      "a b c"
      "d e f"
      " hero hero hero"
      "g h i"
      "j k l"
      "m n o"
      "p q r";
  }
}

@media only screen and (max-width: 443px) {
  .grid-cell > img {
    min-width: 100px;
  }
}

@media only screen and (max-width: 386px) {
  .grid-cell > img {
    min-width: 80px;
  }

}
