/* ==================================================
	Typografie
====================================================*/

@font-face {
	font-family: 'Raleway';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/raleway-v14-latin-regular.eot');
	/* IE9 Compat Modes */
	src: local('Raleway'), local('Raleway-Regular'), url('../fonts/raleway-v14-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('../fonts/raleway-v14-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
	url('../fonts/raleway-v14-latin-regular.woff') format('woff'), /* Modern Browsers */
	url('../fonts/raleway-v14-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
	url('../fonts/raleway-v14-latin-regular.svg#Raleway') format('svg');
	/* Legacy iOS */
}
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/open-sans-v17-latin-regular.eot');
	/* IE9 Compat Modes */
	src: local('Open Sans Regular'), local('OpenSans-Regular'), url('../fonts/open-sans-v17-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('../fonts/open-sans-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
	url('../fonts/open-sans-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
	url('../fonts/open-sans-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
	url('../fonts/open-sans-v17-latin-regular.svg#OpenSans') format('svg');
	/* Legacy iOS */
}
html,
body {
	height: 100%;
	font-family: 'Open Sans', sans-serif;
	text-align: center;
	color: white;
	position: relative;
	background-color: rgba(50, 50, 65, 1);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
form {
	padding-top: 7px;
}
h1,
i {
	color: rgb(255, 255, 255);
	font-family: 'Raleway', sans-serif;
	font-size: 34px;
}
h2 {
	font-family: 'Raleway', sans-serif;
	font-size: 26px;
	margin-top: 5px;
}
h3 {
	font-family: 'Raleway', sans-serif;
	font-size: 24px;
	line-height: 1.2;
	margin-top: 5px;
}
p {
	font-size: 16px;
	line-height: 1.6;
}
a,
a:hover,
a:focus {
	color: white;
	text-decoration: none;
	outline: none;
}
a img {
	outline: none;
}
img {
	border: 0;
}
@media (min-width: 767px) {
	h1 {
		font-size: 40px;
	}
}
@media (min-width: 767px) {
	h2 {
		font-size: 30px;
	}
}
.btn-primary {
	background-color: rgba(50, 50, 65, 0.8);
	margin-bottom: 20px;
	border-width: 0px;
}
.its a {
	color: rgba(50, 50, 65, 1);
	font-size: 20px;
}
.its p {
	font-size: 20px;
}
.its h1 {
	color: rgba(120, 171, 204, 1);
}
.its {
	color: rgba(50, 50, 65, 1);
	background-color: white;
}

.video_intro {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
/* ==================================================
	Navi
====================================================*/

.navbar {
	background-color: rgba(50, 50, 65, 0.8);
	min-height: 60px;
}
.navbar-nav > li > a {
	padding-top: 20px;
	height: 60px;
	font-size: 14px;
}
.navbar-brand {
	padding-top: 10px;
}
.navbar .navbar-nav > li > a:hover,
.navbar .navbar-nav > li > a:focus {
	color: white;
	background-color: transparent;
}
.navbar .navbar-nav > .active > a,
.navbar .navbar-nav > .active > a:hover,
.navbar .navbar-nav > .active > a:focus {
	background-color: rgba(255, 255, 255, 0.2);
}
@media (max-width: 767px) {
	.navbar-nav > li > a {
		height: 50px;
	}
}
@media (max-width: 767px) {
	.navbar {
		background-color: rgba(50, 50, 65, 0.8);
	}
}

/* ==================================================
	Slider
====================================================*/

.carousel,
.item,
.active {
	height: 100%;
}
.carousel-inner {
	height: 100%;
}
.fill {
	width: 100%;
	height: 100%;
	background-position: center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover;
}
.carousel-control.left,
.carousel-control.right {
	filter: progid: none !important;
	filter: none !important;
	background-image: none;
}
.carousel-caption {
	color: rgb(255, 255, 255);
	text-shadow: none;
	background-color: rgba(50, 50, 65, 0.8);
	padding-left: 25px;
	padding-right: 25px;
	padding-bottom: 15px;
	max-width: 100%;
	width: 100%;
	left: 0;
}
.carousel-indicators li {
	box-shadow: 1px 1px 3px #000000;
}
.carousel-indicators .active {}
.carousel-control .icon-prev:before {
	font-size: 120px;
	text-shadow: 0px 1px 3px #000000;
}
.carousel-control .icon-next:before {
	font-size: 120px;
	text-shadow: 0px 1px 3px #000000;
}
.carousel .carousel-indicators {
	display: none;
}

/* ==================================================
	Background/Container
====================================================*/

.hide {
	position: absolute;
	top: -1px;
	left: -1px;
	width: 1px;
	height: 1px;
}
.backstretch-carousel {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: -2;
	background-color: rgb(50, 50, 65);
}
.backstretch-overlay {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: -1;
	opacity: 0.4;
	background-image: url(/img/overlay.png)
}
.abdunkler {
	padding: 0px;
	background: -moz-linear-gradient(top, rgba(0, 0, 15, 0) 0%, rgba(0, 0, 15, 0.2) 15%, rgba(0, 0, 15, 0.5) 50%, rgba(0, 0, 15, 0.2) 85%, rgba(0, 0, 15, 0) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 15, 0)), color-stop(15%, rgba(0, 0, 15, 0.2)), color-stop(50%, rgba(0, 0, 15, 0.5)), color-stop(85%, rgba(0, 0, 15, 0.2)), color-stop(100%, rgba(0, 0, 15, 0)));
	background: -webkit-linear-gradient(top, rgba(0, 0, 15, 0) 0%, rgba(0, 0, 15, 0.2) 15%, rgba(0, 0, 15, 0.5) 50%, rgba(0, 0, 15, 0.2) 85%, rgba(0, 0, 15, 0) 100%);
	background: -o-linear-gradient(top, rgba(0, 0, 15, 0) 0%, rgba(0, 0, 15, 0.2) 15%, rgba(0, 0, 15, 0.5) 50%, rgba(0, 0, 15, 0.2) 85%, rgba(0, 0, 15, 0) 100%);
	background: -ms-linear-gradient(top, rgba(0, 0, 15, 0) 0%, rgba(0, 0, 15, 0.2) 15%, rgba(0, 0, 15, 0.5) 50%, rgba(0, 0, 15, 0.2) 85%, rgba(0, 0, 15, 0) 100%);
	background: linear-gradient(to bottom, rgba(0, 0, 15, 0) 0%, rgba(0, 0, 15, 0.2) 15%, rgba(0, 0, 15, 0.5) 50%, rgba(0, 0, 15, 0.2) 85%, rgba(0, 0, 15, 0) 100%);
	filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#0000000f', endColorstr='#0000000f', GradientType=0);
}
.copyleft {
	text-align: left;
}
@media (max-width: 767px) {
	.copyleft {
		text-align: center;
	}
}
.padding {
	padding-bottom: 25px;
}
.fullscreen {
	display: table;
	width: 100%;
	height: 100%;
	min-height: 100%;
}
.fullscreen_inhalt {
	display: table-cell;
	vertical-align: middle;
	padding-top: 60px;
}
#intro > .fullscreen_inhalt {
	vertical-align: bottom;
}
.btn {
	margin-top: -8px;
}
.img-responsive {
	width: 100%;
	height: auto;
}
.container-fluid_ds {
	background-color: rgb(50, 50, 65);
}

video{
width:100%
}

/* ==================================================
	Modal
====================================================*/

.modal-header .close {
	color: white;
	opacity: 1;
}
.modal-klein p {
	font-size: 12px;
}
.modal-dialog {
	position: absolute;
	top: 50% !important;
	transform: translate(0, -50%) !important;
	-ms-transform: translate(0, -50%) !important;
	-webkit-transform: translate(0, -50%) !important;
	margin: auto 5%;
	width: 90%;
	height: 80%;
}
.modal-content {
	background-color: rgb(50, 50, 65);
}

/* ==================================================
	Portfolio
====================================================*/

.col-alt {
	padding: 5px;
}
.portfolio__item {
	position: relative;
}
.portfolio-item__img {
	position: relative;
}
.portfolio-item__img:hover .portfolio-item-img__mask {
	opacity: 0;
	filter: alpha(opacity=0);
}
.portfolio-item__img:hover .portfolio-mask-inner__icon,
.portfolio-item__img:hover .portfolio-mask-inner__title,
.portfolio-item__img:hover .portfolio-mask-inner__summary {
	display: block !important;
}
.portfolio-item-img__mask {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: rgba(10, 10, 25, 0.8);
	padding: 5px;
	opacity: 1;
	filter: alpha(opacity=100);
	-webkit-transition: opacity 300ms;
	-o-transition: opacity 300ms;
	transition: opacity 300ms;
}
.portfolio-mask__container {
	display: table;
	height: 100%;
	width: 100%;
	min-height: 100%;
}
.portfolio-mask__inner {
	display: table-cell;
	vertical-align: middle;
}
.pad {
	padding-bottom: 15px;
}

/* ==================================================
	Floating Animation
====================================================*/

.floating {
	animation-name: floating;
	-webkit-animation-name: floating;
	animation-duration: 1.5s;
	-webkit-animation-duration: 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
@keyframes floating {
	0% {
		transform: translateY(0%);
	}
	50% {
		transform: translateY(8%);
	}
	100% {
		transform: translateY(0%);
	}
}
@-webkit-keyframes floating {
	0% {
		-webkit-transform: translateY(0%);
	}
	50% {
		-webkit-transform: translateY(8%);
	}
	100% {
		-webkit-transform: translateY(0%);
	}
}

/* ==================================================
	Lupe
====================================================*/

.magnify {
	position: relative;
	cursor: none;
}
.magnify-large {
	position: absolute;
	display: none;
	width: 300px;
	height: 300px;
	-webkit-box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9), 0 0 7px 7px rgba(0, 0, 0, 0.2), inset 0 0 40px 2px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9), 0 0 7px 7px rgba(0, 0, 0, 0.2), inset 0 0 40px 2px rgba(0, 0, 0, 0.1);
	box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9), 0 0 7px 7px rgba(0, 0, 0, 0.2), inset 0 0 40px 2px rgba(0, 0, 0, 0.1);
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%
}