/* Color Tokens */
/includes/modules/wide-sub-banner.css

----------------------------------------------------------------------------


#primary {
	color: #00548B; /* $primary */
}

#secondary {
	color: #D0282E; /* $secondary */
}

#tertiary {
	color: #3F79BC; /* $tertiary */
}

#light {
	color: #EFECE4; /* $light */
}

#dark {
	color: #53616F; /* $dark */
}

#white {
	color: #FFFFFF; /* $white */
}

#text {
	color: #2B2E30; /* $text */
}
/* End Color Tokens */

/* Sub Banner Styles */
.sub-banner-area.wide {
	padding: 0;
}

.sub-banner-area.wide .banner-holder {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-align-items: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	min-height: 21.333em;
	position: relative;
}

.sub-banner-area.wide .banner-holder .banner-content {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-justify-content: flex-start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 4.222em 2.556em 4.222em 4.556em;
	background-color: rgba(110,32,111,0.8);
	position: absolute;
	bottom: 0;
	right: 0;
	width: 80%;
}



.sub-banner-area.wide .banner-holder .banner-content.v1 {
	background-color: rgba(0,84,139,0.8); /* alpha($primary,80%) */
}

.sub-banner-area.wide .banner-holder .banner-content.v2 {
	background-color: rgba(208,40,46,0.8); /* alpha($secondary,80%) */
}

.sub-banner-area.wide .banner-holder .banner-content.v3 {
	background-color: rgba(63,121,188,0.8); /* alpha($tertiary,80%) */
}

.sub-banner-area.wide .banner-holder .banner-content.v4 {
	background-color: rgba(161,14,69,0.8);
}

.sub-banner-area.wide .banner-holder .banner-content.v5 {
	background-color: rgba(0,109,102,0.8);
}

.sub-banner-area.wide .banner-holder .banner-content.v6 {
	background-color: rgba(224,178,146,0.8);
}

.sub-banner-area.wide .banner-holder .banner-content.v7 {
	background-color: rgba(110,32,111,0.8);
}

.sub-banner-area.wide .banner-holder .banner-content.v8 {
	background-color: rgba(133,196,70,0.8);
}

.sub-banner-area.wide .banner-holder .banner-content.v9 {
	background-color: rgba(255,202,56,0.8);
}

.sub-banner-area.wide .banner-holder .banner-content.v9 h1 {
	color: #3A4855;
}

.sub-banner-area.wide .banner-holder .banner-content.v10 {
	background-color: #78678F;
}

.sub-banner-area.wide .banner-holder .banner-content h1, .sub-banner-area.wide .banner-holder .banner-content h4 {
	font-size: 3.333em;
	font-weight: 600;
	color: #FFFFFF;
}

.sub-banner-area.wide .banner-holder .banner-image {
	position: relative;
	width: 100%;
	z-index: -1;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.sub-banner-area.wide .banner-holder .banner-image {
		height: 21.333em;
	}
}

.sub-banner-area.wide .banner-holder .banner-image img {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-size: cover;
	background-position: top center;
	background-repeat: no-repeat;
}
/* End Sub Banner Styles */

/* Sub Banner Styles [Green Theme] */
.green-theme.sub-banner-area.wide .banner-holder .banner-content {
	background-color: rgba(0,109,102,0.89);
}

.recolor .sub-banner-area.wide .banner-holder .banner-content {
	background-color: #4773A7;
}
/* End Sub Banner Styles [Green Theme] */

/* Sub Banner [Careers Page] */
.careers .sub-banner-area.wide .banner-holder {
	min-height: 41em;
}

.careers .sub-banner-area.wide .banner-holder .banner-content {
	right: auto;
	left: 0;
	width: 66.667%;
	display: block;
	background-color: rgba(161,14,69,0.8);
	padding: 2.5em 2.5em 2.5em 12.667em;
}

.careers .sub-banner-area.wide .banner-holder .banner-content h4 {
	color: #FFFFFF; /* $white */
	font-size: 3em;
	line-height: 1;
}

.careers .sub-banner-area.wide .banner-holder .banner-content h5, .sub-banner-area.wide .banner-holder .banner-content h5 {
	color: #FFFFFF;
	font-size: 2em;
	font-weight: 300;
	margin: 0;
}
/* End Sub Banner [Careers Page] */

/* Responsive [1650px] */
@media screen and (max-width: 1650px) {
	.sub-banner-area.wide {
	}

	.careers .sub-banner-area.wide .banner-holder .banner-content {
		padding: 2.5em 2.5em 2.5em 10em;
	}
}
/* End Responsive [1650px] */

/* Responsive [1500px] */
@media screen and (max-width: 1500px) {
	.sub-banner-area.wide {
	}

	.sub-banner-area.wide .banner-holder .banner-content {
		padding: 5.556em 5.667em 6.111em 6.667em;
		width: 85%;
	}
}
/* End Responsive [1500px] */

/* Responsive [1200px] */
@media screen and (max-width: 1200px) {
	.sub-banner-area.wide {
	}

	.sub-banner-area.wide .banner-holder .banner-content {
		padding: 2em 2.5em 2.5em 2.5em;
		width: 100%;
	}

	.sub-banner-area.wide .banner-holder {
		min-height: 30em;
	}

	@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
		.sub-banner-area.wide .banner-holder .banner-image {
			min-height: 30em;
		}
	}

	.careers .sub-banner-area.wide .banner-holder {
		min-height: 30em;
	}

	.careers .sub-banner-area.wide .banner-holder .banner-content {
		padding: 2.5em;
	}

	.careers .sub-banner-area.wide .banner-holder .banner-content h4 {
		font-size: 2.5em;
	}

	.careers .sub-banner-area.wide .banner-holder .banner-content h5 {
		font-size: 1.778em;
	}
}
/* End Responsive [1200px] */

/* Responsive [1000px] */
@media screen and (max-width: 1000px) {
	.sub-banner-area.wide {
	}

	.careers .sub-banner-area.wide .banner-holder .banner-content {
		width: 75%;
	}
}
/* End Responsive [1000px] */

/* Responsive [800px] */
@media screen and (max-width: 800px) {
	.sub-banner-area.wide {
	}

	.sub-banner-area.wide .banner-holder .banner-content {
		padding: 1em 1.5em 1.5em 1.5em;
	}

	.sub-banner-area.wide .banner-holder .banner-content h1 {
		font-size: 2.5em;
	}

	.sub-banner-area.wide .banner-holder {
		min-height: 20em;
	}

	@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
		.sub-banner-area.wide .banner-holder .banner-image {
			min-height: 20em;
		}
	}

	.careers .sub-banner-area.wide .banner-holder {
		min-height: 25em;
	}

	.careers .sub-banner-area.wide .banner-holder .banner-content {
		width: 100%;
		padding: 2.5em 1.5em;
	}
}
/* End Responsive [800px] */

/* Responsive [600px] */
@media screen and (max-width: 600px) {
	.sub-banner-area.wide {
	}

	.careers .sub-banner-area.wide .banner-holder {
		min-height: 20em;
	}

	.careers .sub-banner-area.wide .banner-holder .banner-content h4 {
		font-size: 2em;
	}

	.careers .sub-banner-area.wide .banner-holder .banner-content h5 {
		font-size: 1.556em;
	}

	.careers .sub-banner-area.wide .banner-holder .banner-content {
		padding: 1.5em;
	}
}
/* End Responsive [600px] */

/* Responsive [450px] */
@media screen and (max-width: 450px) {
	.sub-banner-area.wide {
	}

	.sub-banner-area.wide .banner-holder .banner-content.v7 {
		width: 100%;
	}

	.sub-banner-area.wide .banner-holder {
		min-height: 15em;
	}

	@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
		.sub-banner-area.wide .banner-holder .banner-image {
			min-height: 15em;
		}
	}

	.careers .sub-banner-area.wide .banner-holder {
		min-height: 15em;
	}

	.sub-banner-area.wide .banner-holder .banner-image {
	}

	.sub-banner-area.wide .banner-holder .banner-content h1 {
		font-size: 2em;
	}

	.careers .sub-banner-area.wide .banner-holder .banner-content h4 {
		font-size: 1.75em;
	}

	.careers .sub-banner-area.wide .banner-holder .banner-content h5 {
		font-size: 1.444em;
	}
}
/* End Responsive [450px] */
