html { 	overflow-x: hidden;
	position: relative; }

.content_container{	max-width: 80%;
			box-sizing: border-box;
			margin: auto; }
			
.content_container_LOTR{	max-width: 80%;
				box-sizing: border-box;
				margin: auto; }
			
#Main_Content_Container{ grid-template-rows: repeat(8, 10vh) auto; }
			
#Main_Content_Header{	box-sizing: border-box;
			grid-column-start: 4;
			grid-column-end: 8;
			grid-row-start: 3;
			grid-row-end: 4; }
			
#Main_Content_Home{	 }
			
#Main_Content{		grid-column-start: 3;
			grid-column-end: 9;
			grid-row-start: 4;
			grid-row-end: 9; }
		
#top_navbar{	display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		width: 100%;
		font-size: 14px;
  		border-radius: 0px 0px 10px 0px;
  		position: sticky;
  		top: 0; }
  		
#top_navbar.scrolled{	position: static; }

.Band_Navbar{	margin-bottom: 40px; }
  		
#Media_Display{		display: flex;
			flex-direction: row;
			justify-content: space-evenly;
			align-items: center;
			flex-wrap: wrap;
			width: 100%;
			margin-top: 35%; }
			
.Review_Item{	display: flex; }

.Spiel_Item{	width: 100%;	}
			
img.Media{	object-fit: contain;
  		height: 100px;
  		width: 33vw; }

img.Spiel{	width: 80vw;
		display: flex;
		justify-content: center;
		align-content: center;
		margin-left: 10%;
		margin-bottom: 25px; }

.AFJ_Trailer_BG {	display: flex;
			width: 60%;
			justify-content: center;
			margin: 20px 0px 40px 0px; }

    		
.AFJ_Trailer_Content {
 			background-color: gold;
 			margin: auto;
  			padding: 5px;
  			border: 1px solid #888;
  			border-radius: 5px;
  			width: fit-content;
  			position: relative; }
  			
/* The Close Button */
.AFJ_Trailer_Close {
  			color: gold;
  			position: absolute;
  			top: -10px;
  			right: -10px;
  			background-color: black;
  			border-radius: 5px;
  			border-color: gold;
  			border-style: solid;
  			border-width: 1px;
  			padding: 5px;
  			font-size: 20px;
  			line-height: 16px;
  			font-weight: bolder; }
  							
#YouTube_Preview{	max-height: 450px;
  			min-width: 360px;
  			min-height: 200px;
  			width: 100%;
  			height: 60vh; }
		
#footer{	grid-column-start: 1;
		grid-column-end: 3;
		grid-row-start: 8;
		grid-row-end: 10;
		line-height: 25px; }
		
.Content_Header{	display: grid;
			align-items: end;
			font-size: 40px;
			padding-bottom: 5px;
			padding: 10px 0px 10px 0px;
			border-bottom: 5px solid gold;
			border-bottom-width: thick; }
			
#Content_Header_Home{	padding: 10px 0px 15px 0px;
			justify-content: center; }
			
#ticker-container {
			display: grid;
			grid-column-start: 4;
			grid-column-end: 8;
			grid-row-start: 1;
			grid-row-end: 2;
 			align-self: center;
			
    			overflow: hidden;
}

#ticker {
		display: grid;
 		align-self: center;
 		height: 5vh;
 		min-height: 30px;
 		min-width: 200px;
   		background-color: #000000;
   		color: #FFFFFF;
   		border-color: #FFFFFF;
   		align-content: center;
   		justify-items: center;
   		border-radius: 25px;
   		border-color: gold;
   		border-style: solid;
    
}

#ticker:after {
    animation-name:ticker;
    animation-duration: 45s;
    animation-iteration-count: infinite;
    content: "";
  }


@keyframes ticker {
  0% {
    content: "'The UK's best tribute to Foreigner & Journey' - National Tribute Music Awards";
  }
  25% {
    content: "'A mixture of classic songs, delivered impeccably' - Planet Rock";
  }
  50% {
    content: "'Check out this amazing band, they ROCK!' - Jeff Pilson of Foreigner";
  }
  75% {
    content: "NEXT LIVE SHOW - May 3 2025 - The Mechanics, Burnley";
  }
  100% {
    content: "'The UK's best tribute to Foreigner & Journey' - National Tribute Music Awards";
  }
}
			
#Buy_Tickets{	display: grid;
		grid-column-end: 6;
		grid-row-start: 2;
		grid-row-end: 3;
		align-self: center;
		height: 5vh;
		min-height: 30px;
		min-width: 155px;
  		background-color: #000000;
		color: #FFFFFF;
		align-items: center;
		justify-items: center;
		border-style: solid;
		border-radius: 25px;
		border-width: 2px;
   		border-color: gold;
		transition: all 0.5s;
  		cursor: pointer; }
  		
#Buy_Tickets:hover{	background-color: #FFD700;
          		border-color: #000000;
  			color: #000000;	}


#Buy_Tickets{		transition: 0.5s; }

#Buy_Tickets:after {
  				content: '\00bb';
  				position: absolute;
  				opacity: 0;
  				top: 0;
  				right: -20px;
  				transition: 0.5s; }

#Buy_Tickets:hover span {	padding-right: 25px; }

#Buy_Tickets:hover span:after {
  				opacity: 1;
  				right: 0; }
  				
#AFJ_Preview_Link{	grid-column-start: 6;
		  	grid-column-end: 7;
		  	grid-row-start: 2;
		  	grid-row-end: 3;
  			align-self: center;
  			min-width: 172px; }
  				
#AFJ_Preview{	display: grid;
 		grid-row-start: 2;
 		grid-row-end: 3;
 		align-self: center;
 		height: 5vh;
 		min-height: 30px;
   		background-color: #000000;
   		border-color: gold;
 		color: #FFFFFF;
 		align-items: center;
 		justify-items: center;
 		border-style: solid;
 		border-radius: 25px;
 		border-width: 2px;
 		transition: all 0.5s;
   		cursor: pointer;
   		margin: 0px; }
   		
#AFJ_Preview:hover{	background-color: #FFD700;
           		border-color: #000000;
   			color: #000000;	}
 
 
#AFJ_Preview{		transition: 0.5s; }
 
#AFJ_Preview:after {
   				content: '\00bb';
   				position: absolute;
   				opacity: 0;
   				top: 0;
   				right: -20px;
   				transition: 0.5s; }
 
#AFJ_Preview:hover span {	padding-right: 25px; }
 
#AFJ_Preview:hover span:after {
   				opacity: 1;
  				right: 0; }
  				
#AFJ_Preview_Link.AFJ_Preview_Tickets{	grid-column-start: 5;
 					grid-column-end: 7; }
 					
#Link_Banner{	display: grid;
		grid-row-start: 2;
		grid-column-start: 3;
		grid-column-end: 9;
		padding-top: 30px; }

.Flex_Banner{ 	display: flex;
		flex-direction: row;
		justify-content: center;
		align-self: flex-start;
		flex-wrap: wrap;
		flex-grow: 0;
		gap: 25px; }
		
		
#Dates_Tickets{		}
		
img#AFJ_Logo{	padding-top: 10px;
		width: 90%;
		min-width: 300px; }
		
img#AFJ_Logo_Main{	width: 100%;
			min-width: 300px; }
			
img#AFJ_Logo_Mobile{	width: 90%;
			display: flex;
			margin: auto; }
		
.Social_Logo{	height: 25px;
		width: 25px;
		margin-right: 10px;
		}
		
#Social_Media{	display: flex;
  		left: 25px;
  		top: 25px;
  		flex-direction: row;
  		justify-content: center;
  		align-content: center; }
		
#afj_desc{	color: #FFD700;
		font-weight: 500; }
		
#Firestar{	display: flex;
		flex: 100%;
		align-items: center;
		letter-spacing: 0.1em;
		align-content: center;
  		justify-content: center;
  		margin: 140px 0px 20px 0px; }
		
a.Navbar{	display: flex;
		justify-content: center;
		text-decoration: none;
		color: #FFFFFF;
		margin-bottom: 15px; }
		
.Nav_Menu{	list-style-type: none;
		margin-top: 25px;
		padding: 0px 25px 0px 25px; }

.Nav_Item{	display: flex;
  		align-items: center; 
  		letter-spacing: 0.1em;
  		height: 100px;
  		position: relative; }
		
.Nav_Arrow{	width: 0;
      		height: 0;
      		border-top: 10px solid gold;
      		border-left: 5px solid transparent;
      		border-right: 5px solid transparent;
      		margin-right: 5px;
      		transition: transform 0.5s; }
      		
.Nav_Buttons{	object-fit: contain;
		height: 100px;
		width: 11vw;
		min-width: 120px; 
		max-width: 160px; }
		
#Ticket_Link.Nav_Buttons {	object-fit: contain;
				height: 100px;
				min-width: 120px;
				width: 160px;
				max-width: unset; }
		
#Nav_Buttons_Menu{	object-fit: contain;
			width: 11vw;
			min-width: 120px; 
			max-width: 160px; }
      		
a.Nav_Link{	text-decoration: none;
		color: #FFFFFF;
		transition: color 0.5s; }
		
.Nav_Link:hover{ color: #FFF08D; }
		
.Nav_Item:hover .Nav_Arrow { transform: rotate(-90deg); }
		
.content-item{	grid-column-start: 1;
		grid-column-end: 1;
		grid-row-start: 1;
		grid-row-end: 2;
		text-align: center;
		border: 1px solid #ddd;
		background-color: #f0f0f0;
		box-sizing: border-box; }



div#dates{	width: 100%;
		display: inline-block;
		margin: auto;
		margin-bottom: 30px;
		background-color: rgba(0,0,0, 0.95);
  		border-radius: 10px; 
  		border-style: solid;
  		border-color: #E8DD42;
  		margin-top: 550px;
  		padding-bottom: 50px; }
  			
.tour_month_header{	font-weight: bold;
  			font-size: 1.6em;
  			margin-bottom: 50px;
  			margin-left: 5%;
  			margin-top: 50px;
  			border-style: solid;
  			border-width: 0px 0px 1px 0px;
  			height: 30px;
  			width: 90%;
  			min-width: 116px;
  			border-color: #E8DD42;
  			color: #E8DD42; }
  			
#AFJ_Gallery{		display: flex;
			flex-wrap: wrap;
			flex-direction: row;
			width: 100%;
			justify-content: space-evenly;
			align-items: flex-start;
			gap: 20px 20px;
			margin-top: 75vh;
			margin-bottom: 50px; }
			
#Band{			margin-top: 50px; }

.Image_Container{	width: 200px;
  			height: 200px;
  			overflow: hidden;
  			border-style: solid;
  			border-color: #E8DD42;
  			border-width: 1px; }
  			
.Image_Container img{   width: 100%;
			height: 100%;
			object-fit: cover;
			object-position: top; }
		
.Image_Container img:hover { box-shadow: 0 0 2px 1px rgba(255, 215, 0, 0.5); }

div.tour_stop{		display: flex;
			flex-flow: row wrap;
			align-items: center;
			margin: auto; }
			
div.tour_date{		display: flex;
			flex: 25%;
			justify-content: center; }

div.tour_venue{		display: flex;
			flex: 45%;
			font-style: italic;
			justify-content: center; }

div.tour_book{		display: flex;
			flex: 30%;
			justify-content: center; }

div.tour_book_tbc{	display: flex;
			flex: 30%;
			justify-content: center; }
			
		
@media only screen and (min-width: 601px) {

iframe#promo_video{	
			width: 50%;
			height: 400px;
			margin: 50px; }
						}
				
@media only screen and (max-width: 600px) {

iframe#promo_video{	
			width: 100%;
			height: 400px;
			margin: 50px 0px 50px 0px; }
			
div#copyright{	float: left;
		text-align: right;
		height: 30px;
		line-height: 30px;
		margin: auto;
		width: 50%;
		font-size: 3vw; }
		
div#facebook{	float: left;
		margin: auto;
		height: 30px;
		line-height: 30px;
		width: 50%;
		font-size: 3vw; }				
					}
		
@media only screen and (min-width: 601px) {
		
h1#desktop{	width: 100%;
		text-align: center;
		margin: 50px 0px 50px 0px; }
		
h1#mobile{	font-size: 3.5vw;		
		width: 100%;
		text-align: center; 
		display: none; }		
					}
				
@media only screen and (max-width: 600px) {
						
h1#desktop{	font-size: 5vw;		
		width: 100%;
		text-align: center;
		display: none; }
		
h1#mobile{	font-size: 6vw;
		width: 100%;
		text-align: center;
		margin: 50px auto 50px auto; }
		
#ticker-container {
			display: none;
			grid-column-start: 4;
			grid-column-end: 8;
			grid-row-start: 1;
			grid-row-end: 2;
 			align-self: center;
			
    			overflow: hidden;
}

#ticker {
		display: none;
 		align-self: center;
 		height: 5vh;
 		min-height: 30px;
 		min-width: 200px;
   		background-color: #000000;
   		color: #FFFFFF;
   		border-color: #FFFFFF;
   		align-content: center;
   		justify-items: center;
   		border-radius: 5px;
   		border-color: gold;
   		border-style: solid;
    
}

#YouTube_Preview{	width: 80vw;
			height: 30vh;
			min-width: 400px;
    			min-height: 200px; }
    			
#AFJ_Preview_Link{	grid-column-start: 6;
  			grid-column-end: 7;
  			grid-row-start: 2;
  			grid-row-end: 3;
  			align-self: center;
  			min-width: 172px; }
  			
#AFJ_Preview_Link.AFJ_Preview_Tickets{	grid-row-start: 4;
					grid-column-start: 4;
    					grid-column-end: 8;
					font-size: 0.9em; }
    					
    					}
					
@media screen and (min-width: 320px) and (max-width: 1400px) and (orientation: landscape) {

iframe#promo_video{	
			width: 50%;
			height: 75vh;
			margin: 50px 25% 50px 25%; }		
}

@font-face {
    font-family: 'CustomFont';
    src: url('fonts/TrajanPro-Bold.otf') format('truetype');
    font-weight: normal;
    font-style: normal;
}



body{		font-family: 'CustomFont', sans-serif;
     		color: #FFFFFF;
     		font-size: 18px;
     		padding: 0px;
     		line-height: 18px;
     		height: 100%;
     		margin: 0px;
     		box-sizing: border-box;
     		position: relative;  		
     		background-image: url("images/WEBSITE BACKGROUND.jpg");
    		background-blend-mode: normal;
    		background-repeat: no-repeat;
  		background-attachment: scroll;
  		background-size: contain;
  		background-color: black;
    }
    
body.LOTR{	background-image: url("images/WEBSITE BACKGROUND GRADIENT.jpg"); }

body.Merch{	background-size: cover; }

body.Contact{	background-size: cover; }

#LOTR_Logo{	display: flex;
		align-content: center;
  		justify-content: center;
  		margin-bottom: 40px; }
  		
#LOTR_Latest{	display: flex;
		align-content: center;
  		justify-content: center;
  		margin-bottom: 10px; }
  		
#LOTR_Full_Series{	display: flex;
			align-content: center;
  			justify-content: center;
  			margin-bottom: 10px;
  			width: 100vw; }

ul.LOTR{	list-style-type: disc;
  		margin: 20px;
  		padding: 10px;
  		list-style-position: inside; }
  		
#LOTR_Spiel{	text-align: center;
		line-height: 30px;
		margin-bottom: 30px; }
		
.LOTR_Main{	max-width: 150%;
  		height: auto; }
  		
.LOTR_Latest{	max-width: 150%;
  		height: auto; }
  		
.LOTR_Full_Series{	max-width: 150%;
  			height: auto; }
  		
#LOTR_Main_Video {	width: 100%;
			margin: 30px auto 25px auto;
			border-style: solid;
  			border-color: gold;
  			border-width: 2px;
  			border-radius: 2px; }

#LOTR_Main_Video iframe{	max-height: 450px;
  				min-width: 360px;
  				min-height: 200px;
  				width: 100%;
  				height: 60vh; }
  			
.LOTR_Videos{		display: flex;
  			flex-wrap: wrap;
  			flex-direction: row;
  			width: 100%;
  			justify-content: center;
  			align-items: flex-start;
  			gap: 10px;
  			row-gap: 20px;
			column-gap: 50px;
  			margin-bottom: 50px; }
			
.LOTR_Next5{		display: flex;
			border-style: solid;
  			border-color: gold;
  			border-width: 2px;
  			border-radius: 2px; }	

.LOTR_Next5 iframe{	display: flex; }
    


a{		text-decoration: none;
		color: #FFFFFF; }

p{		margin-bottom: 10px;}

br{		margin-bottom: 5px;}

b{		font-weight: bold;}

i{		font-style: italic; }

p.tour_day{	display: inline-block;
		margin-top: 0em;
  		margin-bottom: 0em;
  		margin-left: 0;
  		margin-right: 5px;
  		font-size: 2em; }

p.tour_month{	display: inline-block;
		margin-top: 0em;
  		margin-bottom: 0em;
  		margin-left: 0;
  		margin-right: 5px; }

p.tour_year{	display: inline-block;
		margin-top: 0em;
  		margin-bottom: 0em;
  		margin-left: 0;
  		margin-right: 0; }

.button {
  border-radius: 25px;
  background-color: #000000;
  border-color: gold;
  color: #FFFFFF;
  text-align: center;
  font-size: 15px;
  padding: 5px;
  width: 150px;
  transition: all 0.5s;
  cursor: pointer;
  margin: 0px;
}

.button:hover{
          background-color: #FFD700;
          border-color: #000000;
  color: #000000;
  }

.button span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.button span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}

.button:hover span {
  padding-right: 25px;
}

.button:hover span:after {
  opacity: 1;
  right: 0;
}

p.home{		text-align: center; }

h2#form_disclaimer{	clear: both;
			font-weight: bold;
			text-align: center;
			color: #FFFFFF;
			padding: 5px;
			margin: 5px 0px;
			background-color: #000000; }

.feed_form{
display: flex;
font-family: Georgia, Times New Roman, serif;
border:solid 1px #000000;
margin: 20px 30px;
padding:14px;
-webkit-border-radius: 10px 10px 10px 10px;
border-radius: 10px 10px 10px 10px;
background-color: rgba(0,0,0, 0.325);
overflow: hidden;
line-height: normal;
}
.feed_form h1 {
font-family: Georgia, Times New Roman, serif;
font-size:24px;
line-height: 32px;
font-weight: lighter;
margin-bottom:8px;
text-align: center;
color: #FFFFFF;
}
.feed_form p{
font-family: Georgia, Times New Roman, serif;
font-size:16px;
color: #FFFFFF;
padding-bottom: 20px;
margin-bottom: 25px;
text-align: center;
border-bottom:solid 1px #000000;
}
.feed_form label{
font-family: Arial, Helvetica, sans-serif;
display:block;
font-weight:bold;
text-align:right;
color: #FFFFFF;
width:140px;
float:left;
clear: left;
margin-top: 5px;
margin-left: 75px;
padding-bottom: 1px;
}
.feed_form .small{
font-family: Arial, Helvetica, sans-serif;
color: #FFFFFF;
display:block;
font-size:11px;
font-weight:normal;
text-align:right;
margin-top: 2px;
width:140px;
}
.feed_form input{
float:left;
font-size:12px;
padding:4px 2px;
border:solid 1px #aacfe4;
width:200px;
margin:7px 0 20px 10px;
clear:right;
}

h2.message_preview{ font-weight: lighter; }

h2.messsage_display{ font-weight: lighter; }

b.required{
color: #F00;
font-weight: bold; }

h1.required{
color: #F00;
font-weight: bold;
float: left;
margin: 9px 0px 0px 5px;
padding: 1px 2px;
font-size: smaller; }

h2.required{
color: #FFFFFF;
background-color: #FF0000;
clear: both;
text-align: center;
margin: auto;
padding: 1px 2px;
font-size: smaller; }

div.feed_form_flex_layout{ 	display: flex;
				justify-content: center;
				flex: 100%; }


input#offers
{
float: left;
width: 10px;
margin-bottom: 25px;
border: 0px;
}

.feed_form select{
float:left;
font-size:12px;
padding:4px 2px;
border:solid 1px #aacfe4;
width:150px;
margin:2px 0 20px 10px;
clear:right;
}

.feed_form textarea{
float: left;
padding:4px 2px;
width: 375px;
height: 150px;
margin:7px 0 20px 10px;
border:solid 1px #aacfe4;
resize: none;
font-family: Verdana,Arial;
font-size: small;
}

.feed_form button{
clear:both;
margin: auto;
display: block;
height:31px;
background:#000000;
text-align:center;
color:#FFFFFF;
font-size:13px;
border-color: gold;
border-radius: 25px;
border-width: 2px; }

.hidden input{
float: left;
margin: 15px 100px 5px 100px;
width:200px;
height:31px;
background:#000000;
text-align:center;
line-height:31px;
color:#FFFFFF;
font-size:13px;
-webkit-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
}

div.Band_Member{ 	display: grid;
  			grid-template-columns: 0.25fr 0.75fr;
  			grid-template-rows: 80px 50px 1fr;
  			margin-bottom: 25px;
  			min-height: 400px;
  			background-color: rgba(0,0,0, 0.95); 
  			border-style: solid;
  			border-color: gold;
  			border-radius: 25px;
  			grid-gap: 10px; }

div.Band_Name{ 	grid-column-start: 2;
		grid-column-end: 3;
		grid-row-start: 1;
		grid-row-end: 2;
		font-size: 40px;
		color: gold;
		align-self: center;
		margin: 40px 0px 20px 0px;
		padding: 20px;
		text-align: center; }

div.Band_Image{	grid-column-start: 1;
		grid-column-end: 2;
		grid-row-start: 1;
		grid-row-end: 4;
		max-height: 400px;
		box-sizing: border-box; }
		
img.Band{	width: 100%;
		max-height: 100%;
		max-width: 252px;
		padding: 10px;
		border-radius: 40px;
		box-sizing: border-box; }

div.Band_Role{ 	grid-column-start: 2;
		grid-column-end: 3;
		grid-row-start: 2;
		grid-row-end: 3;
		font-size: 25px;
		font-style: italic;
		align-self: center;
		padding: 20px;
		line-height: 30px;
		text-align: center; }

div.Band_Bio{ 	grid-column-start: 2;
		grid-column-end: 3;
		grid-row-start: 3;
		grid-row-end: 4;
		font-size: 20px;
		line-height: 30px;
		margin: 20px 40px 60px 40px;
		text-align: center; }
		
div.Merch_Soon{ 	display: block;
  			margin-bottom: 25px;
  			min-height: 400px;
  			background-color: rgba(0,0,0, 1);
  			background-blend-mode: multiply;
  			background-size: cover;
  			border-style: solid;
  			border-color: gold;
  			border-radius: 25px;
  			font-weight: bold;
  			text-align: center;
  			padding: 25px;
  			font-size: 40px;
  			line-height: 40px;
  			height: 300px;
  			align-content: center; }
  			
div.Contact_Firestar{ 	display: block;
  			margin-bottom: 25px;
  			min-height: 400px;
  			background-color: rgba(0,0,0, 1);
  			background-blend-mode: multiply;
  			background-size: cover;
  			border-style: solid;
  			border-color: gold;
  			border-radius: 25px;
  			font-weight: bold;
  			text-align: center;
  			padding: 25px;
  			font-size: 30px;
  			line-height: 40px;
  			align-content: center; }
  			
.Firestar_Image_Container{	align-content: center;
				justify-content: center;
				display: flex;
				margin: auto auto 20px auto;
				max-width: 50%;
  				height: auto; }
  				
.Firestar_Image{	max-width: 50%;
  			height: auto; }
  			
a.email-link{		color: #E8DD42;
  			text-decoration: none;
  			border-bottom: 2px solid #E8DD42;
  			overflow-wrap: break-word; }
  			
#Content_Admin{		display: flex;
			flex-flow: column wrap;
			justify-content: center; }
			
/* Hamburger icon */
.hamburger {
  font-size: 1.75rem;
  padding: 1rem;
  cursor: pointer;
  z-index: 1001;
  position: absolute;
  top: 0px;
  right: 0px;
  display: none;
}

.Home_Tickets{ 	position: absolute;
		top: 7px;
  		right: 25vw;
  		display: none; }

/* Navigation menu */
#mobileNav {
  position: fixed;
  top: 0;
  left: -100%;
  height: 100%;
  color: white;
  transition: left 0.4s ease, opacity 0.4s ease;
  opacity: 0;
  z-index: 1000;
  padding-top: 4rem;
  background-color: rgba(0,0,0, 0.55);
  overflow-y: scroll;
}

/* Active state */
#mobileNav.active {
  left: 0;
  opacity: 1;
}

/* Menu items */
#mobileNav ul {
  list-style: none;
  padding: 0;
}

#mobileNav li {
  padding: 0.25rem;
}

#mobileNav a {
  color: white;
  text-decoration: none;
  font-size: 1.2rem;
}

@media (max-width: 395px){

	body.Contact{	background-size: contain; }

}

@media (max-width: 499px) {
    	#AFJ_Gallery { grid-template-columns: repeat(1, 1fr); }
    	
    	div#dates{		display: flex;
    				flex-flow: row wrap; }
    	
	div.tour_stop{		 }
	
    	div.tour_date{		display: flex;
    				flex: 100%;
    				justify-content: center; 
    				align-items: center;
    				margin-bottom: 25px; }
		
	div.tour_venue{		display: flex;
				flex: 100%;
    				justify-content: center; 
    				align-items: center;
    				text-align: center;
    				flex-wrap: wrap;
    				margin: 0px 10px 0px 10px; }
    				
	div.tour_book{		display: flex;
				flex: 100%;
    				justify-content: center; 
    				align-items: center;
    				margin-bottom: 15px; }	
    				
	div.tour_book_tbc{	display: flex;
				flex: 100%;
    				justify-content: center; 
    				align-items: center;
    				margin-bottom: 15px; }
    				
    	.tour_month_header {	margin-bottom: 50px;
    				margin-left: 5%;
    				width: 90%; }
    				
    	#Main_Content_Home { grid-row-start: 4; }
    	
	img#AFJ_Logo_Main{	display: none; }
	
	div.Band_Member{ 	display: flex;
    				flex-flow: row wrap;
    				width: 100%;
				margin: auto auto 25px auto; }
				
	div.Band_Name{		display: flex; }
	
	div.Band_Role{		display: flex;
				flex: 100%; }
	
	div.Band_Image{		display: flex;
				margin: auto; }
	
	div.Band_Bio{		display: flex;
				font-size: 15px; }
				
	body{  		box-sizing: border-box;
     			position: relative;  		
     			background-image: url("images/MOBILE WEBSITE BACKGROUND.jpg");
    			background-blend-mode: normal;
    			background-repeat: no-repeat;
  			background-attachment: scroll;
			background-position-x: 0px;
    			background-position-y: -100px; }
    			
    	body.LOTR{	background-position-y: unset; 
    			overflow-x: hidden; }
    			
    	img.Media{	width: 100vw; }
    	
    	#Media_Display{	margin-top: 100%; }
	div#dates{	margin-top: 125%; }
	#AFJ_Gallery{	margin-top: 100%; }
	#Band{		margin-top: 100%;
			display: inline-block;
			margin-bottom: 30px; 
			border-radius: 10px; }
	
	#YouTube_Preview{	min-width: unset; }
	
	.Firestar_Image{	max-width: 100%; }
	
/*	a.email-link{	font-size: 10px; } */
	
	.Nav_Item{	display: none; }
	
	.hamburger { display: flex; }
	
	.Home_Tickets{ 	display: flex; }
	
	#Nav_Buttons_Menu.Tour_Link{	width: 180px;
  					max-width: unset; }
  					
	#Ticket_Link.Nav_Buttons{	object-fit: contain;
					height: 100px;
					min-width: 120px; 
					width: 180px;
    					max-width: unset; }
	
	.content_container{	max-width: 80vw; }
	
	div.Merch_Soon{ 	display: block;
				background-color: rgba(0,0,0, 1);
				background-blend-mode: multiply;
				background-size: cover;
				border-style: solid;
				border-color: gold;
				border-radius: 25px;
				font-weight: bold;
				text-align: center;
				padding: 25px;
				font-size: 40px;
				line-height: 40px;
				height: 300px;
				align-content: center;
				margin-top: 100px; }
  			
	div.Contact_Firestar{ 	display: block;
				background-color: rgba(0,0,0, 1);
				background-blend-mode: multiply;
				background-size: cover;
				border-style: solid;
				border-color: gold;
				border-radius: 25px;
				font-weight: bold;
				text-align: center;
				padding: 25px;
				font-size: 30px;
				line-height: 40px;
				align-content: center;
				margin-top: 100px; }
	
	#LOTR_Logo{	margin: 100px auto 40px auto; }

	.LOTR_Latest{	max-width: 100%; }

	.LOTR_Full_Series{	max-width: 100%; }

	#LOTR_Main_Video iframe { 	min-width: unset;
					height: 40vh; }
						
	.LOTR_Next5 iframe {		height: 35vh; }

}

 			
@media (max-width: 575.99px) and (min-width: 500px) {
    	#AFJ_Gallery { grid-template-columns: repeat(1, 1fr); }
    	
	div.tour_stop{		margin-bottom: 25px; }
	
    	div.tour_date{		display: flex;
    				flex: 100%;
    				justify-content: center; 
    				align-items: center;
    				margin-bottom: 15px; }
		
	div.tour_venue{		display: flex;
				flex: 100%;
    				justify-content: center; 
    				align-items: center;
    				text-align: center;
    				flex-wrap: wrap;
    				margin: 0px 15px 0px 15px; }
    				
	div.tour_book{		display: flex;
				flex: 100%;
    				justify-content: center; 
    				align-items: center;
    				margin-bottom: 15px; }	
    				
	div.tour_book_tbc{	display: flex;
				flex: 100%;
    				justify-content: center; 
    				align-items: center;
    				margin-bottom: 15px; }
    				
    	#Main_Content_Home { grid-row-start: 4; }
    	
	img#AFJ_Logo_Main{	display: none; }
	
	div.Band_Member{ 	width: 90%;
				margin: auto auto 25px auto; }
				
	body{  		box-sizing: border-box;
     			position: relative;  		
     			background-image: url("images/MOBILE WEBSITE BACKGROUND.jpg");
    			background-blend-mode: normal;
    			background-repeat: no-repeat;
  			background-attachment: scroll;
			background-position-x: 0px;
    			background-position-y: -100px; }
    			
    	img.Media{	width: 100vw; }
    	
    	#Media_Display{	margin-top: 100%; }
	div#dates{	margin-top: 125%; }
	#AFJ_Gallery{	margin-top: 100%; }
	#Band{		margin-top: 100%;
			display: inline-block;
			margin-bottom: 30px; 
			border-radius: 10px; }
	
/*	a.email-link{	font-size: 11px; } */
	
	.Firestar_Image{	max-width: 100%; }
    		
}

@media (max-width: 768.99px) and (min-width: 576px) {
    	#AFJ_Gallery { grid-template-columns: repeat(2, 1fr); }
    	
    	div.tour_stop{		align-items: normal; }
		
	div.tour_venue{		justify-content: unset; }
		
	div.tour_book{		flex: 100%;
				justify-content: center;
				margin: 15px; }
		
	div.tour_book_tbc{	flex: 100%;
				justify-content: center; }
				
	img#AFJ_Logo_Mobile{	display: none; }
	
	.LOTR_Next5 iframe{	width: 100%;
				height: 40vh; }
				
	#LOTR_Main_Video iframe{	max-height: unset;
  					min-width: unset;
  					min-height: unset;
  					height: 40vh; }
	
	.tour_month_header{	margin-bottom: 50px; }
	
	.content_container{	max-width: 80%; }
	
	.Firestar_Image{	max-width: 100%; }
	
/*	a.email-link{	font-size: 14px; } */
	
	img.Media{	width: 100vw; }
	
	#YouTube_Preview{	height: 45vh; }
    
}

@media (max-width: 575px) {

	#Media_Display{	margin-top: 100%; }
	#AFJ_Gallery{	margin-top: 125%; }
	#Band{		margin-top: 125%;
			display: inline-block;
			margin-bottom: 30px; 
			border-radius: 10px; }
}

@media (min-width: 576px) and (max-width: 849px) {

	#Media_Display{	margin-top: 45%; }
	div#dates{	margin-top: 60%; }
	#AFJ_Gallery{	margin-top: 60%; }
	#Band{		margin-top: 60%;
			display: inline-block;
			margin-bottom: 30px; 
			border-radius: 10px; }
}

@media (max-width: 850px) {

	.Nav_Item{	display: none; }
	
	.hamburger { display: flex; }
		
	.Home_Tickets{ 	display: flex;
	  		left: 0; 
  			right: 0; 
  			margin-inline: auto; 
  			width: fit-content; }
	
	#Nav_Buttons_Menu.Tour_Link{	width: 180px;
  					max-width: unset; }
  					
	div.Merch_Soon{ 		margin-top: 100px; }

	div.Contact_Firestar{ 		margin-top: 100px; }
	
	div.Band_Member{ 	display: flex;
				flex-flow: row wrap;
				width: 100%;
				margin: auto auto 25px auto; }

	div.Band_Name{		display: flex; }

	div.Band_Role{		display: flex;
				flex: 100%; }

	div.Band_Image{		display: flex;
				margin: auto; }

	div.Band_Bio{		display: flex;
				font-size: 15px; }
				
 	#LOTR_Logo {		margin: 100px auto 40px auto; }
}

@media (min-width: 851px) {

	#Media_Display{	margin-top: 35%; }
	div#dates{	margin-top: 45%; }
	#AFJ_Gallery{	margin-top: 45%; }
	#Band{		margin-top: 45%;
			display: inline-block;
			margin-bottom: 30px; 
			border-radius: 10px; }
	
}

@media (max-width: 991.98px) and (min-width: 769px) {
    	#AFJ_Gallery { grid-template-columns: repeat(3, 1fr); }
    	
    	div.tour_stop{		align-items: normal; }
	
	div.tour_venue{		justify-content: unset; }
	
	div.tour_book{		flex: 100%;
				margin: 15px;
				justify-content: center; }
	
	div.tour_book_tbc{	flex: 100%;
				justify-content: center; }
				
	img#AFJ_Logo_Mobile{	display: none; }
	
/*	a.email-link{	font-size: 21px; } */
	
	img.Media{	width: 50vw; }
	
	#YouTube_Preview{	height: 45vh; }
	
	.Firestar_Image{	max-width: 100%; }
    
}
@media (max-width: 1199.98px) and (min-width: 992px) {
    	#AFJ_Gallery { grid-template-columns: repeat(4, 1fr); }
   
	img#AFJ_Logo_Mobile{	display: none; }
	
/*	a.email-link{	font-size: 25px; } */
	
	img.Media{	width: 50vw; }
	
	#YouTube_Preview{	height: 60vh; }
	
	.Firestar_Image{	max-width: 100%; }
}
@media (min-width: 1200px) {
    	
    	#AFJ_Gallery { grid-template-columns: repeat(5, 1fr); }
    	div.tour_date{		flex: 25%;
    				justify-content: center; }
    
    	div.tour_venue{		flex: 45%; }
    
    	div.tour_book{		flex: 30%; }
    
	div.tour_book_tbc{	flex: 30%; }
	
	img#AFJ_Logo_Mobile{	display: none; }
	
	#YouTube_Preview{	height: 60vh; }
	
	.Firestar_Image{	max-width: 325px; }
    
}

@media (min-width: 576px) and (max-width: 1034px){

	body.Merch{	background-size: contain; }
	body.Contact{	background-size: contain; }
}

.Shows_Ticker { margin: 0 auto;
		white-space: nowrap;
		overflow: hidden;
		box-sizing: border-box;
		padding: 0;
		height: 40px;
		width: 100%;
		display: flex;
  		font-style: italic;
  		background-color: rgba(0,0,0, 0.7);
  		position: sticky;
  		top: 100px; } 
		
@keyframes Shows_Ticker {

0% { transform: translate(100%, 0); -webkit-transform: translateX(100%); }
100% { transform: translate(-100%, 0); -webkit-transform: translateX(-100%); }

}

.Shows_Ticker span {	display: inline-block;
			text-indent: 0;
			overflow: hidden;
			-webkit-transition: 30s;
			transition: 30s;
			-webkit-animation: Shows_Ticker 30s linear infinite;
			animation: Shows_Ticker 30s linear infinite;
			width: 100%;
			align-content: center; }