/*-------------------------
	Watch banner only
	(scoped — do not lock page scroll)
--------------------------*/

#bannerfixed {
	position: relative;
}

#banner {
	position: relative !important;
	overflow: hidden !important;
	width: min(280px, 30vw) !important;
	/* Full 9:16 — hero height adapts (see fitHeroToCountdown) between 768–1920 */
	height: calc(280px * 3840 / 2160) !important;
	max-height: none !important;
	margin: 0 auto !important;
	flex-shrink: 0;
	pointer-events: all !important;
}

/* 480–767: stacked, centered */
@media (min-width: 480px) and (max-width: 767px) {
	#banner {
		width: 200px !important;
		height: calc(200px * 3840 / 2160) !important;
		max-height: none !important;
		overflow: visible !important;
		margin: 0 auto !important;
	}
}

/* <480: stacked, smaller */
@media (max-width: 479px) {
	#banner {
		width: 120px !important;
		height: calc(120px * 3840 / 2160) !important;
		max-height: none !important;
		overflow: visible !important;
		margin: 0 auto !important;
	}
}

#banner img {
	max-width: none;
}

#background {
	position: absolute;
	opacity: 0;
}

img#watch_background {
	background-color: #000;
}

#rollover {
	position: absolute;
	top: 0px;
	left: 0px;
	display: none;
}

#watch {
	position: absolute;
	top: 0px;
	left: 0px;
}

#guichet {
	position: absolute;
	top: 0px;
	left: 0px;
}

#date {
	position: absolute;
	text-align: right;
	display: none;
}

.hand {
	position: absolute;
}

#fixedover {
	position: absolute;
	display: none;
}

.cntdwn {
	position: absolute;
	text-align: center;
	display: none;
}