/* FULLSCREEN BANNER */
	
	#herocontainer {
    position: absolute;
    top: 0;
    left: 0;
	height: 100%;
	width: 100%;
	overflow: hidden;
    z-index: 10;
	}

	.tthc-img1 {
	
	background-image: url('../img/tthc-cover-1d-2000.jpg');
	background-size: cover;
	background-position: center 25%;
	background-repeat: no-repeat;
	background-color: #000; 
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	line-height:0;
	display: block;
	padding: 0;
	opacity: 0;
	animation: fadein 1s .5s forwards linear;
	}
	
	#covertitle {
	position: absolute;
	left: 0;
	bottom: 0;
	padding-bottom: 1vh;
	text-align: left;
	z-index: 10;
	}
	
	#covertitle span.display {
	font-size: 35vw;
    letter-spacing: -2px;
    color: #fff;
    line-height: .77;
	}
	
	#covercredits {
	position: absolute;
	right: 0;
	bottom: 0;
	padding-right: 20px;
	text-align: right;
	margin-bottom: 2.5vh;
	z-index: 10;
	}
	
	#covercredits span.display {
	font-size: 2.9vh;
    letter-spacing: .5px;
    color: #fff;
    line-height: .85;
	}
	
	#covervideo {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	line-height:0;
	display: block;
	padding: 0;
	opacity: 0;
	z-index: 8;
	background-color: blue;
	}
	
	.video-container {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	}
	
	#teaserVid {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	height: auto;
	width: 100%;
	}
	
	@media (max-aspect-ratio: 10/9) {
		#teaserVid {	
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		height: 100%;
		width: auto;
		}
	}
	
	#midimg, #endimg {
	background-size: cover;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	line-height:0;
	display: block;
	padding: 0;
	opacity: 0;
	}
	
	#midimg {
	background-image: url('../img/tthc-cover-end-1920.jpg');
	background-position: 75% center;
	z-index: 5;
	}
	
	#endimg {
	background-image: url('../img/tthc-cover-still003B.jpg');
	background-position: center top;
	z-index: 6;
	}
	
	#covertitle  {
	position: absolute;
	display: table;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	letter-spacing: -.2px;
	opacity: 0;
	z-index: 10; 
	}
	
	#coverbyline  {
	position: absolute;
    display: table;
    left: 50%;
    top: 0;
    width: 90vw;
    height: 100%;
    transform: translateX(-50%);
    opacity: 0;
    z-index: 10; 
	}
	
	.cvrttl5 {
	margin-top: -9.4vw;
	}
	
	.cvrttl6 {
	margin-top: 9.4vw;
	}
	
	#finaltitle  {
	position: absolute;
	left: 3vw;
	bottom: -100%;
	margin-bottom: 40px;
	opacity: 0;
	z-index: 10; 
	}
	
	#covertitle span.display {
	font-size: 34vw;
    color: #fff;
    display: table-cell;
	}
	
	#coverbyline span.byline {
	font-size: 12vw;
    line-height: 0.8;
    letter-spacing: .2px;
    color: #fff;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    padding-top: 2vw;
	}
	
	#finaltitle span.display {
	font-size: 17vh;
    color: #fff;
    letter-spacing: .1vw;
    color: #fff;
    text-align: left;
    display: inline-block;
	}
	
	.fnlttl1 {
		transform: translateY(-43.5vh);
	}
	.fnlttl2 {
		transform: translateY(-29.9vh);
	}
	.fnlttl3 {
		transform: translateY(-16.5vh);
	}
	.fnlttl4 {
		transform: translateY(-3vh);
	}

	.inview {
		display: block;
		}

	.hide {
		display: none;
		}
	
	@media (orientation: landscape) {
		#covertitle span.display {
			font-size: 23vh;
		}
	}
	
	@media (max-height: 600px) {
		#covertitle span.display {
			font-size: 21vh;
		}
	}
	
	@media (orientation: portrait) {
		#covercredits {
			display: none;
		}
	}
		
	.inview {
		display: block;
	}
	
	span.display {
	font-family: "coluna-rounded", Coluna Rounded, sans-serif;
    font-style: normal;
    text-transform: uppercase;
	}