/* Image frame only. Title, date, and time links also use .tile-image;
   a broad .tile-image ratio stretches those lines and lets the column flex
   squash the photo away from 724×454. */
.tiles-section.event_tile-section .tiles-content-container .tiles-tile > .tile-image {
  display: block;
  position: relative;
  width: 100%;
  flex: 0 0 auto;
  aspect-ratio: 724 / 454;
  overflow: hidden;
}

.tiles-section.event_tile-section .tiles-content-container .tiles-tile > .tile-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  /* Overrides the 200px snapshot in tailwind-app.css (homepage card height). */
  height: 100% !important;
  max-height: none !important;
  object-fit: cover;
  object-position: center center;
}

.tiles-section.event_tile-section.white .tile-wrapper,
.tiles-section.event_tile-section.white .tile-action {
  background-color: #f8f8f8;
}

.tiles-section.event_tile-section.white .tile-action:hover {
  background-color: #09009c;
  color: #fff;
}

.tile-item-detail .item-label {
  padding-top: 7px;
  padding-left: 12px;
}

.tile-item-detail .item-label.timezone {
  padding-left: 7px;
}

@media screen and (max-width: 480px) {
  .tiles-section.event_tile-section .tiles-content-container .tiles-tile .tile-wrapper .tile-title {
    font-size: 22px;
  }

  .tiles-section.event_tile-section .tiles-content-container .tiles-tile .tile-wrapper {
    padding: 22px;
  }
}

@media (max-width: 767px) {
  .mobile_hide {
    display: none;
  }
}

@media (min-width: 767px) {
  .desktop_hide {
    display: none;
  }
}