@font-face {
	font-family: 'Gotham-Thin';
	src: url('../fonts/Gotham-Thin.eot');
	src: local('?'), url('../fonts/Gotham-Thin.woff') format('woff'), url('../fonts/Gotham-Thin.ttf') format('truetype'), url('../fonts/Gotham-Thin.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Gotham-Black';
	src: url('../fonts/Gotham-Black.eot');
	src: local('?'), url('../fonts/Gotham-Black.woff') format('woff'), url('../fonts/Gotham-Black.ttf') format('truetype'), url('../fonts/Gotham-Black.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Gotham-Ultra';
	src: url('../fonts/Gotham-Ultra.eot');
	src: local('?'), url('../fonts/Gotham-Ultra.woff') format('woff'), url('../fonts/Gotham-Ultra.ttf') format('truetype'), url('../fonts/Gotham-Ultra.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Gotham-Book';
	src: url('../fonts/Gotham-Book.eot');
	src: local('?'), url('../fonts/Gotham-Book.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Gotham-Medium';
	src: url('../fonts/Gotham-Medium.eot');
	src: local('?'), url('../fonts/Gotham-Medium.woff') format('woff'), url('../fonts/Gotham-Medium.ttf') format('truetype'), url('../fonts/Gotham-Medium.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Gotham-Light';
	src: url('../fonts/Gotham-Light.eot');
	src: local('?'), url('../fonts/Gotham-Light.woff') format('woff'), url('../fonts/Gotham-Light.ttf') format('truetype'), url('../fonts/Gotham-Light.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
:root {
	--color1: rgba(248,235,28,1.00);
	--color2: rgba(255,7,10,1.00);
}
a {
	text-decoration: none;
}
body{
	font-family: 'Gotham-Book', sans-serif;
	background-image: linear-gradient(30deg, rgb(0,0,0) 0%, rgb(66,66,66) 30%, rgb(20,20,20) 60%);
	margin: 0;
}
.h1 {
	font-size: 36px;
	color: #000000;
	font-weight: bold;
}
.h2 {
	font-size: 32px;
	color: var(--color1);
	font-weight: bolder;
}
.h3 {
	font-size: 26px;
	color: #999999;
}
.a4 {
	font-size: 22px;
	color: #FFFFFF;
}
.h4 {
	font-size: 24px;
	font-style: italic;
	color: #FFFFFF;
}
.header-image{
	width: 100%;
	height: auto;
	vertical-align: top;
}
.reg-now{
	background-color: #404040;
	padding: 0.6em;
	color: black;
	margin: 2em 0;
	text-align: center;
}
.reg-now a{
	display: inline-block;
	width: 500px;
	color: rgba(255,7,10,1.00);
	background-color: black;
	padding: 1em;
	font-size: 1.6em;
	font-weight: 500;
	margin: 0.5em;
}
.reg-now a:hover{
	color: black;
	background-color: transparent;
	background-image: linear-gradient(0deg, rgba(255,255,255,0.3) 60%, rgba(255,255,255,0.5) 65%, rgba(255,255,255,0.2));
}
.social-bar{
	background-color: #000000;
	color: white;
	font-size: 2.5em;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1em;
	flex-wrap: wrap;
}
.social-bar>div{
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 0;
}
.social-bar>div>div{
	height: 0.8em;
	white-space: nowrap;
}
.social-bar span{
	position: relative;
	top: -0.2em;
}
.social-bar img{
	width: 1.25em;
	height: 1.25em;
	vertical-align: middle;
}
.text{
	width: 85%;
	margin: 2em auto;
	color: white;
	}
.hero{
	width: 100%;
	aspect-ratio: 2467 / 1080;
	background-image: url("../images/hero-banner-2026.webp");
	background-size: cover;
	background-position: center;
}
.contentDropOff {
	color: var(--color2);
}

@media screen and (orientation:portrait){
	.hero{
		width: 100%;
		aspect-ratio: 1.05;
		background-position: calc(50% - 20px) center;
	}
}