:root {
	--color-text: #000000 !important;
	--color-background: #ffffff !important;
	--color-backgroundDark: #2a3151 !important;
	--color-primary: #019cdb !important;
	--color-secondary: #ccebf8 !important;
	--color-accent: #f47a42 !important;
	--color-accentLight: #f47a4288 !important;
	--color-backgroundT: #011412 !important;
	--color-primaryT: #ffffff !important;
	--color-secondaryT: #ffffff !important;
	--color-accentT: #ffffff !important;
}

.color1:not(.slide) {
	background-color: var(--color-primary);
}
.color1 {
	color: var(--color-text) !important;
	accent-color: var(--color-accent) !important;
	background-color: var(--color-background) !important;
}

.color1Light:not(.slide) {
	background-color: var(--color-secondary);
	/* opacity: 80%; */
}
.color1Light {
	color: var(--color-secondaryT);
	accent-color: var(--color-accent);
	background-color: var(--color-secondary);
}
.color2:not(.slide) {
	background-color: var(--color-accent);
}
.color2 {
	color: var(--color-text) !important;
	accent-color: var(--color-primary) !important;
	background-color: var(--color-accent) !important;
}

.color2Light:not(.slide) {
	background-color: var(--color-secondary);
	/* opacity: 90%; */
}
.color2Light {
	color: var(--color-text) !important;
	accent-color: var(--color-primary) !important;
	background-color: var(--color-accentLight) !important;
}

.color0Light {
	color: var(--color-lightT);
	accent-color: var(--color-accent);
	background-color: var(--color-background);
}

/* body {
	background-image: url(app/back_1.svg);
	background-size: cover;
} */

.menu-content > ul {
	height: 100%;
	background-color: var(--color-background);
}

.menu-content > ul > li a {
	background-size: cover;
}
/* .item-selected{
	background-color: var(--color-background) !important;
	color: var(--color-text) !important;
} */
.portadaSlide {
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.page {
	background-color: var(--color-background);
	color: var(--color-backgroundT);
	padding: 0;
}
.actCard {
	margin: 0 !important;
	/* margin-bottom: 1rem !important; */
	width: 100% !important;
	border-radius: unset !important;
}
.slide {
	p {
		font-size: 1.3rem;
		text-wrap: pretty;
	}
}

.slide.portada h1 {
	font-weight: 800;
	color: var(--color-primary);
	text-wrap: balance;
}

.slide.portada h2 {
	color: var(--color-accent);
	font-weight: 600;
}

.icono_instruccion {
	color: var(--color-primary);
}

.cont_text h1 {
	background-color: #ccebf8;
	color: var(--color-accent);
	display: inline-block;
	padding: 1rem;
	padding-left: 2rem;
	padding-right: 2rem;
	margin-left: -2rem;
	border-radius: 0 999px 999px 0;
}

.img_slide {
	background-size: contain;
	aspect-ratio: auto;
}
.exp_button {
	background-color: var(--color-accent);
	color: var(--color-background);

	border-radius: 1.5cqw;
	padding: 0;
}

.exp_button .label {
	padding: 0;
	line-height: 1cqw;
	font-size: 5cqw;
	padding: 3cqw;
}

.triviaPregunta {
	border-color: var(--color-accent);
	background-color: var(--color-accentLight);
}
.triviaOpcion {
	color: var(--color-primaryT);
	background-color: var(--color-accent);
}
.retroFinal {
	border-color: var(--color-accent);
	background-color: var(--color-background);
	color: var(--color-text);
}

.slide.portada {
	container-name: portada;
	container-type: size;
}

@container portada (aspect-ratio > 1/1) {
	.titulo {
		padding: 3cqw;

		h1 {
			font-size: 3.9cqw;
			line-height: 4cqw;
		}

		h2 {
			font-size: 3.7cqw;
			line-height: 3.7cqw;
		}
	}
}
@container portada (aspect-ratio < 1/1) {
	.titulo {
		padding: 5cqw;
		h1 {
			font-size: 6.2cqw;
		}

		h2 {
			font-size: 6.2cqw;
			line-height: 7.2cqw;
		}
	}
}
