/* CSS Mini Reset */
/******************/
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}
.clear { clear:both; }
/* STYLES */


@font-face{
    font-family:"DIN Next Slab W01 Regular";
    src:url("/css/fonts/bd445a03-c03d-4d4e-b23e-480a56b9de92.woff2") format("woff2"),url("/css/fonts/1404063/27f66ee3-a899-442e-826f-05803076a11b.woff") format("woff");
}
/*
@font-face {
    font-family:"DIN Next Slab W01 Regular";
    src: url('fonts/DINNextSlabPro-Regular.woff2') format('woff2'),
         url('fonts/DINNextSlabPro-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family:'DIN Next Slab W01 Medium';
    src: url('fonts/DINNextSlabPro-Medium.woff2') format('woff2'),
         url('fonts/DINNextSlabPro-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family:'DIN Next Slab W01 Light';
    src: url('fonts/DINNextSlabPro-Light.woff2') format('woff2'),
         url('fonts/DINNextSlabPro-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
*/


body {
    margin:0;
    padding:0;
    font-family:'DIN Next Slab W01 Light'!important;
    /*cursor: none;*/
    box-sizing: border-box;
    color: black;
}
body a {
}

body a:hover, body a:visited, body a:link, body a:focus {
    color: black;
    text-decoration: none;
}

/*body .cursor {    pointer-events: none; }
body .cursor__ball { position: fixed; top: 0; left: 0; mix-blend-mode: difference; z-index: 1000; }
body .cursor__ball circle { fill: #f7f8fa; }
*/
.nopad {
	padding-left: 0px!important;
	padding-right: 0px!important;
}
strong{
	font-weight:normal !important;
	/*font-family:'DIN Next Slab W01 Medium';*/
    font-family:'DIN Next Slab W01 Regular';
}

::-moz-selection { background: black; color: white; }
::selection { background: black; color: white; }

#selectionSharerPopover-inner {
	background-color: black !important;
}

#logo {
    /*position: fixed;*/
    z-index: 200;
    /*margin-left: 60px;*/
    /*margin-top: 40px;*/
    left:60px;
    top:90px;
    width: 140px;
    position: absolute;
}

.id12 #logo_wrapper {
    position: relative;
    z-index: 200;
}

#content_wrapper, .team_ov, #pro_wrapper, #product_txt, .pro_nav, #service {
    margin-top: 140px;
}

/* HEADER */
#mobnav_wrapper {
    display: none;
    background-color: black;
    color: white;
    position: absolute;
    top: 0px;
    width: 100%;
    z-index: 10;
    height: 50px;
}
.mobnavtxt {
    font-size: 16px;
    height: 26px;
    font-family:'DIN Next Slab W01 Medium';
    position: relative;
    top: 13px;
    left: 20px;
    cursor: pointer;
}
.mobnav {
    display: none;
    height: calc(100vh - 50px);
    background-color: black;
    width: 100%;
    position: absolute;
    top: 50px;
    padding-top: 40px;
}
.mobnav li {
    text-align: center;
    padding-top: 25px;
    padding-bottom: 25px;
}
.mobnav a {
    color: white !important;
    font-size: 29px;
    line-height: 39px;
    font-family:'DIN Next Slab W01 Medium';
}
.mob_act {
    border-bottom: 1px solid #3A3A3A;
}
#header {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 50px;
    width: 100%;
    z-index: 20;
    padding-right: 60px;
    background-color: black;
}

.headernav {
    float: right;
    margin-bottom: 0px;
    position: relative;
    top: 12px;
}

.headernav li {
    float: left;
    margin-left: 100px;
}

.headernav a {
    font-family:'DIN Next Slab W01 Medium';
    font-weight: 400;
    font-size: 16px;
    color: white !important;
}

/* NEW SERVICE */
#slogo {
    position: absolute;
    top: 90px;
    left: 60px;
    z-index: 10;
    width: 140px;
    height: auto;
}

#serviceicon {
    position: absolute;
    top: 65px;
    right: 15px;
    z-index: 20;
    width: 80px;
    height: auto;
}

.id98 #logo {
    display: none;
}

.serviceimg {
    position: relative;
    background-attachment: fixed !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    height: 100vh;
    width: auto;
    z-index: 0;
}

.simg_txt {
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100%;
    text-align: center;
    color: white;
    font-family: "DIN Next Slab W01 Medium";
}
.simg_txt > span {
    font-size: 21px;
    line-height: 30px;
}
.simg_txt > h2 {
    font-size: 80px;
    line-height: 90px;
    margin: 0px;
}
#contentservice1, #contentservice2, #contentservice3 {
    padding: 0px 250px;
}



#talk, #cat, #contentservice3 h2,  #contentservice3 p, #contentservice1 .servicetitle, #contentservice1 h2, #contentservice2 .servicetitle, #contentservice2 .serviceinside > span, .service_ht  {
    font-family: "DIN Next Slab W01 Medium";
}

#contentservice1 .servicetitle, #contentservice3 p {
    font-size: 18px !important;
    line-height: 28px !important;
}

#contentservice1 h2 {
    font-size: 36px;
    line-height: 40px;
    margin-top: 5px;
    margin-bottom: 15px;
}
#service p {
    font-size: 20px;
    line-height: 30px;
    margin: 0px;
}
#service {
    position: relative;
    z-index: 100;
}
#contentservice2 .servicetitle {
    font-size: 15px !important;
    line-height: 25px !important;
}

#contentservice2 .serviceinside > span, #contentservice3 h2 {
    font-size: 30px;
    line-height: 40px;
}
.service_ht {
    font-size: 16px;
    line-height: 26px;
}






#contentservice1 {
    margin-bottom: 200px;
}

#contentservice1 .serviceinside {
    width: 50%;
}

#contentservice2 {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 150px;
}

#contentservice2 .serviceinside img{
    width: 100%;
    height: auto;
    margin-top: 10px;
    margin-bottom: 25px;
}

#contentservice2 .serviceinside {
    margin-bottom: 50px;
}
#contentservice2 .serviceinside:nth-child(3n+1){
    padding-left: 0px;
    padding-right: 20px;
}
#contentservice2 .serviceinside:nth-child(3n+2){
    padding-left: 10px;
    padding-right: 10px;
}
#contentservice2 .serviceinside:nth-child(3n){
    padding-left: 20px;
    padding-right: 0px;
}

.service_all, #service {
    float: left;
}
.service_all {
    position: relative;
    z-index: 50;
}
#contentservice3 {
        background-color: black;
        color: white;
        display: flex;
        flex-wrap: wrap;
        padding-top: 180px;
}
#contentservice3 .serviceinside:nth-child(2n) {
    padding-right: 0px;
    padding-left: 140px;
}
#contentservice3 .serviceinside:nth-child(2n+1) {
    padding-right: 140px;
    padding-left: 0px;
}
#contentservice3 h2 {
    margin-top: 0px;
}
 #contentservice3 p {
     margin-bottom: 20px;
 }
 .service_ht {
     margin-right: 10px;
     margin-bottom: 10px;
     border: 1px solid white;
     transition: all 0.2s;
     padding: 0px 8px;
     float: left;
 }
 /*
 .service_ht:hover {
     border: 1px solid black;
 }
 */
 #contentservice3 > div {
     margin-bottom: 180px;
 }

 #simg_bottom {
     position: relative;
     float: left;
     width: 100%;
 }
 #simg_bottom .serviceimg {
     height: 700px;
 }

 #simg_bottom .simg_txt {
     display: none;
 }

#talk {
     position: absolute;
     top: 325px;
     left: 0;
     right: 0;
     margin-left: auto;
     margin-right: auto;
     width: 150px;
     text-align: center;
     padding-top: 15px;
     padding-bottom: 15px;
     color: black;
     background-color: white;
     font-size: 20px;
     z-index: 50;
 }

#talk:hover {
    background-color: black;
    color: #6F6F6F;
}


.t-caret {
    width: 3px;
    height: 62px;
    top: 4px;
    left: 10px;
    background-color: white;
    position: relative;
    display: inline-block;
}


/* CATEGORIES */
#cat {
    position: absolute;
    top: 12px;
    left: 60px;
    color: black;
    z-index: 220;
    font-size: 16px;
    line-height: 25px;
}

#cat:hover {
    cursor: pointer;
}

#cat > img {
    width: 22px;
    height: auto;
    margin-right: 12px;
    display: none;
}

#inner_cat {
    display: none;
    position: fixed;
    left: 0px;
    top: 50px;
    font-size: 16px;
    line-height: 25px;
    background-color: white;
    z-index: 210;
    box-shadow: 0px 10px 10px -15px #111;
    padding: 50px 45px 50px 60px;
    width: 100%;
}

#inner_cat span {
    border: 1px solid #CDCDCD;
    font-family: "DIN Next Slab W01 Medium";
    margin-right: 15px;
    padding: 5px 15px;
    transition: all 0.2s;
    float: left;
    margin-bottom: 15px;
}

#inner_cat span:hover {
    border: 1px solid white;
}

.cat_act {
    background-color: #E6E6E6;
}

.even a {
    float: left !important;
}

.odd a {
    float: right !important;
}

/* CONTENT */
.content_txt {
    font-size: 18px;
}

.content_txt a, .content_txt a:hover, .content_txt a:visited, .content_txt a:link {
    color: black;
    text-decoration: none;
}

.def_text:not(:last-child){
}

#ptxt_wrapper {
	clear: both;
}

#content_wrapper, #product_txt, #ptxt_wrapper, #pn_content {
	margin-left: auto;
	margin-right: auto;
	width: 75%;
}
#fancy .def_text{
	padding-top:150px;
	padding-right:440px;
}
#ptxt_wrapper .def_text{
	padding-right:0px;
	font-size:23px;
	line-height:40px;
	font-family:'DIN Next Slab W01 Medium';
}
.contact_txt{
	padding-top:150px;
	font-size:21px;
}
.contact_txt img{
	margin-top:-50px;
}
#newsletter{
	margin-top:50px;
}
#content_wrapper h2, #product_txt h2, #ptxt_wrapper h2 {
    margin-top: 0px;
    margin-bottom: 35px;
	font-weight: bold;
}

#content_wrapper h1, #product_txt h1, #ptxt_wrapper h1  {
    font-size: 18px;
    margin-top: 0px;
    margin-bottom: 10px;
}

#product_txt h1, #product_txt h2, #content_wrapper h1, #content_wrapper h2{
	font-family:'DIN Next Slab W01 Medium';
	font-weight:400;
}
#content_wrapper span, #product_txt span, #ptxt_wrapper {
    font-size: 20px;
    line-height: 28px;
    display: block;
}
#content_wrapper.contact_txt span{
    font-size: 18px;
	line-height:26px;
	display: block;
}
.contact_t xt {
	display: flex;
	align-items: center;
}

#newsletter input{
    -webkit-border-radius:0;
    border-radius:0;
	-webkit-appearance: none;
	width: 80%;
	padding: 5px 0px;
	border: none;
	border-bottom: 1px solid #575757;
	font-size:18px;
}

#newsletter #email::placeholder {
	color: #575757;
	opacity: 1;
}

#newsletter #send{
    -webkit-border-radius:0;
    border-radius:0;
	 -webkit-appearance: none;
	background-color: black;
	color: white;
	border: none;
	font-weight: bold;
	padding: 5px 24px;
	margin-top: 20px;
	width: auto;
	font-size:18px;
}

.input_wrongdiv {
	display: none;
}

#kreis {
    background-color: rgba(112, 112, 112, 0.8);
    width: 69px;
    height: 69px;
    text-align: center;
    border-radius: 100px;
    position: absolute;
    top: calc(100vh - 110px);
    left: 50%;
    margin-left: -50px;
    display: none;
}

#kreis:hover {
    cursor: pointer;
}

#kreis img {
    width: 28px;
    height: auto;
    margin-top: 27px;
}



#panorama {
    width: 100vw;
    height: 100vh;
    cursor:default;
}
.pnlm-grab {
	cursor: default;
}

#dia {
    position: absolute;
    margin:0;
    padding:0;
    z-index: 1;
    top:0;
    left:0;
    width:100vw;
    height:100vh;
    background: rgba(255,255,255,0);
    color:#000;
    /*text-align: center;*/
    /*cursor: pointer;*/
    display: none;
    overflow-y: scroll;
    /*clip-path: polygon(calc(100% - 110px) 0%, 0% 0%, 0% 100%, 100% 100%, 100% 110px, calc(100% - 110px) 110px);*/
    /*border:solid 1px red;*/
    /*
    background-image:url("/img/closelogo.png");
    background-size:100%;
    background-repeat: no-repeat;
    background-position: top right;
*/
}
/*

#diahead {
    text-align: left;
    background: #fff;
    position: absolute;
    left:0;
    right:95px;
    top:0;
    height:95px;
    border-right:solid 1px white;
}

#diacanvas {
    position: absolute;
    top:0;
    right:0;
    touch-action: none;
    width:95px;
    height:95px;
    margin:0;
    z-index:10;
}

#diacontent {
    margin:95px auto; width:100%;
    height:100%;
    background: #ffffff;
    color:#000;
}
*/

#diahead {
    text-align: left;
    background-color: #fff;
    position: absolute;
    left:0;
    right:100vw;
    top:0;
    height:100vh;
    border-right:solid 1px white;
}
#diahead.black {
    border-right:solid 1px black;
	background-color: black;
	color: white;
}

#diacontent {
    /*height:100%;*/
	background: #fff;
    /*
	clip-path: polygon(calc(100% - 110px) 0%, 0% 0%, 0% 100%, 100% 100%, 100% 110px, calc(100% - 110px) 110px;
    -webkit-clip-path: polygon(calc(100% - 110px) 0%, 0% 0%, 0% 100%, 100% 100%, 100% 110px, calc(100% - 110px) 110px);
    */
    color:#000;
    /*margin-left:100vw;*/
    margin-top:100vh;
    position: absolute;
    left:0;
    right:0;
    /*overflow-y: scroll;*/
}

#diacontent.black {
	background-color: black;
	color: white;
}

#diacontent.black .pro_nav {
	margin-top: 110px;
}

#diacontent.no-clip {
    clip-path: none;
}

#diacanvas {
    position: absolute;
    top:0;
    right:0;
    /*left:0;*/
    touch-action: none;
    width:100vw;
    height:100vh;
    margin:0;
    z-index:20;
    /*background-image:url("/img/closelogo.png");*/
    background-size:200%;
    background-repeat: no-repeat;
    background-position: top right;
    top: 50px !important;

}

.startl {
    float:left;
}

.startr {
    float:right;
}

.lchar {
	max-width:100%;
    position: absolute;
    text-align: center;
    vertical-align: middle;
	height:100%;
}

.char {
    display: inline-block;
    /*animation-delay: calc(0.25s + var(--char-index) * 0.1s);*/
    /*transition: all 0.25s calc(0.25s + var(--char-index) * 0.1s); */
    transition: all 0.1s;
}

.text--random.char:nth-of-type(1) {
    transform: translateX(-265%) translateY(-31%);
}

.text--random.char:nth-of-type(2) {
    transform: translateX(-195%) translateY(206%);
}

.text--random.char:nth-of-type(3) {
    transform: translateX(114%) translateY(66%);
}

.text--random.char:nth-of-type(4) {
    transform: translateX(-91%) translateY(184%);
}

.text--random.char:nth-of-type(5) {
    transform: translateX(42%) translateY(28%);
}

.text--random.char:nth-of-type(6) {
    transform: translateX(114%) translateY(-41%);
}

.char.delighter {
    transition: all 1s ease-out;
    transform: translateX(-100%);
    opacity: 0.1;
}

.char.delighter.started {
    transform: none;
    opacity: 1;
}

.char.delighter.started.ended {
    transform: none;
    opacity: 1;
}

.smallpopup24 {
	width: 24px;
	height: 24px;
}
.smallpopup50 {
	width: 50px;
	height: 50px;
}
.squareIntInvis {
    width:60px;
    height:420px;
}
.squareExtInvis {
    width:32px;
    height:32px;
}
.smallpopup, .squareInt, .squareExt {
	width: 12px;
	height: 12px;
	background-color: transparent;
	border: 3px solid white;
	transition: width 0.5s, height 0.5s;
}

.smallpopup:hover, .squareInt:hover, .squareExt:hover {
	margin-top:-2.5px;
	margin-left:-2.5px;
	width: 17px;
	height: 17px;
}

.circle {
    border: 3px solid #ffffff;
    background-color: transparent;
    height: 12px;
    width: 12px;
    border-radius:50%;
    transition: width 0.5s, height 0.5s, margin 0.5s;
}

.circle:hover {
	   width:18px;
       height:18px;
       margin-left:-3px;
       margin-top: -3px;
}
.artpopup {
    border: none;
    height:34px;
    width:34px;
    /*
    transition: width 0.5s, height 0.5s, margin 0.5s;
	background:url("../img/plus.png") center center no-repeat;
    */
}
.artpopupmed {
    height:120px;
    width:120px;
}
.artpopupbig {
    height:300px;
    width:200px;
}

/*
.artpopup:hover{
	width:18px;
	height:18px;
	margin-top:-1px;
	margin-left:-1px;
}
*/
.friedhof {
    width:27px;
    height:52px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='27' height='52.681' viewBox='0 0 27 52.681'><line y2='52.681' transform='translate(13.25)' fill='none' stroke='%23fff' stroke-width='4'/><line x1='27' transform='translate(0 14.5)' fill='none' stroke='%23fff' stroke-width='4'/></svg>");
    transition: background-image 0.2s;
}
.friedhof:hover  {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='27' height='52.681' viewBox='0 0 27 52.681'><line y2='52.681' transform='translate(13.25)' fill='none' stroke='%23000' stroke-width='4'/><line x1='27' transform='translate(0 14.5)' fill='none' stroke='%23000' stroke-width='4'/></svg>");
}
.cookie {
    width:22px;
    height:21px;
    background-image:url("/img/cookie.png");
    background-repeat: no-repeat;
}
.cookie:hover {
    background-size: 110%;
    margin-left:-1px;
    margin-top:-1px;
    width:24px;
    height:23px;
}
/*
.artpopup {
    border: none;
    background-color: rgba(255,255,255,1);
    height: 20px;
    width: 4px;
    transition: width 0.5s, height 0.5s, margin 0.5s;
}
.artpopup:before{
	background-color: rgba(255,255,255,1);
	height: 4px;
    width: 20px;
	content: "";
	position: absolute;
    top: 8px;
    left: -8px;
}
.artpopup:hover {
	transition: all 0.5s;
	height:30px;
	margin-top:-5px;
}
.artpopup:hover:before{
	top:13px;
}

.artpopup:hover {
    height:30px;
}
.artpopup:hover::before {
    width: 30px;
	top: 12px;
	left: -12px;
}
.artpopup::after {
    content: '';
    width: 30px;
    height: 30px;
    display: inline-block;
    margin: 0px -12px;
}*/
#popup {
    display:none;
    background-color:#fff;
    width:480px;
    height:auto;
    margin:0 auto;
    position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	right: 0px;
    z-index: 10;
}



#popup #popwrapper {
	padding: 60px 40px;
    z-index:10;
}

#popup h1 {
	margin-top: 50px;
	padding: 0px;
	font-size: 18px;
	font-family:'DIN Next Slab W01 Medium';
}

#popup .def_text {
	font-size: 16px;
}

#popup .def_text a {
	font-weight: bold;
	/*text-decoration: underline;*/
}

#cross{
	position: absolute;
/*	width: 4px;
	height: 4px;
	right: 20px;
	top: 20px;
*/
    width:20px;
    height:20px;
    right:8px;
    top:20px;
	transform: rotate(45deg);
}
#cross:before{
	background: black;
	content: "";
	width: 20px;
	height: 4px;
	position: absolute;
	top: 0px;
	left:-8px;
	transition:all 0.5s;
}
#cross:after {
	background: black;
	content: "";
    width: 4px;
    height: 20px;
	position: absolute;
	top:-8px;
	left:0px;
	transition:all 0.5s;
}
#cross:hover:before{
	width:30px;
	left:-13px;
}
#cross:hover:after{
	height:30px;
	top:-13px;
}
#sp_wrapper {
    display:none;
    background-color:#fff;
    width:250px;
    height:auto;
    margin:0 auto;
    position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	right: 0px;
    z-index:10;
}

#sp_wrapper #popwrapper {
	padding: 30px 40px;
    z-index:10;
}

#sp_wrapper h1 {
	font-weight: bold;
	font-size: 18px;
	margin: 0px;
}

#sp_wrapper .revealing {
	font-size: 16px;
}


#fancy {
   display: none;

}

#site_end {
    position: fixed;
    bottom: 10px;
}

/* PRODUKTE */
#product_txt {
    min-height: calc(100vh - 110px - 69px - 50px);
	display: flex;
	align-items: center;
}

.hideme  {
    clear: both;
	opacity: 0;
}


#projektseite {
 /*   height: 100vh; */
    background-color: black;
    /*overflow-y: scroll;*/
    clear: both;
}
#pro_wrapper {
    padding-right: 80px;
    padding-left: 80px;
}

.pro_nav {
	overflow: hidden;
	background-color: white;
	float: left;
	margin-bottom: 0px;
}

.pro_nav, #othersp {
    padding-left: 60px;
    padding-right: 60px;
}

.pro_nav li {
    width: 100%;
}

.pro_nav li a {
    width:50%;
    position: relative;
    display: inline-block;
}

.pro_nav li:not(:first-child) a {
    margin-top: -100px;
}

.pro_nav li a img {
    width:66%;
	margin-left:17%;
}

.pro_nav li:nth-child(even) a{
    float: right;
}

.pronav_txt {
    left: 0px;
    right: 0px;
}

.pronav_txt .word {
	font-family:'DIN Next Slab W01 Medium';
	top: 50%;
	transform: translateY(-50%);
	position: absolute;
	left: 0;
	right: 0;
	font-size:130px;
}

#projektseite .hideme {
    margin-right: auto;
    margin-left: auto;
    float: none;
    display: block;
    padding-bottom: 150px;
}

#projektseite .hideme:first-child {
	padding-top: 150px;
}

#othersp {
    padding-top: 100px;
    padding-bottom: 80px;
    margin-top: 0px;
    margin-bottom: 0px;
}

#end {
	clear: both;
	background-color: transparent;
	position: fixed;
	top: calc(100vh - 65px);
	z-index: 10;
	left: 0px;
	right: 0px;
}

.serviceend {
    top: calc(100vh - 75px) !important;
}

.black ::selection {
    background: #fff;
}

.black #end {
	top: calc(100vh - 135px);
}

.black .contact_txt a:hover, .black .contact_txt a:visited, .black .contact_txt a:link, .black .contact_txt a:focus{
    color:#fff;
}
#end img {
	width: 49px;
	height: auto;
	display: block;
	margin-right: auto;
	margin-left: auto;
	cursor: pointer;
	animation-duration: 1s;
	animation-name: end_ani;
	animation-direction: alternate-reverse;
	animation-iteration-count: infinite;
}
@keyframes end_ani{
	from{
		margin-top:-10px;
	}
	to{
		margin-top:10px;
	}
}

#pn_wrapper {
	background-color: white;
	width: 100%;
	position: fixed;
	bottom: 0px;
	color: black;
	height: 60px;
	border-top: 1px solid black;
	z-index: 10;
	font-size: 18px;
	font-weight: bold;
    left:0;
}

#pn_content > a, #pn_content > div {
	margin-top: 16px;
}

#pn_content > a {
	/*font-family:'DIN Next Slab W01 Medium';*/
    font-family:'DIN Next Slab W01 Regular';
	float: left;
	padding: 0px;
	position:relative;
}
.footer_nav a, .def_text a, #p_back, #p_next, .team_txt  a{
	position: relative;
}
#pn_content > a:after, .footer_nav a:after, .def_text a:after, #p_back:after, #p_next:after, .team_txt a:after, #ofooter .fl a:after, #st_bottom a:after {
	display: block;
	content:"";
	height:2px;
	position: absolute;
	left:0px;
	bottom:-3px;
	background:#000;
	width:0px;
	transition: all 0.5s;
}
#ofooter .fl a:after {
    position: relative !important;
    bottom:1px !important;
}
#pn_content > a:hover:after, .footer_nav a:hover:after, .def_text a:hover:after, #p_back:hover:after, #p_next:hover:after, .team_txt a:hover:after, #ofooter .fl a:hover:after {
	width:100%;
}
#kaffee_close:after {
	display: block;
	content:"";
	height:2px;
	position: relative;
	left:0px;
	bottom:1px;
	background:#fff;
	width:0px;
	transition: all 0.5s;
}
#kaffee_close:hover:after {
     width:152px;
}

#pn_content > div {
	float: right;
}

#pn_content img {
	width: auto;
	margin-top: -2px;
}
#p_next_outer{
	position: relative;
	float: left;
}
#p_next_outer img{
	transition:all 0.5s;
	position: absolute;
	top:8px;
	right:-16px;
}
#p_next_outer:hover img{
	right:-21px;
}
#p_back_outer{
	margin-right: 80px;
	position: relative;
	float: left;
}
#p_back_outer img{
	padding-right: 7px;
	transition:all 0.5s;
}
#p_back_outer:hover img{
	padding-right:12px;
}

/* KUNDENMEINUNGEN */
#opinion_wrapper {
	display: block;
	margin: auto;
	float: none;
}

#opinion_wrapper .opinions {
	clear: both;
	width: 650px;
	margin-bottom: 60px;
}

#opinion_wrapper .opinions:nth-child(odd){
	float: right;
}

#opinion_wrapper .opinions:nth-child(odd) h2 {
	text-align: left;
}

#opinion_wrapper .opinions:nth-child(even){
	float: left;
}

#opinion_wrapper .opinions:last-child {
	margin-bottom: 140px;
}

.opinions span {
	font-size: 54px;
	line-height: 64px;
	font-weight: bold;
}

.opinions h2 {
	font-size: 16px;
	margin-top: 18px;
	margin-bottom: 0px;
}



/* OLD PROJECTS */
@keyframes jump {
	from {
		top: 0px;
	}
	to {
		top: -20px;
	}
}

#pold {
	padding-left: 110px;
	padding-right: 110px;
	float: left;
	width: 100%;
}

.kreuz {
	height: 165px;
	width: auto;
	opacity: 1;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
	margin-top: 180px;
	position: relative;
}

.kreuz:hover {
	opacity: 0.2;
	animation-name: jump;
	animation-duration: 0.5s;
	animation-fill-mode: forwards;
}

#pold a {
	padding: 0px;
	margin: 0px;
	border: 0px;
	text-align: center;
	cursor: auto;
}

/* TEAM */
#team_wrapper {
    position: relative;
    margin-bottom: 160px;
}
#team_img.team2{
	display:none;
}

.team_txt {
    text-align: left;
    position: absolute;
    top: 200px;
    right: 90px;
    width: 23%;
}

.team_txt h1 {
    padding-top: 0px;
    font-size: 50px;
    font-family: 'DIN Next Slab W01 Medium';
    margin-bottom: 20px
}

#team_img {
    height: 100vh;
    width: auto;
    margin-right: auto;
    margin-left: auto;
    display: block;
}

#team_nav {
    padding-left: 130px;
    padding-right: 130px;
    clear: both;
    display: flex;
    flex-wrap: wrap;
}
#fav_proj{
    font-family: 'DIN Next Slab W01 Medium';
	position: relative;
	float: left;
	width:100%;
	margin-bottom:25px;
}
#fav_proj img{
	position: absolute;
	left:0px;
	top:50px;
	width:100%;
	height:auto;
	display:none;
	z-index:100;
}
.heart{
	background:url("../img/heart1.svg") center center no-repeat;
	background-size:100% 100%;
	display:inline-block;
	width:15px;
	height:15px;
	margin-right:10px;
}
.team_box{
	cursor:pointer;
}
.team_box:hover .heart{
	background:url("../img/heart2.svg") center center no-repeat;
	background-size:100% 100%;
}
/*
.team_box:hover + img{
	display:block !important;
}*/

/*#team_nav a img, #team_nav a:hover .team_name{*/
#team_nav a img {
    opacity: 1;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}

#team_nav a:hover img {
    opacity: 1;
}

#team_nav a:hover .team_name {
	display: block;
}


.team_name {
    /*opacity: 0;*/
    display:none;
    position: absolute;
    /*
    top: 50%;
    transform: translateY(-50%);
*/
    top:0;
    bottom:0;
    left: 0;
    right: 0;
    z-index: 10;
    color: black;
    font-size: 36px;
    text-align: center;
}


#team_nav a {
    margin-bottom: 70px;
}

#team_nav a:nth-child(3n) img {
    padding-left: 20px;
    padding-right: 0px;
}

#team_nav a:nth-child(3n+1) img {
    padding-left: 0px;
    padding-right: 20px;
}

#team_nav a:nth-child(3n+2) img {
    padding-left: 10px;
    padding-right: 10px;
}

#team_hover {
    position: absolute;
    height: 200px;
    bottom: 80px;
    width: 100%;
    text-align: center;
    color: white;
    display: none;
}

/* OVERLAY */
#anmeldung {
    width: 425px;
}

#nav1{
	padding-left:0px;
	padding-right:0px;
}
#ov_close{
    margin-top: -20px;
    margin-left: -50px;
margin-right: 15px;
}

#kaffee_close{
	font-family:'DIN Next Slab W01 Medium';
	cursor:pointer;
	/*border-bottom:1px solid #FFF;*/
    font-size: 18px;
}
#overlay{
	display:none;
	position: fixed !important;
	width:100vw;
	background:rgba(0,0,0,0.8);
	z-index:1000000;
	left: 0;
    top: 0;
    height: 100vh;
    overflow-x: hidden;
}

#overlay .container{
	height: 100vh;
	position: relative;
	overflow: scroll;
	padding-left:250px;
	padding-right:15px;
	color:#FFF;
    padding-top: 100px;
}
#overlay #form_title{
	font-size:36px;
    font-family: 'DIN Next Slab W01 Medium';
}

#formt_wrapper {
    margin-bottom:20px;
    margin-top: 30px;
}

#overlay .txt{
	margin-bottom:50px;
	display:block;
	float:left;
	width:100%;
    font-size: 16px;
}
#overlay label{
	font-weight:normal;
	margin-bottom:15px;
}
#overlay .formfeld {
	border-bottom:1px solid #FFF;
}
#overlay .formfeld, #overlay .formfeld::placeholder{
	margin-bottom:25px;
    padding-bottom: 5px;
	background:none;
    border-top: none;
    border-right: none;
    border-left: none;
	padding-left:0px;
    font-size: 20px;
    color: white;
    opacity: 1;
    width: 100%;
}
#overlay input, #overlay .formfeld::placeholder, #overlay .formfeld:focus {
    border:none;
}
#overlay .formfeld option {
    padding-left: 0px;
    font-size: 14px;
}

#overlay input {
    border:none;
    padding-left: 5px!important;
}


#overlay select{
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;       /* remove default arrow */
	background:url(../img/kaffee_dd.png) center right 10px no-repeat !important;
}
#overlay input#send{
	background:#FFF;
	color:#000;

	border:none;
	font-family:'DIN Next Slab W01 Medium';
	margin-top:20px;
    padding: 7px 30px 7px 30px!important;
}
#after_send{
	display:none;
	margin-top:20px;
}

/* TON */
#ton {
	width: auto;
	height: 30px;
	position: absolute;
	right: 140px;
	top: 35px;
    display: none;
}


/* NAV BOTTOM */
.nav_bottom {
    position: relative;
    z-index: 200;
    margin-top: 200px;
    margin-bottom: 200px;
    clear: both;
	background-color: white;
	float: left;
	width: 100%;
}
.end12 .nav_bottom{
	background:#000;
}
.nav_bottom:hover a{
	opacity:0.5;
}

.nav_bottom li {
    float: left;
    width: 33.333%;
    text-align: center;
}
.nav_bottom a:hover{
	opacity:1;
	font-size:40px;
}

.nav_bottom li a {
	/*font-family:'DIN Next Slab W01 Medium';*/
    font-family:"DIN Next Slab W01 Regular";
  	transition:all 0.5s;
	font-size: 30px;
	line-height:40px;
    color: black;
    text-decoration: none;
}
.end12 .nav_bottom li a{
	color:#FFF;
}
.nav_bottom .act {
    display: none!important;
}

/* FOOTER */
#ofooter {
    position: relative;
    z-index: 200;
    clear: both;
	background-color: white;
	color: black;
	float: left;
	width: 100%;
}

.footerb {
	margin-bottom: 50px !important;
}

.footer_nav {
	float: right;
}

.footer_nav li{
    float: left;
}

.fr {
	float: right;
}

.fl, .fr {
    font-size: 20px;
    padding-bottom: 30px;
    padding-top: 30px;
}

.fl a, .fr a, .fl a:hover, .fr a:hover, .fl a:active, .fr a:active, .fl a:visited, .fr a:visited {
    color: black;
    text-decoration: none;
}

.fl {
    float:left;
    padding-left: 50px
}

#ofooter div:nth-child(4) {
	padding-right: 50px;
}

.fr .footer_nav li {
    float:right;
    padding-right: 50px
}
.sig {
	height:160px;
	/*padding-bottom: 25px;*/
}

.sig path, .sig line {
  fill: none;
  stroke: #b0b0b0;
  stroke-width: 1;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-miterlimit: 10;
}



.sig_adrian1 {
  stroke-dasharray: 144;
  animation: anim_adrian1 2s linear;
}
.sig_adrian2 {
  stroke-dasharray: 79;
  animation: anim_adrian2 2s linear;
}
.sig_adrian3 {
  stroke-dasharray: 27;
  animation: anim_adrian3 2s linear;
}
.sig_adrian4 {
  stroke-dasharray: 13;
  animation: anim_adrian4 2s linear;
}
.sig_adrian5 {
  stroke-dasharray: 104;
  animation: anim_adrian5 2s linear;
}
.sig_adrian6 {
  stroke-dasharray: 2;
  animation: anim_adrian6 2s linear;
}

@keyframes anim_adrian1 {
    0% { stroke-dashoffset: 144; }
    16% { stroke-dashoffset: 0; }
}
@keyframes anim_adrian2 {
    0%, 16%  { stroke-dashoffset: 79; }
    32% { stroke-dashoffset: 0; }
}
@keyframes anim_adrian3 {
    0%, 16%, 32%  { stroke-dashoffset: 27; }
    48% { stroke-dashoffset: 0; }
}
@keyframes anim_adrian4 {
    0%, 20%, 48%, 64%  { stroke-dashoffset: 13; }
    80% { stroke-dashoffset: 0; }
}
@keyframes anim_adrian5 {
    0%, 20%, 48%, 64%, 80%  { stroke-dashoffset: 104; }
    96% { stroke-dashoffset: 0; }
}
@keyframes anim_adrian6 {
    0%, 20%, 48%, 64%, 80%, 96%  { stroke-dashoffset: 2; }
    100% { stroke-dashoffset: 0; }
}

.sig_daniela1 {
  stroke-dasharray: 19;
  animation: anim_daniela1 2s linear;
}
.sig_daniela2 {
  stroke-dasharray: 123;
  animation: anim_daniela2 2s linear;
}
.sig_daniela3 {
  stroke-dasharray: 93;
  animation: anim_daniela3 2s linear;
}
.sig_daniela4 {
  stroke-dasharray: 15;
  animation: anim_daniela4 2s linear;
}
.sig_daniela5 {
  stroke-dasharray: 2;
  animation: anim_daniela5 2s linear;
}
.sig_daniela6 {
  stroke-dasharray: 88;
  animation: anim_daniela6 2s linear;
}
.sig_daniela7 {
  stroke-dasharray: 51;
  animation: anim_daniela7 2s linear;
}

@keyframes anim_daniela1 {
    0% { stroke-dashoffset: 19; }
    14% { stroke-dashoffset: 0; }
}
@keyframes anim_daniela2 {
    0%, 14%  { stroke-dashoffset: 123; }
    28% { stroke-dashoffset: 0; }
}
@keyframes anim_daniela3 {
    0%, 14%, 28%  { stroke-dashoffset: 93; }
    42% { stroke-dashoffset: 0; }
}
@keyframes anim_daniela4 {
    0%, 14%, 28%, 42%  { stroke-dashoffset: 15; }
    56% { stroke-dashoffset: 0; }
}
@keyframes anim_daniela5 {
    0%, 14%, 28%, 42%, 56%  { stroke-dashoffset: 2; }
    70% { stroke-dashoffset: 0; }
}
@keyframes anim_daniela6 {
    0%, 14%, 28%, 42%, 56%, 70%  { stroke-dashoffset: 88; }
    84% { stroke-dashoffset: 0; }
}
@keyframes anim_daniela7 {
    0%, 14%, 28%, 42%, 56%, 70%, 84%  { stroke-dashoffset: 51; }
    100% { stroke-dashoffset: 0; }
}

.sig_denise1 {
  stroke-dasharray: 40;
  animation: anim_denise1 2s linear;
}
.sig_denise2 {
  stroke-dasharray: 56;
  animation: anim_denise2 2s linear;
}
.sig_denise3 {
  stroke-dasharray: 140;
  animation: anim_denise3 2s linear;
}
.sig_denise4 {
  stroke-dasharray: 3;
  animation: anim_denise4 2s linear;
}
.sig_denise5 {
  stroke-dasharray: 57;
  animation: anim_denise5 2s linear;
}
@keyframes anim_denise1 {
    0% { stroke-dashoffset: 40; }
    20% { stroke-dashoffset: 0; }
}
@keyframes anim_denise2 {
    0%, 20%  { stroke-dashoffset: 56; }
    40% { stroke-dashoffset: 0; }
}
@keyframes anim_denise3 {
    0%, 20%, 40%  { stroke-dashoffset: 140; }
    60% { stroke-dashoffset: 0; }
}
@keyframes anim_denise4 {
    0%, 20%, 40%, 60%  { stroke-dashoffset: 3; }
    80% { stroke-dashoffset: 0; }
}
@keyframes anim_denise5 {
    0%, 20%, 40%, 60%, 80%  { stroke-dashoffset: 57; }
    100% { stroke-dashoffset: 0; }
}

.sig_eva1 {
  stroke-dasharray: 38;
  animation: anim_eva1 2s linear;
}
.sig_eva2 {
  stroke-dasharray: 20;
  animation: anim_eva2 2s linear;
}
.sig_eva3 {
  stroke-dasharray: 16;
  animation: anim_eva3 2s linear;
}
.sig_eva4 {
  stroke-dasharray: 27;
  animation: anim_eva4 2s linear;
}
.sig_eva5 {
  stroke-dasharray: 41;
  animation: anim_eva5 2s linear;
}
@keyframes anim_eva1 {
    0% { stroke-dashoffset: 38; }
    20% { stroke-dashoffset: 0; }
}
@keyframes anim_eva2 {
    0%, 20%  { stroke-dashoffset: 20; }
    40% { stroke-dashoffset: 0; }
}
@keyframes anim_eva3 {
    0%, 20%, 40%  { stroke-dashoffset: 16; }
    60% { stroke-dashoffset: 0; }
}
@keyframes anim_eva4 {
    0%, 20%, 40%, 60%  { stroke-dashoffset: 27; }
    80% { stroke-dashoffset: 0; }
}
@keyframes anim_eva5 {
    0%, 20%, 40%, 60%, 80%  { stroke-dashoffset: 41; }
    100% { stroke-dashoffset: 0; }
}


.sig_jil {
  stroke-dasharray: 584;
  animation: anim_jil 2s linear;
}
@keyframes anim_jil {
    0% { stroke-dashoffset: 584; }
    100% { stroke-dashoffset: 0; }
}

.sig_miriam1 {
  stroke-dasharray: 138;
  animation: anim_miriam1 2s linear;
}
.sig_miriam2 {
  stroke-dasharray: 79;
  animation: anim_miriam2 2s linear;
}
.sig_miriam3 {
  stroke-dasharray: 116;
  animation: anim_miriam3 2s linear;
}
.sig_miriam4 {
  stroke-dasharray: 4;
  animation: anim_miriam4 2s linear;
}
.sig_miriam5 {
  stroke-dasharray: 4;
  animation: anim_miriam5 2s linear;
}
@keyframes anim_miriam1 {
    0% { stroke-dashoffset: 138; }
    20% { stroke-dashoffset: 0; }
}
@keyframes anim_miriam2 {
    0%, 20%  { stroke-dashoffset: 79; }
    40% { stroke-dashoffset: 0; }
}
@keyframes anim_miriam3 {
    0%, 20%, 40%  { stroke-dashoffset: 116; }
    60% { stroke-dashoffset: 0; }
}
@keyframes anim_miriam4 {
    0%, 20%, 40%, 60%  { stroke-dashoffset: 4; }
    80% { stroke-dashoffset: 0; }
}
@keyframes anim_miriam5 {
    0%, 20%, 40%, 60%, 80%  { stroke-dashoffset: 4; }
    100% { stroke-dashoffset: 0; }
}

.sig_robert1 {
  stroke-dasharray: 79;
  animation: anim_robert1 2s linear;
}
.sig_robert2 {
  stroke-dasharray: 97;
  animation: anim_robert2 2s linear;
}
.sig_robert3 {
  stroke-dasharray: 20;
  animation: anim_robert3 2s linear;
}
.sig_robert4 {
  stroke-dasharray: 4;
  animation: anim_robert4 2s linear;
}
.sig_robert5 {
  stroke-dasharray: 4;
  animation: anim_robert5 2s linear;
}
.sig_robert6 {
  stroke-dasharray: 74;
  animation: anim_robert6 2s linear;
}
.sig_robert7 {
  stroke-dasharray: 4;
  animation: anim_robert7 2s linear;
}

@keyframes anim_robert1 {
    0% { stroke-dashoffset: 79; }
    14% { stroke-dashoffset: 0; }
}
@keyframes anim_robert2 {
    0%, 14%  { stroke-dashoffset: 97; }
    28% { stroke-dashoffset: 0; }
}
@keyframes anim_robert3 {
    0%, 14%, 28%  { stroke-dashoffset: 20; }
    42% { stroke-dashoffset: 0; }
}
@keyframes anim_robert4 {
    0%, 14%, 28%, 42%  { stroke-dashoffset: 4; }
    56% { stroke-dashoffset: 0; }
}
@keyframes anim_robert5 {
    0%, 14%, 28%, 42%, 56%  { stroke-dashoffset: 4; }
    70% { stroke-dashoffset: 0; }
}
@keyframes anim_robert6 {
    0%, 14%, 28%, 42%, 56%, 70%  { stroke-dashoffset: 74; }
    84% { stroke-dashoffset: 0; }
}
@keyframes anim_robert7 {
    0%, 14%, 28%, 42%, 56%, 70%, 84%  { stroke-dashoffset: 4; }
    100% { stroke-dashoffset: 0; }
}


.sig_soraia1 {
  stroke-dasharray: 106;
  animation: anim_soraia1 2s linear;
}
.sig_soraia2 {
  stroke-dasharray: 26;
  animation: anim_soraia2 2s linear;
}
.sig_soraia3 {
  stroke-dasharray: 22;
  animation: anim_soraia3 2s linear;
}
.sig_soraia4 {
  stroke-dasharray: 45;
  animation: anim_soraia4 2s linear;
}
.sig_soraia5 {
  stroke-dasharray: 34;
  animation: anim_soraia5 2s linear;
}
.sig_soraia6 {
  stroke-dasharray: 3;
  animation: anim_soraia6 2s linear;
}
@keyframes anim_soraia1 {
    0% { stroke-dashoffset: 106; }
    16% { stroke-dashoffset: 0; }
}
@keyframes anim_soraia2 {
    0%, 16%  { stroke-dashoffset: 26; }
    32% { stroke-dashoffset: 0; }
}
@keyframes anim_soraia3 {
    0%, 16%, 32%  { stroke-dashoffset: 22; }
    48% { stroke-dashoffset: 0; }
}
@keyframes anim_soraia4 {
    0%, 16%, 32%, 48%  { stroke-dashoffset: 45; }
    64% { stroke-dashoffset: 0; }
}
@keyframes anim_soraia5 {
    0%, 16%, 32%, 48%, 64%  { stroke-dashoffset: 34; }
    80% { stroke-dashoffset: 0; }
}
@keyframes anim_soraia6 {
    0%, 16%, 32%, 48%, 64%, 80%  { stroke-dashoffset: 3; }
    100% { stroke-dashoffset: 0; }
}

.sig_stefania1 {
  stroke-dasharray: 65;
  animation: anim_stefania1 2s linear;
}
.sig_stefania2 {
  stroke-dasharray: 133;
  animation: anim_stefania2 2s linear;
}
.sig_stefania3 {
  stroke-dasharray: 11;
  animation: anim_stefania3 2s linear;
}
.sig_stefania4 {
  stroke-dasharray: 36;
  animation: anim_stefania4 2s linear;
}
.sig_stefania5 {
  stroke-dasharray: 30;
  animation: anim_stefania5 2s linear;
}
.sig_stefania6 {
  stroke-dasharray: 3;
  animation: anim_stefania6 2s linear;
}
@keyframes anim_stefania1 {
    0% { stroke-dashoffset: 65; }
    16% { stroke-dashoffset: 0; }
}
@keyframes anim_stefania2 {
    0%, 16%  { stroke-dashoffset: 133; }
    32% { stroke-dashoffset: 0; }
}
@keyframes anim_stefania3 {
    0%, 16%, 32%  { stroke-dashoffset: 11; }
    48% { stroke-dashoffset: 0; }
}
@keyframes anim_stefania4 {
    0%, 16%, 32%, 48%  { stroke-dashoffset: 36; }
    64% { stroke-dashoffset: 0; }
}
@keyframes anim_stefania5 {
    0%, 16%, 32%, 48%, 64%  { stroke-dashoffset: 30; }
    80% { stroke-dashoffset: 0; }
}
@keyframes anim_stefania6 {
    0%, 16%, 32%, 48%, 64%, 80%  { stroke-dashoffset: 3; }
    100% { stroke-dashoffset: 0; }
}

.sig_shaumiea1 {
  stroke-dasharray: 438;
  animation: anim_shaumiea1 2s linear;
}
.sig_shaumiea2 {
  stroke-dasharray: 42;
  animation: anim_shaumiea2 2s linear;
}
.sig_shaumiea3 {
  stroke-dasharray: 2;
  animation: anim_shaumiea3 2s linear;
}

@keyframes anim_shaumiea1 {
    0% { stroke-dashoffset: 438; }
    80% { stroke-dashoffset: 0; }
}
@keyframes anim_shaumiea2 {
    0%, 80%  { stroke-dashoffset: 42; }
    90% { stroke-dashoffset: 0; }
}
@keyframes anim_shaumiea3 {
    0%, 80%, 90%  { stroke-dashoffset: 2; }
    100% { stroke-dashoffset: 0; }
}


.sig_vanessa1 {
  stroke-dasharray: 101;
  animation: anim_vanessa1 2s linear;
}
.sig_vanessa2 {
  stroke-dasharray: 44;
  animation: anim_vanessa2 2s linear;
}
.sig_vanessa3 {
  stroke-dasharray: 66;
  animation: anim_vanessa3 2s linear;
}
.sig_vanessa4 {
  stroke-dasharray: 62;
  animation: anim_vanessa4 2s linear;
}
.sig_vanessa5 {
  stroke-dasharray: 38;
  animation: anim_vanessa5 2s linear;
}
@keyframes anim_vanessa1 {
    0% { stroke-dashoffset: 101; }
    20% { stroke-dashoffset: 0; }
}
@keyframes anim_vanessa2 {
    0%, 20%  { stroke-dashoffset: 44; }
    40% { stroke-dashoffset: 0; }
}
@keyframes anim_vanessa3 {
    0%, 20%, 40%  { stroke-dashoffset: 66; }
    60% { stroke-dashoffset: 0; }
}
@keyframes anim_vanessa4 {
    0%, 20%, 40%, 60%  { stroke-dashoffset: 62; }
    80% { stroke-dashoffset: 0; }
}
@keyframes anim_vanessa5 {
    0%, 20%, 40%, 60%, 80%  { stroke-dashoffset: 38; }
    100% { stroke-dashoffset: 0; }
}

.sig_stephan1 {
  stroke-dasharray: 163;
  animation: anim_stephan1 2s linear;
}
.sig_stephan2 {
  stroke-dasharray: 115;
  animation: anim_stephan2 2s linear;
}
.sig_stephan3 {
  stroke-dasharray: 126;
  animation: anim_stephan3 2s linear;
}
.sig_stephan4 {
  stroke-dasharray: 126;
  animation: anim_stephan4 2s linear;
}
.sig_stephan5 {
  stroke-dasharray: 159;
  animation: anim_stephan5 2s linear;
}
@keyframes anim_stephan1 {
    0% { stroke-dashoffset: 163; }
    20% { stroke-dashoffset: 0; }
}
@keyframes anim_stephan2 {
    0%, 20%  { stroke-dashoffset: 115; }
    40% { stroke-dashoffset: 0; }
}
@keyframes anim_stephan3 {
    0%, 20%, 40%  { stroke-dashoffset: 126; }
    60% { stroke-dashoffset: 0; }
}
@keyframes anim_stephan4 {
    0%, 20%, 40%, 60%  { stroke-dashoffset: 126; }
    80% { stroke-dashoffset: 0; }
}
@keyframes anim_stephan5 {
    0%, 20%, 40%, 60%, 80%  { stroke-dashoffset: 159; }
    100% { stroke-dashoffset: 0; }
}

.sig_marcel1 {
  stroke-dasharray: 116;
  animation: anim_marcel1 2s linear;
}
.sig_marcel2 {
  stroke-dasharray: 163;
  animation: anim_marcel2 2s linear;
}
.sig_marcel3 {
  stroke-dasharray: 4;
  animation: anim_marcel3 2s linear;
}

@keyframes anim_marcel1 {
    0% { stroke-dashoffset: 116; }
    20% { stroke-dashoffset: 0; }
}
@keyframes anim_marcel2 {
    0%, 20%  { stroke-dashoffset: 163; }
    90% { stroke-dashoffset: 0; }
}
@keyframes anim_marcel3 {
    0%, 20%, 90%  { stroke-dashoffset: 4; }
    100% { stroke-dashoffset: 0; }
}

#sig23 {
    height: 70%;
    margin-left: -43%;
    margin-top: 38%;
}
#sig24 {
    height:41%;
    margin-left:25%;
    margin-top:54%;
}
#sig25 {
    height:32%;
    margin-top:40%;
    margin-left:-19%;
}
#sig26 {
    height:31%;
    margin-top:42%;
    margin-left:-15%;
}
#sig27 {
    height:25%;
    margin-top:42%;
    margin-left:-33%;
}
#sig28 {
    height:30%;
    margin-top:42%;
    margin-left:25%;
}
#sig29 {
    height:40%;
    margin-top:40%;
    margin-left:-40%;
}
#sig30 {
    height: 40%;
    margin-top:51%;
    margin-left:32%;
}
#sig30 path {
stroke-width:2px;
}
#sig31 {
    height:31%;
    margin-top:45%;
    margin-left:45%;
}
#sig95 {
    height:22%;
    margin-top:50%;
    margin-left:-30%;
}
#sig122 {
    height:25%;
    margin-top:53%;
    margin-left:0;
}
#sig128 {
    height:75%;
    margin-top:36%;
    margin-left:0;
}
#sig129 {
    height:75%;
    margin-top:33%;
    margin-left:0;
}

div.pnlm-tooltip span{
	color:#000;
	background:rgba(255,255,255,0.7);
}
div.pnlm-tooltip:hover span::after{
	border-color:rgba(255,255,255, 0.7) transparent transparent transparent;
}



.embed-container{
	position: relative;
	padding-bottom: 56.25%; /* ratio 16x9 */
	height: 0;
	overflow: hidden;
	width: 100%;
	height: auto;
}
.embed-container iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#linkimgpop {
    display: none;
    position: absolute;
    margin: 0 auto;
    top: 10vh;
    bottom: 10vh;
    left: 10vw;
    right: 10vw;
    width: 80vw;
    height: 80vh;
    text-align: center;
}
#linkimgpop img {
    max-width:100%;
    max-height:100%;
    height:auto;
}
.contact_txt .small, .contact_txt small {
    font-size: 16px;
    line-height: 26px;
    display: inline-block;

}

/* STORIES */
.ht_title, #ht_left > span, #st_wrapper .st_pad h2, .st_title, #st_quote h3, #st_wrapper u, #st_wrapper strong  {
    font-family:'DIN Next Slab W01 Medium';
}
.st_pad {
    width:100%;
    padding-left: 60px;
    padding-right: 60px;
    position: relative;
    z-index: 100;
    float: left;
}

#st_wrapper {
    position: relative;
    z-index: 1;
}

#st_wrapper .st_pad, #st_bottom {
    background-color: white;
}

#st_wrapper .serviceimg {
    margin-bottom: 160px;
}

.id100 #logo {
    display: none;
}

#st_bottom a {
    position: relative;
}

#st_bottom a::after {
    position: absolute;
    bottom: 0px;
    display: block;
    content: "";
    height: 2px;
    left: 0px;
    background: black;
    transition: all 0.5s;
    width: 0px;
}

#st_bottom a:hover::after {
    width: 100%;
}

.ht_title {
    font-size: 18px;
    line-height: 28px;
    width: 100%;
    display: block;
    margin-bottom: 20px;
    margin-top: 0px;
}

#ht_left {
    padding-left: 0px;
    padding-right: 50px;
}

#ht_left span:not(.ht_title) {
    font-size: 14px;
    line-height: 24px;
    border: 1px solid #D1D1D1;
    float: left;
    color: #656565;
    margin-right: 10px;
    margin-bottom: 10px;
    padding: 0px 8px;
}

#st_wrapper .st_pad h2 {
    font-size: 36px;
    line-height: 46px;
    margin-top: -10px;
    margin-bottom: 70px;
}

#st_wrapper .st_pad p {
    font-size: 20px;
    line-height: 30px;
}

.st_title {
    font-size: 30px;
    line-height: 40px;
    margin-bottom: 40px;
    float: left;
    width: 100%;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

#st_bottom {
    clear: both;
    margin-top: 180px;
}

#st_bottom > div {
    float: left;
    clear: both;
    width: 100%;
}

#st_bottom > div:not(:last-child) {
    margin-bottom: 150px;
}

.stcont_bottom {
    display: flex;
    flex-wrap: wrap;
}

.stcont_bottom > div > img {
        width: 100%;
}

.stcont_bottom > div {
    margin-bottom: 30px;
    font-size: 20px;
    line-height: 30px;
}

.stcont_bottom > div:nth-child(2n) {
    padding-right: 0px;
    padding-left: 15px;
}

.stcont_bottom > div:nth-child(2n + 1){
    padding-left: 0px;
    padding-right: 15px;
}

.stcont_bottom iframe {
    width: 100%;
    min-height: 400px;
}

#st_quote {
    margin-top: 230px;
    margin-bottom: 30px;
    width: 100%;
}

#st_quote h3 {
    font-size: 60px;
    line-height: 70px;
    margin-top: 0px;
}

#st_quote span {
    font-size: 16px;
    line-height: 26px;
}

#st_quote > div {
    width: 650px;
    margin-left: auto;
    margin-right: auto;
}

#st_wrapper strong  {
    font-weight: normal;
}

#st_wrapper .marker {
    color: white;
    background-color: black;
    padding-bottom: 3px;
    padding-left: 4px;
    padding-right: 4px;
    box-decoration-break: clone;
}

/*
#st_wrapper {
    position: relative;
    float: left;
    width: 100%;
    top: 50px;
}

#st_content {
    padding-left: 200px;
    padding-right: 200px;
    margin-top: 200px;

}

#st_content img {
    margin-bottom: 30px;
}

#st_content img:nth-child(3n){
    padding-right: 0px;
    padding-left: 20px;
}

#st_content img:nth-child(3n + 2){
    padding-right: 10px;
    padding-left: 10px;
}

#st_content img:nth-child(3n + 1){
    padding-right: 20px;
    padding-left: 0px;
}
*/

/* COOKIES */
.ck_title, .ck_text h2, .ck_title_big, #ck_right table td:nth-child(2), #ckr_txt h2, .st_nav span {
    font-family:'DIN Next Slab W01 Medium';
}

.ck_title {
    font-size: 18px;
    line-height: 28px;
}

.ck_text p, #ckr_txt, #ckr_txt h2 {
    font-size: 20px;
    line-height: 30px;
}

.ck_text h2, .ck_title_big {
    font-size: 35px;
    line-height: 45px;
}

#ck_wrapper {
    padding-top: 290px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-wrap: wrap;
}

#ck_left {
    padding-right: 160px;
    padding-left: 0px;
}

#ck_right {
    padding-left: 160px;
    padding-right: 0px;
    border-left: 1px solid #E6E6E6;
}

#ck_wrapper h2 {
    margin-top: 0px;
    margin-bottom: 30px;
}

.ck_text {
    margin-bottom: 100px;
}

.ck_title_big  {
    float: left;
    margin-bottom: 35px;
}

#ckr_img {
    width: 100%;
    height: auto;
    margin-bottom: 40px;
}

#ck_right table td:nth-child(2) {
    padding: 10px 20px;
}

#ck_right table td:nth-child(1) {
    text-align: center;
}

#ckr_txt h2 {
    margin: 0px;
}

#ckr_txt ul {
    list-style: disc;
    margin-left: 18px;
}

#ckr_txt ul li, #ckr_txt ol li {
    padding-left: 5px;
}

#ckr_txt ol {
    list-style: decimal;
    margin-left: 18px;
}


/* STORIES OVERVIEW */
.st_vw li {
    width: calc(33.333% - 20px);
    float: left;
    margin-bottom: 30px;
    background-color: black;
    position: relative;
}

.st_vw li:nth-child(3n) {
    margin-left: 20px;
}

.st_vw li:nth-child(3n+1) {
    margin-right: 20px;
}

.st_vw li:nth-child(3n+2) {
    margin-left: 10px;
    margin-right: 10px;
}

.st_vw li img {
    width: 100%;
}

.st_vw li:hover img {
    opacity: 0.3;
    transition: all 0.2s;
}

.st_nav {
    position: absolute;
    top: 0px;
    left: 0px;
    color: white;
    display: none;
    padding: 25px;
}
.st_vw li:hover .st_nav {
    display: block;
}
.st_vw {
    width: 100%;
    float: left;
    padding-top: 230px;
    padding-left: 200px;
    padding-right: 200px;
}

#st_button {
    background-color: white;
    color: black;
    font-size: 20px;
    line-height: 30px;
    padding: 10px 50px;
    position: relative;
    top: 30px;
}
#st_button:hover {
    color: #6F6F6F;
    background-color: black;
}
.st_nav_top {
    font-size: 15px;
    line-height: 25px;
    width: 100%;
}
.st_nav_bottom {
    font-size: 30px;
    line-height: 40px;
    width: 100%;
}
.nav_bottom li:nth-child(4) {
    display: none !important;
}
.hashtag_item  {
    pointer-events: none;
}


.embed-container{
	position: relative;
	padding-bottom: 56.25%; /* ratio 16x9 */
	height: 0;
	overflow: hidden;
	width: 100%;
	height: auto;
}
.embed-container iframe, .embed-container video{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}