.pagelistingblock-cardgridwdate ul.list  {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, auto);
  min-height: 21.25rem;
  gap: 2rem 3rem;
  /*
   ** NOTE: this was grid-auto-rows: 1fr; on 5/12/2026 KP switched it to grid-auto-rows: auto
   ** This correct a problem with wide gapping on the last row of the Video page on OAI
  */
  grid-auto-rows: auto;
}
.pagelistingblock-cardgridwdate ul.list li  {
  display: grid;
    grid-template-rows: subgrid;
    grid-row: span 3;
  border-top: 1px solid var(--border);
  padding-top: .5rem;
  justify-items: start;
  align-items: start;
  /*
   ** NOTE: this was gap: 0.01rem; on 5/12/2026 KP switched it to column-gap: 0.01rem; row-gap: 1rem;
   ** This goes with the correction above and addes a little more spacing between elements in the card
  */
  column-gap: .01rem;
  row-gap:1rem;
}
@media (max-width: 766px) {
  .pagelistingblock-cardgridwdate ul.list li  {
    grid-template-rows: auto;
    gap: 1rem;
  }
}

.pagelistingblock-cardgridwdate ul.list .list-item .summary {
  font-size: 1rem;
}
.pagelistingblock-cardgridwdate ul.list .list-item .summary p {
 font-size: 1rem;
}
.pagelistingblock-cardgridwdate ul.list .title h3  {
  margin-top:0;
  margin-bottom:0;
  font-size: 1.6rem;
  line-height: 1.9rem;
}
.pagelistingblock-cardgridwdate ul.list .title h3 a  {
  margin-top:0;
  margin-bottom:0;
  font-size: 1.6rem;
  line-height: 1.9rem;
}
.pagelistingblock-cardgridwdate ul.list .title .date {
    font-size: 1rem;
    font-family: sans-serif;
}

.pagelistingblock-cardgridwdate ul.list .image {
  min-height: 0;
  max-height: 225px;
  overflow: hidden;
  position: relative;
  aspect-ratio: 16 / 9;
}
.pagelistingblock-cardgridwdate ul.list .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}