/* Design Styling */

.promo-box-component.design0 {
	background-color: #ffffff;
	border-radius: 8px;
	overflow: hidden;		
}

.promo-box-component.design0 .media-container {
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}

.promo-box-component.reverse.design0 .media-container {
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}


.promo-box-component.design1, .promo-box-component.reverse.design1 {

	border-left: 1px solid #e4e4e4;
	border-right: 1px solid #e4e4e4;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	border-radius: 8px;
	overflow: hidden;		
}



.promo-box-component.design1 .text-container, .promo-box-component.reverse.design1 .text-container {
	color: #252525;
	background-color: #ffffff;
}		

.promo-box-component.design2, .promo-box-component.reverse.design2 {

	border-radius: 8px;
	overflow: hidden;		
}	

.promo-box-component.design2 .text-container, .promo-box-component.reverse.design2 .text-container {
	color: #ffffff;
	background-color: #252525;
}		

.promo-box-component.design3, .promo-box-component.reverse.design3 {

	border-radius: 8px;
	overflow: hidden;			
}	

.promo-box-component.design3 .text-container, .promo-box-component.reverse.design3 .text-container {
	color: #ffffff;
	background-color: #002a5c;
}	

.promo-box-component.design4, .promo-box-component.reverse.design4 {
	border-radius: 8px;	
	overflow: hidden;		
}

.promo-box-component.design4 .text-container, .promo-box-component.reverse.design4 .text-container {
	color: #252525;
	/* background-color: #fff9e6; */
}		

/* Stack location border and radius adjustments */			
.promo-box-component.design0.first-stack .media-container {border-bottom-left-radius: 0px;}
.promo-box-component.design0.middle-stack .media-container {border-top-left-radius: 0px;border-bottom-left-radius: 0px;}
.promo-box-component.design0.last-stack .media-container {border-top-left-radius: 0px}
.promo-box-component.reverse.design0.first-stack .media-container {border-bottom-right-radius: 0px;}
.promo-box-component.reverse.design0.middle-stack .media-container {border-top-right-radius: 0px;border-bottom-right-radius: 0px;}
.promo-box-component.reverse.design0.last-stack .media-container {border-top-right-radius: 0px}
.promo-box-component.design1.first-stack,.promo-box-component.design2.first-stack,.promo-box-component.design3.first-stack,.promo-box-component.design4.first-stack {border-bottom-left-radius: 0px;border-bottom-right-radius: 0px;border-bottom: 0px;}
.promo-box-component.design1.middle-stack,.promo-box-component.design2.middle-stack,.promo-box-component.design3.middle-stack,.promo-box-component.design4.middle-stack {border-radius:0px;border-top:0px;border-bottom:0px}
.promo-box-component.design1.last-stack,.promo-box-component.design2.last-stack,.promo-box-component.design3.last-stack,.promo-box-component.design4.last-stack {border-top-left-radius: 0px;border-top-right-radius: 0px;border-top: 0px;}			
.promo-box-component.reverse.design1.first-stack,.promo-box-component.reverse.design2.first-stack,.promo-box-component.reverse.design3.first-stack,.promo-box-component.reverse.design4.first-stack {border-bottom-right-radius: 0px;border-bottom-left-radius: 0px;border-bottom: 0px;}	
.promo-box-component.reverse.design1.middle-stack,.promo-box-component.reverse.design2.middle-stack,.promo-box-component.reverse.design3.middle-stack,.promo-box-component.reverse.design4.middle-stack {border-radius:0px;border-top: 0px;}
.promo-box-component.reverse.design1.last-stack,.promo-box-component.reverse.design2.last-stack,.promo-box-component.reverse.design3.last-stack,.promo-box-component.reverse.design4.last-stack {border-top-right-radius: 0px;border-top-left-radius: 0px;border-top: 0px;}



.promo-box-component .text-inner-padding {
align-self:center

}

.promo-box-component  .text-container {
min-height:29rem;
display:flex;
flex-direction:row;
padding: 30px;	

}

.promo-box-component .promo-header h3 {
	margin-top: 10px;
	font-weight:bold;		
}

/* .promo-box-component .media-container a {
	font-family: "Font Awesome 5 Pro"; content: "\f099";
	position: absolute;
	z-index: 5;
	left: 50%;
	top: 50%;
	transform: translate( -50%, -50% );
	color:white;
} */

.promo-box-component .media-container a {
	position: absolute;
	z-index: 5;
	left: 50%;
	top: 50%;
	transform: translate( -50%, -50% );
	/*color:white;*/
    width: 100%;
    height: 100%;
}

/* video icon overlay style */	

.promo-box-component .media-container a::before {
    content: url(/images/youtube-play-red.svg);
	position: absolute;
	z-index:5;	
	left: 50%;
	top: 50%;
	transform: translate( -50%, -50% );
	width: 80px;
	opacity: .9;
	

}
.promo-box-component .media-container:hover a::before {
	    content: url(/images/youtube-play-red.svg);
		opacity: 1;

}

.promo-box-component .media-container i.far.fa-play-circle.fa-7x {
    display: none;
}

/*.promo-box-component .media-container a:hover {
	color:#fec635;
}*/

/* button styles */			
.promo-box-component .text-container .btn {
	color: #000;
	background-color: #ffca2c;
	border-color: #ffc720;
	font-size: 18px;
	margin-top: 15px;
}

.promo-box-component .text-container .btn:hover {
	color: #000;
	background-color: #ffc107;
	border-color: #ffc107;
}	

/* Icon Margins */

.promo-box-component a.btn span  {
	margin-right: 0.3em;	
}

/* Desktop Behavior */

@media screen and (min-width: 768px) {
	.promo-box-component  {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;

		-ms-flex-direction: row;
		flex-direction: row;
		align-items: stretch;
	}


	.promo-box-component.reverse.design4 > .text-container {
		border-left: solid 12px #fec52d;
		border-right:0;
	}

	.promo-box-component.design4 > .text-container {
		border-right: solid 12px #fec52d;
		border-left:0;
	}			

	.promo-box-component .text-container {
		width: 50%;
	}

	.promo-box-component .text-container.sixty-forty {
		width: 60%;
	}			

	.promo-box-component .text-container.forty-sixty {
		width: 40%;
	}

	.promo-box-component .text-container.thirty-seventy {
		width: 30%;
	}			

	.promo-box-component.reverse {
		flex-direction: row-reverse;
	}	

	.promo-box-component .media-container {
		width: 50%;
		height: auto;
		min-height: 40rem;
	}	

	.promo-box-component .media-container.forty-sixty {
		width: 60%;
	}	

	.promo-box-component .media-container.sixty-forty {
		width: 40%;
	}			


	/* arrow indicators */		
	.promo-box-component.reverse.design0 .media-container::after, .promo-box-component.reverse.design1 .media-container::after, .promo-box-component.reverse.design2 .media-container::after, .promo-box-component.reverse.design3 .media-container::after  {
		position: absolute;
		right: -40px;
		left: inherit;	
		bottom: 45%;
		width: 4rem;
		height: 4rem;
		transform: translateX(-50%) rotate(45deg);
		content: '';
		box-shadow: 1px 1px 3px rgb(51 51 51 / 43%);
	}
	.promo-box-component.design0 .media-container::after, .promo-box-component.design1 .media-container::after, .promo-box-component.design2 .media-container::after, .promo-box-component.design3 .media-container::after {
		position: absolute;
		left: 0;
		bottom: 45%;
		width: 4rem;
		height: 4rem;
		-webkit-transform: translateX(-50%) rotate(45deg); 
		transform: translateX(-50%) rotate(45deg);
		content: '';
		box-shadow: 1px 1px 3px rgb(51 51 51 / 43%);
	}	
	
.promo-box-component.design1 .media-container {
	right: -1px;
}
.promo-box-component.reverse.design1 .media-container {
	right: 0;
}	
}

/* arrow colors */
.promo-box-component.reverse.design0 .media-container::after, .promo-box-component.design0 .media-container::after, .promo-box-component.reverse.design1 .media-container::after, .promo-box-component.design1 .media-container::after {background-color:#ffffff}
.promo-box-component.reverse.design2 .media-container::after, .promo-box-component.design2 .media-container::after {background-color:#252525}	
.promo-box-component.reverse.design3 .media-container::after, .promo-box-component.design3 .media-container::after {background-color:#002a5c}


.promo-box-component .media-container {
	position: relative;
	min-height: 29rem;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	overflow: hidden;
}

.full-width .promo-box-component  .media-container {
	position: relative;
	height: 60rem;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	overflow: hidden;
}

/* link color change for darker design backgrounds */
.promo-box-component.design2 a, .promo-box-component.design3 a {
	color: #96daff;
}

/* Mobile Behavior */		
@media only screen and (max-width : 768px){
	
	.promo-box-component  {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-direction: column-reverse;
		flex-direction: column-reverse;
		
	}

	.promo-box-component {
		margin-bottom: 30px;
	}

	.promo-box-component .text-container {
		padding: 30px;
	}

	.promo-box-component > .promo-header h3 {
		margin-top: 0px;
	}

	.promo-box-component.design1 {
		border-top-right-radius: 8px;
		border-right: 1px solid #e4e4e4;
	}

	.promo-box-component > .media-container::after {
		box-shadow: -1px -1px 3px rgb(51 51 51 / 43%);
	}

	.promo-box-component.reverse.design0 .media-container::after, .promo-box-component.design0 .media-container::after {
		background-color: #f8f8f8;
	}	

	.promo-box-component.reverse.design0 .media-container::after, .promo-box-component.design0 .media-container::after {
		background-color: #f8f8f8;

	}

	.promo-box-component.design0 .text-container {
		padding: 30px;
		background-color: #f8f8f8;
		/*border-top-right-radius: 8px;*/
		/*border-top-left-radius: 8px;*/
	}
	
	.promo-box-component .text-container {
		min-height: auto;}

	.promo-box-component.design2 {
		border-top-right-radius: 8px;
	}	

	.promo-box-component.design3 {
		border-top-right-radius: 8px;
	}			

	.promo-box-component  .media-container::after {
		position: absolute;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		bottom: -2rem;
		width: 4rem;
		height: 4rem;
		-webkit-transform: translateX(-50%) rotate(45deg);
		transform: translateX(-50%) rotate(45deg);
		content: '';
	}
	.promo-box-component.reverse.design4 > .text-container, .promo-box-component.design4 > .text-container {

		border-top: solid 12px #fec52d;

	}	

	.promo-box-component.reverse.design1.last-stack, .promo-box-component.reverse.design2.last-stack, .promo-box-component.reverse.design3.last-stack, .promo-box-component.reverse.design4.last-stack {
		border-top-right-radius: 8px;
		border-top-left-radius: 8px;
		border-top: 0px;
	}


	.promo-box-component.reverse.design1.middle-stack, .promo-box-component.design1.middle-stack, .promo-box-component.reverse.design1.last-stack, .promo-box-component.design1.last-stack {
		border-top: 1px solid #e4e4e4;
	}

	.promo-box-component.design1.first-stack, .promo-box-component.design2.first-stack, .promo-box-component.design3.first-stack, .promo-box-component.design4.first-stack,.promo-box-component.design1.middle-stack, .promo-box-component.design2.middle-stack, .promo-box-component.design3.middle-stack, .promo-box-component.design4.middle-stack, .promo-box-component.design1.last-stack, .promo-box-component.design2.last-stack, .promo-box-component.design3.last-stack, .promo-box-component.design4.last-stack, .promo-box-component.reverse.design1.first-stack, .promo-box-component.reverse.design2.first-stack, .promo-box-component.reverse.design3.first-stack, .promo-box-component.reverse.design4.first-stack,.promo-box-component.reverse.design1.middle-stack, .promo-box-component.reverse.design2.middle-stack, .promo-box-component.reverse.design3.middle-stack, .promo-box-component.reverse.design4.middle-stack, .promo-box-component.reverse.design1.last-stack, .promo-box-component.reverse.design2.last-stack, .promo-box-component.reverse.design3.last-stack, .promo-box-component.reverse.design4.last-stack		 {
		border-radius: 8px;
	}

	.promo-box-component.design0 .media-container, .promo-box-component.design2 .media-container, .promo-box-component.design3 .media-container, .promo-box-component.design4 .media-container {
		border-top-left-radius: 0px;


	}		
	
	.promo-box-component.design1.first-stack, .promo-box-component.design1.middle-stack {
		border-bottom: 1px solid #e4e4e4;
	}
}

/*editor styles */

.stk-component-editor-wrapper.horizontal-card img {
    float: right;
    max-width: 250px;
}
.stk-component-editor-wrapper.horizontal-card img.yes {
    float: left;
    max-width: 250px;
	margin-right:30px;
	margin-left: 20px;
}