* {
	box-sizing: border-box;
}
/* Resetting list environment */
ul {
	padding: 0;
	margin: 0;
}

/* Logo top-left */
div.logo {
	position: absolute; left: 40px; top: 30px
}
/* Copyright note bottom-left */
div.copyright {
	position: absolute; left: 40px; bottom: 30px; position: fixed; z-index: 99999;
}
/* Language menu bottom-right */
div.language {
	position: absolute; left:calc(100vw - 100px); bottom: 30px; position: fixed; z-index: 99999;
}
/* Navigation bar and button */
.navbar {
	position: absolute; right: 40px; top: 45px; min-height: 50px; margin-bottom: 20px; z-index: 1000;
}


/* Main content */
div.contentframe {
	position: absolute; width: calc(100% - 10px); top: 100px; height:calc(100% - 160px); padding: 0; overflow-y: auto; overflow-x: hidden;
}
@media (min-width:980px) { /* Has full bottom available */
	div.contentframe {
		height:calc(100% - 100px); 
	}
}

div.content {
	position: relative; left: 10%; width: 80%;
}
@media (min-width:980px) {
	div.content {
		left: 15%; width: 70%;
	}
}
@media (min-width:1200px) {
	div.content {
		left: 20%; width: 60%;
	}
}

/** Two column layouts **/
div.musiker, div.musik, img.bilder {
	display:inline-block;
	margin: 0 20px 30px 0;
	max-width: 450px;
	vertical-align:top;
}
div.musik {
	margin-bottom: 50px;
}

div.musiker, div.musik, img.bilder {
	width: 100%;
}
@media (min-width:840px) {
	div.musiker, div.musik, img.bilder {
		width: 45%;
	}
}


/** Spezielle Ausrichtungen von Layouts **/
/* Tabelle Konzerte */
table.konzerte {
	min-width: 750px;
}
table.konzerte td {
	padding: 7.5px 15px;
}

/* Presseberichte */
div.presse {
	padding: 0 0 30px;
}

/* Musiker */
div.musiker h2 {
	margin-bottom: 0;
}
div.musiker p {
	margin: 5px 0 10px;
}
div.musiker img {
	width: 100%;
}
.musikerdetail {
	margin-top: -18px; /* height of one line */ 
   overflow: hidden;
   max-height: 1500px;
   opacity: 1;
}
.hidedetail {
   max-height: 0;
   opacity: 0;
}

/* Musikbeispiele */
div.musik {
   position: relative;
   min-height: 100px;
   padding: 10px;
}
div.musik audio {
	padding-top:10px;
	width: 100%;
}

/* "Social-icons" main page */
div.icons {
	display:flex;
	width: 50%;
	min-width: 250px;
	margin-left:auto; margin-right:auto;
	margin-top: 45px;
}
div.icons a, div.icons a:hover, div.icons a:focus {
	margin: 0 auto;
}
div.blend {
   position: relative;
   width: 4vw;
   min-width: 60px;
   height: 2.5vw;
}
div.blend img {
	position: absolute;
	width: 100%;
   left:0;
}

/* Navigation bar details */
.navbar::after, .navbar-header::after {
	clear: both;
}
/* The Button */
.navbar-header {
	float: right;
}
.navbar-toggle {
	position:relative;
}
button {
	width: 40px; height: 40px; z-index: 9999;
}

/* The menu itself */
.navbar-nav {
	list-style: inside none none;	z-index: 5000;
}
.navbar-nav > li {
	position: relative;
	display: block;
	margin: 0 10px;
}
.navbar-nav a {
	padding-bottom: 3px;
}
#navbar-menu {
	overflow: visible;
	max-height: 1500px;
	padding: 30px 10px 10px;
}
#navbar-menu.collapsed {
	overflow-y: auto;
	max-height: 0px;
	padding: 0;
}


@media (min-width:840px) { /* or 768px */
	.navbar-toggle {
		display:none
	}
	#navbar-menu.collapsed {
		overflow-y: visible;
		max-height: 1500px;
		padding: 0;
	}
	.navbar-nav>li {
		float:left
	}

}
@media (min-width:992px) {
}
