.content-container {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* Ajusta las columnas fluidamente */
	width: 100%;

	.module-list {
		display: flex;
		flex-direction: column;
		align-items: flex-start;

		strong {
			font-size: clamp(1rem, 2.5vw, 1.3rem); /* Ajusta el tamaño del texto fluidamente */
		}

		.basic-modules li {
			margin-bottom: 10px;

			a {
				color: #444;
				font-size: clamp(0.8rem, 2vw, 1rem);

				&:hover {
					color: #660000;
				}
			}

			&::before {
				content: '✓  ';
				color: var(--color-cuarto);
				font-weight: bold;
				font-size: 1.25rem;
			}
		}
	}

	.slideshow-container {
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		width: 100%;
		max-width: 400px; /* Ajusta el tamaño máximo del contenedor del slideshow */
		overflow: hidden;

		.slideshow {
			position: relative;
			width: 280px;
			height: 250px;
			overflow: hidden;

			.slide {
				position: absolute;
				width: 100%;
				height: 100%;
				opacity: 0;
				transition: opacity 1s ease-in-out;

				img {
					width: 100%;
					height: 100%;
				}

				&:nth-child(1) {
					animation: fade 15s infinite 0s;
				}

				&:nth-child(2) {
					animation: fade 15s infinite 5s;
				}

				&:nth-child(3) {
					animation: fade 15s infinite 10s;
				}
			}
		}
	}
}

.italic {
	font-style: italic;
	margin-bottom: clamp(10px, 2.5vw, 15px);
}

@keyframes fade {
	0%,
	20%,
	100% {
		opacity: 0;
	}
	25%,
	95% {
		opacity: 1;
	}
}
