/* BANNER DEACTIVATED */

#featureddates-cont {display: none;}

/*
#featureddates-cont {
	position: relative;
	display: flex;
	flex-flow: column nowrap;
	justify-content: flex-start;
	width: calc(100vw - 30px);
	margin: 0 auto;
	overflow: hidden;
	z-index: 5;
}
*/

.featprfmnce {
	position: relative;
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	width: 100%;
	padding: 2vw 3vw;
	margin-bottom: 15px;
	font-family: "coluna-rounded", Coluna Rounded, sans-serif;
	color: #fff;
	line-height: .85;
	-webkit-box-sizing: border-box;
	-mox-box-sizing: border-box;
	box-sizing: border-box;
	/* remove following for text-height versions */
	height: calc(50vh - 45px);
	overflow: hidden;
}

.prfm,
.featprfmlink {
	position: relative;
	display: flex;
	flex-flow: column nowrap;
	justify-content: flex-end;	
}

.prfm.prfmcity,
.prfm.prfmdates {
	border-left: 1px dashed #fff;
    padding-left: 3vw;
}

.featprfmlink {
	order: 4;
	width: 25%;
	border-left: 1px dashed #fff;
    padding-left: 3vw;
}

.featprfmlink a {
	color: #fff;
	margin-bottom: -.4vw;
}

span.prfmarrow {
	background-image: url('../img/rightarrow-wht.svg');
	background-size: auto 100%;
	background-position: left center;
	background-repeat: no-repeat;
	display: inline-block;
	width: 100%;
	margin-left: 0;
	-webkit-transition: 300ms;
	-moz-transition: 300ms;
	transition: 300ms;
}

.featprfmlink:hover span.prfmarrow {
	margin-left: 1vw;
	-webkit-transition: 1000ms;
	-moz-transition: 1000ms;
	transition: 1000ms;
}

.prfmvenue:before,
.prfmcity:before,
.prfmdates:before {
	position: absolute;
	top: 0;
	left: 0;
	font-family: "IBM Plex Mono","trianon_caption_extralight_reg", serif;
	font-size: 10px;
	color: #fff; 
}

.prfmvenue:before {
	content: "Venue";
}

.prfmcity:before {
	content: "Location";
	left: 3vw;
}

.prfmdates:before {
	content: "Dates";
	left: 3vw;
}


/* Configuration */

	.prfm {
		font-size: 5.7vw;
		padding-top: 1.4vw;
		padding-right: 3vw;
	}

	.prfm.prfmvenue {
		width: 25%;
	}

	.prfm.prfmcity {
		width: 25%;
	}

	.prfm.prfmdates {
		width: 25%;
	}

	.featprfmlink {
		font-size: 5.7vw;
		padding-top: 1.4vw;
	}

	.featprfmlink span.prfmarrow {
		height: 4.7vw;
		margin-top: -.6vw;
	}
	
	/* Public Theatre NYC */

	.featprfmnce.public {
		order: 1;
		background-color: #562db9;
	}
	
	/* MDC Miami */

	.featprfmnce.miami {
		order: 1;
		background-color: #ec3300;
	}

	
	/* Media Queries */
	
	@media (orientation: landscape) and (max-height: 1000px) { 
		.prfm, .featprfmlink {
			font-size: 10vh;
			padding-top: 2vh;
		}
		.featprfmlink span.prfmarrow {
			height: 8vh;
			margin-top: -.6vh;
		}
	}
	
	@media (max-width: 1020px) {
		#featureddates-cont {margin-top: 15px;}
		
		.featprfmnce {
			position: relative;
			display: flex;
			flex-flow: row wrap;
		}

		.prfm.prfmvenue {
			width: 100%;
			padding-right: 0;
    		font-size: 11vw;
    		padding-bottom: 3vw;
		}
		
		.prfmvenue:before {
			left: 3vw;
		}

		.prfm.prfmcity {
			width: 31%;
			padding-right: 0;
		}

		.prfm.prfmdates {
			width: 31%;
			padding-right: 0;
		}
	}
	
	@media (max-width: 1020px) and (max-height: 1000px) {
		#featureddates-cont {
			margin-bottom: 0;
		}
		.featprfmnce {
			height: 48vw;
		}
		.featprfmnce.miami {
			margin-bottom: 0;
		}
	}
	
	@media (max-width: 549px) and (orientation: portrait) {
		#featureddates-cont {
			width: 94vw;
			margin-top: 3vw;
		}
		.featprfmnce {
			flex-flow: column nowrap;
			height: 106vh;
			padding: 0 4vw;
			margin-bottom: 3vw;
		}
		
		.featprfmnce.public {
			height: 110vh;
		}
		
		.prfm {
			font-size: 14vw;
			padding-top: 7vw;
			margin-top: 5vw;
		}
		.prfm.prfmvenue{
			font-size: 21vw;
			border-bottom: 1px dashed #fff;
			border-left: 0;
		}
		.prfm.prfmcity,
		.prfm.prfmdates {
			margin-top: 5vw;
			border-left: 0;
			border-bottom: 1px dashed #fff;
			padding-left: 0;
			padding-bottom: 4vw;
			width: 100%;
		}
		.prfmvenue:before,
		.prfmcity:before,
		.prfmdates:before {
			left: 0;
		}
		.featprfmlink {
			font-size: 14vw;
			border-left: none;
			padding-left: 0;
			position: absolute;
			bottom: 0;
			width: 100%;	
		}
		.featprfmlink a {
			display: block;
		}
		.featprfmlink span.prfmarrow {
			background-size: 100% auto;
			height: 32vw;
			margin-top: -7vw;
			margin-bottom: 3vw;
			width: calc(95vw - 30px);
		}
		
	}