@charset "utf-8";

/* CSS Document */

html{
	scroll-behavior: smooth;
}

body{
	background-color: #000 !important;
	font-family: "Lato", sans-serif;
	position: relative;
}

/* Firefox-selection */
::-moz-selection {
	color: rgb(255, 255, 255);
	background-color: rgba(255, 0, 0, 0.493);
}

::selection{
	color: rgb(255, 255, 255);
	background-color: rgba(255, 0, 0, 0.493);
}
 
a:focus,
a:hover {
  text-decoration: none;
}

a:hover{
	color:rgb(255, 0, 0) !important;
	opacity: 0.8 !important;
}


a:focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px
}

.w3-button{
	border-bottom: 2px solid  rgb(0, 0, 0);
}

.w3-button:hover{
	border-bottom: 2px solid  rgba(255, 0, 0, 0.493);
	background-color:black !important;
	color:white !important;
	text-decoration: none;
} 

.w3-container{
	width: 90% !important;
	/* padding-left:10% !important;
	padding-right: 10% !important; */
}

.header h3, b{
	color: #fff;
	text-shadow:
	2px 2px 0 #000,
	-1px -1px 0 #000,  
	1px -1px 0 #000,
	-1px 1px 0 #000,
	1px 1px 0 #000;
}

/* NAVBAR */
.sticky {
	position: sticky !important;
	top: 0;
	opacity: 1 !important;
	z-index: 9999;
}

.sticky + .content {
	padding-top: 60px;
}

.navbar{
	background-color: #000 !important;
	padding:0 !important;
	margin: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	top: 0%;
}

.navbar-inverse .navbar-toggle{
	border: none !important; 

}

.navbar-brand{
	padding-left: 0 !important;
	margin: 0 !important;
	opacity: 0.6;
}

.nav a{
	font-size: 14px !important;
	margin: 0 10px 0 10px !important;
}

/* Navbar hover font style */
.navbar-inverse .navbar-nav a:hover{
	color: rgba(255, 0, 0, 0.664) !important;
	opacity: 1 !important; 
}

/* Navbar hover background color */
.navbar-inverse .navbar-nav li:hover{
	background-color: rgb(0, 0, 0) !important;
	z-index: 9999;
}

/* Navbar font color */
.navbar-inverse{ 
	color: rgb(255, 255, 255) !important;
}

/* Spynav active tab color */
.navbar-inverse .navbar-nav>.active>a{
	color:rgb(255, 0, 0) !important; 
	background-color: transparent !important;
}

/* Shop-tab active */ 
.active{ 
	color:rgb(255, 0, 0) !important; 
	background-color: transparent !important;
}

a.active{  
	color:rgb(255, 0, 0) !important; 
}

/* DROPDOWN MENU */
.dropdown-content {
	display: none;
	position: absolute;
	background-color: #000000;
	min-width: auto;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 1;
}

.dropdown-content a {
	float: none;
	text-decoration: none;
	padding:10px;
}

.dropdown:hover .dropdown-content {
	display: block;	
}

ul.dropdown-content{
	text-align: center !important;
}

ul.dropdown-content li{
	width: 100%;
}

.nav>li>a{
	text-align: center !important;
}

li.more{
	display: none !important; 
}

div#navbar-large{  
	display: flex !important; 
	justify-content: center!important;
}

/* SMALL NAVBAR*/
.navbar-toggle{
	border: none !important;
}

.navbar-header{
	margin-top:0 !important;
	padding-top: 0 !important;
}

.navbar-header a{
	display: none;
}

/* TOP BUTTON */
#TopBtn {
  display: none;
  position: fixed;
  bottom: 3%;
  right: 2%;
  z-index: 99;
  background-image: url('up.png');
	background-repeat: no-repeat;
	border: none;
  cursor: pointer;
  padding: 20px; 
	opacity: 0.5;
	background-color: transparent;
	background-size: 100%; 
}

#TopBtn:hover {
  background-image: url("up_hover.png");
	opacity: 1;
}

/* SHOP */
.shop-container:hover .shop-banner {
	opacity: 0.3;
}

#storeinfo h2.w3-wide{	
	padding-bottom: 32px;
}

.shop_info h3{
	padding-bottom: 32px;
}

.shop_info{
	width: 60%;
	padding-top:15px;
}

.shop_info p{
	font-size: medium;
	line-height: 1.5;
	text-align: left;
}

.back{
	text-align: left;
	padding-left: 20%;
	padding-top:32px;
	padding-bottom: 32px;
}

/* Shopping cart */
.cart {
	position: absolute;
	z-index: 30;
	right: 10px;
	top: 530px;
	padding-right: env(safe-area-inset-right);
	padding: 10px;
}

.fixed {
	position: fixed;
	top: 50px;
	padding: 10px;
}

/* SOME LINKS */
.somelinks{
	padding-top: 10px;
	padding-bottom: 16px;
}

.somelinks i{
	padding: 5px;
}

.somelinks .fa, .somelinks .fab{
	font-size: smaller;
}

/* EUROTOUR VIDEO */
.eurotour-video{
	aspect-ratio: 16/9;
	width: 90%;
}

/* TOUR-SECTION */
.bandsintown-widget{
	margin-bottom: 36px;
}

.tour-row img{
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 15px; 
	padding-bottom: 15px;
}

.tourImg {
	border-radius: 5px;
	cursor: pointer;
	transition: 0.3s;
}

.tourImg:hover {
	opacity: 0.7;
}

/* TOUR POSTERS */
/* The Modal (background) */
.modal {
	display: none;
	/* Hidden by default */
	position: fixed;
	/* Stay in place */
	z-index: 1;
	/* Sit on top */
	padding-top: 100px;
	/* Location of the box */
	left: 0;
	top: 0;
	width: 100%;
	/* Full width */
	height: 100%;
	/* Full height */
	overflow: auto;
	/* Enable scroll if needed */
	background-color: rgb(0, 0, 0);
	/* Fallback color */
	background-color: rgba(0, 0, 0, 0.9);
	/* Black w/ opacity */
}

/* Modal Content (image) */
.modal-content {
	margin: auto;
	display: block;
	width: 100%;
	max-width: 700px;
	background-color: transparent;
}

/* Caption of Modal Image */
#caption {
	margin: auto;
	display: block;
	width: 80%;
	max-width: 700px;
	text-align: center;
	color: #ccc;
	padding: 10px 0;
	height: 150px;
}

/* Add Animation */
.modal-content,
#caption {
	-webkit-animation-name: zoom;
	-webkit-animation-duration: 0.6s;
	animation-name: zoom;
	animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
	from {
		-webkit-transform: scale(0)
	}

	to {
		-webkit-transform: scale(1)
	}
}

@keyframes zoom {
	from {
		transform: scale(0)
	}

	to {
		transform: scale(1)
	}
}

/* The Close Button */
.close {
	position: absolute;
	top: 50px;
	right: 30px;
	color: #f1f1f1;
	font-size: 40px;
	font-weight: bold;
	transition: 0.3s;
}

.close:hover,
.close:focus {
	color: #bbb;
	text-decoration: none;
	cursor: pointer;
}

/* DISCOGRAPHY */
.music-container p {
	margin-top: 20px;
}

.music-container img {
	border-radius: 5px 5px 0 0;
}

.albums h4,
.singles h4,
.other h4 {
	padding: 10px;
}

.albums,
.singles,
.other {
	padding-bottom: 10px;
}

.albums:hover,
.singles:hover,
.other:hover {
	opacity: 0.8;
	color: rgb(255, 0, 0);
}

.albums a:hover,
.singles a:hover,
.other a:hover {
	opacity: 1;
}

.filter{
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.albums, .singles, .other{
	padding-left: 5px;
	padding-right: 5px;
}

.filter h4{
	background-color: rgb(255, 255, 255);
	color: #000;
	display: block;
	border-radius: 0 0 5px 5px;
	font-size: medium;
	margin-top: 0px;
	min-height: 4.5em;
} 

.filterRed{
	border-bottom: 2px solid red;
}

.KFS,
.IWYTWS,
.OSA {
	padding-top: 15px;
	padding-right: 15px;
	padding-left: 15px;
}

#discography h2.w3-wide {
	padding-bottom: 32px;
}

.tracklisting {
	text-align: left;
	padding-right: 15px;
	padding-left: 15px;
	padding-top: 15px;
	height: fit-content;
}

.tracklisting a {
	color: rgb(255, 0, 0);
	opacity: 1;
	padding-left: 5px;
}

.tracklisting a:hover {
	padding-left: 5px;
}

.buy {
	padding-bottom: 15px;
}

.buy a {
	color: red;
}

.lyrics h3 {
	padding-top: 20px;
}

.gallery-title h5 {
	padding-bottom: 0 !important;
	margin-bottom: 0 !important;
}

.gallery {
	padding-bottom: 3%;
}

.w3-card img {
	height: 200px;
	object-fit: cover;
}

/* BAND-SECTION */
#band{
	margin-bottom: 25px;
}

#band h2{
	margin-bottom: 10px;
}

#band p{
	word-spacing: 1px;
	padding-right: 2%;
	padding-left: 2%;
}

.img-text{
	margin-top: 10px;
	margin-bottom: 30px;
}

.band-text{
	color: white;
}

.text-red{
	color: red;
}

/* LINEUP */
.lineup{
	padding-top: 32px;
}

.lineup img{
	padding: 10px;
}

.lineup-1 .lineup-2{
	margin-top: 25px;
}

.lineup-2{
	padding-left: 15%;
	padding-right: 15%;
}

/* CONTACT */
.contact{
	border: rgba(255, 0, 0, 0.411);
	border-style: solid;
	border-width: 1px 0 1px 0;
	padding-top:64px;
	padding-bottom:64px;
}

.contact-header{
	font-size: 22px;
}

.contact-text-red{
	color: red;
}

.contact-info{
	font-size: 18px;
}
.contact-info a{
	letter-spacing: 2px;
}

.contact p{
	margin: 15px;
	margin-bottom: 30px;
}

.contact .fa{
	width: 25px;
	padding: 0;
}

/* BOOKING */
.booking-agencies{
	padding-top:15px;
}

.booking-agencies img{
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
}

/* LABELS */
.labels{
	padding-top: 64px;
	padding-bottom: 10px;
}

.labels img, .endorsements img{
	padding-top: 10px;
	margin-left: 10px;
	margin-right: 10px;
}

.labels h5, .endorsements h5{
	opacity: 0.9;
	font-size: 16px;	
}

.endorsements {
	padding-top:20px;
	padding-bottom: 64px;
}

/* FOOTER */
.footer{
	padding-bottom:32px;
}
.border{
	border-top: rgba(128, 128, 128, 0.274);
	border-style: solid;
	border-width: 1px 0 0 0;
	width: 100% !important;
}

.footer a {
	text-decoration: none;
}

.footer i {
	padding-bottom: 32px;
}

/* VIDEOS */
.video {
	aspect-ratio: 16/9;
	width: 100%;
}

.videos{
	padding-bottom: 3%;
}

/* MEDIA */
.media_selection .tablink{
	display:none;
}

div#albumreviews a, 
div#concertreviews a,
div#interviews a
{
	/* color:rgb(255, 0, 0) !important;  */
	opacity: 0.8;
	border-bottom: 1px solid rgb(255, 255, 255) !important;
	padding-bottom: 1px;
	line-height: 25px !important;
}

div#albumreviews a:hover, 
div#concertreviews a:hover,
div#interviews a:hover
{
	border-bottom: 1px solid rgba(255, 0, 0) !important; 
}

.contact-text-red-ks{
	color: red;
	padding-left: 2px;
}

.legal a{
	padding-right: 10px;
}

/* MOBILE SIZES */
/*medium screen */
@media only screen and (max-width:847px) and (min-width:768px) {
	.navbar-brand {
		display: none;
	}

	div#navbar-large {
		display: flex !important;
		justify-content: center !important;
	}

	li.more {
		display: none !important;
	}

	.shop_info {
		width: 80% !important;
	}

	.albums,
	.singles,
	.other {
		padding-bottom: 15px;
	}

	.filter h4 {
		min-height: 3em;
	}

	.back {
		text-align: left;
		padding-left: 10% !important;
		padding-top: 32px;
		padding-bottom: 32px;
	}

}

/* small screen */
@media only screen and (max-width:767px) {
	li.dropdown {
		display: none !important;
	}

	.navbar-brand {
		display: none !important;
	}

	li.more {
		display: block !important;
	}

	.navbar-header a {
		display: block;
		position: absolute;
		left: 10%;
		right: 10%;
		font-size: 100%;
		padding-top: 10px;
	}

	/* nav a:hover{
		color: rgb(255, 0, 0) !important;
		opacity: 0.8 !important;
		text-decoration: none; 
	}
	 */
	.filterDiv {
		color: #ffffff;
		text-align: center;
		display: none;
	}

	.w3-half.filterDiv {
		width: 100%;
	}

	.show {
		display: block;
	}

	.btn {
		background-color: transparent !important;
	}

	.btn.active {
		border-bottom: 2px solid red;
		text-decoration: none !important;
		color: white;
		background-color: black !important;
		text-decoration: none !important;
		outline: none !important;
	}

	.w3-button:hover {
		border-bottom: 2px solid rgba(255, 0, 0);
		background-color: black !important;
		color: white !important;
		text-decoration: none;
	}

	.active {
		border-bottom: 2px solid red;
		text-decoration: none !important;
	}

	.shop_info {
		width: 80% !important;
	}

	.albums,
	.singles,
	.other {
		padding-bottom: 15px;
	}

	.filter h4 {
		min-height: 3em;
	}

	.back {
		text-align: left;
		padding-left: 10% !important;
		padding-top: 32px;
		padding-bottom: 32px;
	}

	.modal-content {
		width: 100%;
	}
}

/* x-small screen */
@media only screen and (max-width:600px) {
	.w3-button:hover {
		border-bottom: 2px solid rgba(255, 0, 0);
		background-color: black !important;
		color: white !important;
		text-decoration: none;
	}

	.shop_info {
		width: 80% !important;
	}

	.back {
		text-align: left;
		padding-left: 10%;
		padding-top: 32px;
		padding-bottom: 32px;
	}

	.tracklisting {
		text-align: center !important;
	}

	.media_selection .tablink {
		display: block !important;
	}

	.media_selection {
		padding-top: 25px;
	}

	.media_selection a {
		padding-top: 25px;
	}

	.albums,
	.singles,
	.other {
		padding-bottom: 15px;
	}

	.filter h4 {
		min-height: 3em;
	}

	.gallery {
		padding-bottom: 0 !important;
	}

	.gallery .w3-card {
		padding-bottom: 5%;
	}

	.modal-content {
		width: 100%;
	}

	.booking-agencies img{
		width: 50%;
	}

	#ibd{
		padding-top:15px;
	}
	
	.record-labels{
		padding-left:5%;
		padding-right: 5%;
	}

	.record-labels img{
		padding-top:15px;
		padding-bottom: 15px;
	}

	.endorsements img{
		width: 20%;
	}

	#nuclear{
		width: 15%;
	}

	
	#inverse{
		width: 18%;
	}
	
	#saturnal, #alt{
		width: 16%;
	}
	
	#electric{
		width: 40%;
	}
}