* {
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}

html {
	height: 100%;
}

body {
    min-height: 100%;
    font-family: 'Open Sans', 'Arial', sans-serif;
    background-color: #f3f3f3;
}

a {
	color: #1e96ff;
	outline-style: none;
}

p {
	margin-bottom: 10px;
}

.page {
	max-width: 1200px;
	margin: 0px auto;
	background-color: white;
	border-bottom-right-radius: 3px;
	border-bottom-left-radius: 3px;
	min-height:90vh;
}

.header {
	text-align: center;
}

.header img {
	width: 100%;
	display: block;
}

.banner.pkportrait,
.banner.pksquare,
.banner.pksquarish {
	max-height: 300px;
	width: auto !important;
	display: inline-block !important;
	margin-top: 20px;
	margin-bottom: 20px;
}

.banner.pkitiny,
.banner.pkismall,
.banner.pkimedium {
	width: auto !important;
	display: inline-block !important;
	margin-top: 20px;
}

.header .banner {
	
}

.header .mobilebanner {
	display: none;
}

.header .titlecontainer {
	padding: 20px 10px;
}

.header a {
	
}

.titlecontainer .nobannertitle {
	font-size: 50px;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: -.1em;
	text-shadow: 1px 1px 1px #dddddd;
}

.tabs {
	background-color: white;
	text-transform: uppercase;
	border-bottom: 1px solid #dddddd;
}

.tabs ul {
	list-style-type: none;
}

.tabs li {
	display: inline-block;
	font-size: 20px;
	font-weight: bold;
	letter-spacing: -.05em;
	padding: 10px;
	border-right: 1px solid #dddddd;
	border-top: 1px solid #dddddd;
	background-color: #eeeeee;
}

.tabs li:hover {
	background-color: #f3f3f3;
}

.tabs li a {
	color: black;
	text-decoration: none;
}

.tabs li a:hover {
	
}

.selectedtab {
	background-color: white !important;
	border-bottom: 1px solid white;
	margin-bottom: -1px;
}

.selectedtab:hover {
	background-color: white !important;
}

.selectedtab a {
	
}

.content {
	padding: 30px;
	padding-bottom: 70px; 
}

.eventscontent {
	margin-bottom: 20px;
}

.eventscalendar {
	margin-top: 20px;
}

/* ****** */
/* Footer */
/* ****** */
.footer {
	position: fixed;
	bottom: 0px;
	left: 0px;
	width: 100%;
	padding: 10px;
	text-align: center;
	border-top: 1px solid #cccccc;
	background-color: white;
	box-sizing: border-box;
	
}

.footerwrap {
	
}

.footer a {
	color: inherit;
}

.footericons {
	margin-right: 10px;
	display: inline-block;
}

.footericon {
	height: 20px;
	vertical-align: bottom; 
}

.copyright {
	white-space: nowrap;
	line-height: 10px;
	display: inline-block;
}

.powered {
	white-space: nowrap;
	display: inline-block;
	margin-left: 10px;
}

.footerlogo {
	height: 22px;
	vertical-align: bottom;
}

.upcomingshowsheader {
	background-color: #222222;
	color: white;
	padding: 5px;
	font-weight: bold;
}

.organizerdetails {
	text-align: center;
	padding-top: 20px;
}

.organizer-name {
	font-weight: bold;
	font-size: 1em;
}

.no-banner-name {
	font-size: 2em;
	margin-top: 20px;
}

.venuedetails {
	
}








/* ------------- */
/* MEDIA QUERIES */
/* ------------- */
@media only screen and (min-width : 0px) and (max-width : 568px) { 
/* MOBILE DEVICE */

	html, body {
		background: none;
	}

	.page {
		box-shadow: none;
	}

	.tabs li {
		border-right: 0px solid white;
		display: block;
		text-align: center;
	}
	
	.tabs li:hover {
		background-color: inherit;
	}
	
	.selectedtab {
		background-color: white;
		margin-bottom: 0px;
	}
	
	.selectedtab:hover {
		background-color: white !important;
	}
	
	.header .banner {
		display: none !important;
	}
	
	.header .mobilebanner {
		display: block;
	}
	
	.mobilebanner.pkportrait,
	.mobilebanner.pksquare,
	.mobilebanner.pksquarish {
		max-height: 200px;
		width: auto !important;
		display: inline-block !important;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	
	.mobilebanner.pkitiny,
	.mobilebanner.pkismall {
		width: auto !important;
		display: inline-block !important;
	}
	
	.eventscontent {
		margin: 30px;
	}
	
	.content {
		padding: 10px;
		padding-bottom: 70px;
	}
	
	.footer {
		font-size: .9em;
		padding: 5px;
	}
	
	.footericons {
		margin-right: 10px;
	}
	
	.powered {
		margin-left: 0px;
	}
	
	.venuedetails {
		text-align: center;
		margin-bottom: 5px;	
	}
	
}

.callout {
	background-color:black;
	color: white;
	text-align: right;
	padding-right: 10px;
	font-size: 10px;
	font-weight: bold;
}

.callout a {
	color: white;
	letter-spacing:-0.1em;
	font-weight: bold;
	font-size: 15px;
}





/* ****** */
/* Series */
/* ****** */
.seriescontent {
	display: grid;
	font-family: 'Open Sans', sans-serif;
	color: #222222;
	grid-template-columns: 1fr .5fr;
  	grid-template-areas: "info tickets";
  	grid-gap: 20px;
}

.seriesinfo {
	grid-area: info;
}

.seriestickets {
	grid-area: tickets;
}

.seriestitle {
	font-size: 40px;
	margin-bottom: 5px;
	font-family: 'Roboto', sans-serif;
	font-weight: bold;
	letter-spacing: -.03em;
}

.seriesinfo .eventscontent {
	line-height: 1.6em;
}

.seriesinfo ul { padding-left: 1.2em; }

.seriesvenue {
	background-color: #f3f3f3;
	padding: 20px;
	display: grid;
	grid-template-columns: 1fr 2fr;
	align-items: center;
}

.seriesvenue img {
	height: 50px;
}

.seriesaddresstop {
	font-weight: bold;
}


@media only screen and (max-width: 600px) {

.seriescontent {
	grid-template-columns: 1fr;
	grid-template-areas: 
		"tickets"
		"info";
}

.eventscontent {
	margin: 5px;
}

}





/* *************** */
/* Overlay Message */
/* *************** */
.msgoverlay {
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: rgba( 0, 0, 0, .8 );
	z-index: 100;
	text-align: center;
	cursor: pointer;
	padding: 10px;
	box-sizing: border-box;
	color: #222222;
}

.msgoverlaydialog {
	margin: 10px auto;
	margin-top: 100px;
	background-color: white;
	display: inline-block;
	max-width: 400px;
	text-align: center;
	padding: 30px 40px 40px 40px;
	border-radius: 1px;
	box-shadow: 3px 3px 20px black;
	box-sizing: border-box;
}

.msgoverlaytitle {
	font-weight: bold;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid #dddddd;
	font-size: 25px;
	font-family: 'Roboto', sans-serif;
}

.msgoverlaytext {
	line-height: 1.6em;
}

.msgbutton {
	margin-top: 20px;
}

.msgoverlay a {
	color: #1e96ff;
	text-decoration: underline;
}

a.button {
	font-size: 14px;
	font-weight: bold;
	letter-spacing: -.05em;
	line-height: normal;
	text-decoration: none;
	text-align: center;
	display: inline-block;
	outline-style: none;
	cursor: pointer;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

a.pinkbutton {
	background-color: #ea214f;
	color: #FFFFFF;
	padding: 5px 10px;
}

a.pinkbutton:hover {
	background-color: #f03a61;
}