* {
	margin: 0;
	padding: 0;
}

body{
	background: #191919;
}

.logos{
	float: right;
	/*clear: both;*/
	padding: 22px 31px 0 0;
}

.divider {
	display: block;
	float: left;
	width: 100%;
	height: 9px;
	background: url(../images/divider.png) repeat-x 0 0 transparent;
	margin: 30px 0;
}

/* Main Container */
/* ========================================= */
#container {
	display: block;
	float: left;
	width: 100%;
	position: relative;
}
#background{
	position: absolute;
	background: #70706f url(../images/bg.jpg) no-repeat 0;
	background-size: cover;
	top: 0;
	width: 100%;
	overflow: hidden;
	height: 100%;

}
#background img{
	display: none;
	position: absolute;
	left: 0;
}
#background img#bg-off{
	display: block;
}
.no-js #background img#bg-off{
	display: none;
}
.no-js #background img#bg-glow{
	display: block;
}

.section { position: relative;  }

.section #background_2  {
	position: fixed;
	background: #70706f url(../images/bg2.jpg) no-repeat 0 0;
	background-size: contain;
	top: 0;
	width: 100%;
	overflow: hidden;
	height: 100%;

	z-index: -1;

}


/* Video */
/* ========================================= */
.player {  height: 100%; }
#video { background: #70706f; }

.vjs-loading-spinner {
	/*display: block !important*/;
	top: 50%;
	left: 50%;
	position: absolute !important;
}

.vjs-default-skin .vjs-loading-spinner:before {display: none;}

@-webkit-keyframes ball-scale-multiple {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0; }

  5% {
    opacity: 1; }

  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0; } }

@keyframes ball-scale-multiple {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0; }

  5% {
    opacity: 1; }

  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0; } 
}

.ball-scale-multiple {
  position: relative;
  -webkit-transform: translateY(-30px);
      -ms-transform: translateY(-30px);
          transform: translateY(-30px); }
  .ball-scale-multiple > div:nth-child(2) {
    -webkit-animation-delay: -0.4s;
            animation-delay: -0.4s; }
  .ball-scale-multiple > div:nth-child(3) {
    -webkit-animation-delay: -0.2s;
            animation-delay: -0.2s; }
  .ball-scale-multiple > div {
    background-color: #880000;
    width: 15px;
    height: 15px;
    border-radius: 100%;
    margin: 2px;
    -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
    position: absolute;
    left: -30px;
    top: 0px;
    opacity: 0;
    margin: 0;
    width: 60px;
    height: 60px;
    -webkit-animation: ball-scale-multiple 1s 0s linear infinite;
            animation: ball-scale-multiple 1s 0s linear infinite; 
}

.vjs-big-play-button,
.vjs-text-track-display,
.vjs-default-skin .vjs-control-bar,
.vjs-default-skin .vjs-control-bar div {
	display: none !important;
	background-color:transparent !important;
	visibility: hidden !important;
	opacity: 0 !important;
	transition: none !important;

}




/**skip video**/
.skip_btn {
	display:block;
	position: absolute;
	bottom: 50px;
	right: 50px;

	z-index: 3;
	font-size: 1.6em;
}

.skip_btn:hover { cursor: pointer; }


/* SUSPENSE LAYER */
/* ========================================= */
#layer {
	display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;

    opacity: 0.75;
    mix-blend-mode: color-burn;

}

#layer img {display: block !important;}
#layer img:nth-child(1) {    
	top: 59px;
    left: 165px;
    top: 3%;
    left: 10%;
}
#layer img:nth-child(2) {
	top: 64px;
	left: 785px;
	top: 4.7%;
	left: 46.5%;
}
#layer img:nth-child(3) {
	top: 232px;
	left: 527px;
	left: 32%;
	top: 24%;
}
#layer img:nth-child(4) {
	top: 236px;
	left: 741px;
	top: 25.3%;
	left: 45%;
}
#layer img:nth-child(5) {
	top: 406px;
	left: 297px;
	top: 43.2%;
	left: 17.3%;
}
#layer img:nth-child(6) {
	top: 406px;
	left: 901px;
	top: 43.3%;
	left: 54.7%;
}
#layer img:nth-child(7) {
	top: 730px;
	left: 815px;
	top: 61%;
	left: 48.5%;
}
#layer img:nth-child(8) {
	top: 578px;
	left: 1185px;
	top: 61%;
	left: 69%;
}



/* home */
#p_home{
	clear: both;
	/*margin: 348px 0 0;*/
	margin: 18% 0 0;
	z-index: 2;
}
.homecont{
	width: 100%;
	/*max-width: 1300px;*/
	margin: 0 auto;
	padding: 0 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

	float: left;
	position: left;
	height: 100%;
}

.offset {
	float: left;
    width: 37.6%;
    margin-left: 37.4%;
	margin-right: 3%;
}

.switch{
	float: left;
	width: 100%;
	max-width: 455px;
	/*margin-right: 5.8%;*/
}
h1 span{opacity: 0;}
.no-js h1 span{opacity: 1;}
#p_home h2{opacity: 0;}
.no-js #p_home h2{opacity: 1;}
.switch p{opacity: 0;}
.no-js .switch p{opacity: 1;}
#p_home .language{opacity: 0;}
.no-js #p_home .language{opacity: 1;}
.intro{
	opacity: 0;
	float: left;
	max-width: 455px;
	width: 100%;
	/*margin-right: 3%;*/
}
.no-js .intro{
	opacity: 1;
}
.cite{
	opacity: 0;
	float: left;
	width: 22%;
	text-align: center;
}
.no-js .cite{opacity: 1;}
#logo-bar-top{
	opacity: 0;
	/*border: 1px solid #262626;*/
	border-left: none;
	border-right: none;
	padding: 17px 0px 5px;
	clear: both;
	width: 100%;
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}
.no-js #logo-bar-top{opacity: 1;}
.logo-row{
	text-align: center;
	font-size: 0;
	line-height: 0;
	vertical-align: top;
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

	margin-top: -57px;

}
.logo-row a{
	display: inline-block;
	margin: 0 1.5% 36px;
	vertical-align: bottom;
}
.top-row{
	height: 100%;
}
.bottom-row{
	height: 71px;
	padding-left: 3%;
}
.bottom-row a{
	margin: 0 4.6%;
}
#tickets{
	opacity: 0;
	float: left;
	width: 22%;
}
#tickets .pos {
    position:relative;
    height: 100%;
    padding-top: 50%;

}
.no-js #tickets{opacity: 1;}

.info-tel{
	float: left;
	width: 100%;
	text-align: center;
	margin-bottom: 34px;
}
.info-order{
	float: right;
	width: 100%;
	text-align: center;
}
#logo-cont{
	float: left;
	width: 100%;
}
#pagecontainer {
	width: 100%;
	max-width: 1229px;
	padding: 0 0 0 24px;
	float: right;
	clear: both;
	margin: 0;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box

}
.haedercontainer {
	display: block;
	float: left;
	width: 100%;
	position: relative;
}
.contentcontainer {
	display: block;
	float: left;
	width: 100%;
	position: relative;

}
.sideimg{
	float: right;
	width: 36.2%;
}
.credit{
	float: right;
	width: 36.2%;
	text-align: right;
	padding-right: 9px;
	font-size: 1.2em;
	color: rgb(80, 80, 80);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}
.no-js #p_home.contentcontainer { padding-top:60px; }

#footercontainer {
	display: block;
	float: left;
	width: 100%;
	background: #000;
	position: relative;
	margin-top: 57px;
	padding-bottom: 53px;
	z-index: 200;
}


/* sidebar */
/* ========================================= */
.sidebar {
	display: block;
	float: left;
	width: 72px;
	top: 64px;
	padding-top: 64px;
	z-index: 200;
}
.no-js .sidebar { position: relative; top: 0; }
.logo_rainydays { display: block; float: right; margin-bottom: 56px;}


/* Pages */
/* ========================================= */
.section {
	float: left;
	display: block;
	width: 100%;
}
.content {
	float: right;
	width: 83.82%;
	border-bottom: 1px solid #2b2b2b;
	padding-bottom: 52px
}
.content.last{
	border: none;
	padding-bottom: 0;
}
.textcont{
	width: 58.45%;
	float: left;
	padding-top: 61px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}
.zitatcontainer {
	display: block;
	float: left;
	width: 100%;
}
.zitat { 
	display: block;
	float: right;
	width: 400px;
	position: absolute;
	right: 0;
}
.scroll_icon {
	opacity: 0;
	display: block;
	position: relative;
	width: 61px;
	height: 35px;
	margin: 0 37.6% 25px;
	padding-top: 29px;
	clear: both;
	background: url('../images/down.png') 0 24px no-repeat;
	color: transparent;;
}
.no-js .scroll_icon{opacity: 1;}

#p_home .content { margin-top: 96px; }
.logolist {
	float: left;
	width: 100%;
	padding: 10px 0px;
	list-style: none;
}
.logolist li { display: inline-block; margin:10px 10px 10px 0;}
.logolist li:first-child { margin-left: 0px;}

.event {
	display: block;
	float: left;
	width: 100%;
}


/* Footer */
/* ========================================= */
#logo-bar-bottom{
	float: left;
	width: 100%;
	background: #444444;
	text-align: center;
	padding: 17px 0 0px;
	font-size: 0;

    height: auto;
}
.logo-row-hor{
	display: inline-block;
	vertical-align: top;
	width: 100%;

    margin-top: -57px;
}
.right-row{
	text-align: left;
}
#logo-bar-bottom a{
	display: inline-block;
	margin: 0 1.5% 25px;
	vertical-align: bottom;
}
.logo-divider{
	display: none;
}
.footer {
	display: block;
	max-width:980px;
	margin: 0 auto;
	position: relative; 
}
.footer .content_left,
.footer .content_right {
	display: block;
	float: left;
	padding-top: 46px;
}
.footer .content_left {
	margin:0 9% 0 20%;
}


/* Responsive */
/* ========================================= */
@media only screen and (max-width: 1630px) {
	#p_home{ margin: 358px 0 0; }
	#logo-cont{ margin-left: 0; }
}

@media only screen and (max-width: 1580px) {
	#p_home{ margin: 18% 0 0; }
	.logo-divider{ display: block; }
}
@media only screen and (max-width: 1044px) {
	.offset { margin-left: 0; width: 67%; }
	#tickets{ width: 30%; }

	#layer img:nth-child(1) {top: 10%;}
	#layer img:nth-child(2) {top: 10%;}
	#layer img:nth-child(3) {top: 32%;left: 26%;}
	#layer img:nth-child(4) {top: 31.7%;left: 57%;}
	#layer img:nth-child(5) {top: 58%;left: 15%;}
	#layer img:nth-child(6) {top: 57%;left: 38%;}
	#layer img:nth-child(7) {top: 75%;left: 46%;}
	#layer img:nth-child(8) {top: 75%;left: 68%;}

	.scroll_icon {margin-left: 20px;}

	#logo-cont{ width: 100%; }
}

@media only screen and (max-width: 757px){
	.switch, .intro, .cite{
		float: none;
		width: auto;
		margin: 0;
	}
	.logo-row a { margin: 0 1.3%; }
}
@media only screen and (max-width: 640px) {
	#background, .section #background_2 { background: none; }
	#container {background: #70706f url(../images/bg_mobile.jpg) no-repeat top center; background-size: contain;}
	.language { 
		float: left; 
		max-width: 100%; 
		width: auto; 
		padding: 46px 46px 0px; 
		margin: 0px 0px 20px; 

		clear: both;

	}

	.player, 
	#layer, 
	#video {display: none;}

	#p_home h2, 
	.switch p, 
	.intro, 
	.cite, 
	#tickets, 
	.scroll_icon, 
	#logo-bar-top {opacity: 1 !important;}

	.logos {
		float: left;
		padding: 0px;
		max-width: 100%;
		width: auto;

		padding: 0px 20px; 
		margin-bottom: 35px;

		clear: both;
	}


	#p_home{ margin: 20% 0 0; }

	.homecont { padding:0px 20px; }

	h1 span {display: none;}

	.offset, #tickets, .switch, .intro, .cite{width: 100%; margin: 0px;}

	.offset {margin-bottom: 80px;}
	#tickets .pos {padding: 0px;}

	#logo-bar-top {margin-top: 72px !important;border-bottom: 1px solid #fff;}

	.logo-row{
		margin-top: 0px;
		height: auto;
		padding: 0;
	}

	.logo-row-hor {margin-top: 0px;}
	.logo-row a, #logo-bar-bottom a{ margin: 0px 2% 40px; }
	.logos a{ display: block; margin: 0px 0px 12px; }
	.logo-divider{ display: none; }

	.sidebar{ padding-top: 16px; }

	.scroll_icon{ display: none; }

	.info-tel, .info-order{
		width: auto;
		float: none;
	}
	#pagecontainer{
		padding-left: 2%;
		padding-top: 45px;
	}
	.content{ width: 70% !important; }
	.textcont{
		width: 100%;
		padding-right: 20px;
	}
	.sideimg, .credit{ display: none; }
	.footer {max-width:100%;float: left; padding: 0px 20px;}
	.footer .content_left {width: 68%; padding-right: 2%; margin: 0px;}
	.footer .content_right{width: 30%;}
	#cloud7, #cloud9, #cloud10, #cloud11 { opacity: 0.5; }

}











/* updates */


video {
	object-fit: cover;
	height: 100vh;
}

@media only screen and (min-width: 640px){
	video {
		width: 100vw;
	}
}