body, header, footer {
	margin: 0px;
	padding: 0px;
	background-color: #FFF;
}
body {
	overflow: hidden;
}
* {font-size: 16px; color: #000; outline: none !important;}

a {text-decoration: underline; color:#000000 !important}
a:hover {text-decoration: none; color:#000000 !important}

ul {margin:0px !important; padding:0px !important}

/* ############## */
/* Layout */
/* ############## */

#frame {
	width: 100%;
}

#header {
	display: none; /* wegen Preloader zunächst verstecket */
	height: 100px;
	border-bottom: 10px #FFCE00 solid;
	background-color: #FFF;
}
@media (max-device-width: 768px) { 
	#header {
		max-height: none;
		padding-bottom: 20px;
	}
}
#footer {
	border-top: 2px #aaaaaa solid;
	background-color: #e4e4e4;
	line-height: 18px;
	color: #000;
	margin-top: 100px;
}
#header, #footer {
	background-repeat: no-repeat
}
#footer h4 {
	font-weight: bold;
}

#footer * {
	font-size: 12px;
}
#footer a {
	color: #000;
	text-decoration: none;
}

#headline {
	/* background-color: #007ab6; */
	background-color: #062e43;
}
@media (max-device-width: 768px) { 
	#headline {
		padding-bottom: 20px;
	}
}
#headline div {
	font-size: 14px;
}

#headline div,
#headline h1,
#headline h3 {
	color: #FFF;
}

/* ############## */
/* Navigation */
/* ############## */

nav a {text-decoration: none;}

#navbar { 
	margin-top: 35px;
	text-align: right;
}
ul.navbar-nav {
	text-align: right;
}

.navbar-default .navbar-nav > li {
	line-height: 1;
	padding: 0px !important;

}

.navbar-default .navbar-nav > li > a {
	padding: 0px 15px;
	background-color: #FFF;
	color: #000;
	font-size: 15px;
	border-left: 2px solid #FFCE00;
	margin-bottom: 5px;
}
.navbar-default .navbar-nav > li:first-child a {
	border-width: 0px;
}
.navbar-default .navbar-nav > li.active > a {
	font-weight: bold;
}

.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:focus, 
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > li > a:focus, 
.navbar-default .navbar-nav > li > a:hover  {
	color: #E3001B;
	background-color: #FFF;
}
.navbar-default .navbar-nav > li > a:focus, 
.navbar-default .navbar-nav > li > a:focus {
	color:#000;
}

/* ############## */
/* Elemente */
/* ############## */

.well h3, .panel h3, .jumbotron h3,
.well h4, .panel h4, .jumbotron h4
 {
	margin-top:0px;
	margin-bottom:10px;
}
.panel-default, .btn-default, .panel-body {
	background-color: rgba(240,241,241,0.6);
	color: #000;
}
.panel-default * {
	background-color: rgba(240,241,241,0.6);
}
.panel-default h4.panel-title, .panel-default h4.panel-title a {
	background-color: transparent !important;
}
.panel-default h4 {
	margin: 10px 0px;
	font-weight: bold;
}

.list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover {
	color: #000;
	background-color: #FFCE00;
	border-color: #FFCE00;
}
a.list-group-item:focus, a.list-group-item:hover, button.list-group-item:focus, button.list-group-item:hover {
	background-color: #ffe36c;
}
.panel-default div.list-group-item-default {
	color: #000 !important;
	background-color: #EEEEEE !important;
}

.img-rounded-top {border-radius: 2px 2px 0px 0px;}
.panel-heading {font-weight: bold;}
.checkbox-text {margin: -28px 0px 0px 25px;}
.panel a {text-decoration: none;}
.img-hover {cursor: pointer;}
.btn-default, .btn-primary {
	text-decoration: none;
}
.btn-default span.glyphicon {
	color: #000;
}

.popover {
	color: #000;
	max-width: 400px; 
}
h3.popover-title {
	font-size: 14px; 
	font-weight: bold;
}
.popover-content {
	font-size: 12px;
}
.timeline .active {
	background-color: #E3001B;
}

.caption, .carousel-caption {
	background-color: rgba(0,0,0,0.6);
	font-size: 13px;
	padding: 5px 10px;
}
.carousel-caption {
	font-size: 13px;
	position: absolute;
	left:0;
	right:0;
	bottom:0;
}
.carousel-indicators {
	top: 1%
}

button.btn-ki,
button.btn-ki:focus {
	background-color: #FFCE00;
	background-image: url('../img/KI_logo_25.png');
	background-repeat: no-repeat;
	background-position: right;
	padding-right: 30px;
	height: 35px;
}
button.btn-ki:hover {
	background-color: #ffe36b;
}
.ANI-button {margin-bottom: 20px;}

.list-group a {text-decoration: none;}

.WP-fadein, .WP-fadein-left, .WP-fadein-right
{
	opacity: 0;
	-webkit-animation-duration:1500ms;
	-moz-animation-duration:1500ms;
	-ms-animation-duration:1500ms;
	-o-animation-duration:1500ms;
	animation-duration:1500ms;
}


/* ################################## */
/* Sections */
/* ################################## */


section {
	background-size: cover;
	min-height: 1080px;
	margin-top: 100px;
}

section * {color: #FFF}
section a:hover {color: #FFF}
section .XXcontainer {z-index: 100;}

section .jumbotron  * {color: #000}
section .jumbotron,
section .panel,
section .panel-default,
section .panel-heading,
section .panel-body
{background-color: rgba(255,255,255,0.8) !important;}
.panel-title a, .popover * {
	color: #000 !important;
}

section .layer-responsive {
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
}

section.video-BG {
	position: relative;
	overflow: hidden;
}
section.img-BG {
	XXXbackground-color: #000;
}

section .main-text-box {
	background-color: rgba(0,0,0,0.7);
	border-radius: 5px;
	padding-bottom: 15px;
}
section .main-text-box {
	margin-top: 100px;
}

.vimeo-embed-col6 {
	width: 500px;
	height: 281px;
}

.video-container {
	position: absolute;
	z-index: -100;
	top:0%;
	left:0%;
	width: 1980px;
	height: 1080px;
	overflow: hidden;
}
.video-container video {
	position:absolute;
	z-index:0;
}
.video-container video.fillWidth {
	width: 100%;
}


#chat-video iframe {
	width: 711px;
	height: 400px;
}

#headline-video {
	padding: 0px;
	width: auto;
	height: 320px;
	background-size: cover;
	overflow: hidden;
	display:block;
	background-color: #transparent;
}
#headline-video #start-video {
	margin-top: -5%;
	position:relative;
    z-index:-1;
	min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
}


#headline-video .text {
	position:absolute;
	color: rgb(255, 255, 255);
	text-shadow: 0px 0px 20px rgba(0, 0, 0, 1);
	z-index:10;
	font-size: 64px;
	font-weight: bold;
}

.carousel-caption {text-align: left; !important;}


/* ################################## */
/* Preloader */
/* ################################## */

#preloader {
	position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#696A6E; /* change if the mask should have another color then white */
	z-index:99; /* makes sure it stays on top */
}

#status {
	width:450px;
	height:350px;
	padding: 40px;
	position:absolute;
	text-align: center !important;
	background-color: #FFF;
	left:45%; /* centers the loading animation horizontally one the screen */
	top:30%; /* centers the loading animation vertically one the screen */
	background-repeat:no-repeat;
	background-position:center;
	margin:-225px 0 0 -150px; /* is width and height divided by two */
}

/* ################################## */
/* Hilfsklassen JH */
/* ################################## */

.bold {font-weight: bold;}
.gelb {color: #FFCE00;}
.text-right {text-align: right;}

.no-left-padding {padding-left: 0px !important;}
.no-right-padding {padding-right: 0px !important;}
.no-top-padding {padding-top: 0px !important;}
.no-bottom-padding {padding-bottom: 0px !important;}

.no-left-margin {margin-left: 0px !important;}
.no-right-margin {margin-right: 0px !important;}
.no-top-margin {margin-top: 0px !important;}
.no-bottom-margin {margin-bottom: 0px !important;}

.margin-top5 {margin-top: 5px;}
.margin-top10 {margin-top: 10px;}
.margin-top15 {margin-top: 15px;}
.margin-top20 {margin-top: 20px;}
.margin-top30 {margin-top: 30px;}
.margin-top35 {margin-top: 35px;}
.margin-top40 {margin-top: 40px;}
.margin-top50 {margin-top: 50px;}
.margin-top90 {margin-top: 90px;}
.margin-top100 {margin-top: 100px;}
.margin-top150 {margin-top: 150px;}
.margin-top200 {margin-top: 200px;}
.margin-top250 {margin-top: 250px;}

.margin-bottom10 {margin-bottom: 10px;}
.margin-bottom20 {margin-bottom: 20px;}
.margin-bottom30 {margin-bottom: 30px;}
.margin-bottom40 {margin-bottom: 40px;}
.margin-bottom50 {margin-bottom: 50px;}
.margin-bottom100 {margin-bottom: 100px;}


/* ################################## */
/* Media Queries */
/* ################################## */

@media (max-width: 1200px) {
	.navbar-default .navbar-nav > li > a{
		font-size: 13px !important;
	}
	.navbar-default .navbar-nav > li  {
		padding-left: 0px !important;
		
	}
	#headline-video .text {font-size: 48px;}
	#chat-video iframe {
		width: 580px;
		height: 326px;
	}
	#headline-video .text {
		top: 30%;
		left: 25%;
	}
}
@media (max-width: 1000px) {
	#XXnavbar { margin-top: 23px;}
	.navbar-default .navbar-nav > li > a {
		font-size: 12px !important;
		padding: 2px 5px !important;
		border-width: 1px;
	}
	.navbar-default .navbar-nav > li  {
		padding: 0px !important;
	}
	section .main-text-box {margin-top: 50px;}
	#chat-video iframe {
		min-width: 100%;
		min-height: 300px;
		width: auto;
		height: auto;
	}
	#chat-select { 
		height: 150px;
		overflow: scroll;
		overflow-x: hidden;
	}
@media (max-width: 750px) {
	#status {
		width:250px;
		height:280px;
		
		margin:-125px 0 0 -140px; /* is width and height divided by two */
	}
	.preload-logo {width: 75%}
	#headline-video {
		padding: 0px;
		width: auto;
		height: 150px;
		background-size: cover;
		overflow: hidden;
		display:block;
		background-image: url(../_00/00_cover.jpg);
	}
	video, .glyphicon-download {
		display: none !important;
	}
	#headline-video .text {
		font-size: 28px;
		top: 26%;
		left: 15%;
	}
	section .main-text-box , .panel-group, #timeline-viewport {margin-top: 20px;}
	section#05 {background-image: url(../_05/05_Bild_Hintergrund.jpg);}
	
	#navbar {
		margin-top: 49px;
	}
	ul.navbar-nav {
		text-align: left;
	}

	.navbar-default .navbar-nav > li {
		line-height: 1;
		padding: 0px !important;
		float: none;
	}

	.navbar-default .navbar-nav > li > a {
		border-right-width: 0px;
	}
	.navbar-collapse {
		background-color: #FFF;
	}
}