.comicfont {
	font-family: ccbiffbamboom, sans-serif; 
}

.comicsmash {
	font-family: cc-smash, sans-serif;
}

.canadared {
	color: #ed3c13;
}

.team-section {
	min-height: 90vh;
}

.hero-image {
	height:90vh;
	width:100%;
	background:url(/images/hero-image-vertical-v2.webp);
	background-size:cover;
	background-position:center bottom;
}


.white-outline {
	text-shadow:   -3px -3px 0 #fff,
	 0   -3px 0 #fff,
	 3px -3px 0 #fff,
	 3px  0   0 #fff,
	 3px  3px 0 #fff,
	 0    3px 0 #fff,
	-3px  3px 0 #fff,
	-3px  0   0 #fff;
}

.tagline {
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90vw;
  font-size: calc(1.625rem + 4.5vw);
 }

.premiere {
	opacity: 0;
	bottom: 0px;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
}

.white-glow {
	text-shadow: 0px 0px 4px #fff, 0px 0px 9px #fff, 0px 0px 12px #fff, 0px 0px 24px #fff
}

.shirt {
	width: 70%;
	transform: translate(-50%, -50%);
}

.shirt1 {
	top: 65%;left:25%;
}

.shirt2 {
	top: 41%;left:50%;
}

.shirt3 {
	top: 65%;left:75%;
}

.shirt:hover {
	z-index: 9999;
}

div.desktop-wrapper {
	position: relative;
	padding-top: 25px;
	padding-bottom: 67.5%;
	height: 0;
}
div.desktop-wrapper iframe {
	box-sizing: border-box;
	background: url(/images/tv.webp) center center no-repeat;
	background-size: contain;
	padding: 3.4% 10.8% 18.6%;/* 11.9% 15.5% 14.8% */
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media (min-width: 576px) {
	.shirt {
		width: 50%;
	}
}


@media (min-width: 768px) {
	.tagline {
	  top: 36%;
	  left: 72%;
	  transform: translate(-50%, -50%);
	  width: 40vw;
	  font-size: 2rem;
	}
	
	
}


@media (min-width: 992px) {
	
	.hero-image {
		background:url(/images/hero-image-v2.webp);
		background-size:cover;
		background-position:center;
	}
	
	.tagline {
	  top: 36%;
	  left: 72%;
	  transform: translate(-50%, -50%);
	  width: 50vw;
	  font-size: 3rem;
	}
	
	.shirt {
		width: 45%;
	}
	
	.shirt1 {
		top: 55%;left:25%;
	}
	
	.shirt2 {
		top: 45%;left:50%;
	}
	
	.shirt3 {
		top: 55%;left:75%;
	}

}

@media (min-width: 1200px) {
	
	
	.shirt {
		width: 35%;
	}
	
	.shirt1 {
		top: 55%;left:25%;
	}
	
	.shirt2 {
		top: 49%;left:50%;
	}
	
	.shirt3 {
		top: 55%;left:75%;
	}
	
	
	

}