.jco-featured-image,
.jco-event-image-link {
	display: block;
}

.jco-event-image-link img {
	display: block;
}

.jco-image-credit {
	display: block;
	margin-top: 0.2rem;
	font-size: 10px;
	line-height: 1.3;
	color: #777;
}

/* My Calendar card list: two equal columns on desktop. */
.mc-main .my-calendar-cards {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-auto-rows: 1fr;
	gap: 16px;
	align-items: stretch;
}

.mc-main .my-calendar-cards > * {
	width: 100%;
	min-width: 0;
	height: 100%;
}

.mc-main .my-calendar-cards .card-event {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.mc-main .my-calendar-cards .card-event header {
	flex: 0 0 auto;
}

.mc-main .my-calendar-cards .card-event .event-title {
	min-height: 2.7em;
	margin: 0;
}

.mc-main .my-calendar-cards .event-title-container {
	display: -webkit-box;
	overflow: hidden;
	line-height: 1.35;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.mc-main .my-calendar-cards .card-event .details,
.mc-main .my-calendar-cards .mc-event-container {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
}

.mc-main .my-calendar-cards .mc-image-container {
	overflow: hidden;
	width: 100%;
	margin: 0 !important;
	aspect-ratio: 16 / 9;
	background: #f7f7f7;
}

.mc-main .my-calendar-cards .mc-image-container .jco-featured-image,
.mc-main .my-calendar-cards .mc-image-container .jco-event-image-link {
	width: 100%;
	height: 100%;
}

.mc-main .my-calendar-cards .mc-image-container img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.mc-main .my-calendar-cards .mc-content-container {
	flex: 1 1 auto;
	align-content: start;
}

.mc-main .my-calendar-cards .mc-card-content .shortdesc {
	margin: 0;
}

.mc-main .my-calendar-cards .mc-card-content .shortdesc p {
	display: -webkit-box;
	overflow: hidden;
	margin-bottom: 0;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
}

/* Credits remain available on event pages, but are omitted from card lists. */
.mc-main .my-calendar-cards .jco-image-credit {
	display: none;
}

@media (max-width: 767px) {
	.mc-main .my-calendar-cards {
		grid-template-columns: minmax(0, 1fr);
	}
}
