/* ------------------------------------------------------------------------
   Icone scroll flottante (accueil + pages AImagination : WONDERLAND,
   NISHIKI-GOI, APOLLO, COLOSSEUM). Fixe en bas de l'ecran, disparait en
   fade des les premiers pixels de scroll. Voir js/scroll-indicator.js.
   ------------------------------------------------------------------------ */
.scroll-indicator {
	position: fixed;
	/* Ferme (par defaut) : centree sur le viewport entier, le hero
	   (.epic-slider.fullscreen) etant toujours plein cadre. Ouvert : voir
	   la regle html.desktop-nav-open plus bas, qui la recentre sur la
	   zone visible a droite du panneau. */
	left: 50%;
	bottom: 201px; /* 151px + 50px (remonte de 50px) */
	transform: translateX(-50%);
	width: 56.1px;   /* 85% de 66px (taille d'origine) */
	height: 56.1px;
	pointer-events: auto;
	cursor: pointer;
	z-index: 999;
	opacity: 1;
	transition: opacity 0.3s ease-out, left .45s cubic-bezier(.65,0,.35,1), transform 0.2s ease-out;
	/* Meme effet que le logo PAUL LEON et le hamburger : le GIF (blanc
	   casse) est inverse contre le fond reel de la page -> blanc sur fond
	   sombre, sombre sur fond clair. isolation + mix-blend-mode sont poses
	   sur l'element fixe lui-meme (et non sur l'img), sinon l'inversion
	   reste enfermee dans son contexte d'empilement et donne du blanc
	   partout (cf. commentaires dans css/desktop-menu-toggle.css). */
	isolation: isolate;
	mix-blend-mode: difference;
}
.scroll-indicator:hover {
	transform: translateX(-50%) scale(1.08);
}
.scroll-indicator img {
	width: 100%;
	height: 100%;
	display: block;
	pointer-events: none;
}
.scroll-indicator.is-hidden {
	opacity: 0;
}

/* Menu ouvert (desktop) : le panneau recouvre la partie gauche du hero,
   donc on recentre l'icone sur la zone effectivement visible a droite du
   panneau plutot que sur le viewport entier. --desktop-sidebar-width est
   definie dans css/desktop-menu-toggle.css (250px ou 210px selon le
   palier desktop) : on la reutilise pour rester coherent si sa valeur
   change un jour. */
@media only screen and (min-width: 1200px) {
	html.desktop-nav-open .scroll-indicator {
		left: calc(var(--desktop-sidebar-width, 250px) / 2 + 50vw);
	}
}

/* En dessous de 960px la sidebar se replie en menu mobile : on masque
   l'icone flottante, comme le fait deja le site pour les GIF des slides
   (voir top-banner.css). */
/* Petit desktop (960-1199px) : le hero n'occupe plus toute la hauteur de la
   fenetre, l'icone fixe sortirait de la zone du slider -> masquee aussi. */
@media only screen and (max-width: 1199px) {
	.scroll-indicator { display: none; }
}

/* Anciennes icones scroll.gif repetees dans chaque slide du slider
   (heritees du template) : desormais remplacees par l'icone flottante
   unique ci-dessus, on les masque partout. */
.epic-slider .es-caption img[src*="scroll.gif"] {
	display: none !important;
}
