@font-face {
	font-family: Metropolitan;
	src: url('fonts/m.eot'); /* IE9 Compat Modes */
	src: url('fonts/m.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	     url('fonts/m.woff2') format('woff2'), /* Super Modern Browsers */
	     url('fonts/m.woff') format('woff'), /* Pretty Modern Browsers */
	     url('fonts/m.ttf')  format('truetype'), /* Safari, Android, iOS */
	     url('fonts/m.svg#svgFontName') format('svg'); /* Legacy iOS */
}

html {
	height:100%;
}
html:root {
	background-image:linear-gradient(black,#0D0D0D,#0D0D0D,black);
	background-attachment:fixed;
	--mainColor:black;
}
body {
	z-index:-1;
	overflow-y:scroll;
	height:fill-available;
	height:-webkit-fill-available;
	height:-moz-available;
	margin:0px;
	/**linear-gradient(#0D0D0D,#222,#222,#444);**/
	background-repeat:no-repeat;
	background-attachment:fixed;
	position:relative;
}
#container {
	height:fill-available;
	height:-webkit-fill-available;
	height:-moz-available;
}
#overlay {
	height:fill-available;
	height:-webkit-fill-available;
	height:-moz-available;
	position:absolute;
}
#coverdiv {
	height:inherit;
	background-color:black;
	top:0;
	position:relative;
}
#cover {
	width:100%;
}
#arrow {
	position: absolute;
	width: 25%;
  left: 37.75%;
	top:20%;
	opacity: 0;
	-webkit-animation-name: arrow;
	-webkit-animation-duration: 4s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-direction: alternate-reverse;
	animation-name: arrow;
	animation-duration: 4s;
	animation-timing-function: ease-in-out;
	animation-direction: alternate-reverse;
	animation-iteration-count: infinite;
}
@keyframes  arrow{
	from {
		top:20%;
		opacity: 0;
	}
	to {
		top: 40%;
		opacity: 1;
	}
}
@-webkit-keyframes arrow {
	from {
		top:20%;
		opacity: 0;
	}
	to {
		top: 70%;
		opacity: 1;
	}
}
#menue {
	width:100%;
	position:absolute;
	bottom:0;
}
#menue ul {
	overflow:hidden;
	list-style-type:none;
	margin:10px auto auto;
	padding:0;
	width:fit-content;
	width:-webkit-fit-content;
	width:-moz-fit-content;
}
#menue li {
	float:left;
}
.button {
	color:#EEE;
	border:5px double #999;
	padding:15px 50px;
	text-align:center;
	text-decoration:none;
	display:inline-block;
	font-size:14px;
	margin:4px 2px;
	margin-right:15px;
	cursor:pointer;
	width:32px;
	height:16px;
	background-size:cover;
}
.button:hover {
	background-color:white;
	color:black;
}
#homebtn {
	background-image:url("./imgs/homebtn.png");
}
#homebtn:hover {
	background-image:url("./imgs/homebtnhov.png")!important;
}
#homebtn.active {
	background-image:url("imgs/homebtncur.png");
}
#newsbtn {
	background-image:url("./imgs/newsbtn.png");
}
#newsbtn:hover {
	background-image:url("./imgs/newsbtnhov.png")!important;
}
#newsbtn.active {
	background-image:url("imgs/newsbtncur.png");
}
#medbtn {
	background-image:url("./imgs/medbtn.png");
}
#medbtn:hover {
	background-image:url("./imgs/medbtnhov.png")!important;
}
#medbtn.active {
	background-image:url("imgs/medbtncur.png");
}
#bandbtn {
	background-image:url("./imgs/bandbtn.png");
}
#bandbtn:hover {
	background-image:url("./imgs/bandbtnhov.png")!important;
}
#bandbtn.active {
	background-image:url("imgs/bandbtncur.png");
}
#shopbtn {
	background-image:url("./imgs/shopbtn.png");
}
#shopbtn:hover {
	background-image:url("./imgs/shopbtnhov.png")!important;
}
#shopbtn.active {
	background-image:url("imgs/shopbtncur.png");
}
#konbtn {
	background-image:url("./imgs/konbtn.png");
}
#konbtn:hover {
	background-image:url("./imgs/konbtnhov.png")!important;
}
#konbtn.active {
	background-image:url("imgs/konbtncur.png");
}
#jfbmusic {
	background-image:url("imgs/JFBmusic_silverbtn.png");
}
#jfbmusic:hover {
	background-image:url("imgs/JFBmusic_silverbtnhov.png")!important;
}
.dropbtn {
	position:fixed;
	top:0;
	height:50px;
	background-color: #999;
	color: white;
	padding: 16px;
	font-size: 16px;
	border: none;
	cursor: pointer;
}
#dropdownmenu {
	display:none;
}
.dropdown {
  	position: relative;
  	display: inline-block;
}
.dropdown-content {
	top:0;
	margin-top:50px;
  	display: none;
  	position: fixed;
  	background-color: #f9f9f9;
  	min-width: 160px;
  	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  	z-index: 1;
}
.dropdown-content a {
	color: black;
  	padding: 12px 16px;
  	text-decoration: none;
  	display: block;
}
.dropdown-content a:hover {
	background-color: #ddd;
}
.dropdown-content a:visited {
	color: black;
}
.dropdown:hover .dropdown-content {
  	display: block;
}
.dropdown:hover .dropbtn {
  	background-color: darkgrey;
}

#confoot {
	min-height:101%;
	position:absolute;
	width:100%;
	z-index:-1;
}
#grad {
	width:100%;
	position:fixed;
	z-index:2;
	height:30px;
	background-image:linear-gradient(black,rgba(0,0,0,0));
	opacity:0;
}
#content {
	margin-top:78px;
	width:100%;
	/**border:1px solid red;**/
	-moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
}
.side {
	position:fixed;
	float:left;
	width:15%;
	height:100%;
	background-color:black;
	z-index:1;
}
#left {
	background-image:url("imgs/left.png");
	left:0;
}
#middle {
	margin:0 15%;
	padding:3%;
	width:64%;
	float:left;
}
.text {
	font-family: "Arial", "Times New Roman", Times, serif;
	font-size:18px;
	color:white;
	border: 8px groove grey;
	margin:25px 0;
	padding-bottom:20px;
}
.text p {
	letter-spacing:2px;
	text-align:justify;
	margin:0 8%;
}
.text h1, .text h2, .text h3 {
	font-family: "Metropolitan", "Arial", "Times New Roman", Times, serif;
	text-align:center;
	text-shadow:4px 4px black;
	font-size:40px;
}
.text h2 {
	text-transform:uppercase;
	font-size:28px;
}
.text h3 {
	font-size: 32px;
}
.email {
	border:8px groove grey;
}
.email button {
	background-color:#222;
	border:none;
	display:block;
	width:100%;
	color:white;
	font-size:large;
}
.email button:hover {
	color:black;
	background-color:#DDD;
}
.video_frame {
	display:block;
	margin:50px auto 0;
	width:98%;
	border: 8px groove grey;
}
.mySlides {
	display:none;
}
.w3-left, .w3-right, .w3-badge {
	cursor:pointer;
}
.w3-badge {
	height:13px;
	width:13px;
	padding:0;
}
#slideshow {
	margin:0 auto;
	max-width:800px;
}
#right {
	background-image:url("imgs/right.png");
	right:0px;
}

.linkbuttons {
	height:fill-available;
	height:-webkit-fill-available;
	height:-moz-available;
	position:relative;
}
.linkbutton {
	margin-top:3%;
	z-index:2;
	position:fixed;
	left:0;
	background-repeat:no-repeat;
	background-position:center;
	background-size:70% 70%;
	cursor:pointer;
}
.linkbutton:hover {
	background-color:rgba(255,255,255,0.2);
}
.linkbutton img {
	width:35%;
	display: block;
	margin: 0 auto;
}
#amazonbtn {
	margin-top:12%;
}
#spotifybtn {
	margin-top:21%;
}
#deezerbtn {
	margin-top:30%;
}
.btnright {
	left:auto;
	right:0;
}
#facebookbtn {
	margin-top:12%;
}
footer {
	position:absolute;
	bottom:0;
	width:100%;
	text-align:center;
}
#alt_linkbuttons {
	display:none;
	overflow:hidden;
	width:100%;
	white-space:nowrap;
	max-height:150px;
}
#footer_inner {
	/*background-color:rgba(150,150,150,0.2);*/
}
#alt_linkbuttons a {
	display:inline-block;
	padding:1px;
	height:100%;
	width:10%;
}
#alt_linkbuttons a:hover {
	background-color:rgba(127,255,212,0.2);
}
#alt_linkbuttons img {
	width:75%;
}
#rechtliches {
	margin-top:10px;
	width:100%;
	text-align:center;
	font-size:16px;
}
#rechtliches a {
	margin-right:5px;
}
#rechtliches a:link, #rechtliches a:visited {
	color: #777;
}
#rechtliches a:hover {
	color:white;
}
.clear:before, .clear:after {
	content:" ";
	display:table;
}
.clear:after {
	clear:both;
}

.PLACEHOLDER h1, .PLACEHOLDER h2, .PLACEHOLDER p{
	font-size:40px;
	font-weight:bold;
	color:red;
}
