@charset "UTF-8";
/* CSS Document */

@import url(normalize.css);

@import url(all.css);

@import url("https://p.typekit.net/p.css?s=1&k=fgv5otw&ht=tk&f=44424&a=41915249&app=typekit&e=css");

@import url("https://cdn.jsdelivr.net/npm/glightbox/dist/css/glightbox.min.css");

@font-face {
font-family:"bebas-neue-pro";
src:url("https://use.typekit.net/af/c9f9f2/00000000000000007735c8ad/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("woff2"),url("https://use.typekit.net/af/c9f9f2/00000000000000007735c8ad/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("woff"),url("https://use.typekit.net/af/c9f9f2/00000000000000007735c8ad/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:500;font-stretch:normal;

	  /* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
	font-family: "bebas-neue-pro", sans-serif;
	font-weight: 600;
	font-style: normal;
}

main{
			overflow-x:hidden;

}

p {
	font-family: "bebas-neue-pro", sans-serif;
	font-weight: 400;
	font-style: normal;
	color: #000;
	font-size: 1em;
}

body{
		padding:0;
	margin:0; /*getting rid of default styling*/
	font-family: "bebas-neue-pro", helvetica, sans-serif;
	letter-spacing:1.5px;
	text-transform: uppercase;
	font-size:1em;
	width:100vw;
	position:relative;
}

.wrapper{
	position: relative;
}

a{
	text-decoration:none;
	color:rgba(247,74,83,1);
		 -webkit-transition: all 0.2s ease-in-out;
 -moz-transition: all 0.2s ease-in-out;
 -ms-transition: all 0.2s ease-in-out;
 -o-transition: all 0.2s ease-in-out;
 transition: all 0.2s ease-in-out;
}

a:hover{
	color: rgba(0,0,0,1.00);
}

/* //////////////////////// FIXED NAV //////////////////////////*/
.fixed-nav{
	width: 100vw;
	height: 20vh;
	display:flex;
	flex-direction:row;
	align-items: center;
	justify-content: space-around;
}

.logo-nav{
width:5vw;
}

.logo-nav img{
	width:100%;
}

.last-navdiv{
	padding-right:10vw;
}

/* //////////////////////// Burger Menu //////////////////////////*/

	/* GENERAL STYLES */
.visuallyHidden {
    position: absolute; 
    overflow: hidden; 
    clip: rect(0 0 0 0); 
    height: 1px; width: 1px; 
    margin: -1px; padding: 0; 
	border: 0; 
}


.hamburger-button {
    margin-right:30px;
    margin-top: 0px;
    width: 30px;
    height: 30px;
    position: absolute;
	right:22px;
	top:-90px;
	z-index:99999;
}

.hamburger-button:hover {
	cursor: pointer;
}
	
.hamburger-button .bar {
    padding: 0;
    width: 30px;
    height: 4px;
    background-color: rgba(247,74,83,1);
    display: block;
    border-radius: 4px;
    transition: all 0.4s ease-in-out;
    position: absolute; 
}

.bar1 {
    top: 0;
}

.bar2,
.bar3 {
    top: 13.5px;
}

.bar3 {
    right: 0;
}

.bar4 {
    bottom: 0;
}


/* HAMBURGER 4 */

.hamburger-button .bar4 {
    top: 13.5px;
}

.bar5 {
    bottom: 0px;
}

.hamburger-button .bar {
    transition: all 0.4s ease-in-out, transform 0.4s ease-in-out 0.4s;
}

.hamburger-button .bar2 {
    width: 1px;
    transform: rotate(90deg);
    left: 13.5px;
}

.hamburger-button .bar3 {
    width: 1px;
    left: 13.5px; 
}

.checkbox:checked + label > .hamburger-button > .bar1{
    top: 13.5px;
    background-color: transparent;
}

.checkbox:checked + label > .hamburger-button > .bar2{
    left: 0px;
    width: 30px;
    transform: rotate(45deg);
}

.checkbox:checked + label > .hamburger-button > .bar3{
    left: 0;
    width: 30px;
    transform: rotate(-45deg);
}

.checkbox:checked + label > .hamburger-button > .bar4{
    background-color: transparent;
}

.checkbox:checked + label > .hamburger-button > .bar5{
    bottom: 13.5px;
    background-color: transparent; 
}

.inherit{
display:none;
}



.sticky.inherit{
	display:inherit;
}

#sticky-nav a{
	color: rgba(247,74,83,1) ;
}

#sticky-nav a:hover{
	color: rgba(0,0,0,1.00);
	text-decoration: underline;
}

.navbar{
position: absolute;
  top:-20vh;
  opacity:.98;
  width: 18vw;
  right:-18.5vw;
  transition:1s;
  background-color: rgba(255,255,255,1);
  color:rgba(247,74,83,1);
  padding-bottom:50px;
  border: 1px solid rgba(247,74,83,1);
}

.navbar.open{
	right:0;
	z-index:99999;
}
.navbar ul{
	list-style:none;
	margin-top:15vh;
	font-size:1em;
	font-family: bebas-neue-pro;
	z-index:9999;
}

.navbar ul.submenu{
  margin-top:0px;
  font-size:0.7em;
}

.navbar ul li{
	border-bottom:1px gray;
	line-height:5vh;
	padding:1vh 1vh 0 1vh;
	text-align:left;
	 -webkit-transition: all 0.2s ease-in-out;
 -moz-transition: all 0.2s ease-in-out;
 -ms-transition: all 0.2s ease-in-out;
 -o-transition: all 0.2s ease-in-out;
 transition: all 0.2s ease-in-out;
}

.navbar ul li:hover{
	cursor:pointer;
	text-decoration: underline;
	transform:translateX(3%);
	z-index:99999;
}

.navbar ul li a:hover{
	transform:translateX(3%);
}

#sticky-nav{
	position:fixed;
	right:0;
	z-index:200000;
}

/*///////////////social bar ////////////*/


.wrap-vert{
	z-index:9999;
	padding: 10px 5px 10px 5px;
	border-radius:20px;
	background-color:rgba(4,4,4,.80);
	height:40vh;
	display:flex;
	flex-direction: column;
	position: fixed;
	top:35vh;
	transform:tranlate(0,-50%);
	right:2.2vw;
	align-items: center;
	justify-content: space-around;


	
	
}

.insta {
	width:40px;
}

.fb{
	padding-top:8px;
	width:20px;
}

.sc, .ra{
	width:50px;
	padding-top:8px;
}


/*//////////////////// COVER //////////////////*/

.cover-photo{
	width:100vw;
}


.cover-photo img{
	width:100%;
}

h1{
	color: rgba(247,74,83,1);
	font-size: 10vw;
	letter-spacing: 0.1em;
	position:absolute;
	top:55%;
	left: 50%;
	transform: translate(-50%,0);
	margin:0;
}

/*//////////////////// DATES //////////////////*/
*,
*::before,
*::after {
  box-sizing: border-box;
}

#dates{
	margin-bottom:60px;
}

p.club {
  margin: 0 0 13px 0;
	font-weight:400;
	font-size:1.1em;
	letter-spacing: 0.1em;

}


.month { 
	font-size:4em;
	text-align: left; 
}

.container {
  width: 95%;
  max-width: 1220px;
  margin: 0 auto;
}

.gig {
  display: grid;
  grid-template-columns: 1fr 3fr;
  position: relative;
}


.gig__date {
  font-size: 4.7em;
  font-weight: 600;
  padding: 30px;
  position: sticky;
  top: 0;
  text-align: left;
  height: calc(10vw + 20px);
  transition: all 0.2s ease-in;
}
article{
	height:150px;
}

.gig__content {
  border-top: 2px solid rgba(255,103,103,1);
  display: grid;
	height:150px;
  grid-template-columns: 1fr 4fr;
  grid-gap: 30px;
  padding: 28px 0;
	align-items: center;
}

.gig__content .city {

  font-weight: 600;
}

.gig__content .story {
  line-height: 2.2em;
}

@media (max-width: 600px) {
  .gig__content {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 576px) {
  .gig__content .story {
    font-size: 15px;
  }
}


/*//////////////MUSIC /////////////////*/

.background-black{
	position:relative;

	
}

.background-black img{
height:150vh;
}


h2{
	color:rgba(255,103,103,1);
	font-size:10vh;
	position: absolute;
	top:3vh;

}

.sc-embed{
	position:absolute;
	top:33vh;
}

.sc-embed-solo{
	position:absolute;
	top:85vh;
}


/*///////////////////PRESS /////////////////////////*/
.halb{
  display: flex;
  flex-wrap: wrap;
}


.halb img{
	height:70vh;
	
}



/*//////////// IMPRESSUM /////////////*/
.impressum {
	text-align:center;
}



@media screen and (min-width: 1280px){
  //HD Screens
  .container {
    margin: 0 auto;
    width: 1250px;
  }
}

@media screen and (max-width: 690px){
	
	body{
		overflow-x: hidden;
	}

.inherit{
		display:inherit;
	}
	
	.cover-photo{
	}

	.cover-photo img{
	width: 210vh;
	transform: translate(-35%,0);
	}
	
	main{
	}
	
	
	h1{
		font-size:25vw;
			text-align: center; 
		
	}
	
	#sticky-nav{
		display:inherit;
		top:20vh;
	}
	
	#flex-nav{
display:none;
	}
	
	.navbar{
		width:60vw;
		right:-60.5vw;
	}
	
	.gig__date{
		font-size:3.3em;
	}
}

/*///--media screen max width 430 ///*/
