#lettersContainer {
	position: relative;
	width: 100%;
	height: 50px;
	pointer-events: none;
}

:root {
	--letter-size: 30px;
}

.letter {
	position: absolute;
	font-size: var(--letter-size);
	font-weight: 500;
	text-transform: uppercase;
	opacity: 0;
	transform: translateZ(40px);
	transition: transform 0.25s ease, text-shadow 0.35s ease, filter 0.35s
		ease, left 0.3s ease;
	pointer-events: none;
}

/* ===================== SPOTLIGHT ===================== */
#lightOverlay {
	position: absolute;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	pointer-events: none;
	background: radial-gradient(circle at 50% 40%, rgba(255, 255, 255, 0.85)
		0%, rgba(255, 255, 255, 0.45) 30%, rgba(255, 255, 255, 0.08) 55%,
		rgba(255, 255, 255, 0) 100%);
	mix-blend-mode: screen;
	z-index: 20;
}

/* .blulight { */
/* 	padding-top: 10px; */
/* 	background: rgba(66, 133, 244, 0.2); */
/* } */
/* ===================== IMMAGINE CENTRALE ===================== */
#finalImage {
	position:relative;
	top: -5px;
	opacity: 0;
	max-width: 400px;
	min-width: 400px;
	transition: opacity 1.6s ease, transform 1.2s ease;
/* 	margin-top: 50px; */
	z-index:1111;
	/* 		box-shadow: 20px 20px 20px 20px rgba(66, 133, 244, 0.1); */
	/* 		background:  rgba(66, 133, 244, 0.1); */
}

@media ( max-width : 900px) {
	:root {
		--letter-size: 30px;
	}

	/* ===================== IMMAGINE CENTRALE ===================== */
	#finalImage {
		opacity: 0;
		min-width: 300px;
	}
}