/* Responsive */

@media only screen and (max-width:1023px) {
	body {
		font-size: 15px;
	}
    #navigation #logo-c {
        width: 28px;
        font-size: 25px;
        top: 9px;
        left: 3vw;
        height: 19px;
        border-left: 2px solid #000;
        border-right: 2px solid #000;
        opacity: 1 !important;
        transform: scale(1) !important;
    }
	#logo-c, .location #logo-c {
		color: #000!important;
	}
	.black:not(.white) #navigation #logo-c {
		filter: invert(0);
	}
    .hamburger {
        padding-top: 15px;
        width: 35px;
    }
	.hamburger.active {
		padding-top: 25px;
	}
    .hamb_line {
        margin-bottom: 8px;
        padding-bottom: 2px;
        background: #000;
    }
	
	.menu {
		padding-left: 20vw;
	}	
    .menu a {
        font-size: 10vw;
        margin: 1.5vh 0;
    }	
	.menu A:before {
		content: "";
		left: -8.2vw;
		bottom: 0vw;
		width: 8vw;
		height: 1vw;
	}	
	
	.mobile {
		display: initial;
	}
	.desktop {
		display: none!important;
	}
	#preloader .logo {
		width: 18vw;
		left: 41%;
		top: 45%;
		font-size: 20vw;
		padding-bottom: 0;
		text-align: center;
		padding: 0 0 0 0;
	}
	.header {
		background: #fff;
		width: 100%;
		height: 42px;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 9999;
		box-shadow: 0 0 5px rgba(0,0,0,0.3);
	}
    #lang-nav {
        bottom: 6vw;
        right: 4.5vw;
        font-size: 19px;
        top: initial;
        left: initial;
    }
	.logo {
		width: 9%;
		font-size: 10vw;
		margin: 0.5% 2.8%;
	}
	#navigation .links ul li A {
        font-size: 12vw;
        white-space: nowrap;
    }
	#navigation .links ul li A:before {
		left: -6vw;
		bottom: 0.4vw;
		width: 6vw;
		height: 3px;
	}
	#navigation .links ul li.hover A:before {
		left: -8vw;
		width: 8vw;
	}
	#navigation .links ul li A:after, #navigation .links ul li A:hover:after {
		display: none;
	}
	.video-wrapper {
		top: 41px;
	}
    .flex {
        flex-direction: column;
        align-items: flex-start;
    }
    section {
        overflow: hidden;
        padding-bottom: 8vw;
    }	
	section:first-child {
		margin-top: 41px;
	}
	.section-content {
		width: 90%!important;
		font-size: 15px;
		margin: 4% 5% 4% 5%!important;
	}
	.headline-1, .headline-2 {
		position: relative;
		padding-left: 6vw;
	}	
	.show .headline-1:before, .show .headline-2:before {
		margin-left: -6vw;
		width: 6vw;
	}	
    h2, .headline-2, .page-default .headline-2, .headline-wrapper h2, .headline-wrapper .headline-2, #slider h2.headline-2 {
        font-size: 12vw;
        height: auto;
        white-space: normal;
        line-height: 1.4;
        margin-bottom: 4vw;
        margin-top: 2vw;
        white-space: nowrap;
        margin-left: 0;
        padding-left: 6vw;
    }
	#slider h2.headline-2 {
		margin: 4% 5% 4% 5%;
	}
	h2.headline-2.clayston span.mobile {
		opacity: 0;
	}	
	.page-default h3 {
		font-size: 17px;
		letter-spacing: 0;
	}	
	.page-default.longtext p, .page-default.longtext ul {
		margin-bottom: 4vw;
		margin-top: 4vw;
	}
    .page-default.longtext li {
        margin-bottom: 4px;
    }	
	a.underline:after, .underline a:after, .footer-menue a:after {
		height: 1px;
	}
	.no-br-mob br {
		display: none;
	}
	
/* Home */	
    section#home {
        height: calc(100vh - 41px);
        margin-top: 41px;
    }
    #home .titel {
        top: 45%;
        left: 50%;
    }
	#home .titel .titel1 {
        font-size: 20.2vw;
    }
    #home .titel .titel2 {
        font-size: 4.8vw;
        line-height: 2.8;
        letter-spacing: 0.15vw;
    }
	#home .untertitel {
		right: 0;
		bottom: 5vh;
		font-size: 4vw;
		width: 100%;
		text-align: center;
	}	
	#home .untertitel span {
		display: inline-block;
		margin: 0 2vw;
		font-size: 4.3vw;
	}
	#home h1#titel #titel2 {
		font-size: 5.6vw;
	}	
	.video-wrapper video {
		left: 30%;
		transform: translateX(-50%);
		height: 100%;
		width: auto;
	}	
    a.down-link {
        bottom: 12vh;
    }
	
	.titel .contact-buttons {
		text-align: center;
		margin-top: 5vh;
	}	
	.slidebutton {
		border-radius: 6vw;
		margin: 2vw;
		height: 11vw;
	}
    .slide-inner span {
        border-radius: 6vw;
        padding: 3vw 3vw;
        height: 11vw;
        font-size: 5vw;
        width: 43vw;
    }
	span.slide2 {
		display: none;
	}		
		
    #btn_tel .slide-inner span {
        font-size: 4.7vw;
    }

    div#butter {
        margin-top: 42px;
        overflow: hidden;
    }
	.headline-wrapper {
		justify-content: flex-start;
	}
    .headline-wrapper .img-cover-wrapper {
        margin-bottom: 6.5vw;
        width: auto !important;
        margin-left: 3vw !important;
    }
	.headline-wrapper .img-cover-wrapper img {
		display: none;
	}
	.headline-wrapper .img-cover {
		height: 130%;
	}
    .img-cover-wrapper, .img-cover-wrapper.big {
        max-width: 100vw !important;
        width: 100vw !important;
        margin-right: 0 !important;
        margin-left: -5vw !important;
        margin-bottom: 5vw;
        height: auto !important;
    }
	.img-cover-wrapper.small, .img-s {
		display: none;
	}
    .img-cover-wrapper .number {
        position: initial;
        font-size: 12vw;
    }
	.img-cover-wrapper.team-img-2 {
		width: 90vw!important;
	}
	.img-cover-wrapper.img-right {
		position: absolute;
		top: initial;
	}	
    .img-cover-wrapper img, .img-cover-wrapper video {
        width: 100%;
        margin-left: 0;
        max-width: 100vw;
    }
	section#clayston {
		padding-top: 6vw;
	}
	a.more-link {
		display: inline-block;
	}
	p.right {
		text-align: right;
		margin-top: 4vw;
	}
	#clayston p br {
		display: none;
	}		
	p.team-data {
		margin-bottom: 4vw;
	}
	.team-data span {
		margin-right: 1.2vw;
	}
    .team-data {
        margin-top: 0;
        font-size: 3.6vw;
        letter-spacing: -0.01vw;
    }
	.number {
	}
	.flex > p {
		margin-top: 0;
	}
	p.text-right {
		float: left!important;
		margin-top: 4vw!important;
		width: 96%!important;
		text-align: left!important;
		margin-left: 2%;
	}	
	p.text-left {
		width: 96%!important;
		text-align: left!important;
		float: left!important;
		margin-left: 2%;
		margin-right: 2%;
		margin-top: 72vw!important;
		margin-bottom: 5vw!important;
	}
	
/* Slider */
	#slider {
		height: auto;
		overflow: visible;
	}
	#slidercontent {
		position: relative;
		top: 0;
		left: 0;
		height: auto;
	}
	#slider #slides {
		height: auto;
		position: relative;
		top: 0;
		left: 0;
	}
	#slider div#curtain {
		display: none;
	}
    #slider .section-content {
        height: auto;
        position: relative;
        visibility: visible;
        margin-bottom: 8vw !important;
    }
	#slider .img-l {
		top: initial;
		height: auto;
	}
	#slider .text-bottom {
		position: initial;
	}
	#slider .headline-2.slide-counter {
		display: none;
	}
	#slider.show .img-cover {
		transform: translateY(0);
	}
	#slider .img-cover-wrapper.show .img-cover {
		transform: translateY(-102%);
	}
	h3.competence.mobile {
		position: absolute;
		top: 0;
		right: 0;
		background: #fff;
		font-size: 5.5vw;
		font-family: 'Interstate';
		font-weight: 100;
		padding: 1vw 5vw;
		margin: 0;
	}
    #slider .text-bottom a {
        margin-right: .8vw;
        margin-bottom: .2vw;
    }
	#finance .img-l img {
		transform: rotateY(180deg);
	}
	
	
/* Kompetenzen */
    .competence .text {
        width: 100%;
        margin-top: 4vw;
    }
	.competence .text p {
		margin: 3vw auto;
		font-size: inherit;
	}


/* Standorte */	
	#standorte-links {
        flex-direction: row;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 7%;
    }
	#standorte-links a {
		margin-bottom: 2vw;
		font-size: 4vw;
	}
	#standort .img-cover-wrapper img, .show .img-cover-wrapper video {
		opacity: 1;
		transform: translateY(0);
	}
	#standort .img-wrapper {
		opacity: 0;
		transition: opacity 1.2s ease!important;
	}
	#standort .img-wrapper.active {
		opacity: 1;
		transition: opacity 1.2s ease!important;
	}
	
/* Formular */	
	#contactform .bigtext {
		font-size: 5.5vw;
		margin-top: 8vw;
		margin-bottom: 16vw;
	}		
	#contactform h2 {
		font-size: 11vw;
	}
	#contactform form {
		width: 100%;
		margin-left: 0;
	}
    input[type="text"], input[type="email"], textarea, #form-modal.active input[type="text"], #form-modal.active input[type="email"], #form-modal.active textarea {
        padding: 2vw;
        font-size: 4.3vw;
        margin-bottom: 2vh;
        width: initial;
        border-radius: 0 !important;
        margin-top: 0;
    }	
    textarea {
        margin-top: 3vw;
    }	
	::placeholder {
		font-size: 4.5vw!important;
	}
    .privacy-accept, #form-modal.active .privacy-accept {
        margin-bottom: 3.5vw;
        text-align: right;
        font-size: 3.4vw;
        line-height: 1.2;
		white-space: normal;
    }
	input.submit-button, #form-modal.active input.submit-button {
		width: 50%;
		font-size: 4.5vw;
		padding: 2.5vw 0;
        border-radius: 0 !important;
	}
	
    #form-modal.active {
        left: 5%;
        top: calc(41px + 1.5vh);
        width: 80%;
        height: auto;
        padding: 1vh 5% 5vh 5%;
        background: rgba(255, 255, 255, .95);
    }
    #form-modal.active .headline-2 {
        font-size: 8vw;
        margin-top: 2vw;
        padding-left: 3.5vw;
        margin-bottom: 0.5vh;
    }
	#btn_form_close {
		width: 6vw;
	}

	p.text-right br, p.text-left br {
		display: none;
	}	
	p.text-right.left-line {
		margin-left: 5vw;
	}
	.headline-1:after, .headline-2:after {
		bottom: -8px;
		width: 7.8vw;
	}	
    .page-default h1, .page-default .headline-1, .page-default .headline-2 {
        font-size: 9.6vw;
        margin-top: 12vw !important;
        margin-bottom: 4vw !important;
        height: auto;
    }
	.left-line a:after {
		width: 2.2vw!important;
		height: 2px!important;
		top: 3.8vw!important;
		left: -2.2vw!important;
	}
	.left-line a:hover:after, .left-line a.active:after {
		width: 11px!important;
		left: -12px!important;
	}
	
	#faq .bezeichnung {
		line-height: 1.4;
		padding: 4vw .5vw 4vw .5vw;
		display: block;
		font-size: 15px;
	}
	a.loadmore {
		margin-top: 5vw;
		line-height: 1.2;
	}
	a.hoverline:after, .hoverline a:after {
		height: 1px;
	}

/* Page Team */
	#team .section-content.slim {
		overflow: hidden;
		width: 100vw!important;
		margin: 4% 0!important;
	}
	#team .team-nav {
		right: -100%;
		position: absolute;
	}
    .page-default #team h1.headline-1 {
        margin-left: 5%;
        margin-top: 4vw !important;
        margin-bottom: 4vw !important;
    }	
	
	@keyframes zoom-bg-out {
	   0%   { background-size: auto 150%;}
	   100% { background-size: auto 100%;}
	}			
	@keyframes slide-to-left {
	   0%   { left: 100%;}
	   100% { left: 80%;}
	}			
	@keyframes slide-to-right {
	   0%   { left: -120%;}
	   100% { left: -100%;}
	}	
	.team-boxes {
		margin-top: 0;
	}
	.text-team p {
		letter-spacing: -0.1vw;
		margin-bottom: 0;
	}
    .team-boxes > div:nth-child(2n-1), .team-boxes > div:nth-child(2n) {
        transform: none;
        width: 50%;
        padding-bottom: 50%;
        margin-top: 0;
        overflow: visible;
        background-size: contain;
        background-position: -5vw top !important;
        background-size: auto 150%;
        animation: zoom-bg-out 1.5s forwards ease-out;
    }
	.team-boxes > div:nth-child(2n) {
		left: 50%;
        background-position: 5vw top !important;
	}
	p .slim {
		letter-spacing: -1px;
	}
	.team-boxes .text-bg {
		width: 120%;
		transform: none;
		opacity: 1;
		left: 100%;
	}
	
	.team-boxes > div:nth-child(2n-1) .text-bg {
		left: 80%;		
		animation: slide-to-left 1.5s forwards ease-out;
	}	
	.team-boxes > div:nth-child(2n) .text-bg {
		left: -125%;
		animation: slide-to-right 1.5s forwards ease-out;
	}
    .text-team h2.name {
        font-size: 5vw;
        margin-top: 0;
        padding-left: 0;
    }
    .text-team {
        font-size: 3.3vw;
        padding: 3% 4%;
        width: 92%;
    }
	.page-default .headline-3 {
		font-size: 20px;
		letter-spacing: 0;
		white-space: normal;
	}
	
/* Ganze Breite verlinkt */				
	@keyframes slide-to-left {
	   0%   { left: 100%;}
	   100% { left: 40%;}
	}		
	@keyframes slide-to-right {
	   0%   { left: -60%;}
	   100% { left: 0%;}
	}	
    .team-boxes > div:nth-child(2n-1), .team-boxes > div:nth-child(2n) {
        transform: none;
        width: 100%;
        padding-bottom: 50%;
        margin-top: 0;
        overflow: visible;
        background-size: contain;
        background-position: -5vw top !important;
        background-size: auto 150%;
        animation: zoom-bg-out 1.5s forwards ease-out;
    }	
    .team-boxes > div:nth-child(2n) {
        left: 0;
        background-position: 110% top !important;
    }
	.team-box a {
		width: 100vw;
		display: inline-block;
		position: absolute;
		top: 0;
		left: 0;
		height: 50vw;
	}
	.team-boxes > div:nth-child(2n-1) {
		position: relative;
	}
	.team-boxes .text-bg {
        width: 60%;
        transform: none;
        opacity: 1;
        left: 40%;
        position: absolute;
        height: 50vw;
    }
	.team-boxes > div:nth-child(2n-1) .text-bg {
        left: 40%;
        animation: slide-to-left 1.5s forwards ease-out;
    }	
	.team-boxes > div:nth-child(2n) .text-bg {
		left: 0;
		animation: slide-to-right 1.5s forwards ease-out;
	}
	
/* Team Detail */
    #team-detail {
        margin-top: 41px;
        padding-bottom: 0;
    }
	#team-detail .headline-1 {
		margin-left: 5%;
		width: 93%;
		font-size: 9vw;
		margin-top: 8vw !important;
	}
    #team-detail .beruf, #team-detail .headline-1 .beruf {
        font-size: 4vw;
        margin-bottom: 6vw;
        margin-left: 0;
        width: 100%;
    }
	#team-detail .beruf br {
		display: none;
	}
	#team-detail .img-flexbox {
        margin-left: 5%;
        flex-direction: column;
        /* align-items: flex-end; */
    }
	#team-detail .img-cover-wrapper.team-img-2 {
		width: 100vw !important;
	}
	#team-detail .text {
		margin: 0;
	}
    #team-detail .text h2 {
        font-size: 5vw;
        margin-top: 10vw;
        margin-bottom: 0;
        padding-left: 0;
    }
	#team-kontakt .team-contact {
		flex-direction: column;
	}
	#team-kontakt .team-contact-img {
		max-width: 100vw;
		width: 100vw;
		margin-right: 0;
	}
	#team-kontakt .team-contact-text {
		transform: translateY(0);
		padding-right: 0;
        text-align: left;
	}
	#team-detail .legalbox {
        margin-top: 6vw;
        margin-bottom: 6vw;
		width: 100%;
	}
	.box-content {
		padding: 2vw 1.5vw 2vw 1.3vw;
	}
	.box-header {
		width: 40%;
	}
    .box-header.fade {
        transform: scaleX(0.01);
        transform-origin: right;
        transition: transform 1.0s ease-in-out .3s;
        padding: .6vw 2.2vw;
    }
	.box-header.fade.show {
		transform: scaleX(1);
	}
	.vongueltlingen span#namespace {
		font-size: 9vw !important;
		white-space: normal !important;
	}
	#team-detail .accordion-top {
		margin-top: 6vw;
	}
	#team-detail .accordion {
		margin-top: 4vw;
	}
    #team-detail .text .accordion h2 {
        margin-top: 0;
        margin-bottom: 2vw;
		padding-right: 6vw;
    }
	#team-detail .accordion .bezeichnung:after {
		content: "";
		right: 0;
		top: 5%;
		border-left: 1px solid #000;
		border-bottom: 1px solid #000;
		width: 2.5vw;
		height: 2.5vw;
	}
	#team-detail .accordion .bezeichnung.open:after {
		transform: rotate(135deg) translate(1vw, -1vw);
	}
	#team-detail .text p {
		margin-bottom: 2vw;
	}
	

/* Page About */	
    #about {
        margin-bottom: 2vw;
        font-size: 1.52vw;
        padding-bottom: 0;
    }
    #about .section-content {
        margin-bottom: 120vw !important;
    }
    #about h1 {
        margin-top: 3vw !important;
    }
	#about h1.headline-2:before {
		transform: translateX(1vw);
	}	
	#about .text-middle {
		width: 98%;
		margin-left: 1%;
		font-size: 15px;
		line-height: 1.3;
	}
	#about .text-middle p {
		margin-bottom: 10px;
		margin-top: 0;
	}
	#about .more-button {
		text-align: center;
		border: 1px solid #000;
		padding: 3px 8px;
		margin: 25px 0 15px 50%;
		transform: translateX(-50%);
		display: inline-block;
		border-radius: 2px;
	}
	#about .more-content {
		height: 0;
		overflow: hidden;
		transition: height 0.8s ease;
	}	
	#about.showall #about-bg {
		background-position: 50% 75%;
		background-size: 100% 100%;
	}
	#about.showall .more-content {
		height: 550px;
	}
	
	#about h2 {
		font-size: 18px;
		font-weight: 500;
		line-height: 1.2;
		margin-top: 6vw;
		margin-bottom: 1vw;
	}
	#about ul {
		padding-left: 6vw;
		margin-top: 0;
	}
    #about .slide-inner span {
        width: 42vw;
    }
    #about #counters {
        margin: 70% 0 5% 0% !important;
        width: 100% !important;
    }
	#about #counters .count .number {
        font-size: 11vw;
    }
	#about #counters div.count {
        width: 46% !important;
        margin-left: 0% !important;
        margin-right: 4% !important;
    }

	
/* Karriere */
	.career  .video-wrapper {
		height: 50vh;
	}
	.career  .video-wrapper video {
        left: 30%;
        transform: translateX(-50%);
        height: 50vh;
        width: auto;
        min-height: auto;
        min-width: auto;
    }
    .career #home {
        height: 50vh !important;
        padding-bottom: 0;
    }
	.career .headline-wrapper {
		justify-content: center;
	}
	
	#vacancies {
		transform: translateY(0);
		margin-top: 0;
	}	
	#vacancies .section-content.teaser {
		font-size: 4.2vw;
	}
	#vacancies .newstitle .bezeichnung {
		font-size: 5.2vw;
		padding: 2vw 0;
	}
	#vacancies .function {
		font-size: 70%;
	}
	#vacancies .newstitle.accordion {
		font-size: 4vw;
	}
	#vacancies .description, #vacancies .open .description {
		padding: 0;
	}
	
	
/* Impressum, Datenschutz */
    .page-default .headline-3 {
        font-size: 5.5vw;
        margin-top: 8vw;
        padding-left: 0;
    }
	.page-default ul {
		padding-left: 6vw;
	}
	.button-back {
		width: 6vw;
		height: 6vw;
		right: 0;
		top: 2vw;
	}

}