.upper_logo_main{
	margin-top: -30vh;
}



.performanceHeaderB{
	display: flex;
}
.PArtist{
	grid-column-start: 1;
    grid-column-end: 7;
    display: grid;
}
.PTitle.yesAdditional{
	grid-column-start: 2;
	grid-column-end: 10;
	display: grid;
}
.PTitle.noAdditional{
	grid-column-start: 2;
	grid-column-end: 7;
	display: grid;
}
.PTitle, .pTitleAdditional{
	font-family: "JL_Impact-2019";
	grid-row-start: 2;
  display: grid;
   
}
.pAdditional{
	grid-row-start: 2;
    display: grid;
}
/*.PTitle h3{
	font-size: 2.2em;
	font-weight: normal;

}*/
.PTitle h5{
	    font-size: 1.2em;
    font-weight: normal;
    line-height: 1em;
/*    margin-bottom: calc(var(--outer-margin) / 2) !important;*/
}
.pArtist img{
/*	max-width: 50%;*/
	max-width: 100%;
	height: 4em;
}

.imgParent.activeParent{
	max-width: 95%;

}
.imgParent img{
	max-width: 100%;
}
.imgParent{
	transition: 0.3s max-width;
	/*	max-width: 0%;*/
	display: flex;
	align-items: center;
	background: black;
	justify-content: center;
	width: 100%;
	overflow: hidden;
	background-size: 100%;
	background-repeat: no-repeat;
}

.PTitle h5{
	margin: 0;
}

/*.textBlock{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}*/
.textBlock {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 0.5fr;
    font-size: 1.2em;
    line-height: 1.3em;
	}

.textBlock p{
	  grid-column-start: 1;
    grid-column-end: 5;

}
.textBlock .quote{
		margin-top: var(--newM);
		margin-bottom: var(--newM);
		/*grid-column-start: 2;
    grid-column-end: 4;*/
    display: grid;
    /* margin-left: calc(var(--outer-margin) /2); */
    font-size: 0.8em;
}
.performanceText{
	grid-column-start: 1;
    grid-column-end: 6;
    display: grid;
/*    column-gap: var(--col-gap);*/
    grid-template-columns: 1fr 1fr 1fr 0.5fr;
    background: var(--div-bg);
    margin: var(--newM);
    grid-row-start: 2;
    height: fit-content;
}
.intro{
		grid-column-start: 1;
		grid-column-end: 6;
}
.quote{
	/*grid-column-start: 2;
    grid-column-end: 6;*/
    display: grid;
    margin-left: var(--newM);
    font-size: 0.8em;
}
.quote h3{
	font-family: "JL_Impact-2019";
}
.quote h5{
	text-align: right;
    margin: 5 0 0 0;
    font-weight: normal;
    line-height: 1.3em;
    font-size: 1em;
    max-width: 50%;
    justify-self: flex-end;
    hyphens: none;
}
.address p:first-of-type{
	margin-top: calc(var(--newM)/2) !important;
}

.tickets{
	background: var(--div-bg);
/*    margin: calc(var(--outer-margin)/2);*/
    grid-column-start: 8;
    grid-column-end: 11;
    height: fit-content;
    font-size: 0.9em;
    /*position: sticky;
    top: 100px;*/
/*    grid-row-start: 2;*/
/*    margin-left: 5vw;*/
/*    margin-top: calc(var(--header-height) *-1 );*/
}
.tickets *{
	hyphens: none !important;
}
h2{
	margin: 5px 0px;
}
.dateTime{
	  display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: space-between;
    padding: 0 var(--newM) 0 var(--newM);
    column-gap: var(--outer-margin);
}
.dateTime *:not(.arrow){
	align-self: flex-end;
}
.dateTime h3{
	font-size: 1.9em;
  grid-row-start: 1;
  grid-column-start: 1;
}

.dateTime h5{
	margin: 0;
  font-weight: normal;
  font-size: 1.1em;
  line-height: 1.7em;
  grid-row-start: 1;
  grid-column-start: 2;
  text-align: center;
}

.performanceTickets p{
	margin: 0;
	white-space: nowrap;
}
.performanceTickets{
	font-family: "JL_Impact-2012";
  background: var(--div-bg);
  font-size: 1.2em;
  line-height: 1.4em;
  text-decoration: none;
  color: var(--highlight-color);
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  /* background: red; */
  text-align: right;
  
}

.performanceTickets .arrow{
	height: 0.8em;
	margin-right: 5px;
	align-self: center;
}
/*.intro{
	margin-bottom: calc(var(--outer-margin)/2);
}*/

.performanceTickets:hover svg.arrow{
  cursor: pointer;
  animation-name: bounce2;
  -moz-animation-name: bounce2;
}
.performanceTickets a{
	color: var(--highlight-color);
  	text-decoration: none;
}
/*.bio{
	background: white;
    grid-column-start: 6;
    grid-column-end: 10;
    margin: calc(var(--outer-margin)/2);
    padding: calc(var(--outer-margin)/2);
    font-size: 0.8em;
    line-height: 1.3em;
}*/
.trigger, .duration, .place, .language{
/*	font-size: 0.9em;*/
    line-height: 1.3em;
    margin: var(--newM);

}
.place{
	text-align: right;
}
.text p{
	margin: 0;
    
}

.bio p{
	margin-top: 0;
}
.credits p, .trigger p{
	margin: 0;
}
.credits strong, .bio strong, .trigger strong{
	font-family: "JL_Impact-2016";
}
.bio .web{
	text-align: right;
}

.credits p{
	margin-bottom: var(--newM);
}

.credits strong{
	white-space: normal;
    hyphens: none;
}
.bio a{
	color: var(--highlight-color);
}

.desktop .bio .web a, .desktop .bio a {
  display: inline-block;
  position: relative;
  color: var(--highlight-color);
  text-decoration: none;
}

.desktop .bio .web a::after, .desktop .bio a::after {
  content: '';
  position: absolute;
  width: 100%;
  transform: scaleX(1);
  height: 1px;
  bottom: 0px;
  left: 0;
  background-color: var(--highlight-color);
  transform-origin: bottom right;
  transition: transform 0.25s ease-out;
}

.desktop .bio .web a:hover::after, .desktop .bio a:hover::after {
  transform: scaleX(0);
  transform-origin: bottom right;
}
/*.credits{
	width: 70%;
    font-size: 0.8em;
    line-height: 1.3em;
    margin-top: calc(var(--outer-margin) * 2);
}*/
.video{
	grid-column-start: 1;
	grid-column-end: 10;
}
.bio{
	z-index: 2;
}
.tickets, .mainText{
	z-index: 2;

	
}

.soldout{
	border-bottom: 1px solid black;
  /* width: 60%; */
  margin-bottom: 1em;
  /* position: absolute; */
  background: rgba(255,0,0,0.5);
  width: 100%;
  height: inherit;
  display: grid;
  grid-column-start: 1;
  grid-row-start: 1;
  grid-column-end: 3;
}

.priceRange{
	grid-column-start: 1;
  grid-row-start: 2;
  margin: 0;
  /* padding: 0 var(--newM); */
  width: 100%;
  text-align: right;
  grid-column-start: 3;
  font-size: 1.1em;
  white-space: nowrap;
}

/*p, h3, h5{
	hyphens: auto;
}*/

.ticketC svg{
	height: calc(var(--outer-margin) * 2);
	
    margin: var(--newM);
    cursor: pointer;
}
.performanceText{
	position: sticky;
	position: -webkit-sticky;
	top: calc(var(--header-height) +  var(--newM));
/*	top: 0px;*/
}



.images figcaption{
	font-size: 0.8em;
	background: var(--div-bg);
	padding: 2px 5px 2px 5px;
}

.images.mobileHide figure{
	background-size: 100%;
  background-repeat: no-repeat;
}


 .video {
    position: relative;
     width: calc(100vw - var(--outer-margin));
     height: 0;
     padding-bottom: 56.25%;
/*     margin: calc(var(--outer-margin)/2);*/

 }
 .video iframe{
 	border: none;
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
 }

 figure{
 	margin: 0;
 }
  .ticketC p{
  	margin: 0;
  }
 .ticketC div{
/* 	max-width: 45%;*/
 }
 .ticketC .place{
 	max-width: 70%;
 }
 .ticketC h2{
 	line-height: 1.3em;
 	margin: 0px !important;
 }
 .ticketC{
 	display: flex;
 	justify-content: space-between;
 }

 .imgBigC{

   /* position: absolute;
    top: inherit;*/
    
 }
 .imgBig{
  	/*position: absolute;
  	left: 0%;
  	transform-origin: center;
  	transform: scale(1.0);
  	transition: 1s transform;
  	display: none;
  	filter: grayscale(50%);*/
/*  	z-index: 1000;*/
  }
   .imgBig.grow{
   	transform: scale(2.0);
   	z-index: 1000000;
   }



@media screen
and (max-width: 820px), (min-width:821px) and (orientation:portrait) {
	.vertStack.stickyMobile{
		position: sticky;
		position: -webkit-sticky;
		top: 0;

	}
	
	.header{
  	display: flex !important;
  }
	.simpleTextPdf{
		padding-left: var(--newM);
	}
	.performanceText{
		grid-row-start: 3;
	}
	.stickToHeader{
		grid-row-start: 1;
		grid-row-end: 3;
		grid-column-start: 1;
    grid-column-end: 9;

	}
	.textBlock .quote{
		margin-top: calc(var(--newM) * 1.5);
    margin-bottom: calc(var(--newM) * 1.5);
	}
	.performanceHeaderC{
		margin: 0 var(--newM);
    grid-column-start: 1;
    grid-column-end: 10;
    background: transparent;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    display: grid;
    padding: var(--newM);
    row-gap: var(--newM);
	}
	.desktopHide:not(.images.desktopHide){
		display: grid;
	}
	.mobileHide{
		display: none;
	}

	.PTitle{
		line-height: 1.1em;
		height: fit-content;
    justify-content: flex-end;
    align-items: flex-start;
    transition: 0.5s align-items, 0.5s height;
    grid-row-start: 1;
    text-align: right;
/*    row-gap: 0.1em;*/
/*    background: green;*/
	}
	.PTitle h3{
		font-size: 0.7em;
    font-weight: normal;
    line-height: 1.1em;
    height: fit-content;
    /* margin-top: auto; */
    transition: 0.5s margin-top;
    /* margin-bottom: calc(var(--outer-margin)/4); */
/*    background: red;*/
    display: inline-block;
  	align-self: flex-end;
	}

	.PTitle h3, .PTitle h5 {
	 /* display: inline-block;

	  position: absolute;*/
	  display: inline-block;
	  right: 0;
	  bottom: 0;
/*	  height: 1em;*/
/*	  background: red;*/
	  margin-bottom: -2px;
	  margin-top: 2px;
	}

/*	.PTitle h3::before, .PTitle h5::before {
	  display: inline-block;  
	  height: 100%;
	  vertical-align: baseline;
	  content: '';
	}*/
	.PTitle h5{
		margin-bottom: 0 !important;
	}
	.stickToHeader{
		margin-bottom: -5px;
	}
	.artistName.desktopHide{

		min-height: fit-content;
	    width: calc(100% + var(--outer-margin));
	    position: sticky;
	    position: -webkit-sticky;
	    grid-column-start: 1;
	    grid-column-end: 5;
	    grid-row-start: 1;
	    z-index: 10;
	    margin-left: calc((var(--outer-margin)/2)*-1);
	    margin-top: calc((var(--outer-margin)/2)*-1);
	    background: var(--div-bg);
	}

	.stuck .artistName.desktopHide{
		background: red;
	}
	.stickyMarker.stickyMobile{
		transition: 0.5s padding-top;
		align-items: flex-start;
		grid-row-start: 2;
		padding-top: 0px;
		padding-bottom: 0px;
		padding-right: 0px;
	}
	.stickToHeader{
/*		background: transparent !important;*/
	}
	.desktopHide.artistName img{
		padding: 0 var(--newM) calc(var(--outer-margin)/4) var(--newM);
		height: 5vh;
/*		padding-left: 0px;*/
/*		width: fit-content;*/
		max-width: 100%;
	}
	.desktopHide.artistName{
		display: flex !important;
		align-items: flex-start;
		justify-content: flex-start;
	}
	.images.desktopHide{
		display: flex;
	}
	.desktopHeaderPerformance{
		display: none;
	}
	.mobileHeaderPerformance{
		display: grid;
	}
	.pTitleC{
		position: sticky;
		position: -webkit-sticky;
    	top: 0;
	}
	.pTitleAdditional{
		font-size: 0.5em !important;
/*		line-height: 1.1em !important;*/
		margin-bottom: calc(var(--outer-margin)/2) !important;
	}
	.images img.activeImg{
/*		width: 90vw !important;*/
/*		transition: 0.5s width;*/
		width: auto;
	}
	.images img:not(.activeImg){
		width: auto;
	}
	.images img{

		height: 100%;

	}
	.images.desktopHide{
		width: 100%;
		display: flex;
		height: 33vh;
		overflow: hidden;
	}

	.clickGallery{
		position: absolute;
		width: inherit;
		height: inherit;
		top: 0;
		left: 0;
		z-index: 100;
		display: flex;
	}
	.clickPrev, .clickNext{
		width: 50%;
		height: 100%;
	}
	.caption:not(.visibleCaption){
		display: none;
	}

	.tickets.desktopHide, .credits, .bio.desktopHide{
		margin-top: var(--newM);
		margin-bottom: var(--newM);
		padding: 0 var(--newM);
	}
	.captions{
		background: var(--div-bg);
	}
	.caption p{
		margin: calc(var(--outer-margin)/4) var(--outer-margin)
	}
	.bio, .credits, .caption{
		font-size: 0.9em;
		line-height: 1.3em;
	}
	.credits{
		background: var(--div-bg);
		padding: var(--outer-margin);
	}
	.text.textBlock{
		background: var(--div-bg);
		padding: var(--newM) var(--outer-margin) var(--outer-margin) var(--outer-margin);
		font-size: 1.1em;
	}
	.accessibilityPDF{
		padding: var(--newM) var(--newM) 0 var(--newM);
	}
	.mainText, .intro{
		background: transparent !important;
		margin: calc(var(--outer-margin)/4) 0 ;
	}
	.bio.desktopHide{
		background: var(--div-bg);
		padding: var(--outer-margin);
	}
	.quote{
		grid-column-start: 1;
    grid-column-end: 6;
  }
  .quote h3{
  	font-size: 1em;
  }
  .quote h5{
  	max-width: 50%;
  	justify-self: flex-end;
  }
  .additionalInfo p{
  	margin: 0 0 var(--newM) 0;
  }
  .additionalInfo{
  	grid-column-start: 1;
    grid-row-start: 2;
    z-index: 10;
    line-height: 1.3em;
    
    font-size: 0.9em;
  	}
 	.trigger, .duration, .place, .language{
		font-size: 0.95em;
	}
	.header{
	}
	.video{
		margin-bottom: var(--newM);
	}
	.pAdditional p{
		margin: var(--newM) var(--newM) var(--newM) 0;
	}
	.textBlock .quote{
		margin-left: 0px;
	}
	.subtitleC{
      display: none;
  }
  .priceRange{
  	width: 100%;
  }
  .dateTime{
  	flex-wrap: wrap;
  	font-size: 1.1em;
    margin-top: calc(var(--outer-margin)/4);
  }
  .stackVideo{
  	min-height: 50%;
  	max-width: 100%;
  	box-sizing: border-box;
  	margin-bottom: 50px;
  }
  .video-block{
  	background-color: var(--div-bg);
    height: 100%;
    position: relative;
    width: 100%;
    /* margin-left: var(--outer-margin); */
    display: flex;
    align-items: center;
    justify-content: center;
    flex-grow: 1;
/*    display: flex;*/
    grid-column-start: 1;
    grid-column-end: 5;
  }
  .web a{
  	text-decoration: underline;
    text-underline-offset: 2px;
  }
  .gallery.desktopHide{
  	margin-bottom: -1px;
  }
  .artistName.desktopHide{
  	    z-index: 100;
  }

}

@media screen
and (min-width: 821px) and (orientation:landscape) {
/*	fix for safari*/
	/*body{
		overflow-y: scroll !important;
		overflow-x: hidden !important;
		position: absolute !important;
		width: 100% !important;
		height: 100% !important;
		top: 0px !important;
		left: 0px !important;
	}
	.subBody{
		position: relative !important;
		width: 100% !important;
		height: fit-content !important;
		top: 0px !important;
		left: 0px !important;
		overflow-y: scroll !important;
		box-sizing: border-box !important;
		overflow-x: hidden !important;
	}
	.header{
		position: fixed !important;
		width: 100%;
	}
	.aboutC{
		padding-top: calc(var(--header-height) + var(--outer-margin));
	}*/

	.header{
		  height: var(--header-height) !important;
	}
	:root{
		--header-height: calc(10vh - (var(--outer-margin)));
		--newM: calc(var(--outer-margin)/2);
	}


	.headerSectionRight{
		    padding-top: var(--outer-margin) !important;
	}
	.headerBG{
		display: none;
	}

	.performanceHeaderC{
		margin: 0 calc(var(--outer-margin)/2);
    grid-column-start: 1;
    grid-column-end: 11;
    background: var(--div-bg);
    grid-template-columns: 1fr 1fr 1fr 0.5fr 0.5fr 1fr 1fr 1fr;
    display: grid;
    padding: var(--newM);
    row-gap: var(--newM);
	}
	.desktopHide{
		display: none !important;
	}
	.mobileHide{
		display: grid;
	}
	.PTitle h3{
		font-size: 2em;
		font-weight: normal;
		line-height: 1em;

	}
	.pTitle{
		row-gap: calc(var(--newM)/2);
	}
	.desktopHeaderPerformance{
		display: grid;
	}
	.mobileHeaderPerformance{
		display: none;
	}
	.images{
		position: relative;
    grid-row-start: 2;
    grid-row-end: 2;
    grid-column-start: 4;
    grid-column-end: 8;
    height: fit-content;
    /* z-index: 0; */
    margin: 5vh var(--newM) var(--newM) var(--newM);
	}

	
	.images figure{
		margin-bottom: 10vh;
	}
	.images figure:not(.images figure:first-of-type){
		margin-top: 10vh;
	}
	.images img{
		max-width: 100%;
		height: auto;
		transform-origin: center;
		transition: 1s transform;
		transform:scale(1);
		position: relative;
		cursor: zoom-in;
	}

	.images img.grow{
		transform:scale(2);
/*		z-index: 1000;*/
		cursor: zoom-out;
/*		position: absolute;*/
	}
	.tickets{
    margin: var(--newM) var(--newM) 0 var(--newM);
    margin-left: 5vw;
    margin-top: calc(var(--header-height) * -1 );
    position: sticky;
    position: -webkit-sticky;
    top: calc(var(--header-height) + var(--newM));
    grid-row-start: 2;
    padding: calc(var(--outer-margin)/4) calc(var(--outer-margin)/4) 0 calc(var(--outer-margin)/4);
    min-width: min-content;
    transition: 0.1s margin-top;
    right: 0px;
	}
	
	.credits{
/*		width: 70%;*/
    font-size: 0.8em;
    line-height: 1.3em;
    margin-top: calc(var(--outer-margin) * 2);
	}
	.bio{
		background: var(--div-bg);
    grid-column-start: 7;
    grid-column-end: 11;
    margin: var(--newM);
    padding: var(--newM);
    font-size: 0.8em;

    line-height: 1.3em;
	}
	.bio p{
		margin-bottom: 0px;
	}
	.textBlock .quote{
		grid-column-start: 2;
    grid-column-end: 5;
	}
	.quote{
		grid-column-start: 2;
  	grid-column-end: 6;
  	margin-left: var(--outer-margin) !important;
 	}
  	.trigger, .duration, .place, .language{
		font-size: 0.8em;
	}
	.intro{

		padding: 0;
	}
	.video{
		margin: var(--newM);
	}
	.performanceText{
		font-size: 1.1em;
		/*grid-column-end: 6 !important;
		margin-right: 5vw !important;*/
		padding-right: 2vw !important;
	}
	.pAdditional p{
		margin: 0;
	}
	.ticketC svg{
		max-height: 1.8vw;
	}
	.dateTime{
  	flex-wrap: wrap;
  }
  

  .CJ{
  	grid-column-end: 11 !important;
    grid-column-start: 8 !important;
  }
  .aboutC{
/*  	z-index: 1;*/
	margin-top: -1px;
  }

  *{
  	-webkit-backface-visibility: hidden;
/*  	overflow: hidden;*/
  }

  body{
  	overflow: hidden;
  	width: 100%;
  	height: 100%;
  	top: 0px;
  	left: 0px;
/*  	overscroll-behavior: none;*/
  }

  .subBody{
  	overscroll-behavior-y: none;
  	padding-bottom: 0px !important;
  	position: fixed;
  }
  .subtitleC{
      display: none;
  }

  .stackVideo{
  	min-height: 100vh;
  }
  .video-block{
		background-color: white;
		height: 100%;
		position: absolute;
		width: 100%;
		margin-left: var(--outer-margin);
		display: flex;
		align-items: center;
		justify-content: center;
	}

  .vertStack{
  	grid-template-columns: 1fr 1fr 1fr 1fr 0.5fr 0.5fr 1fr 1fr 1fr 1fr !important;
  }
}  


.video-block .text{
	height: fit-content;
	color: var(--highlight-color);
	text-decoration: none;
	display: flex;
	flex-direction: column;
	text-align: center;
}

.video-block .text a{
	display: inline-block;
	position: relative;
	text-decoration: none;
	color: var(--highlight-color);
	width: fit-content;
	align-self: center;
}

.video-block .text a::after{
	bottom: 0.1em;
}

.video-block .text button{
	width: 100%;
	border: none;
	/* font-family: ''; */
	font-family: "JL_Impact-2012";
	font-size: 1.2em;
	background: var(--div-bg);
	margin: var(--outer-margin);
	cursor: pointer;
	color: var(--highlight-color);
}

.additionalTicketInfo{
		display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
	}
	.additionalTicketInfo .language{
		grid-column-start: 3;
    grid-column-end: 5;
	}
	.additionalTicketInfo .duration{
		grid-column-start: 1;
    grid-column-end: 3;
	
	}