@charset "ISO-8859-1";

@font-face {
    font-family: 'fabrikbold-v5';
    src: url('fonts/fabrik-bold-v5-webfont.eot');
    src: url('fonts/fabrik-bold-v5-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/fabrik-bold-v5-webfont.woff') format('woff'),
         url('fonts/fabrik-bold-v5-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'fabrikregular-v5';
    src: url('fonts/fabrik-regular-v5-webfont.eot');
    src: url('fonts/fabrik-regular-v5-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/fabrik-regular-v5-webfont.woff') format('woff'),
         url('fonts/fabrik-regular-v5-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}


#noise {
	position:fixed;
	background-image:url(img/noise.png);
	width:100%;
	height:100%;
	left:0px;
	top:0px;
	z-index:-9999;
}

#menucontainer {
	position:absolute;
	width: 80%;
	height:1500px;
	left:120px;
	right:30px;
	top:100px;
	z-index:1;
	visibility:visible;

	-o-transition:.5s;
	-ms-transition:.5s;
	-moz-transition:.5s;
	-webkit-transition:.5s;
	transition:.5s;

	transform:matrix(1,-0.7,0.03,1,0,0);
	-ms-transform:matrix(1,-0.07,0.03,1,0,0);
	-moz-transform:matrix(1,-0.07,0.03,1,0,0);
	-webkit-transform:matrix(1,-0.07,0.03,1,0,0);
	-o-transform:matrix(1,-0.07,0.03,1,0,0);
}

#logo-wrapper {
	position:fixed;
	width:250px;
	height:100px;
	left:0px;
	top:0px;
	z-index:2;
	overflow:hidden;
	clip:rect(0px, 400px, 80px, 0px);
}

#logo-wrapper2 {
	position:fixed;
	width:250px;
	height:100px;
	left:0px;
	top:0px;
	z-index:-100;
	overflow:hidden;
	clip:rect(80px, 400px, 100px, 0px);
}

#logo-back {
	z-index: 0;
	position:fixed;
	width:350px;
	left:25px;
	top:0px;
		
	-o-transition:left 0.5s;
	-ms-transition:left 0.5s;
	-moz-transition:left 0.5s;
	-webkit-transition:left 0.5s;
	transition:left 0.5s;
	
	transform:matrix(1,0.08,-0.05,1,0,0);
	-ms-transform:matrix(1,0.08,-0.05,1,0,0);
	-moz-transform:matrix(1,0.08,-0.05,1,0,0);
	-webkit-transform:matrix(1,0.06,-0.03,1,0,0);
	-o-transform:matrix(1,0.08,-0.05,1,0,0);
}

#logo-back-port {
	z-index: 0;
	position:fixed;
	width:350px;
	left:25px;
	top:30px;
		
	-o-transition:left 0.5s;
	-ms-transition:left 0.5s;
	-moz-transition:left 0.5s;
	-webkit-transition:left 0.5s;
	transition:left 0.5s;
	
	transform:matrix(1,0.08,-0.05,1,0,0);
	-ms-transform:matrix(1,0.08,-0.05,1,0,0);
	-moz-transform:matrix(1,0.08,-0.05,1,0,0);
	-webkit-transform:matrix(1,0.06,-0.03,1,0,0);
	-o-transform:matrix(1,0.08,-0.05,1,0,0);
}

#title {
	position:fixed;
	width:300px;
	height:130px;
	left:140px;
	top:120px;
	z-index:2;
	transform:matrix(1,-0.08,0.05,1,0,0);
	-ms-transform:matrix(1,-0.08,0.05,1,0,0);
	-moz-transform:matrix(1,-0.08,0.05,1,0,0);
	-webkit-transform:matrix(1,-0.08,0.05,1,0,0);
	-o-transform:matrix(1,-0.08,0.05,1,0,0);
}

#title_fix {
	position:fixed;
	width:200px;
	height:130px;
	left:30px;
	top:110px;
	z-index:2;
	transform:matrix(1,-0.08,0.05,1,0,0);
	-ms-transform:matrix(1,-0.08,0.05,1,0,0);
	-moz-transform:matrix(1,-0.08,0.05,1,0,0);
	-webkit-transform:matrix(1,-0.08,0.05,1,0,0);
	-o-transform:matrix(1,-0.08,0.05,1,0,0);
}

#background-left {
	position:fixed;
	width:165px;
	height:100%;
	left:0px;
	top:0px;
	z-index:1;
}
#background-top {
	position:fixed;
	width:100%;
	height:80px;
	left:0px;
	top:0px;
	z-index:9999;
	visibility:visible;
}

#slidercontainer {
	position:fixed;
	height:800px;
	width:800px;
	margin:-400px 0px 0px -400px;
	top: 50%;
	left: 50%;
	z-index:-99;
	background-color:transparent;
}

#slider1 {
	text-align: center;
	margin: 0 auto;
	text-align:center;
	width: 100%;
}

#video_button {
	position:fixed;
	top:45%;
	padding-left:82px;
	width:100%;
	height:100%;
	z-index:999999;
	text-align: center;
	
	-o-transition:padding-left 0.5s;
	-ms-transition:padding-left 0.5s;
	-moz-transition:padding-left 0.5s;
	-webkit-transition:padding-left 0.5s;
	transition:padding-left 0.5s;
}

#video {
	position:fixed;
	top:30%;
	width:100%;
	height:100%;
	z-index:10001;
	text-align: center;
	visibility:hidden;
}

#video_bg {
	position:fixed;
	width:100%;
	height:100%;
	z-index:10000;
	background-color:#000;
	opacity:0.8;
	visibility:hidden;
}

#video_back {
	position:fixed;
	top:15px;
	height:50px;
	z-index:10002;
	right: 15px;
	text-align: right;
	visibility:hidden;
}

#back {
	visibility:visible;
	position:fixed;
	top:66px;
	padding-left:82px;
	width:100%;
	height:50px;
	z-index:3;
	text-align: center;
	
	-o-transition:padding-left 0.5s;
	-ms-transition:padding-left 0.5s;
	-moz-transition:padding-left 0.5s;
	-webkit-transition:padding-left 0.5s;
	transition:padding-left 0.5s;
}

#imprint {
	position:fixed;
	bottom:10px;
	padding-left:82px;
	width:100%;
	z-index:4;
	text-align: center;	
	-o-transition:padding-left 0.5s;
	-ms-transition:padding-left 0.5s;
	-moz-transition:padding-left 0.5s;
	-webkit-transition:padding-left 0.5s;
	transition:padding-left 0.5s;
}

#menu-off {
	position:fixed;
	top:20px;
	right:20px;
	width:50px;
	height:50px;
	z-index:3;
	text-align: right;
	visibility:visible;
}

#menu-on {
	position:fixed;
	top:20px;
	right:20px;
	width:100%;
	height:50px;
	z-index:3;
	text-align: right;
	visibility:hidden;
}

#info-close {
	position:fixed;
	top:94px;
	height:50px;
	z-index:100;
	right: 15px;
	text-align: right;
	visibility: hidden;
}

#info-off {
	position:fixed;
	right:0px;
	top:80px;
	width:60px;
	height:30px;
	padding:8px 6px 5px 12px;
	z-index:888;
	line-height:30px;
	text-align: center;
	background-color: #F5F5F5;
	visibility: visible;
}

#info-text {
	position:absolute;
	right:0px;
	top:80px;
	max-width:700px;
	z-index:4;
	text-align: left;
	background-color:#F5F5F5;
	visibility: hidden;
}

#datenschutz {
	position:absolute;
	right:0px;
	top:80px;
	max-width:700px;
	z-index:99;
	text-align: left;
	background-color:#F5F5F5;
	visibility: hidden;
}



.menu {
	font-family:'fabrikbold-v5', Arial Narrow, sans-serif;
	text-rendering: optimizeLegibility;
	text-decoration:none;
	line-height: 105px;
	font-size: 120px;
	letter-spacing: 0em;
	color:#F5F5F5;
	text-transform: uppercase;
	display:inline;
	text-decoration: none; 
}

.menu a {
	-webkit-transition: letter-spacing 0.4s ease;
	-moz-transition: letter-spacing 0.4s ease;
	-o-transition: letter-spacing 0.4s ease;
	transition: letter-spacing 0.4s ease;
}

.menu a:hover {

	background-image: linear-gradient(to right, #333 50%, #333 50%);
	background-position: 0 1.07em;
	background-repeat: repeat-x;
	background-size: 1px 7px;

	animation-name: menu; 
	animation-duration:3s; 
	animation-direction:normal; 
	animation-iteration-count:infinite; 
	
	-webkit-animation-name: menu; 
	-webkit-animation-duration:3s; 
	-webkit-animation-direction:normal; 
	-webkit-animation-iteration-count:infinite;
	}

@keyframes menu {50% {letter-spacing:0.03em;}} 
@-webkit-keyframes menu {50% {letter-spacing:0.03em;}} 


.neu {
	font-family:'Montserrat', sans-serif;
	font-weight: 800;
	font-size: 18px;
	line-height: 30px;
	letter-spacing: 0.1em;
	vertical-align: top;
	padding-left: 5px;
	text-shadow: none;
	color:#0CF;
	
	animation-name: neu; 
	animation-duration:3s; 
	animation-direction:normal; 
	animation-iteration-count:infinite; 
	
	-webkit-animation-name: neu; 
	-webkit-animation-duration:3s; 
	-webkit-animation-direction:normal; 
	-webkit-animation-iteration-count:infinite;
	}

@keyframes neu {50% {color:#F66;}} 
@-webkit-keyframes neu {50% {color:#F66;}} 


.discipline {
	font-family:'fabrikregular-v5', Arial Narrow, sans-serif;
	text-rendering: optimizeLegibility;
	text-decoration:none;
	line-height: 50px;
	font-size: 50px;
	letter-spacing: 0.05em;
	color:#F5F5F5;
	padding-left: 4px;
	text-transform: none;
}

.logo {
	font-family:'fabrikregular-v5', Arial Narrow, sans-serif;
	text-rendering:optimizeLegibility;
	text-decoration:none;
	line-height:30px;
	font-size:30px;
	letter-spacing: 0.0em;
	color:#111111;
	text-shadow: none;
}

.title {
	font-family:'fabrikbold-v5', sans-serif;
	text-rendering: optimizeLegibility;
	text-decoration:none;
	line-height: 22px;
	font-size: 24px;
	letter-spacing: 0.1em;
	color:#F5F5F5;
	text-transform: uppercase;
	
	-o-transition:left 0.5s;
	-ms-transition:left 0.5s;
	-moz-transition:left 0.5s;
	-webkit-transition:left 0.5s;
	transition:left 0.5s;
	
	animation-name: title; 
	animation-duration:3s; 
	animation-direction:normal; 
	animation-iteration-count:infinite; 
	
	-webkit-animation-name: title; 
	-webkit-animation-duration:3s; 
	-webkit-animation-direction:normal; 
	-webkit-animation-iteration-count:infinite;
	}

@keyframes title {50% {letter-spacing:0.2em;}} 
@-webkit-keyframes title {50% {letter-spacing:0.2em;}} 


.title_fix {
	font-family:'fabrikbold-v5', sans-serif;
	text-rendering: optimizeLegibility;
	text-decoration:none;
	line-height:18px;
	font-size:20px;
	letter-spacing: 0.1em;
	color:#F5F5F5;
	text-transform:uppercase;
}

.head {
	text-rendering: optimizeLegibility;
	font-family:'fabrikregular-v5', sans-serif;
	letter-spacing: 0.05em;
	font-size: 36px;
	line-height: 38px;
	text-transform: none;
}
.info {
	text-rendering: optimizeLegibility;
	font-family:'fabrikregular-v5', sans-serif;
	letter-spacing: 0.05em;
	font-size: 22px;
	line-height: 20px;
}

.fliess {
	font-family: 'Work Sans', sans-serif;
	font-weight: 400;
	text-decoration:none;
	font-size: 18px;
	line-height: 24px;
	padding:22px 30px 5px 22px;
	padding-top:12px;
	letter-spacing: 0.05em;
	color:#222222;
}

.scope {
	font-family: 'Work Sans', sans-serif;
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 0.1em;
	line-height: 15px;
	padding-top:14px;
	color:#888;
}

.discipline_info {
	font-family: 'Work Sans', sans-serif;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.1em;
	line-height: 12px;
	padding-top:12px;
	letter-spacing: 0.2em;
	color:#222;
	text-transform: uppercase;
	display:block;
}


.back {
	font-family: "Zapf Dingbats";
	font-size: 26px;
	color:#F5F5F5;
}
.back_arrow {
	font-family: "Zapf Dingbats";
	font-size: 52px;
	color:#F5F5F5;
}

.close {
	font-family: "Zapf Dingbats";
	font-size: 26px;
	color:#000000;
}

.imprint {
	text-rendering: optimizeLegibility;
	font-family:'fabrikbold-v5', Arial Narrow, sans-serif;
	letter-spacing: 0.3em;
	font-size: 11px;
	text-transform: uppercase;
	color:#F5F5F5;
}

.video_back {
	font-family: "Zapf Dingbats";
	font-size: 46px;
	color:#FFF;
}

a:link {text-decoration: none; color: inherit;}
a:visited {text-decoration: inherit; color: inherit;}
a:active {text-decoration: inherit; color: inherit;}

.back a:hover {text-decoration: none; color: #000000;}
.close a:hover {text-decoration: none; color: #000000;}
.imprint a:hover {text-decoration: none; color: #000000;}
.fliess a:hover   {color:#999999; text-decoration:none;}
.logo a:hover   { color:#FFFFFF;}





@media (max-width: 1200px) {
	.menu {
	line-height: 73px;
	font-size: 84px;
	}
	.menu a {
	line-height: 73px;
	font-size: 84px;
	}
	.neu {
	line-height: 25px;
	}
	.discipline {
	line-height: 40px;
	font-size: 40px;
	padding-left: 3px;
	}
	#menucontainer {
	left:100px;
	top:55px;
	}
	#background-left {
	width:85px;
	}
	#title {
	left:55px;
	}
	#back, #imprint, #video_button {
	padding-left:42px;
	}
	.menu a:hover {
	background-position: 0 1.05em;
	background-size: 1px 8px;
	}
}

@media (max-width: 850px) {
	.menu, .menu a {
	line-height: 46px;
	font-size: 48px;
	}
	.menu a:hover {
	background-position: 0 1.05em;
	background-size: 1px 6px;
	}
	.neu {
	line-height: 15px;
	font-size: 12px;
	padding-left: 3px;
	}
	.discipline {
	line-height: 26px;
	font-size: 26px;
	letter-spacing: 0.05em;
	padding-left: 1px;
	}
	.title {
	line-height:18px;
	font-size:18px;
	font-family:'fabrikregular-v5', sans-serif;
	letter-spacing: 0.2em;
	text-transform: none;
	}
	#title {
	width:400px;
	height:130px;
	top:16px;
	transform:matrix(1,0,0,1,0,0);
	-ms-transform:matrix(1,0,0,1,0,0);
	-moz-transform:matrix(1,0,0,1,0,0);
	-webkit-transform:matrix(1,0,0,1,0,0);
	-o-transform:matrix(1,0,0,1,0,0);
	left:50px;
	text-align:left;
	visibility:hidden;
	}
	#menucontainer {
	left:65px;
	top:100px;
	}
	#imprint, #video_button {
	padding-left:0px;
	}
	#logo-wrapper,	#logo-wrapper2, #background-top, #background-left {
	visibility:hidden;
	}	
	#info-close {
	top:14px;
	}
	#info-text, #info-off {
	top:0px;
	}	
	#back {
	padding-left:14px;
	width:200px;
	text-align: left;
	top:-10px;	
	}	
}

@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {

	.back_arrow {font-size: 28px;}	
	.back {font-size: 26px;}
	#back {top: 0px;}		
}

@media (max-width: 500px) {
	.menu, .menu a {
	line-height: 30px;
	font-size: 30px;
	}
	.neu {
	line-height: 18px;
	font-size: 10px;
	padding-left: 3px;
	}
	.discipline {
	line-height: 20px;
	font-size: 20px;
	padding-left: 1px;
	}
	#menucontainer {
	left:25px;
	width:85%;
	top:100px;
	transform:matrix(1,-0.07,0.03,1,0,0);
	-ms-transform:matrix(1,-0.07,0.03,1,0,0);
	-moz-transform:matrix(1,-0.07,0.03,1,0,0);
	-webkit-transform:matrix(1,-0.05,0,1,0,0);
	-o-transform:matrix(1,-0.07,0.03,1,0,0);
	}
}