/* 	local.events.css */ 

body#events #content-container {
	padding-bottom: 0px; 
}

.page-banner {
	position: relative;
	height: inherit !important; 
	min-height: 250px; 
	background-color: transparent; 
	overflow: hidden; 
	padding: 100px 50px; 
}
	.page-banner h1 {
		display: block; width: 100%; color: #fff; text-align: center; 
		font-weight: normal; 
	}
	span.blur-bg-image {
		display: block; width: calc(100% + 40px); height: calc(100% + 40px); 
		overflow: hidden; 
		-webkit-filter: blur(15px); 
		filter: blur(15px);
		background-size: cover; 
		z-index: -1; 
		position: absolute; top: -20px; left: -20px; 
	}

#year-select {
	display: block; box-sizing: border-box; 
	width: 100%; 
	text-align: center; 
}

	#year-select ul {
		display: inline-block; box-sizing: border-box; padding: 0px; margin: 0px; 
		list-style-type: none; 
		font-size: 0;
	}
	
	#year-select ul li {
		font-size: 1rem; 
		width: 75px; height: 75px; 
		display: inline-block; box-sizing: border-box; 
		
		margin: 5px; 
		text-align: left; 
	}
	
	#year-select ul li a {
		display: block; width: 100%; height: 100%; 
		color: #fff; 
		cursor: pointer; 
		padding: 10px; 
		border: 2px solid #fff; 
		box-sizing: border-box; 
		-webkit-transition: all 500ms ease-in-out;
		transition: all 500ms ease-in-out;			
	}	
	
	#year-select ul li.active a,
	#year-select ul li a:hover {
		background-color: #cc922f; 
		border: 2px solid #cc922f; 
		color: #fff;
		font-weight: bolder; 
	}
	
	
#event-details {
	display: block; width: 100%; box-sizing: border-box; 
	list-style-type: none; font-size: 0px; 
	margin: 0px; padding: 0px; 
}

	#event-details > li {
		display: inline-block; width: 100%; clear: both; 
		background-color: #cdcdc3; 
		border-top: 5px solid #cc922f;
	}

	#event-details > li:first-child {
		border-top: 0px; 
	}

	#event-details > li:nth-child(even){
		background-color: #1e3957; 
		color: #fff !important; 
	}
	
	#event-details > li span.event-image {
		width: 300px; min-height: 300px; 
		padding: 20px; box-sizing: border-box; 
		background-color: #dedede; 
		text-align: center; 
	}
	#event-details > li span.event-image img {
		max-width: 100%; max-height: 325px; 
		font-size: 0; line-height: 100%; 
		-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,0.25);
		box-shadow: 0 0 20px 0 rgba(0,0,0,0.25);		
	}
	
	#event-details > li span.event-meta {
		color: #1f1f1f; 
		width: calc(100% - 300px); 
		padding: 40px 20px; 
	}
		#event-details > li:nth-child(even) .event-meta {
			color: #fff; 
		}

		span.event-meta span.event-notice {
			display: block; width: 100%; margin-bottom: 20px; 
		}
			span.event-meta span.event-notice img {
				max-width: 550px; 
			}

		span.event-meta h2.event-title {
			font-size: 1.8rem; line-height: 120%; 
			margin: 0px; padding: 0px; margin-bottom: 20px; 
		}
			#event-details > li:nth-child(even) .event-meta h2 {
				color: #fff; 
			}
		
		span.event-meta span.event-description {
			display: inline-block; min-height: 75px; 
			padding-bottom: 50px; 
		}
		
		span.event-meta dl {}
		span.event-meta dl dt {}
		span.event-meta dl dd {}
		
		span.event-meta dl dd i.button {
			font-style: normal; 
			margin: 0px; font-size: 0.95rem; cursor: pointer !important; 
		}
	

	#event-details > li.even span.event-image {
		float: right; 
	}


	@media all and (max-width: 680px){	
	
		.social-share {
			position: absolute; bottom: 385px; /* Force to Top - This needs to be dynamic for this page as the banner has variable height */ 
		}
		
	}
	
	
	@media all and (max-width: 640px){	
	
		#event-details li a {
			width: 100vw !important; 
		}

		#event-details li span.event-image,
		#event-details li span.event-meta {
			display: block; width: 100%; clear: both; 
		}
		
		
	}