/* Custom Stuff [start] ------------------------------------------------------------------------------------- */

.xtralink {
	font-family: 'Oswald', sans-serif;
	font-weight: 300;
	padding: 18px 0 0 0;
	transition: all 1.0s ease;
}
.sticky .xtralink {	padding: 4px 0 0 0; }
.sticky .xtralink p {  margin-bottom: 0em; }
.xtralink a {
  line-height: 70px;
  padding: 8px 20px 10px 20px;
  text-transform: none;
  font-size: 24px;
  color: #ffffff;
  text-decoration: none;
  border: 2px solid #fff;
  border-radius: 40px;
  background: #f67b0e87;
}

@media only screen and (max-width: 990px) {
	.heroImg img { width: auto; max-width: 125%; /*transform: translate(-20%,0%);*/}
}
@media only screen and (max-width: 768px) {
	.heroImg img { width: auto; max-width: 150%; /*transform: translate(-40%,0%);*/}
}
@media only screen and (max-width: 768px) {
	body.home .heroImg img { width: auto; max-width: 270%; transform: translate(-40%,0%);}
	body.legal .heroImg img { width: auto; max-width: 280%; transform: translate(-20%,0%);}
}
@media only screen and (max-width: 990px) {
	.titelbild img { width: auto; max-width: 160%; /*transform: translate(-20%,0%);*/}
}
@media only screen and (max-width: 768px) {
	.titelbild img { width: auto; max-width: 300%; /*transform: translate(-40%,0%);*/}
}
/* Hero Image Overlay */
.heroImgOverlay .inside {
  background-color: rgba(77, 96, 108, 0.4);
  padding: 30px 30px 10px 30px;
  width: 58%;
}
@media only screen and (max-width: 1180px) {
	.heroImgOverlay .inside {
	  width: 72%;
	}
}
@media only screen and (max-width: 990px) {
	.heroImgOverlay .inside {
	  background-color: rgba(77, 96, 108, 0.75);	
	  width: 100%;
	}
}
.heroImgOverlay .inside p {
  margin-bottom: 1em;
  font-size: 19px;
  line-height: 28px;
  font-weight: 400;
}
.heroImgOverlay .inside p strong {
  font-size: 26px;
  font-weight: 700;
}
.subheadline { font-weight: 300;}
.headline { font-weight: 500;}

.heroImgOverlay .inside h1.underline::after , .heroImgOverlay .inside h2.underline::after, .heroImgOverlay .inside h3.underline::after, .heroImgOverlay .inside h4.underline::after, .heroImgOverlay .inside h5.underline::after, .heroImgOverlay .inside h6.underline::after{
	background: transparent url("../img/underline_bg2.png") no-repeat scroll bottom center;
}

/* Bogen der Stage */
.separator-svg {
  position: absolute;
  bottom: 5px;
  left: 0;
  width: 100vw;
}
.separator-svg .image_container img {
    margin-bottom: inherit;
}

.dropcap {
    font-size: 2em;
    float: left;
    margin-bottom: 5.5em;
    margin-right: 20px;
    font-weight: 200;
	color: var(--hauptfarbe1);
}
@media only screen and (max-width: 768px) {
	.dropcap { float: none; }
}
.bildbox, .text_bildbox .image_container { position: relative; overflow: hidden; }
.bildbox img { max-width: 200%; width: 100%; height: auto; transform: scale(1);transition: transform 1s ease;}
.bildbox img:hover { transform: scale(1.15); transition: transform 1s ease; }
.text_bildbox img { transform: scale(1);transition: transform 1s ease;}
.text_bildbox img:hover { transform: scale(1.15); transition: transform 1s ease; }
.bildbox .caption, .text_bildbox .caption {
  position: absolute;
  bottom: 16px;
  background-color: rgba(91,108,120,.7);
  width: 96%;
  margin: 0 2% 0 2%;
  left: 0;
  text-align: center;
  color: #fff;
  font-size: 19px;
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 300;
  padding-top: 4px;
}
.bildbox .caption span, .text_bildbox .caption span {
  font-weight: 400;
}

a.linkXtra { text-decoration: none; color: #000; font-weight: 400; font-size: .85em;}
a.linkXtra::after {    
	content: "\f105" !important;
    display: inline-block;
    font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 1em;
	padding-left: 6px;
}

.xl-parallax .ghostbutton, .bgImgOverlay .ghostbutton { border: 2px solid #fff; }


.toggle-info-wrapper {
  transform: translateX(316px);
  transition: transform .3s;
  background: var(--hauptfarbe1);
  position: fixed;
  top: 50vh;
  box-shadow: -4px 0px 12px rgba(0,0,0,0.25);
  pointer-events: all;
  animation: startSlide .3s ease-in-out 2s 1 backwards;
  z-index: 99;
  width: 400px;
  right: 0;
  padding: 10px 14px;
}
.toggle-info-wrapper:hover {
  transform: translateX(10%);
}

p.back a { color: transparent !important;}
p.back a::before {
  content: "\f053";
  font-family: "Font Awesome 5 Free";
  color: #626161;
  font-size: 30px;
  font-weight: 600;
  display: block;
  margin-top: 30px;
}

.bg_img { height:auto; }

@media (max-width:1024px)
{
	.bg_img { height:450px; }
}

@media (max-width:1024px)
{
	#footer .grid8, #footer .grid8_0[class*="grid"] {
		float:none !important;
		display:block !important;
		width:auto !important;
	}
}

.scale { transform: scale(1);transition: transform 1s ease;}
.scale:hover { transform: scale(1.1); transition: transform 1s ease; z-index:99; }

#cboxContent { margin: 30px; border-radius: 12px; }
#cboxLoadedContent {
  border: 10px solid #fff;
  background: transparent;
  box-shadow: 0px 0px 20px rgba(0,0,0,0.25);
  border-radius: 12px;
}
.xtraheadline { margin-top: -168px; }
@media (max-width:768px)
{
.xtraheadline { margin-top: -108px; }
}
.xtraheadline h1, .xtraheadline h2, .xtraheadline h3, .xtraheadline h4, .xtraheadline h5, .xtraheadline h6 {
	color: var(--hauptfarbe1);
	font-family: 'Oswald';
	text-transform: uppercase;
	letter-spacing: -0.063em;
	font-weight: 700;
	font-size: 7.6em;
	text-shadow: 0px 0px 15px #2626264f;
	line-height: 84%;
	margin: 0 0 10px 0;
}
.xtraheadline h2, .xtraheadline .h2 {
	font-size: 4.8em;
	line-height: 108%;
}
@media (max-width:1024px)


{
	.xtraheadline h1, .xtraheadline h2, .xtraheadline h3, .xtraheadline h4, .xtraheadline h5, .xtraheadline h6, .xtraheadline [class*="h"]{
		font-size: 4.5em;		
	}
	.xtraheadline h2, .xtraheadline .h2 {
		font-size: 2.8em;
	}
}

.tile {
  display: table-cell;
  vertical-align: middle;
  float: none;
  padding: 0% 8% 0% 8%;
}
@media (max-width:1024px)
{
	.tile { padding: 0% 4% 0% 4%; }
}

.ce_image.tile {
  padding: 0;
}

@media (max-width:767px)
{
	.table-header-group { display: table-header-group !important; }
	.table-header-group > div { height: 400px !important; }
	.tile { padding: 12% 15%; }
	
	.home .xtraheadline h1{
		font-size: 4.8em;		
	}


	.xtraheadline h1, .xtraheadline h2, .xtraheadline h3, .xtraheadline h4, .xtraheadline h5, .xtraheadline h6, .xtraheadline [class*="h"]{
		font-size: 3.73em;		
	}
	.xtraheadline h2, .xtraheadline .h2 {
		font-size: 2.1em;
	}

	
}


li { font-size: 18px; }