@import 'variables.less';

/* ========== FLATDOWN - EXTRA STYLES FOR VIDEO BACKGROUND TEMPLATE ========== */



/* ===== VIDEO BACKGROUND ===== */

body.video-bg {
	background-color: @wet-asphalt;

	#wrapper {

		z-index: 999;
	
		#bg-hue {
			background-color: rgba(44, 62, 80, 0.7); /* translucent color overlay to make the video more subtle. */
			z-index: -499;
			position: fixed;
			top: 0;
			left: 0;
			height: 100%;
			width: 100%;
		}
	}



	/* ===== INTRO SECTION ===== */

	#intro {
		color: @clouds;
	}



	/* ===== COUNTDOWN SECTION ===== */

	#countdown {
		background: rgba(255,255,255,0.1)
	}



	/* ===== CAPTION SECTION ===== */
	
	#caption {
		background-color: transparent;

		.caption {

			q {

				&::before,
				&::after {
					content: '';
				}
			}

			.cite {
				color: @asbestos;
			}
		}
	}

}

/* ===== HIDE VIDEO ON MOBILE DEVICES ===== */

@media handheld, only screen and (max-width: 767px) {

	#tubular-container,
	#tubular-player,
	#tubular-shield,
	#video-controls { 
		display: none;
		width: 0;
		height: 0;
		position: fixed;
		top: -5000px;
	}
	
}