/* //////////////////////////////////// ALLGEMEIN //////////////////////////////////// */
body{
	line-height:2;
	margin: 0px;
	font-size: 18px;
	font-family: 'Roboto';
	font-weight: 300;
	color: #000000;
}
h1, h2, h3, h4, h5, h6 {
	line-height:1.2;
	margin: 0 auto 30px;
	font-size: 30px;
	font-weight: normal;
	font-family: 'Montserrat';
}
.titel_box{
	margin-bottom: 30px;
}
.titel_box h1, .titel_box h2{
	display: inline-block;
	margin: 0 auto;
	border: 2px solid #000;
	padding: 10px;
	font-weight: 600;
}
div p{
	margin: 0px 0px 15px 0px;
}
div p:last-child, p:last-child{
	margin: 0 auto;
}
img{
	max-width: 100%;
	height:auto;
}
a{
	color: #DE9BE3;
	text-decoration: none;
}
a:active, a:hover {
	color: #7FC1D9;
}
.textcenter{
	text-align:center;
}
svg, video{
	max-width: 100%;
}
ul{
	padding-left: 20px;
	margin: 0 auto 15px;
}
.no_scroll{
	height: 100vh;
	overflow: hidden;
}
/* //////////////////////////////////// CONTENT //////////////////////////////////// */
.w1280{
	max-width: 1280px;
	margin: 0 auto;
	position:relative;
	padding: 0px 40px;
}
.w1024{
	max-width:1024px;
	margin:0 auto;
	position:relative;
}
.w960{
	max-width:960px;
	margin:0 auto;
	position:relative;
}
.w800{
	max-width:800px;
	margin:0 auto;
	position:relative;
}
.w600{
	max-width:600px;
	margin:0 auto;
	position:relative;
}

.margin_oben{
	margin-top: 100px;
}
.margin_unten{
	margin-bottom: 100px;
}

.fullwidth{
	width:100%;
	background-repeat:no-repeat;
	background-size:cover;
	background-position: center;
	position: relative;
}
.h900{
	height: 900px;
}
.table_div{
	display: table;
	width: 100%;
	height: 100%;
}
.table_cell_div{
	display: table-cell;
	vertical-align: middle;
}


.button{
	display: inline-block;
}
.button a, .button span{
	display: block;
	padding: 15px 25px;
	border: 1px solid;
	border-radius: 100px;
	line-height: 1;
	font-weight: 400;
	transition: all 0.3s ease 0s;
}
.button a:hover, .button span:hover{
	cursor: pointer;
}
.button_w a, .button_w span{
	color: #fff;
	border-color: #fff;
}

.button_b a, .button_b span{
	color: #000;
	border-color: #000;
}

.button a:hover, .button span:hover {
  transform: translateY(-5px);
}
.blau_hover a:hover, .blau_hover span:hover {
	border-color: #7FC1D9;
	box-shadow: 0px 15px 20px rgba(127, 193, 217, 0.7);
}
.pink_hover a:hover, .pink_hover span:hover {
	border-color: #DE9BE3;
	box-shadow: 0px 15px 20px rgba(222, 155, 227, 0.7); 
}

.white_hover a:hover{
	color: #000;
	background-color: #fff;
	box-shadow: 0px 15px 20px rgba(255, 255, 255, 0.7); 
}
/* //////////////////////////////////// Menu //////////////////////////////////// */
.menu_leiste{
	position: fixed;
	left: -375px;
	height: 100vh;
	width: auto;
	background-color: #fff;
	z-index: 10;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	transition-delay: 1s;
	box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.1);
	-o-box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.1);
}

.loaded .menu_leiste{
	left: -294px;
}
.menu_leiste.open{
	left: 0;
}
.menu{
	float: left;
	width: calc(100% - 80px);
	padding: 170px 60px 0 70px;
	width: 295px;
}
.menu_inner_leiste{
	width: 80px;
	float: right;
	position: relative;
	text-align: center;
}
.nav-menu{
	list-style: none;
	padding: 0;
	margin: 0;
}
.nav-menu li{
	display: block;
	min-width: 150px;
	margin-bottom: 30px;
}
.nav-menu li:last-child{
	margin: 0 auto;
}
.nav-menu li a{
	display: inline-block;
	font-size: 22px;
	font-weight: 600;
	color: #000;
	border-bottom: 3px solid #DE9BE3;
	line-height: 1;
	padding-bottom: 5px;
	font-family: 'Montserrat';
}
.nav-menu li a:hover{
	border-color: #7FC1D9;
}

.menu_open{
	width: 35px;
	height: 25px;
	position: absolute;
	top: 30px;
	left: 20px;
	vertical-align: middle;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	cursor: pointer;
}
.menu_open:hover{
	cursor: pointer;
}
.menu_open span{
	display: block;
	position: absolute;
	height: 3px;
	width: 100%;
	background: #000;
	border-radius: 9px;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}
.menu_open span:nth-child(1){
	top: 0px;
	width: 60%;
}
.menu_open span:nth-child(2), .menu_open span:nth-child(3){
	bottom: 11px;
}
.menu_open span:nth-child(4){
	bottom: 0px;
	width: 60%;
}
.menu_open.open span:nth-child(1){
	top: 18px;
	width: 0%;
	left: 50%;
}
.menu_open.open span:nth-child(2){
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
	bottom: 15px;
}
.menu_open.open span:nth-child(3){
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
	bottom: 15px;
}
.menu_open.open span:nth-child(4){
	top: 18px;
	width: 0%;
	left: 50%;
}

.header_logo{
	line-height: 0;
	width: 30px;
	margin: 0 auto;
}
.header_logo a{
	display: block;
}
.resp_logo{
	display: none;
}

.menu_wrapper{
	position: absolute;
	bottom: 30px;
	left: 30px;
}
.menu_wrapper a{
	display: block;
	width: 20px;
	line-height: 1;
	margin-top: 10px;
}
.menu_wrapper svg{
	width: 100%;
	height: auto;
}
.menu_wrapper a:hover .path_hover{
	fill: #DE9BE3;
}

#languages{
	position: absolute;
	bottom: 30px;
	left: 70px;
}
#languages a{
	display: inline-block;
	color: #000;
	font-family: 'Montserrat';
	font-size: 18px;
	margin-right: 10px;
	font-weight: normal;
}
#languages a:last-child{
	margin: 0 auto;
}
#languages a:hover{
	color: #DE9BE3;
}
/* //////////////////////////////////// CONTENT //////////////////////////////////// */
.no_delay{
	transition-delay: 0s !important;
}
#page{
	width: 100%;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	transition-delay: 1s;
}
.loaded #page{
	width: calc(100% - 80px);
	margin-left: 80px;
}
#page.open{
	width: calc(100% - 374px);
	margin-left: 374px;
}
.startblock{
	width: 100%;
	overflow: hidden;
	height: 100vh
}
.half_left{
	height: 100%;
	width: 100%;
	float: left;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	position: relative;
	overflow: hidden;
	animation: scroll 100s infinite;
}
@-webkit-keyframes scroll {
 100% {
    background-position: -100% 0px;
  }
}

.fixed_element{
	position: absolute;
	height: auto;
	line-height: 0;
}
.spin{
	transform-origin : center center;
	-webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:spin 4s linear infinite;
}
.fixed_element:first-child {
  left: 12%;
  top: 11%;
  width: 20px;
}
.fixed_element:nth-child(2) {
  left: 40%;
  top: 18%;
  width: 35px;
}
.fixed_element:nth-child(3) {
  right: 17%;
  top: 7%;
  width: 15px;
}
.fixed_element:nth-child(4) {
  right: 30%;
  bottom: 42%;
  width: 40px;
}
.fixed_element:nth-child(5) {
  left: 22%;
  bottom: 20%;
  width: 45px;
}
.fixed_element:nth-child(6) {
  right: 20%;
  bottom: 20%;
  width: 10px;
}
.fixed_element:nth-child(7) {
  left: 20%;
  bottom: 50%;
  width: 45px;
}
.fixed_element:nth-child(8) {
  right: 20%;
  bottom: -10%;
  width: 80px;
}
.fixed_element:nth-child(9) {
  right: 27%;
  bottom: 65%;
  width: 15px;
}

@keyframes spin { 
    0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.bg-bubbles{
	position: absolute;
	top: 0;
	left: 0;
	width: 98%;
	height: 100%;
	z-index: 1;
	padding: 0;
	margin: 0;
	overflow: hidden;
}
.bg-bubbles li{
	position: absolute;
	list-style: none;
	display: block;
	width: 40px;
	height: 40px;
	bottom: -160px;
	-webkit-animation: square 25s infinite;
	animation: square 25s infinite;
	-webkit-transition-timing-function: linear;
	transition-timing-function: linear;
	line-height: 0;
}
.bg-bubbles li:nth-child(1){
	left: 10%;
}	
.bg-bubbles li:nth-child(2){
	left: 20%;
	width: 40px;
	height: 40px;
	animation-delay: 2s;
	animation-duration: 17s;
}

.bg-bubbles li:nth-child(3){
	left: 25%;
	animation-delay: 4s;
}

.bg-bubbles li:nth-child(4){
	left: 40%;
	width: 30px;
	height: 30px;
	animation-duration: 22s;
}

.bg-bubbles li:nth-child(5){
	left: 70%;
}

.bg-bubbles li:nth-child(6){
	left: 80%;
	width: 60px;
	height: 60px;
	animation-delay: 3s;
}

.bg-bubbles li:nth-child(7){
	left: 32%;
	width: 80px;
	height: 80px;
	animation-delay: 7s;
}

.bg-bubbles li:nth-child(8){
	left: 55%;
	width: 10px;
	height: 10px;
	animation-delay: 15s;
	animation-duration: 40s;
}

.bg-bubbles li:nth-child(9){
	left: 25%;
	width: 5px;
	height: 5px;
	animation-delay: 2s;
	animation-duration: 40s;
}

.bg-bubbles li:nth-child(10){
	left: 90%;
	width: 80px;
	height: 80px;
	animation-delay: 11s;
}

@-webkit-keyframes square {
  0%   { transform: translateY(0); }
  100% { transform: translateY(-120vh) rotate(600deg); }
}
@keyframes square {
  0%   { transform: translateY(0); }
  100% { transform: translateY(-120vh) rotate(600deg); }
}


.half_right{
	position: absolute;
	right: -50%;
	height: 100%;
	background-color: black;
	width: 50%;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	background-position: center;
	background-size: cover;
}
.loaded .half_left{
	width: 51%;
	
}
.loaded .half_right{
	right: 0;
}
.overlay{
	display: table;
	width: 100%;
	height: 100%;
	position: absolute;
	text-align: center;
	z-index: 3;
	top: -100vh;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	transition: all 1s ease;
	transition-delay: 0.8s;
}
.loaded .overlay{
	top: 0px;
}


.start_text_box{
	margin: 0 auto;
	max-width: 600px;
	color: #fff;
}
.text_1{
	font-size: 25px;
	margin-bottom: 15px;
	line-height: 1;
}
.text_2{
	
}
.text_2 span{
	font-family: 'Montserrat';
	background-color: #fff;
	display: inline-block;
	color: #000;
	font-size: 50px;
	font-weight: 600;
	line-height: 1;
	padding: 10px;
	margin-bottom: 10px;
}
.text_3{
	text-transform: uppercase;
	font-size: 25px;
	font-weight: 600;
	font-family: 'Montserrat';
	letter-spacing: 5px;
	line-height: 1;
	margin-top: 5px;
}
.scroll_down{
	margin-top: 30px;
}


.leistung_box{
	width: calc(50% - 20px);
	float: left;
	border: 3px solid #DE9BE3;
	padding: 50px;
	position: relative;
	cursor: pointer;
}
.leistung_box h2{
	margin: 40px auto 50px;
}
.leistung_box:nth-child(even){
	float: right;
	border-color: #7FC1D9;
}
.leistung_box img{
	height: 50px;
}
.leistung_box:before {
	position: absolute; 
	left: 0;
	bottom: 0;
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: #DE9BE3;
	opacity: 0.2;
	transform-origin: 0 bottom 0;
	transform: scaleY(0);
	transition: .25s ease-out;
	z-index: -1;
}
.leistung_box:nth-child(even):before{
	background-color: #7FC1D9;
}
.leistung_box:hover:before {
	transform: scaleY(1);
}


.leistung_box:hover .button span{
  transform: translateY(-5px);
}
.leistung_box:hover .blau_hover span{
	border-color: #7FC1D9;
	box-shadow: 0px 15px 20px rgba(127, 193, 217, 0.7);
}
.leistung_box:hover .pink_hover span{
	border-color: #DE9BE3;
	box-shadow: 0px 15px 20px rgba(222, 155, 227, 0.7);
}



.bg_grau{
	background-color: rgba(0,0,0,0.05);
}
.erfahrung_links{
	float: left;
	width: 300px;
}
.erfahrung_rechts{
	float: right;
	max-width: calc(100% - 340px);
	text-align: right;
}
.info_box{
	float: left;
	width: auto;
	text-align: center;
	margin-left: 75px;
}
.info_box:first-child{
	margin-left: 0;
}
.info_box img{
	height: 40px;
}
.info_box span{
	display: block;
}
.info_box span.zahl{
	color: #7FC1D9;
	font-size: 40px;
	font-family: 'Montserrat';
	font-weight: normal;
}


.partner_box{
	border: 2px solid #DE9BE3;
	width: calc(25% - 30px);
	float: left;
	line-height: 0;
	margin: 0 40px 40px 0;
	position: relative;
}
.partner_box:nth-child(4n){
	margin-right: 0;
}
.partner_box a{
	padding: 30px;
}


.partner_box:before {
	position: absolute; 
	left: 0;
	bottom: 0;
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: #DE9BE3;
	opacity: 0.2;
	transform-origin: 0 bottom 0;
	transform: scaleY(0);
	transition: .25s ease-out;
	z-index: -1;
}
.partner_box:hover:before {
	transform: scaleY(1);
}


.bg_pink{
	background-color: #DE9BE3;
	color: #fff;
}
.spruch{
	font-family: 'Montserrat';
	font-size: 35px;
	font-weight: normal;
	display: inline-block;
	vertical-align: middle;
	padding: 0 50px;
	position: relative;
}
.quot_1{
	width: 25px;
	position: absolute;
	left: 0;
	bottom: 0px;
}
.quot_2{
	width: 25px;
	position: absolute;
	right: 0;
	top: 0px;
}
.author{
	margin-top: 30px;
}

.footer_logo{
	margin-top: 30px;
}
.adresse{
	line-height: 1.7;
}
.adresse a{
	color: #000;
	font-weight: normal;
}
.telefonnummer a, .mail a{
	color: #000;
}
.mwst{
	margin-top: 20px;
	font-size: 16px;
}
.empfaengercodex, .impressum{
	font-size: 16px;
}
.impressum a{
	display: inline-block;
	vertical-align: middle;
	color: #000;
}
.impressum span{
	display: inline-block;
	vertical-align: middle;
}

.impressum a:hover, .adresse a:hover, .telefonnummer a:hover, .mail a:hover{
	color: #DE9BE3;
}




.popup{
	position: fixed;
	width: 100%;
	height: 100vh;
	overflow: scroll;
	background-color: rgba(0,0,0,0.5);
	z-index: 20;
	top: 0;
	left: 0;
	text-align: center;
	display: none;
	padding: 50px 30px;
}
.inner_popup{
	background-color: #fff;
	max-width: 1200px;
	margin: 0 auto;
	text-align: left;
	position: relative;
}
.inner_popup_box{
	display: none;
}
.popup_bild{
	width: 100%;
	background-size: cover;
	background-position: center bottom;
	padding-bottom: 30%;
}
.popup_text{
	padding: 60px;
}
.close_popup{
	position: absolute;
	right: 0;
	top: 0;
	background-color: #000;
	width: 40px;
	height: 40px;
	padding: 10px;
	line-height: 1;
	cursor: pointer;
}
.pink .close_popup:hover{
	background-color: #DE9BE3;
}
.pink a, .pink h1, .pink h2{
	color: #DE9BE3;
}
.blau .close_popup:hover{
	background-color: #7FC1D9;
}
.blau a, .blau h1, .blau h2{
	color: #7FC1D9;
}
/* //////////////////////////////////// CLEARFIX do not group these rules //////////////////////////////////// */
html {
	box-sizing: border-box;
}
*, *:before, *:after {
	box-sizing: inherit;
}
.clearfix:before,
.clearfix:after {
	content:"";
	display:table;
}
.clearfix:after {
	clear:both;
}
.clearfix {
	zoom:1; /* For IE 6/7 (trigger hasLayout) */
}