@media only screen {body {    margin: 0;    padding: 0;}.source-theme-warning{display:none!important}
}

.navbar ul li{
    background-color:var(--background-color-alt);
    border-radius:4px;
}
.navbar .ml-menu li {
	margin:10px 4px!important;
}
.nav-wrap, .popdrop-popover-alert, .iconic-caption {
  background: var(--background-color-alt)!important;
  /* fallback for old browsers */
background: -webkit-linear-gradient(to top, #B5C9A7, #B9C8AA)!important;
/* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to top, #B5C9A7, #B9C8AA)!important;
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.cloudy {
  background: #ffffff;
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to top, var(--background-color-alt), #ffffff);/* Chrome 10-25, Safari 5.1-6 */background: linear-gradient(to top, var(--background-color-alt), #ffffff);/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */}.iconic-caption {	color:var(--text-color-normal)!important;}mark {background-color: rgba(255, 255, 128, .5);}.popdrop-popover-alert .popdrop-popover-title {background-color: var(--accent-color)!important;border-bottom: 1px solid var(--background-color-alt)!important;}.ml-dropdown {	background-color: transparent !important;	//background-color:var(--background-color-alt);}.branding div {	font-weight:bold!important;}.button-second a, .button-primary a {	text-shadow: 		-2px 2px 6px rgba(0, 0, 0, 0.3),		2px -2px 6px rgba(255, 255, 255, 0.4);	box-shadow:		rgba(60, 64, 67, 0.15) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 2px 0px;}        /* ==========================================================================   BLOCKQUOTE SPECIALE (Classe: cit-speciale) - VERSIONE COMPLETA ANTI-BLOCCO   ========================================================================== *//* --------------------------------------------------------------------------   1. REGIONALI MOBILE (Schermi piccoli: Riquadro centrato e 10px dalle virgolette)   -------------------------------------------------------------------------- */.cit-speciale blockquote {position: relative;z-index: 1;/* Margini simmetrici su Mobile per centrare il riquadro */    margin: 20px 25px 20px 25px;padding: 25px;border: 1px solid rgba(204, 204, 204, 1.00);border-radius: 0px;overflow: visible;/* 🔥 RISOLUZIONE PULSANTE: Fa passare i click "attraverso" il riquadro invisibile dello Stack */    pointer-events: none;}/* 🔥 Permette comunque di selezionare il testo o cliccare sui loghi all'interno della citazione */.cit-speciale blockquote p,.cit-speciale blockquote img,.cit-speciale blockquote picture,.cit-speciale blockquote strong {pointer-events: auto;}/* Evita spazi vuoti strani sotto l'ultimo paragrafo di testo dello Stack */.cit-speciale blockquote p:last-of-type {margin-bottom: 0;}/* Regole comuni per le virgolette giganti sullo sfondo */.cit-speciale blockquote::before, .cit-speciale blockquote::after {position: absolute;display: block;line-height: 0;color: rgba(107, 146, 78, 0.50);/* Il tuo verde esatto al 50% */    font-family: "Arial Black", Gadget, sans-serif;font-size: 280px;}/* Virgoletta iniziale: Spinta fuori di 15px (lascia esattamente 10px dal bordo schermo) */.cit-speciale blockquote::before {content: "\201C";z-index: -1;left: -15px;top: -10px;margin-top: calc(280px / 3);}/* Virgoletta di chiusura: Speculare a destra per simmetria assoluta su Mobile */.cit-speciale blockquote::after {content: "\201D";z-index: -1;text-align: right;right: -15px;bottom: 0px;}/* --------------------------------------------------------------------------   2. RESPONSIVE DESIGN (Invariato: Tornano i tuoi valori per Tablet e PC)   -------------------------------------------------------------------------- *//* TABLET (Schermi da 640px in su) */@media all and (min-width: 640px) {.cit-speciale blockquote {        /* Torna il layout asimmetrico originale che preferisci */        margin: 30px 30px 30px 55px;padding: 35px;}    .cit-speciale blockquote::before,     .cit-speciale blockquote::after {font-size: 300px;}    .cit-speciale blockquote::before {left: -40px;/* Torna il taglio originale a 1/3 */        margin-top: calc(300px / 3);}    .cit-speciale blockquote::after {right: 15px;/* Torna interna a destra */    }}/* COMPUTER (Schermi da 1000px in su) */@media all and (min-width: 1000px) {.cit-speciale blockquote {        /* Torna il layout asimmetrico originale per Desktop */        margin: 40px 40px 40px 65px;padding: 40px;}    .cit-speciale blockquote::before,     .cit-speciale blockquote::after {font-size: 330px;}    .cit-speciale blockquote::before {left: -48px;/* Torna il taglio originale a 1/3 su monitor grandi */        margin-top: calc(330px / 3);}    .cit-speciale blockquote::after {right: 15px;/* Torna interna a destra */    }}p a:link, li a:link, h1 a:link, h2 a:link, h3 a:link,p a:visited, li a:visited, h1 a:visited, h2 a:visited, h3 a:visited {color: #212121 !important;/* Colore grigio scuro/nero */  //font-weight: bold !important;/* Testo in grassetto */  text-decoration: underline !important;/* Sempre sottolineato */  //font-size: max(20px, 1.25rem) !important;}/* .ani-arrows (CSS for arrows animation) This CSS animates in the navigation arrows to an offset of `-2em`. The starting point for the arrows is set in the Splider Styling stack. We can apply this to any Splider stack that we want to by simply adding the css class name `ani-arrows` to the stack settings. Also - as we are using Source we are applying this to only 'non-touch' devices by using the `.touch-stripped` class name */html:not(.touch-stripped) .ani-arrows .splide__arrow {opacity: 0;transition: all 0.4s;}html:not(.touch-stripped) .ani-arrows:hover .splide__arrow--next {right: -1em !important;}html:not(.touch-stripped) .ani-arrows:hover .splide__arrow--prev {left: -1em !important;}html:not(.touch-stripped) .ani-arrows:hover .splide__arrow {opacity: 0.9;}/* .splide-hide (CSS for fading in content) This CSS hides any content that has been given the class name of `splide-hide` and then fades it in when the slide becomes active */.splide-hide{opacity: 0;transition: opacity 0.8s;}.splide__slide.is-active .splide-hide{opacity:1}/* CSS da pagina *//* Sblocca l'animazione di Animagic all'istante anche con l'effetto Bounce */.wow.elxr_bounceInLeft {visibility: visible !important;animation-name: elxr_bounceInLeft !important;animation-delay: 0ms !important;animation-duration: 1000ms !important;}/* Sblocca l'animazione di Animagic all'istante senza aspettare il caricamento dei video */.wow.elxr_flip {visibility: visible !important;animation-name: elxr_flip !important;animation-delay: 2700ms !important;animation-duration: 1000ms !important;}/* 1. CONFIGURAZIONE DEL PULSANTE E ATTIVAZIONE TREMOLIO */.pulsante-musica-unico {animation: scossaTessera 4s infinite ease-in-out !important;display: inline-flex;align-items: center;justify-content: center;transition: transform 0.3s ease;}/* 2. REGOLA PER SPEGNERE IL TREMOLIO QUANDO IL VIDEO PARTE */.pulsante-musica-unico.ferma-animazione {animation: none !important;transform: rotate(0deg) scale(1) !important;/* Lo blocca dritto e perfetto */}/* 3. L'ANIMAZIONE DEL TREMOLIO (CON ANTICIPO DI 2 SECONDI) */@keyframes scossaTessera {/* Resta fermo all'inizio per circa 1,6 secondi (fino al 40% del ciclo) */  0%, 40%, 100% {     transform: rotate(0deg) scale(1);}  /* Il tremolio si attiva e scuote il pulsante tra il 42% e il 56% */  42% {transform: rotate(3deg) scale(1.05);}  44% {transform: rotate(-3deg) scale(1.05);}  46% {transform: rotate(4deg) scale(1.05);}  48% {transform: rotate(-4deg) scale(1.05);}  50% {transform: rotate(3deg) scale(1.05);}  52% {transform: rotate(-3deg) scale(1.05);}  54% {transform: rotate(1.5deg) scale(1.02);}  56% {transform: rotate(-1.5deg) scale(1.02);}}video.vid-bg {	width: 100%;	height: 100%;	object-fit: cover;	display: block;	background-color: #000000;}video.vid-bg-none {	width: 100%;	height: 100%;	object-fit: cover;	display: none;	background-color: #000000;}.splide-scale{transform: scale(0.9);transition: all .4s ease-out;}.splide__slide.is-active .splide-scale{transform: scale(1.0);box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;background-color: var(--background-color)}.splide-scale-img{transform: scale(0.8);transition: transform .6s ease-out;}.splide__slide.is-active .splide-scale-img {transform: scale(1.0);}.stp{position: absolute!important;}//body.lightbox-open .stacks_top{filter:blur(4px);}h2 {	margin-top: 2.4rem!important;	}		#stacks_in_986_ticker {	text-shadow: 		-2px 2px 6px rgba(0, 0, 0, 0.3),		2px -2px 6px rgba(255, 255, 255, 0.4);	box-shadow:		rgba(60, 64, 67, 0.15) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 2px 0px;}/* Mantiene l'H3 dentro il Toggle perfettamente allineato e stilizzato */.stacks_in button h3 {display: inline;font-size: inherit;font-weight: inherit;margin: 0;padding: 0;color: inherit;}/* Forza le miniature della galleria ad avere dimensioni esplicite e stabili */.iconic-gallery img, .iconic-gallery-item img {width: 100% !important;height: auto !important;aspect-ratio: 4 / 3 !important;/* Cambia in 1 / 1 se le tue miniature sono quadrate */}