/* Color Tokens */

.primary {
	color: #FF0009; /* $primary */
}

.secondary {
	color: #D7D7D7; /* $secondary */
}

.tertiary {
	color: #FFF212; /* $tertiary */
}

.light {
	color: #FEFEFE; /* $light */
}

.dark {
	color: #201E1E; /* $dark */
}

/* End Color Tokens */

/* Sub Banner Area */

.sub-banner-area {
	position: relative;
	text-align: center;
	padding: 3em 2%;
}

.sub-banner-area .banner-img {
}

.sub-banner-area img {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.sub-banner-area .banner-img img.default {
}

.sub-banner-area .info {
	position: relative;
	text-align: left;
	display: block;
}

.sub-banner-area .info > strong {
	font-size: 3.778em;
	position: relative;
	transform: translateY(.5em);
	transition: transform 1s ease 3.25s;
	text-transform: uppercase;
	font-weight: 900;
	line-height: 1;
}

.sub-banner-area .info p {
	margin: .5em auto;
	font-size: .9em;
	font-weight: 600;
}

.sub-banner-area .info .sub-title {
	display: -ms-flexbox;
	display: flex;
}

.es.sub-banner-area .info .sub-title {
	margin-top: 1em;
}

.sub-banner-area .info .sub-title em {
	text-transform: uppercase;
	font-style: normal;
	font-size: 2.556em;
	line-height: 1;
	text-align: right;
}

.sub-banner-area .info > strong:after {
	content: '';
	width: 40%;
	height: 3px;
	background-color: #FFF212;
	position: absolute;
	bottom: .21em;
}

.sub-banner-area .info .sub-title em span {
	display: block;
}

.sub-banner-area .info .sub-title strong {
	color: #FF0009; /* $primary */
	font-size: 6.333em;
	font-weight: 900;
	line-height: .8;
	text-transform: uppercase;
}

.sub-banner-area .info .info-tagline > strong:after {
	content: '';
	width: 40%;
	height: 3px;
	background-color: #FFF212;
	position: absolute;
	bottom: .21em;
}

/* End Sub Banner Area */

/* 800px Responsive */

@media screen and (max-width:800px) {
	.sub-banner-area {
		padding: 2em 2%;
	}

	.sub-banner-area h1, .sub-banner-area h2 {
		font-size: 2.5em;
	}
}

/* End 800px Responsive */

/* 650px Responsive */

@media screen and (max-width:650px) {
	.sub-banner-area {
		padding: 1.25em 2%;
	}

	.sub-banner-area h1, .sub-banner-area h2 {
		font-size: 2em;
	}

	.sub-banner-area .info {
		display: table;
	}

	.sub-banner-area .info > strong:after {
		display: none;
	}

	.sub-banner-area .info > strong {
		font-size: 2.75em;
	}

	.sub-banner-area .info .sub-title em {
		font-size: 1.5em;
	}

	.sub-banner-area .info .sub-title strong {
		font-size: 4.33em;
	}
}

/* End 650px Responsive */
