.image-box:hover {
	box-shadow: 0 4px 8px rgba(0,0,0,0.7);
}
.image-box:hover:before {
	background: rgba(0, 0, 0, 0.5);
}

.lista {
	width: 100%;
	margin: 6px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 15px;
	background-color: #f7f7f7;
	border-radius: 10px;
	box-shadow: 0 2px 4px rgba(0,0,0,0.1);

	position: relative;
	background-size: cover;
	height: 100px;
	cursor: pointer;

}

.lista:hover {
	box-shadow: 0 4px 8px rgba(0,0,0,0.5);
}

.lista .date-badge {
	flex-shrink: 0;
	margin-right: 35px;
	background-color: rgba(0,0,0,0.5);
	padding: 5px 10px;
	border-radius: 5px;
	color: white;
	text-align: center;
	width: 6rem;
}
.lista .date-badge .day {
	font-size: 24px;
	line-height: 1;
}
.lista .date-badge .time {
	font-size: 14px;
}
.lista .title-badge {
	flex-grow: 1;
}
.lista .title-badge .titulo {
	margin-bottom: 5px;
	color: white;
	text-shadow: 0 0 5px #666;
}
.lista .title-badge .badge {
	background-color: #007bff; /* Color de Bootstrap para los badges */
}

.lista.sin-plazas .title-badge .titulo {
	color: #ccc;
}

@media (min-width: 1200px) {
	.lista .title-badge h3 {
		font-size: 26px;
	}
	.calendario.cal-sidebar .lista .title-badge p {
		font-size: 22px;
	}
}

@media (min-width: 900px) {
	.lista .title-badge h3 {
		font-size: 22px;
	}
	.calendario.cal-sidebar .lista .title-badge p {
		font-size: 19px;
	}
}

@media (max-width: 899px) {
	.lista .title-badge h3 {
		font-size: 16px;
	}
	.calendario.cal-sidebar .lista .title-badge p {
		font-size: 14px;
	}
}


.calendario.cal-sidebar .lista .date-badge {
	width: 3rem;
}
.calendario.cal-sidebar .lista .date-badge .day {
	font-size: 24px;
}
.calendario.cal-sidebar .lista .date-badge .time {
	font-size: 14px;
}