/*
<style>
/**/


/* Version 2021-01-25 CSP */


@import url("privacy-policy.css?ver=not-set");
@import url("messages.css?ver=not-set");


body {
	font-family: 'Lucida Grande', Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-size: 80%;
	background: url(/assets/images/klavins-bglower.jpg) 0 -259px repeat-x rgb(225, 213, 198);
	margin: 0;
	padding: 0;
}
html, body {
	overflow: visible !important;
}

#wrapper {
	max-width: 1112px;
	min-width: 304px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}

.hide,
.schemaorg-hide {
	display: none;
}

.shadow {
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.75);
	margin: 0 auto;
	position: relative;
	width: 98%;
	height: 5px;
	z-index: -1;
}
.shadow.top {
	margin-bottom: -5px;
}
.shadow.bottom {
	margin-top: -5px;
	margin-bottom: 18px;
}

#mainbackground {
	margin: 0 0 -5px 0;
	background: #fefefe;
}
#header {
	width: 100%;
	height: 156px;
	background: #c33764;
	background-size: cover;
	background-position: center 38%;
}
#header {
	background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%);
}
#header.bg-home { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/home.jpg); }
#header.bg-fluegelverleih { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/fluegelverleih.jpg); }
#header.bg-gebrauchteklaviere { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/gebrauchteklaviere.jpg); }
#header.bg-klavierstimmung { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/klavierstimmung.jpg); }
#header.bg-klaviertransport { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/klaviertransport.jpg); }
#header.bg-klavierunterricht { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/klavierunterricht.jpg); }
#header.bg-klavierwerkstatt { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/klavierwerkstatt.jpg); }
#header.bg-neuinstrumente { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/neuinstrumente.jpg); }
#header.bg-oeffnungszeiten { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/oeffnungszeiten.jpg); }
#header.bg-sauter { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/sauter.jpg); }
#header.bg-schimmelkonzert { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/schimmelkonzert.jpg); }
#header.bg-grotriansteinweg { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/grotriansteinweg.jpg); }
#header.bg-ueber-uns { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/ueber-uns.jpg); }
#header.bg-veranstaltungen { background-image: linear-gradient(180deg, rgba(0,0,0,0.1) 33%, rgba(0,0,0,0.8) 100%), url(/assets/css/images/header/veranstaltungen.jpg); }


a,
a:visited {
	text-decoration: none;
	color: #06c;
}
a:hover {
	text-decoration: underline;
	color: #147;
}
a.whitelink {
	color: #fff;
}
a.klaviatur {
	display: flex;
	justify-content: center;
	align-content: center;
	width: 100%;
	height: 200px;
	margin: 15px 0;
	border: 0;
	text-decoration: none;
	background-image: url(/assets/images/Klaviatur-Klavins-BG.png);
	background-position: center 0;
}
a.klaviatur:hover {
	background-position: center bottom;
}
a.klaviatur img {
	width: 96%;
	padding: 15px 0;
}


span.email {
	color: #06c; /* use link color */
}
span.emailwhite,
span.emailwhite a {
	color: white;
}

button {
	font-family: 'Lucida Grande', Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}

#homebutton {
	background: url(/assets/images/logos/klavierhaus-klavins-logo_233x85.svg) transparent;
	background-position: top left;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	min-width: 135px;
	min-height: 85px;
	width: 225px;
	top: 36px;
	left: 30px;
	display: block;
	border: 0;
	font-size: 0;
}
#homebutton:hover {
	background-color: rgba(255, 255, 255, 0.05);
}
@media screen and (max-width: 530px) {
	#homebutton {
		width: 50%;
	}
}


/* first nav level */

nav#globalnav {
	display: flex;
	flex-direction: column;
}
nav#globalnav ul {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	padding: 0;
	list-style: none;
	line-height: 26px;
	font-size: 1.2em;
	font-weight: 600;
	margin: -27px 0 0 81px;
}
nav#globalnav a,
nav#globalnav a:link,
nav#globalnav a:visited {
	padding: 5px 10px;
	margin: 1px 4px 2px 0;
	text-decoration: none;
	white-space: nowrap;
	color: #ececec;
	background-color: rgba(0, 0, 0, 0.33);
	border-radius: 2px;
}
nav#globalnav a:hover {
	color: #fff;
	background: rgba(167, 0, 15, 0.85);
	transition: all 0.3s ease-out;
}
nav#globalnav a.active {
	color: #000;
	background-color: #fff;
	border-radius: 1px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}


/* second nav level */

nav#chapternav {
	display: grid;
	margin: 2px 21px;
}
nav#chapternav ul {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: 25px;
	font-size: 1.1em;
}
nav#chapternav a,
nav#chapternav a:link,
nav#chapternav a:visited {
	float: left;
	height: 25px;
	padding: 4px 11px;
	margin: 2px 1.1em 2px 0;
	text-decoration: none;
	white-space: nowrap;
	color: #000;
	border: 1px solid rgba(0, 0, 0, 0.0);
	border-radius: 3px;
}
nav#chapternav a.active {
	color: #a6000f;
}
nav#chapternav a:hover {
	color: #a6000f;
	border: 1px solid rgba(0, 0, 0, 0.06);
	transition: all 0.3s ease-out;
}


/* third nav level */

nav#brandnav {
	display: grid;
	margin: 18px 7.5%;
}
nav#brandnav ul {
	position: relative;
	margin: 0 0 0 -10px;
	padding: 0;
	list-style: none;
	line-height: 26px;
	font-size: 1.2em;
}
nav#brandnav a,
nav#brandnav a:link,
nav#brandnav a:visited {
	float: left;
	height: 26px;
	padding: 4px 12px;
	margin: 2px 1.0em 2px 0;
	text-decoration: none;
	white-space: nowrap;
	color: #000;
	border: 1px solid rgba(0, 0, 0, 0.0);
	border-radius: 3px;
}
nav#brandnav a.active {
	color: #a6000f;
}
nav#brandnav a:hover {
	color: #a6000f;
	border: 1px solid rgba(0, 0, 0, 0.06);
	transition: all 0.3s ease-out;
}



h1,
h2,
h3,
h4,
h5,
div.two-col-div p:first-child,
.previoush4 {
	font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, sans-serif;
	line-height: 1.2em;
}
h1 {
	font-size: 2.4em;
	font-weight: 400;
	margin: 30px 0 10px 0;
}
.hiddenhomeh1 {
	display: none;
}
h2 {
	line-height: 1.4em;
	font-size: 1.8em;
	font-weight: 600;
	margin: .3em 0 .6em 0;
	padding-top: 1.0em;
}
h3 {
	font-size: 1.4em;
	margin-top: 2em;
}
h4,
div.two-col-div p:first-child,
.previoush4 {
	font-weight: normal;
	font-size: 1.2em;
	margin: 0.4em 0 0 0;
	padding-bottom: 0.1em;
}
div.two-col-div p:first-child,
.previoush4 {
	color: #767676;
	border-bottom: 1px solid #ccc;
	text-indent: .3em;
	margin: 0.4em 0 0 0;
	padding-bottom: 0.1em;
}
h5 {
	font-size: 1.2em;
	margin: 1.3em 0;
	font-weight: 500;
	line-height: 1.5em;
}


.details { margin: .7em 0 .4em .7em; }

#contentwide .details { margin: -36px 0 0 0; }
#contentwide .details span { color: #9d9a94; font-weight: 500; margin-left: 7px; }

.iframewrapper {
	overflow: hidden;
	padding-top: 56.25%; /* 16:9*/
	position: relative;
	margin: 40px 0;
	clear: both;
}
.iframewrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	border: 0;
	width: 100%;
	height: 100%;
}

.iframewrapper2 {
	overflow: hidden;
	position: relative;
	margin: 40px 0;
	/*clear: both;*/
}
.iframewrapper2 .buttoncontent {
	display: block;
	aspect-ratio: 21/9 auto;
	padding: 5px;
	background-color: #000;
	background-image: url('images/youtube-bg.jpg');
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: cover;
	font-size: 16px;
	color: #fff;
	text-shadow: 0 0 2px rgba(0,0,0,.5);
	cursor: pointer;
}
.iframewrapper2 .buttoncontent:hover {
}

.iframewrapper2 .buttoncontent .youtubetitle {
	float: left;
	padding: 7px;
	margin-right: 40px;
	display: inline-flex;
}
.iframewrapper2 .buttoncontent .youtubetitle-circle {
	width: 20px;
	height: 20px;
	font-weight: 600;
	color: #fff;
	padding: 11px 10px 9px 10px;
	margin-right: 11px;
	background-color: #be360c;
	border-radius: 20px;
	display: inline-table;
	text-align: center;
}
.iframewrapper2 .buttoncontent .youtubeshow {
	border: none;
	position: absolute;
	right: 18px;
	top: 18px;
}
.iframewrapper2 .buttoncontent .ytplay {
	position: absolute;
	display: inline-block;
	top: 50%;
	left: 50%;
	width: 4em;
	height: 3em;
	margin-top: -1.5em;
	margin-left: -2em;
	padding: 0;
	background: red;
	border-radius: 40% / 10%;
	font-size: 16px;
	text-align: center;
	text-indent: 0.1em;
	color: #fff;
	transition: all 150ms ease-out;
}
.iframewrapper2 .buttoncontent .ytplay::before {
	background: inherit;
	border-radius: 5% / 40%;
	bottom: 9%;
	content: "";
	left: -5%;
	position: absolute;
	right: -5%;
	top: 9%;
}
.iframewrapper2 .buttoncontent .ytplay::after {
	border-style: solid;
	border-width: 1em 0 1em 1.732em;
	border-color: transparent transparent transparent rgba(255, 255, 255, 0.85);
	content: ' ';
	font-size: 0.75em;
	height: 0;
	margin: -1em 0 0 -0.65em;
	top: 50%;
	position: absolute;
	width: 0;
}


.iframewrapper2 iframe {
	border: 0;
	width: 100%;
	height: auto;
}

.detailansicht img {
	width: 100%;
	height: initial;
}

.detailansicht p {
	line-height: 1.6em;
	font-weight: bold;
	font-size: 15px;
}

p {
	font-size: 1em;
	line-height: 1.6em;
	-webkit-hyphenate-character: '–';

	/* These are technically the same, but use both */
	overflow-wrap: break-word;
	word-wrap: break-word;

	-ms-word-break: break-all;
	/* This is the dangerous one in WebKit, as it breaks things wherever */
	word-break: break-all;
	/* Instead use this non-standard one: */
	word-break: break-word;

	/* Adds a hyphen where the word breaks, if supported (No Blink) */
	-ms-hyphens: auto;
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}
p[lang='de'] {
	-webkit-locale: 'de';
}

dl {
	font-size: 1em;
	line-height: 2.1em;
	margin: 1.4em 0;
	padding: 0;
}
dt {
	margin: 15px 0 5px 23px;
}
dd {
	margin: 2px 0 4px 0;
}


dl.triple img {
	float: left;
	margin: 0 20px 10px 0;
}
dl.triple dt {
	margin: 15px 0 5px 0;
	font-size: 16px;
	font-weight: 500;
	color: #a6000f;
}
dl.triple dd {
	display: flex;
	flex-direction: column;
	min-height: 120px;
	margin: 0 0 14px 0;
	line-height: 2em;
}
dl.triple dd ul {
	margin: 0.5em 0;
	padding: 0 0 0 1.5em;
}


ul.bulletless {
	list-style: none;
}

ol {
	padding-left: 20px;
	margin-top: 1.5em;
	margin-bottom: 1.5em;
}
ol li {
	margin-bottom: 1em;
}


ol.konzertverleih {
	margin: 0 0 0 23%;
	padding: 0 0 0 20px;
	font-size: 1.5em;
	line-height: 1.65em;
	font-weight: 600;
}
ol.konzertverleih a {
	color: #000;
}
ol.konzertverleih a:hover {
	color: #06c;
}


hr {
	margin-bottom: 1.2em;
	border: none;
	border-top: 1px solid #dcdcdc;
	border-bottom: 1px solid #efefef;
	clear: both;
}

#show { margin-bottom: 1.4em; }

.red {
	color: #ab0644;
	margin: -.7em 0 1em 0;
	border-bottom: none;
	text-indent: 0;
}
.gray {
	color: #757575;
	margin: -1em 0 1em 0;
	border-bottom: none;
	text-indent: 0;
}

.downloadbox {
	width: 306px;
	min-height: 109px;
	display: flex;
	justify-content: space-between;
	margin: -8px 0 16px 50px;
	padding: 12px 12px 4px 12px;
	float: right;
	background-color: rgb(249, 248, 247);
	border-radius: 6px;
	border: 1px solid #f1f1f1;
}
.downloadbox div {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.downloadbox p {
	font-size: 1.2em;
	line-height: 1.4em;
	margin: 2px 0 5px 12px;
}
.downloadbox p span {
	font-size: .85em;
	line-height: .85em;
}

.pressebox {
	background-color: #f1f0eb;
	border: 4px solid #eeede9;
	border-left: none;
	border-right: none;
	padding: 0 12px;
	margin: 1px 0;
}
.pressebox,
.pressebox h2,
.pressebox h3,
.pressebox h4,
.pressebox h5 {
	font-family: Georgia, "Times New Roman", Times, serif;
}
.pressebox h2 { color: #5671d5; }
.pressebox h3 { color: #989794; font-weight: normal; }
.pressetext {
	float: right;
	font-size: 4.5em;
	font-weight: bold;
	padding: 0 7px;
	color: #f6f5f0;
}
.right {
	text-align: left;
	margin: 30px 15px 0 15px;
}

#contentwide p.copyfooter {
	background: #222;
	color: #f9f9f9;
	margin: 44px 65px 15px 65px;
	padding: 9px 12px;
	text-indent: 0px;
	border: 6px solid #111;
}

.Stil1 { font-style: italic; }
.Stil2, dt { font-weight: bold; }
.Stil3 { color: #a6a6a6; }
.Stil4 { color: #ab0644; font-weight: bold; }
.Stil5 { color: #bbb; }


.brandoverview {
	background: url(/assets/images/Klaviatur-Klavins_big.jpg) repeat-x #000;
	min-height: 416px;
	margin: 0 -8.8% 3em -8.8%;
	color: #fff;
	padding: 2% 8.8%;
}
.brandoverview h1 {
	margin: 0;
	padding-top: 21px
}
.brandoverview .brands {
	display: flex;
	flex-flow: wrap;
	justify-content: space-between;
	padding: 21px 0;
}
.brandoverview .brands > div {
	width: 22%;
	min-width: 180px;
	padding: 21px 1%;
}
.brandoverview .brands > div div {
	border-left: 1px solid #bbb;
	padding-left: 11px;
}
.brandoverview .schimmelbrandlogo {
	width: 120px;
	margin: 0 0 15px 7px;
}
.brandoverview .yamahabrandlogo {
	width: 100px;
	margin: 7px 0 23px 7px;
}
.brandoverview .grotrianbrandlogo {
	width: 180px;
	margin: 10px 0 28px 7px;
}
.brandoverview .sauterbrandlogo {
	width: 112px;
	margin: -11px 0 17px 7px;
}
.brandoverview p {
	margin: 20px 0 0 0;
}
.brandoverview a,
.brandoverview a:visited {
	color: #ddd;
}
.brandoverview a:hover {
	color: #fff;
	text-decoration: none;
}


.verkaufte-insert {
	float: right;
	width: 26%;
	padding: 0 8% 20px 20px;
	margin: 0 0 0 20px;
}
.verkaufte-insert img {
	float: left;
	margin: 0 8px 0 6px;
}


#content {
	float: left;
	padding: 0 10px 10px 10px;
	margin: 11px 0 0 0;
	max-width: 555px;
}
#contentwide {
	padding: 0 7.5% 12px 7.5%;
	margin: 18px 0 0 0;
}
@media screen and (max-width: 530px) {
	#contentwide {
		padding: 0 5% 10px 5%;
	}
}


#content ol,
#content ol li ol,
#contentwide > ul,
#contentwide > section ul {
	padding: 2px 0 5px 2em;
}

#content ol li {
	margin: .5em 0 1em -5px;
	font-size: 1em;
	list-style-type: upper-roman;
	font-weight: bold;
}
#content ol li ol li { margin: .3em 0 .6em -5px; font-weight: normal }

#contentwide > ul li,
#contentwide > section ul li {
	margin: .3em 0 .7em -5px;
	font-size: 1em;
	list-style-type: square;
	line-height: 1.6em;
}

section.threecolsect {
	column-count: 3;
	widows: 3;
	orphans: 3;
	gap: 2em;
	margin: 30px 0;
	/* column-width: 10em;
	height: 40em;
	column-fill: auto; */
}
@media screen and (max-width: 1024px) {
	section.threecolsect {
		column-count: 2;
	}
}
@media screen and (max-width: 680px) {
	section.threecolsect {
		column-count: 1;
	}
}
section.threecolsect h3 {
	padding-top: 0;
	margin-top: 20px;
	margin-bottom: 5px;
}

section.threecolsect h3:first-child {
	margin-top: 0;
}


section.twocolsect {
	column-count: 2;
	widows: 3;
	orphans: 3;
	gap: 3em;
	margin: 30px 0 50px 0;
}
@media screen and (max-width: 680px) {
	section.twocolsect {
		column-count: 1;
	}
}
section.twocolsect > ol li {
	font-weight: 600;
}
section.twocolsect > ol li ol li {
	font-weight: 400;
}
section.twocolsect > ol:first-child {
	margin-top: 0;
}


/* alt, ersetzt durch col count siehe oben*/
ul.threecol {
	column-count: 3;
	column-gap: 1em;
	padding-left: 0;
	margin: 0 0 30px 0;
	list-style-type: none;line-height: 1.9em;
}


.flexbox-cols {
	display: flex;
	flex-wrap: wrap;
	gap: 4%;
	margin: 20px 0;
}
.flexbox-cols > div {
	width: 48%;
}
@media screen and (max-width: 768px) {
	.flexbox-cols > div {
		width: 100%;
	}
}


.sidenotes {
	float: right;
	background-color: #fff;
	padding: 1px;
	margin: .65em 4px 3px 0;
	border: 1px solid #ccc;
	max-width: 170px;
	font-size: 90%;
}
.sidenotes h2, .sidenotes h1 {
	line-height: normal;
	padding: 0 4px;
}
.sidenotes h2,
.sidenotes h1 {
	line-height: normal;
	padding: 0 4px;
}
.sidenotes p {
	line-height: normal;
	padding: 0 4px;
	margin: 0 0 .9em 0;
}


footer {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 1%;
	background-color: #ddd5c1;
	background-color: rgba(230, 221, 200, 0.25);
	background: url(/assets/images/klavins-bglower.jpg) 0 -319px repeat-x fixed rgb(225, 213, 198);
	background: linear-gradient(to top, rgba(230, 222, 212, 1), rgba(255, 255, 255, 1) 27.31%);
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: .9em;
}
footer p {
	margin: 0;
	padding: 9px 0 7px 0;
	text-align: center;
	line-height: 1.5em;
}
footer p strong {
	font-size: 1.1em;
	padding: .3em 0 .5em 0;
	font-weight: 500;
}
footer #navfooter {
	display: flex;
	flex-wrap: wrap;
	align-self: center;
	justify-content: space-around;
	width: 100%;
	max-width: 1112px;
	margin-top: 5px;
	padding: 28px 0 15px 0;
	font-size: 14px;
	border-top: 1px solid #2b2b2b;
	border-bottom: 1px solid #2b2b2b;
}
footer #navfooter ul:first-child {
	display: flex;
	flex-wrap: wrap;
}
#navfooter div,
#navfooter:first-child ul li {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
#navfooter div p,
#navfooter:first-child ul li p {
	text-align: left;
	margin-left: 14px;
}
#navfooter div p:last-child,
#navfooter:first-child ul li p:last-child {
	display: flex;
	align-items: center;
	justify-content: space-around;
	gap: 10%;
	width: 100px;
}
#navfooter ul {
	list-style: outside none none;
	margin: 0;
	padding: 0;
}
#navfooter > ul > li {
	padding: 7px 0;
}
#navfooter > ul > li > a {
	color: #6a5d54;
}
#navfooter > ul > li > a:hover {
	text-decoration: none;
	color: #000;
}
#navfooter > ul > li.isheader > a {
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.055em;
	color: #261c13;
}
footer .divinfo {
	display: flex;
	justify-content:center;
	color: #ebe3de;
	background-color: #6c5f53;
	border-top: 2px solid #e8dfd5;
}
footer .divinfo-inner {
	width: 100%;
	max-width: 1112px;
	margin: 0 7.5%;
	padding: 5px 4px 6px 4px;
	font-size: 12px;
	letter-spacing: 0.11em;
	text-transform: uppercase;
}
@media all and (max-width: 760px) {
	footer #navfooter {
		box-sizing: border-box;
		justify-content: space-between;
		padding-left: 7%;
		padding-right: 5%;
	}
	footer #navfooter > div {
		margin-bottom: 25px;
	}
	footer #navfooter > ul {
		flex: 0 0 45%;
		margin-bottom: 25px;
	}
}
@media all and (max-width: 500px) {
	footer #navfooter > ul {
		xflex: 0 0 100%;
	}
}
@media all and (max-width: 1000px) {
	footer.BL .divmitmachen,
	footer.EBK .divmitmachen {
		background-image: none;
	}
}
@media all and (max-width: 1280px) {
	footer .divinfo-inner {
		grid-template-columns: 1fr 1fr 1fr auto 1fr;
	}
}
@media all and (max-width: 750px) {
	footer .divinfo-inner {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 100px 100px;
		justify-items: center;
	}
	footer .divinfo a.erzbistum-koeln-logo {
		grid-column-start: 1;
		grid-column-end: 2;
		grid-row-start: 2;
		grid-row-end: 3;
	}
	footer .divinfo a.bmvi-logo {
		grid-column-start: 2;
		grid-column-end: 3;
		grid-row-start: 2;
		grid-row-end: 3;
		justify-self: center;
	}
}



img {
	border: none;
}
.imagemax100 {
	max-width: 100%;
}
.zwischenbild {
	margin: 30px -8.8% 30px -8.8%;
	display: block;
}

.fullwidthcontentimage {
	margin: 32px auto 45px auto;
}
.imgleft280 {
	margin: 2px 2% 25px 0;
	min-width: 42%;
	max-width: 48%;
	float: left;
}
.imgright280 {
	margin: 2px 0 25px 2%;
	min-width: 42%;
	max-width: 48%;
	float: right;
}
.imgright280.smaller {
	min-width: 30%;
	max-width: 33%;
}
.imgright280.extrasmall {
	min-width: 18%;
	max-width: 20%;
}
.zwischenbild img,
.fullwidthcontentimage img,
.imgleft280 img,
.imgright280 img {
	width: 100%;
	height: auto;
}
.zwischenbild video,
.fullwidthcontentimage video {
	object-fit: fill;
	width: 100%;
	height: auto;
}
.zwischenbild > span,
.fullwidthcontentimage > span,
.imgleft280 span,
.imgright280 span,
.iframewrapper2 span {
	float: right;
	margin-right: 6.5%;
	margin-top: -3px;
	color: #fff;
	background-color: #000;
	padding: 8px 16px;
	font-size: .9em;
}
.zwischenbild span a,
.fullwidthcontentimage span a,
.imgleft280 span a,
.imgright280 span a,
.iframewrapper2 span a {
	color: #fff;
	text-decoration: underline;
}
.bottombrandlogo {
	display: flex;
	justify-content: center;
	margin-top: 50px;
}


.imgleft236,
.imgright236 {
	position: relative;
	background: #fff;
	border: #eaeaea solid 1px;
	border-radius: 2px;
	padding: 6px 6px 4px 6px;
	width: 245px;
	font-size: .9em;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}
.imgleft236 {
	float: left;
	margin: -5px 45px 50px 0;
}
.imgright236 {
	float: right;
	margin: -5px 0 50px 45px;
}
.imgleft236 img,
.imgright236 img {
	width: 100%;
	height: auto;
}
.musicevent > .imgright236:nth-of-type(2n),
.musicevent > .imgright236:nth-of-type(4n),
.musicevent > .imgright236:nth-of-type(6n) {
	float: left;
	margin: -5px 25px 50px 0;
}
.musicevent > .imgright236:nth-of-type(3n),
.musicevent > .imgright236:nth-of-type(5n) {
	float: right;
	margin: -5px 0 50px 30px;
}
@media screen and (max-width: 530px) {
	.imgleft236,
	.imgright236 {
		width: 46%;
		height: auto;
		margin: 19px 14px 10px 0;
	}
	.imgright236 {
		margin: 19px 0 10px 14px;
	}
}

/* Altlasten wegen Veranstaltungen vor 2012 */
.imgnone560,
.imgnone500 { text-align:center; background-color:#fff; padding:5px; margin:5px 0; border:#bbb solid 1px; font-size:0.8em; }
.imgleft360 { text-align:center; background-color:#fff; padding:5px; max-width: 48%; float:left; margin:5px 3% 25px 0; border:#bbb solid 1px; font-size:0.8em; }
.imgright360 { text-align:center; background-color:#fff; padding:5px; max-width: 48%; float:right; margin:5px 0 25px 3%; border:#bbb solid 1px; font-size:0.8em; }
.imgright270 { text-align:center; background-color:#fff; padding:5px; max-width: 48%; float:right; margin:5px 0 25px 3%; border:#bbb solid 1px; font-size:0.8em; }
.imgright320 { text-align:center; background-color:#fff; padding:5px; max-width:320px; float:right; margin:5px 10px; border:#bbb solid 1px; font-size:0.8em; }
.imgnone360 { text-align:center; background-color:#fff; padding:5px; max-width:360px; margin:20px 0; border:#bbb solid 1px; font-size:0.8em; }
.imgmap560 { text-align:center; background-color:#fff; padding:5px; max-width:560px; margin:5px 0; border:#bbb solid 1px; font-size:1em; }
.borderless550 { text-align:center; background-color:#fff; padding:5px 0; max-width:550px; margin:5px 0; font-size:0.8em; }
.pressleft560 { text-align:left; background-color:#fff; padding:1em; max-width:560px; margin:20px 0; border:#bbb solid 1px; font-family:Georgia, 'Times New Roman', Times, serif; font-size:1.0em; line-height:1.4em; }

.imgnone360 img,
.imgnone393 img,
.imgnone500 img,
.imgnone560 img,
.imgnone672 img,
.imgright270 img,
.imgright320 img,
.imgright360 img,
.imgleft270 img,
.imgleft360 img,
.imgmap560 img,
.borderless550 img,
.pressleft560 img {
	width: 100%;
	height: auto;
}


.pricing-availability {
	box-sizing: border-box;
	display: flex;
	gap: 3%;
	margin: 20px 1px 20px 1px;
}
.pricing-availability p {
	flex-grow: 2;
}
.pricing-availability p:last-child {
	flex-grow: 1;
}


a.transportanfragebutton {
	display: inline-block;
	margin: 7px 0 14px 0;
	padding: 20px 22px 22px 23px;
	background-image: linear-gradient(60deg, rgb(72, 162, 45), #41c902, rgb(72, 162, 45));
	background-size: 200% auto;
	border-radius: 6px;
	color: #fbf7f4;
	border: 0;
	font-size: 14px;
	text-align: center;
	font-family: 'Lucida Grande', Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight: 600;
	cursor: pointer;
	transition: 0.5s;
}
a.transportanfragebutton:hover {
	text-decoration: none;
	background-position: right center;
}

a.finanzbutton {
	display: block;
	text-align: center;
	text-decoration: none;
	border: 1px solid #e3e3e3;
	border-radius: 6px;
	box-shadow: 0 0 0 0 rgba(0,0,0,0.15);
	color: #585858;
	font-weight: 500;
	margin: 14px 0;
	padding: 10px 4px 11px 4px;
	background: rgb(254,254,254);
	background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(248,248,248,1) 100%);
}
.finanzbutton img {
	width: 130px;
	height: 20px;
	margin-right: 8px;
	margin-bottom: -5px;
}
.finanzbutton:hover {
	background: rgb(182,242,164);
	color: rgb(0,129,86);
	border: 1px solid rgb(140,210,187);
}
.consorslogo {
	display: inline-block;
	margin: 8px 12px 15px 0;
}

.instrument.style1 {
	border-radius: 5px;
	border: 1px solid #eee;
	background-color: #fff;
	padding: 11px 13px 6px 13px;
}

.cta-buttons {
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	gap: 3%;
	margin: 10px 1px 0 1px;
}
.cta-buttons h2 {
	flex: 1 1 100%;
	margin: 0;
	padding-top: .7em;
	font-size: 1.35em;
}
.cta-buttons span {
	flex-grow: 1;
}
.cta-buttons a {
	border: 2px solid #a6000f;
	border-radius: 6px;
	margin-top: 10px;
	padding: 9px 4px;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
}
.cta-buttons span a {
	display: block;
	background-color: #a6000f;
	color: #fff;
}
.cta-buttons span a:hover {
	background-color: #fff;
	color: #a6000f;
}
.cta-buttons > a {
	flex-grow: 1;
	background-color: #fff;
	color: #a6000f;
}
.cta-buttons > a:hover {
	background-color: #a6000f;
	color: #fff;
}
.cta-buttons > span a::before {
	content: "✉︎";
	font-size: 36px;
	display: inline-block;
	line-height: 0.3em;
	vertical-align: sub;
	margin-right: 6px;
}
.cta-buttons > a::before {
	content: "☎";
	font-size: 24px;
	display: inline-block;
	line-height: 0.7em;
	vertical-align: text-bottom;
	margin-right: 6px;
}



.partner {
	display: inline-block;
	margin: 25px 5px 35px 5px;
	padding: 10px 20px;
	border: 1px solid rgb(240, 240, 240);
	min-height: 140px;
	width: 27.5%;
	min-width: 240px;
	border-radius: 6px;
	box-shadow: 0 -10px 50px 0 rgba(0, 0, 0, 0.15);
	transition: all 0.33s ease-in-out;
}
.partner .row {
	display: table-row;
}
	.partner .center {
	display: table-cell;
	width: 290px;
	height: 100px;
	vertical-align: middle;
	text-align: center;
}
.partner img {
	margin: 0;
}
.partner .center.text {
	height: 25px;
}
.partner:hover {
	background-color: #f0f0f0;
	-webkit-transform: scale(1.03);
	-ms-transform: scale(1.03);
	transform: scale(1.03);
	text-decoration: none;
}


#concerts {
	justify-content: space-between;
	background: #4d4c56 url(/assets/images/veranstaltungen-bg.jpg);
	background-size: cover;
	background-position: center left;
	margin: -5px -8.8% 30px -8.8%;
	padding: 12px;
	overflow: auto;
}
#concerts .previoush4 {
	color: #888;
	border-bottom: 1px solid #888;
}
#concerts h1 {
	color: #fff;
	margin: 6px 6px 0px 6px;
}
#concerts h2 {
	color: #b2b2b2;
	margin: 0 6px 12px 6px;
	font-size: 1.5em;
	font-weight: 500;
}
#concerts .introtext p {
	color: #b2b2b2;
	margin: 0px 6px 12px 6px;
	font-size: 1.1em;
}

#concerts.widget > h2 {
	font-size: 1.8em;
	font-weight: 600;
	color: #fff;
	margin: 12px 15px 6px 40px;
}
#concerts.widget a.whitelink {
	align-content: end;
	margin: 0 45px 10px 40px;
}
#concerts .introtext {
	width: 60%;
	padding-left: 1%;
}


#concerts .sidenotes {
	height: fit-content;
	background-color: #4f4531;
	padding: 7px 9px;
	margin: 5px 4px 12px 5px;
	border: 2px solid #85684d;
	max-width: 22%;
	min-width: 240px;
	font-size: 95%;
	color: #4a3618;
	text-align: right;
	border-radius: 6px;
}
#concerts .sidenotes h3 {
	line-height: 22px;
	padding: 0 3px;
	margin: 0 0 5px 0;
	color: #f2c875;
}
#concerts .sidenotes a {
	display: inline-block;
	color: #feda6e;
	padding: 4px 6px 4px 6px;
	background-color: #4a3618;
	margin-bottom: 3px;
	line-height: 1.45em;
	border-radius: 5px;
}
@media screen and (max-width: 750px) {
	#concerts .introtext {
		width: 100%;
	}
	#concerts .sidenotes {
		max-width: 100%;
	}
}


.eventinfo {
	border: 1px solid #e3e3e3;
	background-color: #fff;
	padding: 2px;
	margin: 12px 0 36px 0;
	color: #717171;
}
.eventinfo > div {
	border: 1px solid #eee;
	background-color: #f6f6f6;
	padding-left: 15px;
}
.eventinfo strong {
	color: #000;
	font-weight: 600;
}

.eventinfo .hideeventinfo {
	display: none;
}


/* img tiles */

a.imgtile {
	color: #3d2d4d;
	position: relative;
	background: #fff;
	border: #ddd solid 1px;
	padding: 5px;
	width: 240px;
	height: 290px;
	float: left;
	font-size: 10px;
	margin: 4px 9px 6px 0;
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
	border-radius: 2px;
	transition: all 0.15s ease-in-out;
}
a:hover.imgtile {
	color: #c40f0f;
	-webkit-transform: scale(1.01);
	-ms-transform: scale(1.01);
	transform: scale(1.01);
	text-decoration: none;
}

.imgtile h2 {
	position: absolute;
	top: 0;
	right: 15px;
	width: 29px;
	height: 34px;
	background: rgba(255, 255, 255, .92);
	padding: 4px 5px 4px 5px;
	font-size: 14px;
	text-align: center;
	z-index: 1;
}
.imgtile h2 span {
	font-size: 18px;
	line-height: 16px;
	color: #c40f0f;
}
.centerfold {
	display: table-cell;
	width: 236px;
	height: 35px;
	vertical-align: bottom;
}
.imgtile h3 {
	background: #fff;
	padding: 0 0 0 2px;
	font-size: 17px;
	margin: 0;
	line-height: 16px;
}
.imgtile p {
	margin: 0;
	padding: 0 0 0 2px;
}



#offers.home {
	float: right;
	position: relative;
	margin: 20px 25px 0 0 !important;
	height: 291px;
	overflow: hidden;
	padding: 5px;
	border: 1px solid #ddd;
	box-shadow: 0 0 5px rgba(0,0,0,0.3);
	background: rgba(255, 255, 255, 0.75);
}

#offers.home img {
	width: 406px;
}
#offers.home .centerfold {
	position: absolute;
	bottom: 0;
	width: 97.5%;
	padding: 5px 0 20px 0;
	background: rgba(255,255,255,0.75);
	border-top: 1px solid rgba(0, 0, 0, 0.33);
}
#offers.home h3 {
	margin: 0 10px 0 15px;
	color: #3d3d3d;
	font-size: 30px;
	font-weight: 700;
	text-align: left;
	position: relative;
}
#offers.home h3:after {
	background: none;
	display: inline-block;
	content: attr(data-text);
	left: 0;
	position: absolute;
	text-shadow: 6px 6px 9px rgba(0, 0, 0, 0.33);
	top: 0;
	z-index: -1;
}
#offers.home h4 {
	margin: 0 10px -5px 5px;
	color: #3d3d3d;
	font-size: 16px;
	font-weight: 700;
	text-align: left;
	position: relative;
	border-bottom: none;
}
#offers.home h4:after {
	background: none;
	display: inline-block;
	content: attr(data-text);
	left: 0;
	position: absolute;
	text-shadow: 6px 6px 9px rgba(0, 0, 0, 0.33);
	top: 0;
	z-index: -1;
}

#offers.home p {
	margin: 0;
}


.instruments {
	background: #f3f3f3;
	margin: 20px -8.8% 20px -8.8%;
	padding: 11px 0;
	border-top: 1px solid #ececec;
	border-bottom: 1px solid #ececec;
}
.instruments.home {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	margin: 15px 0;
	padding: 11px 1.3% 0 1.3%;
}
.instruments > h1 {
	margin: 12px 7px 17px 48px !important;
}
.instruments h2 {
	margin: 12px 15px 6px 40px;
}
.instruments h3 {
	margin: 12px 15px 17px 40px;
}
.instruments h4 {
	color: #888;
	border-bottom: 1px solid #888;
}
.instruments p {
	margin: 0 24px 17px 40px;
}
.instruments ul {
	margin: 0 24px 24px 24px;
}
.instruments li {
	margin: 1em 0;
}
.instruments > img {
	margin: 0 24px 6px 40px;
}



.instruments .red {
	color: #b2b2b2;
	border-bottom: none;
	padding: 4px 6px;
	margin: -6px 1px 13px 1px;
}

.instruments .alignnone.size-full {
	width: 94.5%;
}


@media screen and (max-width: 530px) {
	#concerts,
	.instruments {
		margin: -5px -5.6% 20px -5.6%;
	}
	.zwischenbild,
	.brandoverview {
		margin-left: -5.6%;
		margin-right: -5.6%;
	}
}



.furniere {
	background: #f3f3f3;
	position: relative;
	display: block;
	clear: both;
	margin: 20px -8.8% 30px -8.8%;
	padding: 16px 39px;
	border-top: 1px solid #ececec;
	border-bottom: 1px solid #ececec;
}
.furniere > h1 {
	margin: 12px 7px 17px 43px !important;
}
.furniere h2 {
	margin: 12px 24px 17px 43px;
}
.furniere h3 {
	margin: 12px 24px 17px 43px;
}
.furniere h4 {
	color: #888;
	border-bottom: 1px solid #888;
}
.furniere p {
	margin: 0 24px 17px 43px;
}

.furniere .red {
	color: #b2b2b2;
	border-bottom: none;
	padding: 4px 6px;
	margin: -6px 1px 13px 1px;
}

.furniere .alignnone.size-full {
	width: 94.5%;
}




a.imgleft238 {
	color: #3d2d4d;
	position: relative;
	background: #fff;
	border: #dfdfdf solid 1px;
	padding: 5px;
	width: 236px;
	height: 236px;
	float: left;
	font-size: 10px;
	margin: 4px 9px 6px 0;
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.07);
	border-radius: 1px;
	text-align: right;
	overflow: hidden;
}

a:hover.imgleft238 {
	color: #c40f0f;
	text-decoration: none;
	width: 238px;
	height: 238px;
	margin: 3px 8px 5px -1px;
}

a.imgleft238 img {
	display: block;
	width: 238px;
	height: 238px;
}
a:hover.imgleft238 img {
	width: 240px;
	height: 240px;
}

.instruments > a.imgleft238 > img {
	max-width: 100%;
	height: auto;
}
.instruments > a:hover.imgleft238 > img {
	max-width: 100%;
	height: auto;
}



.imgleft238 h2 {
	position: absolute;
	top: 0;
	right: 15px;
	width: 29px;
	height: 34px;
	background: rgba(255, 255, 255, .92);
	padding: 4px 5px 4px 5px;
	font-size: 14px;
	text-align: center;
}

.imgleft238 h2 span {
	font-size: 18px;
	line-height: 16px;
	color: #c40f0f;
}


.imgleft238 .textoverlay {
	position: absolute;
	bottom: 2px;
	background: rgba(255, 255, 255, .5);
	border-top: 1px solid rgba(255, 255, 255, .4);
	padding-right: 5px;
}

.instruments .textoverlay {
	position: absolute;
	bottom: 2px;
	padding-right: 0px;
}

.imgleft238 .centerfold {
	display: table-cell;
	width: 238px;
	height: 35px;
	vertical-align: bottom;
}

.imgleft238 h3 {
	padding: 0 2px 0 0;
	font-size: 17px;
	margin: 0;
	line-height: 16px;
}

.instruments .imgleft238 h3 {
	padding: 0px 2px 0 0;
	font-size: 17px;
	margin: 0 10px 4px 15px;
	line-height: 16px;
	font-size: 17px;
	font-weight: 700;
	text-align: left;
	position: relative;
}

.imgleft238 p {
	margin: 0;
	padding: 0 2px 0 0;
}


.imgleft96-1 { background-color: #fff; border: #bbb solid 1px; padding: 4px; width: 96px; float: left; margin: 5px 5px 5px 0; font-size: .7em; }
.imgleft96 {
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.25);
	background-color: #fff;
	border: rgba(157, 157, 157, 0.66) solid 1px;
	padding: 0;
	width: 150px;
	float: left;
	margin: 8px 7px;
	font-size: 10px;
	border-radius: 4px;
	overflow: hidden;
	transition: all 0.15s ease-in-out;
	cursor: pointer;
}
.imgleft96 img {
	width: 100%;
}
.imgleft96 span {
	margin: 7px 6px 5px 8px;
	display: block;
}
.imgleft96:hover {
	-webkit-transform: scale(1.02);
	-ms-transform: scale(1.02);
	transform: scale(1.02);
}

.imgleft133,
.imgleft150 {
	background-color: #fff;
	border: #dadada solid 1px;
	padding: 5px;
	width: 133px;
	float: left;
	margin: 0 10px 10px 10px;
	font-size: .8em
}
.imgleft150 {
	width: 150px;
}
.imgleft133:hover,
.imgleft150:hover { border: 1px solid #7aacdf }

.imgleft140 { background-color: #fff; border: #bbb solid 1px; padding: 3px; width: 140px; float: left; margin: 19px 10px 0 0; font-size: .8em; }
.imgright140 { background-color: #fff; border: #bbb solid 1px; padding: 3px; width: 140px; float: right; margin: 9px 0 0 10px; font-size: .8em; }
.imgleft140ob { background-color: #fff; width: 140px; float: left; margin: 0 1px 15px 0; font-size: .8em; }

a img.imgleft140ob { border: none }


.linkbutton {
	border: 1px solid #eee;
	border-radius: 7px;
	display: inline-block;
	padding: 12px 16px 4px 12px;
	margin: 10px 0; 
	min-width: 200px;
	min-height: 50px;
	box-shadow: 0 0 2px 0 rgba(0,0,0,0.05);
	font-size: 1.4em;
	line-height: 1.4em;
	transition: all 0.15s ease-in-out;
	cursor: pointer;
}
.linkbutton.fb {
	color: #fff;
	padding: 12px 16px 4px 12px;
	background-color: #4267b2;
}
.linkbutton img {
	width: 42px;
	margin-right: 4px;
}
.linkbutton.fb img {
	width: 44px;
}


ol.circlednumbers {
	counter-reset: item;
	list-style-type: none;
	padding-left: 0;
}
ol.circlednumbers li {
	position: relative;
	padding: 6px 36px;
}
ol.circlednumbers li:before {
	content: counter(item) "  "; 
	counter-increment: item;
	width: 23px;
	height: 20px;
	padding-top: 3px;
	border: 1px solid #6ec200;
	border-radius: 50%;
	color: #fff;
	text-align: center;
	background-color: #6ec200;
	position: absolute;
	left: 0;
	top: 2px;
}



/* contact page styles */

.vcard {
	box-shadow: 0 0 3px 0 rgba(0,0,0,0.45);
	width: 100%;
	max-width: 390px;
	height: 240px;
	margin: 10px 0;
	font-size: 10px;
	line-height: 1.4em;
	transition: all 0.15s ease-in-out;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.vcard .qrcodeandname {
	display: flex;
	background-color: #fff;
}
.vcard .qrcode {
	width: 102px;
	padding: 0 12px 0 26px;
}
.vcard .qrcode img {
	margin: 43px 0 -55px 0;
}
.vcard .andname .namerowone {
	font-size: 17px;
	margin: 55px 0 3px 0;
}
.vcard .andname .namerowtwo {
	font-size: 11px;
	margin: 0 0 88px 0;
	font-weight: 400;
	color: #473a03;
}
.vcard .companyname {
	border-bottom: 1px solid #000;
	color: #473a03;
	font-family: 'Trebuchet MS','Lucida Grande',Verdana,Arial,Sans-Serif;
}
.vcard .companyname .klavinsname {
	width: 102px;
	padding-left: 28px;
}
.vcard .addressfooter {
	display: flex;
	justify-content: space-between;
	padding: 4px 14px 10px 28px;
	color: #fff;
	background-color: #473a03;
	font-family: 'Trebuchet MS','Lucida Grande',Verdana,Arial,Sans-Serif;
	line-height: 1.5em;
}
.vcard .addressfooter a {
	color: #fff;
}
.vcard .addressfooter .streetaddress {
	min-width: 112px;
}
.vcard .addressfooter .phonewhite {
	min-width: 80px;
}


.linkbutton:hover,
.vcard:hover {
	-webkit-transform: scale(1.01);
	-ms-transform: scale(1.01);
	transform: scale(1.01);
	text-decoration: none;
}


#map {
	height: 420px;
	margin-top: 30px;
}
h3.textcenter {
	padding-top: 2.0em;
	text-align: center;
}




a.anchorlink {
	display: inline-block;
	color: #000;
	text-decoration: none;
	cursor: default;
	margin-bottom: -10px;
}


.toggler {
	color: #999;
	margin: 0;
	padding: 2px 5px;
	background: #fafafa;
	border: 1px solid #eee;
	cursor: pointer;
}
.element {
	background-color: #fafafa;
	border: 1px solid #eee;
}
.element p {
	margin: 0;
	padding: 6px;
}
.float-right {
	padding: 10px 20px;
	float: right;
}


#silent,
.clear,
.clr { clear: both; }



.pane {
	float: left;		/* you need that!!! */
	display: none;		/* you need that - if you remove this, at load the page will have height of the heighest pane, see more instructions in html-file */
	width: 550px;		/* set the width of your content here, it's not necessary if you dont wanna have fixed with */
	padding: 10px;		/* unimportant */
	border: 1px solid #bbb;
}
#tabscontent {
	overflow: hidden;
}
#paneContainer {
	float: left;
}


div.slideshow {
	width: auto;
	margin: 0 0 0 -55px;
}
div.slideshow p {
	margin: 6px 6px;
}



#menu{
	margin-top: 0;
	padding: 0;
	list-style-type: none;
}
.menulink {
	float: left;
	color: #fff;
	padding: 5px 7px;
	border-right: 1px solid #fff;
	border-top: 1px solid #fff;
	display: block;
	background-color:#222;
	cursor: pointer;
}
.menulink:hover { background-color: #fff; color: #000 }
.menulink:active { color: #ab0644 }


/*Overall CSS for each Horizontal Accordion.
	Most settings should be kept as it.
	Customize each Accordion by styling each Accordion's ID attribute instead.
*/

.haccordion { padding: 0; border: 1px solid #ededed; }

.haccordion ul {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
	overflow: hidden; /*leave as is*/
}
.haccordion li {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	margin: 0;
	padding: 0;
	display: block; /*leave as is*/
	width: 100%; /*For users with JS disabled: Width of each content*/
	height: 300px; /*For users with JS disabled: Height of each content*/
	overflow: hidden; /*leave as is*/
	float: left; /*leave as is*/
}

.haccordion li .hpanel {
	width: 100%; /*For users with JS disabled: Width of each content*/
	height: 300px;  /*For users with JS disabled: Height of each content*/
}
#hc1 li {
	margin:0 3px 0 0; /*Spacing between each LI container*/
}
#hc1 li .hpanel {
	padding: 5px; /*Padding inside each content*/
	margin-left: 5px;
	box-shadow: 5px 0 11px #000000;
	opacity: 1;
}

div.milchglas {
	height: 100px;
	margin-top: 180px;
	margin-left: 190px;
}
div.milchglas ul li {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	margin: 0;
	padding: 0;
	 /*leave as is*/
	width: 100%; /*For users with JS disabled: Width of each content*/
	height: 300px; /*For users with JS disabled: Height of each content*/
	overflow: visible; /*leave as is*/
	float: none; /*leave as is*/
	display: list-item;
}

.event-listing-nav {
	margin: 0 auto;
	width: 215px;
}
.event-listing-nav li {
	display: inline;
	list-style: none;
	margin: 8px !important;
}


.inconcert {
	margin: 15px 0;
}
.inconcert th {
	text-align: left;
}
.inconcert td {
	border-bottom: 1px solid #ededed;
}



p.ausfall,
h3.ausfall { color: silver }

div.ausfall {
	text-align: center;
	font-size: 50px;
	font-weight: bold;
	margin: 30px 25px;
	background-color: #dd392d;
	border: 1px solid #fff;
	outline: 4px solid #dd392d;
	color: #fff;
}



#gallery-1 {
	width: 100%;
	-webkit-user-select: none;
	-moz-user-select: none;
	margin: 0 auto 36px;
	background-color: transparent;
}

/* Non-linear resizing on smaller screens */
@media screen and (min-width: 0px) and (max-width: 900px) {
	#gallery-1 {
		padding: 12px 0 12px;
	}
	#gallery-1 .rsOverflow, .royalSlider#gallery-1 {
		height: 400px !important;
	}
}
@media screen and (min-width: 0px) and (max-width: 500px) {
	#gallery-1 .rsOverflow, .royalSlider#gallery-1 {
		height: 300px !important;
	}
}

#content-slider-home {
	width: 100%;
	height: 100%;
	margin: 0;
}
#content-slider-home.rsDefault,
#content-slider-home.rsDefault .rsOverflow,
#content-slider-home.rsDefault .rsSlide,
#content-slider-home.rsDefault .rsVideoFrameHolder,
#content-slider-home.rsDefault .rsThumbs {
	background: #fff !important;
	color: #000 !important;
}
#content-slider-home .rsContent a:hover {
	background-position: right center; /* change the direction of the change here */
	text-decoration: none;
}


#content-slider-home .rsContent.wilhelm .rsABlock {
	width: 28%;
	height: 100%;
	left: 71%;
	bottom: 24%;
	top: auto;
	display: flex !important;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
}
#content-slider-home .rsContent.wilhelm a {
	display: inline-block;
	margin-top: 0;
	padding: 11px 7% 12px 7%;
	background-image: linear-gradient(50deg, #a21f1f, #e5170e, #a21e1c);
	background-size: 200% auto;
	transition: 0.5s;
	border-radius: 9px;
	color: #fff;
}
#content-slider-home .rsContent.wilhelm a:hover {
	color: #fff;
}
#content-slider-home .rsContent.wilhelm h2 {
	font-size: 24px;
	line-height: 1.3em;
	color: #000;
	text-shadow: 0 0 2px rgba(0,0,0,0.3);
}
@media screen and (max-width: 770px) {
	#content-slider-home .rsContent.wilhelm .rsABlock {
		width: 29%;
		bottom: 18%;
	}
	#content-slider-home .rsContent.wilhelm h2 {
		font-size: 1.7em;
	}
}


#content-slider-home .rsContent.blackpearl .rsABlock {
	width: 28%;
	height: 100%;
	left: 63%;
	display: flex !important;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}
#content-slider-home .rsContent.blackpearl a {
	display: inline-block;
	margin-top: 2%;
	padding: 11px 7% 12px 7%;
	background-image: linear-gradient(50deg, #747474, #bcbbb3, #ababab);
	background-size: 200% auto;
	transition: 0.5s;
	border-radius: 9px;
	color: #fff;
}
#content-slider-home .rsContent.blackpearl a:hover {
	color: #fff;
}
#content-slider-home .rsContent.blackpearl h2 {
	font-size: 24px;
	line-height: 1.3em;
	color: #fff;
	text-shadow: 0 0 2px rgba(0,0,0,0.3);
}
@media screen and (max-width: 770px) {
	#content-slider-home .rsContent.blackpearl .rsABlock {
		width: 30%;
		left: 61%;
	}
	#content-slider-home .rsContent.blackpearl h2 {
		font-size: 1.7em;
	}
}


#content-slider-home .rsContent.sauter .rsABlock {
	width: 40%;
	height: 100%;
	left: 57%;
	top: -7%;
	display: flex !important;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}
#content-slider-home .rsContent.sauter h2 {
	margin-top: 0;
	padding-top: 0;
	font-size: 27px;
	line-height: 1.3em;
	color: #000;
	text-shadow: 0 0 2px rgba(0,0,0,0.3);
}
#content-slider-home .rsContent.sauter a {
	padding: 11px 17px 12px 17px;
	background-image: linear-gradient(50deg, #000000, #787775, #55524f);
	background-size: 200% auto;
	transition: 0.5s;
	color: #fff;
	border-radius: 9px;
}
@media screen and (max-width: 640px) {
	#content-slider-home .rsContent.sauter .rsABlock {
		width: 40%;
		left: 57%;
	}
	#content-slider-home .rsContent.sauter h2 {
		font-size: 1.8em;
		line-height: 1.2em;
	}
}


#content-slider-home .rsContent.yamaha .rsABlock {
	width: 36%;
	height: 100%;
	left: 40%;
	bottom: 17%;
	top: auto;
	display: flex !important;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
}
#content-slider-home .rsContent.yamaha h2 {
	font-size: 28px;
	line-height: 1.3em;
	color: #fff;
	text-shadow: 0 0 5px rgba(0,0,0,0.6);
	margin: 0 0 6% 5px;
}
#content-slider-home .rsContent.yamaha a {
	padding: 11px 4% 12px 4%;
	background-image: linear-gradient(50deg, #b80bab, #e147ef, #be2fd6);
	background-color: rgb(167, 65, 175);
	background-size: 200% auto;
	color: #fff;
	border-radius: 12px;
	transition: 0.5s;
	border: 3px solid #e6e5e9;
}
@media screen and (max-width: 930px) {
	#content-slider-home .rsContent.yamaha .rsABlock {
		width: 47%;
		left: 41%;
		bottom: 15%;
	}
	#content-slider-home .rsContent.yamaha h2 {
		font-size: 1.5em;
		line-height: 1.2em;
	}
}


#content-slider-home .rsContent.preis-wert .rsABlock {
	width: 36%;
	height: 100%;
	left: 52%;
	top: 18%;
	display: flex !important;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}
#content-slider-home .rsContent.preis-wert h2 {
	font-size: 26px;
	line-height: 1.3em;
	color: #fff;
	text-shadow: 0 0 5px rgba(0,0,0,0.6);
	margin: 0 0 3% 5px;
}
#content-slider-home .rsContent.preis-wert a {
	padding: 11px 6% 12px 6%;
	background-color: rgb(80, 70, 146);
	color: #fff;
	border-radius: 6px;
}
@media screen and (max-width: 840px) {
	#content-slider-home .rsContent.preis-wert .rsABlock {
		width: 43%;
	}
	#content-slider-home .rsContent.preis-wert h2 {
		font-size: 1.5em;
		line-height: 1.3em;
	}
}


#content-slider-home .rsContent.openingtimes .rsABlock {
	/* left: 60%; */
	top: 2%;
	text-align: center;
	width: 100%;
	/* box-shadow: 0px 0px 30px 20px rgba(0,0,0,0.25) !important;
	background-color: rgba(0, 0, 0, 0.25);
	border-radius: 25px; */
}
#content-slider-home .rsContent.openingtimes .rsABlock:last-child {
	/* left: 60%; */
	top: 22%;
	text-align: center;
	width: 100%;
}
#content-slider-home .rsContent.openingtimes h2 {
	font-size: 28px;
	line-height: 1.4em;
	color: #fff;
	text-shadow: 0 0 5px rgba(0,0,0,0.8);
	margin: 0 0 20px 5px;
}
#content-slider-home .rsContent.openingtimes p {
	font-size: 16px;
	line-height: 1.4em;
	color: #fff;
	text-shadow: 0 1px 5px rgba(0,0,0,1.0);
	margin: 0 0 14px 5px;
}
#content-slider-home .rsContent.openingtimes a {
	padding: 11px 17px 12px 17px;
	background-color: rgb(221, 226, 240);
	color: #333;
	border-radius: 12px;
}


h1.ausgefallen,
h3.ausgefallen,
h4.ausgefallen,
h5.ausgefallen,
p.ausgefallen,
.ausgefallen h2,
.ausgefallen h2 span,
.ausgefallen p {
	color: #999;
}
.ausgefallen h3 {
	color: #c40f0f;
}


div.fireworks {
	background: url('/assets/images/feuerwerk.jpg') no-repeat left top;
	display: block;
	height: 1180px;
	background-size: cover;
}
div.fireworks div.fwtext {
	position: relative;
	display: inline-block;
	padding: 10px 20px;
	top: 35%;
	left: 8%;
	color: rgb(255, 234, 112);
	background-color: rgba(128, 95, 44, 0.76);
}


ul.gallery-sorting {
	display: inline-flex;
	width: auto;
	height: auto;
	margin: 12px 0 5px 40px;
	padding: 1px;
	border: 2px solid #9f8f80;
	border-radius: 5px;
	list-style: outside none none;
	background-color: #fff;
}
ul.gallery-sorting > li {
	box-sizing: border-box;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	cursor: pointer;
}
ul.gallery-sorting > li > a {
	width: auto;
	height: auto;
	font-size: 13px;
	line-height: 23px;
	color: #000;
	font-style: italic;
	font-weight: normal;
	margin: 0;
	padding: 2px 12px;
	min-height: 0;
	border-radius: 3px;
	text-decoration: none;
	display: block;
	cursor: pointer;
}
ul.gallery-sorting > li > a.selected {
	color: #fff;
	background-color: #a6000f;
}
ul.gallery-sorting > li > a:hover {
	background-color: #de7c7c;
	color: #fff;
}

.cmsimagesection {
	text-align: center;
	padding-top: 15px;
	padding-bottom:15px;
}
.cmsimagesection img {
	max-width: 100%;
	height: auto;
}

.nachoben {
	display: block;
}
.cms_section_image {
	text-align: center;
	padding-top: 15px;
	padding-bottom: 15px;
}


#kk-popup-bg {
	content: "";
	display: none;
	background: rgba(144, 142, 138, 0.6);
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10;
}
#kk-popup {
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
	/*position: absolute;*/ /* alternativ wenn box mitscrollen soll */
	position: fixed;
	top: 2%;
	left: 50%;
	transform: translate(-50%, 0);
	width: 98%;
	max-width: 1140px;
	height: auto;
	min-height: 290px;
	aspect-ratio: 5/4 auto;
	z-index: 100000;
	box-shadow: rgba(0,0,0,0.3) 0 5px 25px;
	background-color: #838383;
	background: url('/assets/css/images/wegbeschreibung.jpg');
	background-size: cover;
	margin: 0 auto;
	padding: 1%;
	border: 1px solid #e2ded5;
	border-radius: 12px;
}
#kk-popup-close {
	align-self: start;
	cursor: pointer;
	background: #fff;
	border-radius: 50%;
	border: 1px solid #c9c9c9;
	font-size: 2.4em;
	line-height: 1em;
	padding: 2px 7px 7px 7px;
}
#kk-popup > div {
	max-width: 31%;
	background-color: #f2ca00;
	padding: 2% 3%;
	font-size: 1.4em;
	line-height: 1.6em;
	border-radius: 12px;
	border: 3px solid #000;
	outline: 5px solid #f2ca00;
	text-align: center;
	margin-top: 9%;
}

@media screen and (max-width: 800px) {
	#kk-popup > div {
		max-width: 32%;
		border: 2px solid #000;
		outline: 4px solid #f2ca00;
		font-size: 1.25em;
		line-height: 1.4em;
		margin-top: 3%;
	}
}
@media screen and (max-width: 530px) {
	#kk-popup > div {
		max-width: 34%;
		border: 2px solid #000;
		outline: 3px solid #f2ca00;
		font-size: 1em;
		line-height: 1.3em;
	}
}