/*
Theme Name: Tabaluga B2B
Author: FanSpaces - Wojciech Dominiak
Author URI: https://fan-spaces.com/
Description: Tabaluga Enterpises Theme B2B
Tested up to: 7.4
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tabaluga-enterprises
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images

*/

@font-face {
	font-family: Hakon Handwriting;
	src: url('/wp-content/themes/tabaluga-b2b/fonts/Hakon_Handwriting.woff');
}
@font-face {
	font-family: Gill Sans Light;
	src: url('/wp-content/themes/tabaluga-b2b/fonts/Gill_Sans_light.woff');
	font-weight: bold;
}	
@font-face {
	font-family: Gill Sans;
	src: url('/wp-content/themes/tabaluga-b2b/fonts/Gill_Sans.woff');
	font-weight: bold;
}

/* 
/ animation
*/
 @keyframes bounce {
    0%   { transform: scale(1,1)    translateY(0); }
    10%  { transform: scale(1.1,.9) translateY(0); }
    30%  { transform: scale(.9,1.1) translateY(-20px); }
    50%  { transform: scale(1,1)    translateY(0); }
    57%  { transform: scale(1,1)    translateY(-7px); }
    64%  { transform: scale(1,1)    translateY(0); }
    100% { transform: scale(1,1)    translateY(0); }
}
.bounce {
    animation-name: bounce;
    animation-timing-function: ease;
    animation-duration: 5s;
    animation-iteration-count: infinite;
}

:root {
	--main-color1: #5A9539;
	--main-color2: #666666;
	--main-color3: #B23132;
	--main-color4: #E8E8E8;

	--font1: 'Hakon Handwriting';
	/*--font2: 'Gill Sans,Gill Sans MT,Calibri,sans-serif';*/
	--font2: 'Gill Sans Light';
	--font3: 'Gill Sans';
	/*--font2: 'Cabin', sans-serif;*/

	/* font sizes */
	--font-size-text: clamp(1.563rem, 1vw, 1.275rem);
	--line-height-text: clamp(1.813rem, 1vw, 2.188rem);

	--font-size-headline: clamp(35px, 4.25vw, 80px);
	--line-height-headline: clamp(40px, 4.25vw, 85px);

}
/*::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track {}
::-webkit-scrollbar-thumb {
	background-color: var(--main-color1);   
	border-radius: 20px;      
}*/
* {
	scroll-behavior: smooth;
	scrollbar-width: thin;
}

html,
body {
	margin: 0;
	padding: 0;
	font-family: var(--font2);
	font-size: clamp(30px, 1vw, 25px);
	line-height: clamp(35px, 1vw, 29px);
	font-style: normal;
	font-weight: 400;
	color: var(--main-color2);
	height: 100vh;
	overflow: hidden;
	scroll-snap-type: y mandatory;
}
body {
	overflow-y: scroll;
}
textarea,
.container-nav-site .navigation-content,
.popup {
	/*scrollbar-color: var(--main-color1);
	scrollbar-width: thin;
	scroll-behavior: smooth;*/
	/*overflow: hidden;*/
}
h1,
h2,
h3,
h4 {
	font-family: var(--font1);
}
h1 {
	font-size: clamp(35px, 4.25vw, 80px);
	line-height: clamp(40px, 4.25vw, 92px);
}
h3 {
	font-family: var(--font2);
	text-transform: uppercase;
}
.page-id-3 h2,
.page-id-3 h3,
.page-id-3 h4 {
	font-family: var(--font2);
}
.page-id-3 h3 {
	padding-top: 50px;
	padding-bottom: 20px;
}
.page-id-3 .content ul {
	list-style-type: disc;
	padding-left: 50px;
	padding-bottom: 20px;
}
.page-id-3 .content ul li {
	font-size: clamp(14px, 1vw, 18px);
	line-height: clamp(25px, 1vw, 28px);
}

p { 
	font-family: var(--font2); 
	font-size: 1rem;
	line-height: 1rem;
}
a {
	text-decoration: none;
}
strong,
b {
	font-family: var(--font3);
}

input[type="text"],
input[type="email"],
textarea {
	border: 1px solid var(--main-color1);
	background: rgba(255, 255, 255, 0.75);
	width: 100%;
	min-height: 45px;
	padding: 15px;
	color: var(--main-color2);
	margin: 10px auto;
}
input[type="submit"] {
	text-transform: uppercase;
	font-weight: bold;
	color: #fff;
	background: url('/wp-content/themes/tabaluga-b2b/images/absenden-button.png') top left no-repeat;
	height: 38px;
	width: 190px;
	text-align: center;
	line-height: 38px;
	border: none;
	position: relative;
	transition: all linear 0.3s;
}
input[type="submit"]:hover {
	/*color: var(--main-color3);*/
	background: url('/wp-content/themes/tabaluga-b2b/images/absenden-button-hover.png') top left no-repeat;
}
input::placeholder,
textarea::placeholder {
	font-size: 14px;
}
input:active,
input:focus,
textarea:active,
textarea:focus {
	border: 1px solid var(--main-color2);
	box-shadow: none;
	outline: none;
}
input[type="submit"]:active,
input[type="submit"]:focus {
	border: none;
}


/* home auswahl */
body.home .is-layout-flex { 
	gap: 0; 
}
.home .wp-block-columns {
	margin-bottom: 0;
}
.home h1 { 
	color: #fff !important;
	display: inline-block;
	max-width: 50%;
	margin-left: 25%;
}
.home .wp-block-button__link { 
	color: var(--main-color2); 
	background: url('/wp-content/themes/tabaluga-b2b/images/bg-button.png') center center no-repeat; 
	background-size: contain; 
	font-weight: 400;
}
.home .wp-block-button__link:hover { 
	background: url('/wp-content/themes/tabaluga-b2b/images/bg-button_hover.png') center center no-repeat; 
	background-size: contain; 
	color:#fff; 
}

.home-auswahl-logo { 
	position:absolute; 
	z-index:1; 
	display: block; 
	text-align:center;
	width: 100%;
	margin-top: 20px;
}
.home-tabaluga-tanz {
	position: absolute;
	z-index: 1;
	display: block;
	width: 100%;
	bottom: 20vh;
}
.home .wp-block-cover-image.has-custom-content-position.has-custom-content-position .wp-block-cover__inner-container, 
.home .wp-block-cover.has-custom-content-position.has-custom-content-position .wp-block-cover__inner-container {
	margin-bottom: 10vh;
}

/* home auswahl */


/*
/ navigation
*/
/* burger */
#about .burger-nav-site,
#app .burger-nav-site {
	position: absolute;
	left: 50px;
	top: 50px;
	z-index: 150;
	color: #fff;
}
#tabaluga .burger-nav-site,
#markenwelten .burger-nav-site,
#netzwerk .burger-nav-site,
#kontakt .burger-nav-site,
.single .burger-nav-site,
.page .burger-nav-site,
.site .burger-nav-site,
.blog .burger-nav-site  {
	position: absolute;
	left: 50px;
	top: 50px;
	z-index: 150;
	color: var(--main-color2);
}

/* links */
.container-nav-site {
	position: fixed;
	top: 0;
	left: -100%;
	min-height: 100svh;
	width: 30%;
	padding: 0;
	margin: 0;
	background: #fff;
	z-index: 200;
	opacity: 1;
	box-shadow: 0px 0px 15px rgba(0,0,0,0.3);
}
.container-nav-site .navigation-content {
	min-height: 100svh;
	height: 100svh;
	overflow-y: auto;
}
.container-nav-site .nav-close {
	position: absolute;
	left: 50px;
	top: 5%;
	cursor: pointer;
}
.container-nav-site .navi  {
	padding: 20% 5% 15% 25%;
}
.container-nav-main {
	position: absolute;
	top: 65px;
	right: 65px;
	z-index: 10;
}
.wp-block-navigation__container { 
	display: inline-block; 
	min-width: 300px;
	margin-right: -50px;
}

.container-nav-main .wp-block-navigation-item__content::before {
	content: url('/wp-content/themes/tabaluga-b2b/images/nav-arrow.svg');
	position: absolute;
	margin-top: 8px;
	/*margin-right: -30px;*/
}
.container-nav-about .wp-block-navigation-item__content::before,
.container-nav-tabaluga .wp-block-navigation-item__content::before,
.container-nav-site li::before {
	content: url('/wp-content/themes/tabaluga-b2b/images/nav-arrow-grey.svg');
	line-height: clamp(60px, 3vw, 60px);
	vertical-align: middle;
}
.container-nav-main .wp-block-navigation-item__label,
.container-nav-about .wp-block-navigation-item__label,
.container-nav-tabaluga .wp-block-navigation-item__label,
.container-nav-site a {
	font-size: clamp(20px, 2vw, 45px);
	line-height: clamp(60px, 3vw, 90px);
	padding-left: 20px;
	transition: all linear 0.3s;
	text-transform: uppercase;
}
.container-nav-site .menu a {
	color: var(--main-color2);
}
.wp-block-navigation-item__label:hover,
.container-nav-site .menu a:hover {
	padding-left: 10px;
	color: var(--main-color1);
}

.social-icons {
	display: inline-block;
	border-top: 1px solid #fff;
	padding-top: 25px;
}
.container-nav-site .social-icons {
	border-top: 1px solid var(--main-color2);
	display: flex;
}
.social-icons a {
	color: #fff;
	transition: all linear 0.3s;
}
.container-nav-site .social-icons a.fa-facebook,
.container-nav-site .social-icons a.fa-instagram,
.container-nav-site .social-icons a.fa-youtube {
	color: var(--main-color2);
}
.container-nav-site .social-icons a.fa-facebook:hover,
.container-nav-main .social-icons a.fa-facebook:hover {
	color: #1877F2 !important;
}
.container-nav-site .social-icons a.fa-instagram:hover,
.container-nav-main .social-icons a.fa-instagram:hover {
	color: #000100;
}
.container-nav-site .social-icons a.fa-youtube:hover,
.container-nav-main .social-icons a.fa-youtube:hover {
	color: #FF0302;
}

/*
/
/ font-page
/
*/
#container {
	/*scroll-snap-type: y mandatory;
	height: 100vh;
	overflow-y: scroll;*/
}
#home,
#about,
#tabaluga,
#markenwelten,
#netzwerk,
#app,
#kontakt {
	position: relative;
	overflow: hidden;
	height: 100vh;
	scroll-snap-align: start;
}
#home .home-logo {
	position: absolute;
	top: 65px;
	left: 65px;
	z-index: 1;
}
#home .wp-block-cover {
	padding: 0;
}
#home .wp-block-site-logo {
	/*text-align: center;*/
	color: #fff;
	position: absolute;
	top: 50px;
	left: 155px;
}
#home .home-claim {
	font-size: clamp(20px, 2vw, 30px);
	line-height: clamp(35px, 2vw, 50px);
	position: absolute;
	left: 8%;
	bottom: 150px;
	color: #fff;
	width: 70%;
}

#home .scroll-down {
	display: block;
	width: 400px;
	text-align: center;
	position: absolute;
	bottom: 30px;
	left: 50%;
	margin-left: -200px;
	font-size: 20px;
	line-height: 23px;
}
#home .scroll-down a {
	color: #fff;
}

#about .left { position: relative; }
#about blockquote {
	font-size: clamp(20px, 1vw, 30px);
	line-height: clamp(25px, 1vw, 20px);
	display: inline-block;
	width: 55%;
	position: absolute;
	left: 8%;
	bottom: 30px;
}
/*#about blockquote::before {
	content: "\"";
	position: absolute;
	top: 8px;
	left: -25px;
	z-index: 10;
	font-family: var(--font1);
	font-size: clamp(80px, 2vw, 120px);
	line-height: clamp(80px, 2vw, 120px);
}
#about blockquote::after {
	content: "\"";
	position: absolute;
	bottom: -40px;
	right: 0;
	z-index: 10;
	font-family: var(--font1);
	font-size: clamp(80px, 2vw, 120px);
	line-height: clamp(80px, 2vw, 120px);
}*/
#about blockquote cite {
	text-align: right;
	display: block;
	margin-top: 10px;
}
#about .title,
#tabaluga .title {
	font-size: clamp(15px, 2vw, 20px);
	line-height: clamp(30px, 2vw, 60px);
	letter-spacing: 0.15em;
	margin-bottom: 10vh;
}
#tabaluga .title {
	padding-left: 20%;
}

#tabaluga .tabaluga-top {
	padding-top: 50px;
	height: 25vh;
}
#tabaluga .tabaluga-bottom {
	height: 75vh;
}
#tabaluga .wp-block-cover__image-background {
	min-width: 100%;
	height: 75vh;
	position: absolute;
	/*bottom: 0;*/
	top:0;
}
#tabaluga h2.typed-wrapper {
	display: block;
	width: 40%;
	margin-left: 45%;
	color: var(--main-color1);
	font-size: clamp(35px, 4vw, 80px);
	line-height: clamp(100px, 4vw, 135px);
}

#markenwelten {
	height: 100svh;
	position: relative;
}
#markenwelten .column-container {
	display: flex;
	flex-direction: row;
	gap: 0;
	align-items: center;
	justify-content: space-evenly;
}
#markenwelten .column-container .column {
	flex-grow: 1;
	flex-basis: 14%;
	width: 14%;
	/*filter: grayscale(70%);*/
	transition: all ease-in-out 0.3s;
	margin: -1px;
}
#markenwelten .column-container:hover .column {
	/*flex-basis: 5%;*/
	/*filter: blur(3px);*/
}
#markenwelten .column-container .column:hover {
	/*transform: scale(1.2) !important;*/
	flex-basis: 18%;
	/*filter: grayscale(0%);*/
	filter: blur(0px);
	/*z-index: 100;*/
}
#markenwelten h3 {
	color: #fff;
	margin-top: 30vh;
	font-size: clamp(0.6rem, 1.2vw, 1rem);
	line-height: clamp(30px, 1.2vw, 35px);
	letter-spacing: 0.15em;
	display: block;
	width: 100%;
	text-align: center;
}
#markenwelten .wp-block-buttons {
	width: 100%;
	text-align: center;
	margin: 0 auto;
	position: absolute;
	top: 45vh;
	left: 0;
}
#markenwelten .wp-block-button__link {
	font-size: 12px;
	line-height: 30px;
	margin: 0;
	padding: 0;
	border: 1px solid #fff;
	border-radius: 0;
	width: 86px;
	text-align: center;
	background: none;
	position: relative;
	transition: all linear 0.3s;
}
#markenwelten .wp-block-button__link:hover {
	transform: scale(1.2);
}
#markenwelten .wp-block-button__link::before {
	content: " ";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	opacity: 0.2;
	z-index: 1;
	transition: all linear 0.3s;
}
#markenwelten .wp-block-button__link:hover::before {
	opacity: 0;
}
/* markenwelten logo carousel */
#markenwelten .carousel {
	height: 200px;
	width: 100%;
	position: relative;
}
#markenwelten .carousel .slick-dots {
	display: none !important;
}
#markenwelten .carousel .slick-track {
	display: flex;
	align-items: center;
}
#markenwelten .carousel .slick-prev,
#markenwelten .carousel .slick-next {
	top: 100%;
	left: 50%;
}
#markenwelten .carousel .slick-prev { margin-left: -25px }
#markenwelten .carousel .slick-next { margin-left: 25px }
#markenwelten .carousel .slick-prev:before,
#markenwelten .carousel .slick-next:before {
	color: #333;
}

#netzwerk .netzwerk-top {
	height: 15vh;
	position: relative;
	z-index: 100 !important;
}
#netzwerk .netzwerk-bottom {
	height: 85vh;
	display: flex;
	align-items: flex-end;
	position: relative;
	z-index: 90 !important;
}
#netzwerk .tabaluga-partner {
	position: absolute;
	z-index: 100 !important;
	left: 5%;
	top: 50px;
}
div#n2-ss-2 .n2-ss-slide-limiter { max-width: 100% !important; max-height: 85vh; }
#netzwerk .partner-logo {
	position: absolute;
	top: 8%;
	right: 5%;
	width: 100%;
	padding: 0;
	margin: 0;
	text-align: right;
}
#netzwerk .partner-content {
	position: absolute;
	right: 0;
	height: 65vh;
	width: 60%;
	display: flex;
	align-items: flex-end;
}
#netzwerk .partner-content p {
	font-family: var(--font2) !important;
	font-size: clamp(30px, 1vw, 40px) !important;
	line-height: clamp(33px, 1vw, 45px) !important;
	padding: 0 10% 5% 0;
}

#app h2 {
	padding-bottom: 40px;
	color: var(--main-color1);
	font-size: clamp(50px, 4vw, 80px);
	line-height: clamp(54px, 4vw, 92px);
}
#app h3 {
	font-family: var(--font1);
	color: var(--main-color3);
	padding-top: 40px;
	padding-bottom: 40px;
	font-size: clamp(25px, 1vw, 35px);
	line-height: clamp(28px, 1vw, 40px);
	text-transform: none;
}
#app p {
	font-size: clamp(20px, 1vw, 30px);
	line-height: clamp(23px, 1vw, 35px);
	padding-right: 5%;
	padding-top: 10px;
}
/* carousel */
#app .theta-carousel-container { 
	position: 
	absolute; z-index: 90; 
	width: 100%;
	height: 100svh !important;
}
#app .theta-carousel-item { 
	box-shadow: none !important; 
	max-height: 90vh !important;
}

#kontakt { height: 108vh; }
#kontakt p {
	font-size: clamp(20px, 1vw, 30px);
	line-height: clamp(23px, 1vw, 35px);
	background: rgba(255, 255, 255, 0.6);
	padding: 10px 25px;
}
#kontakt .left h1,
#kontakt .left p { 
	color: #fff; 
}
#kontakt .kontakt-cover {
	height: 100svh;
}
#kontakt .kontakt-cover img {
	object-fit: cover;
}
#kontakt .right {
	margin: 0;
}
#kontakt .kontakt-content {
	font-size: clamp(20px, 1vw, 30px);
	line-height: clamp(23px, 1vw, 35px);
	color: var(--main-color2);
	width: 90%;
	padding-top: 5%;
	margin: 0 auto;
}
#kontakt .kontakt-content h2 {
	color: var(--main-color1);
	font-size: clamp(50px, 4vw, 80px);
	line-height: clamp(54px, 4vw, 92px);
}
#kontakt .kontakt-tabaluga {
	margin-top: -180px;
}
#kontakt .form-element-text,
#kontakt .form-element-quiz {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
}
#kontakt .form-element-quiz label span {
	position: absolute;
	margin-top: 25px;
}
#kontakt .form-element-quiz input {
	width: 150px;
	margin-left: 100px;
	display: flex;
	align-items: center;
	float: right;
}
#kontakt .form-element-submit {
	text-align: right;
	padding: 20px 0 0 0;
	outline: none;
}
#kontakt .form-element-submit .wpcf7-spinner {
	position: absolute;
	margin-left: -300px;
}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
	border: none;
	border-color: var(--main-color3);
	outline: none;
	background: var(--main-color3);
	color: #fff;
	padding: 15px;
}
.wpcf7-not-valid-tip {
	color: var(--main-color3);
}

/*
/ blog page
*/
/*.blog {
	background: url('/wp-content/themes/tabaluga/images/bg_sterne.jpg') top left no-repeat;
	background-size: cover;
	background-attachment: fixed;
}*/
.blog h1 {
	color: #fff;
	text-align: center;
	padding-bottom: 80px;
}
.blog .container {
	background: url('/wp-content/themes/tabaluga-b2b/images/bg_sterne.jpg') top left no-repeat;
	background-size: cover;
	background-attachment: fixed;
	min-height: 100svh;
	padding-bottom: 300px;
	width: 75%;
	margin: 0 auto;
	padding: 50px 5% 100px 5%;
}
.blog .post {
	width: 20%;
	background: #fff;
	border: 1px solid var(--main-color1);
	border-radius: 20px;
	margin: 40px 20px;
}
.blog .post figure img {
	border: 0px solid transparent;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	width: 100%;
	height: auto;
	/*max-height: 300px;*/ 
}
.blog .post .content {
	padding: 5%;
}
.blog .post .content p {
	font-size: clamp(14px, 1vw, 18px);
	line-height: clamp(25px, 1vw, 28px);
}
.blog h2 a {
	text-align: center;
	color: var(--main-color1);
	width: 100%;
	display: block;
	padding-bottom: 15px;
	line-height: clamp(50px, 2vw, 50px);
}

/* single */
.single .container {
	min-height: 100svh;
	width: 75%;
	padding-bottom: 300px;
	margin: 50px auto;
}
.single h1 { 
	color: var(--main-color1); 
	padding-bottom: 80px;
}
.single h2 {
	font-size: 1rem;
	padding: 25px 0 10px 0;
}
.single h3 {
	font-size: 0.8rem;
	padding: 15px 0;
}
.single p {
	font-size: 0.8rem;
	padding: 10px 0;
}
.single .content a {
	color: var(--main-color1);
	transition: all linear 0.3s;
}
.single .content a:hover {
	text-decoration: underline;
}
.single .post {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 50px;
}
.single .content {
	width: 66%;
	font-size: clamp(14px, 1vw, 18px);
	line-height: clamp(25px, 1vw, 28px);
}
.single .thumbnail {
	width: 34%;
}
.single .thumbnail img {
	max-width: 100%;
	height: auto;
}
.single .blog-footer {
	border-top: 1px solid var(--main-color1);
	padding-top: 20px;
	margin-top: 150px;
	display: flex;
	justify-content: flex-start;
}
.single .blog-footer a {
	color: var(--main-color1);
	font-size: clamp(10px, 1vw, 18px);
	line-height: clamp(20px, 1vw, 28px);
}
.single .blog-footer a:hover {
	text-decoration: none;
	color: var(--main-color3);
}
.single .blog-footer a span.fa {
	height: 50px;
	width: 50px;
	text-align: center;
	padding: 15px;
	background: var(--main-color1);
	color: #fff;
	transition: all linear 0.3s;
}
.single .blog-footer a:hover span.fa {
	background: var(--main-color3);
}
.single .blog-footer .left {
	width: 66%;
}
.single .blog-footer .left span.fa {
	transform: rotate(90deg);
}
.single .blog-footer .right {
	width: 34%;
	display: flex;
	justify-content: space-between;
}

/* page */
.page .container {
	min-height: 100svh;
	padding-bottom: 300px;
	width: 75%;
	margin: 50px auto;
	padding-left: 5%;
}
.page .content h1 {
	color: var(--main-color1); 
	padding-bottom: 80px;
	text-align: left;
}
.page .content h2 {
	color: var(--main-color1);
	padding: 50px 0 10px 0;
	line-height: clamp(50px, 2vw, 50px);
	font-size: clamp(20px, 2vw, 30px);;
}
.page .content p {
	font-size: clamp(14px, 1vw, 18px);
	line-height: clamp(25px, 1vw, 28px);
	margin-bottom: 20px;
	/*columns: 2;
	column-gap: 50px*/;
}



footer {
	background: url('/wp-content/themes/tabaluga-b2b/images/bg-footer.png') top left no-repeat;
	background-color: none;
	background-size: cover;
	margin-top: -130px;
	padding-top: 50px;
	min-height: 180px;
	position: relative;
	z-index: 10;
	width: 100%;
/*	scroll-snap-align: end;*/
}
.page-id-2 footer {
	scroll-snap-align: end;
}
footer a {
	color: #fff;
}
footer a:hover {
	text-decoration: underline;
}
footer .column-container {
	display: flex;
	align-items: flex-start;
	justify-content: center;
}
footer .column {
	color: #fff;
	padding: 50px 80px 0 80px;
	font-size: clamp(14px, 1vw, 18px);
	line-height: clamp(25px, 1vw, 28px);
}
footer .column p {
	padding-bottom: 5px;
	font-size: clamp(14px, 1vw, 18px);
	line-height: clamp(25px, 1vw, 28px);
}
footer .copyright {
	display: flex;
	align-items: flex-end;
	font-size: clamp(12px, 1vw, 16px);
	line-height: clamp(23px, 1vw, 26px);
}
footer .copyright .column {
	width: 100%;
	text-align: right;
	padding: 20px 5% 20px 0;
}
footer .menu a {
	font-weight: bold;
	line-height: clamp(25px, 2vw, 40px);
}



/*
/ popup style
*/
.popup img.wp-block-cover__image-background {
	object-fit: cover !important;
	/*height: 100svh !important;*/
}
.popup {
	position: absolute;
	z-index: 50;
	display: block;
	left: -50vw;
	top: 5vh;
	bottom: 5vh;
	opacity: 0;
	margin: 0 5%;
	padding: 0;
	width: 90%;
	max-height: 90vh;
	min-height: 90vh !important;
	overflow: auto;
}
.popup .team-gallery {
	max-width: 100% !important;
}
.popup .team-gallery .figcaption,
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
	line-height: 16px !important;
}
.team-gallery figcaption {
	font-size: 0.5rem;
	line-height: 0.7rem;
	text-align: center;
}
#tabaluga .popup {
	top: 5vh;
	left: -105vw;
}
#tabaluga .popup {
	max-height: 60vh;
	min-height: 60vh !important;
	left: 0;
	top: 50vh;
}
#markenwelten .popup {
	width: 50%;
	margin: 0 14.3%;
	opacity: 1;
	left: -105vw;
	top: 5vh;
}

#tabaluga .popup-tabaluga-markenwerte .left p {
	padding: 10% 3% 5% 30%;
}
#tabaluga .popup-tabaluga-markenwerte .right p {
	padding: 10% 3% 3% 3%;
	line-height: clamp(20px, 2vw, 25px);
}
#tabaluga .popup-tabaluga-sozialeziele .left img {
	height: 55vh !important;
	width: auto;
}
#tabaluga .popup-tabaluga-sozialeziele .right {
	padding: 10% 10% 3% 0%;
}
#tabaluga .popup-tabaluga-sozialeziele .right h4 {
	padding-top: 50px;
	font-size: clamp(15px, 2vw, 20px);
	line-height: clamp(20px, 2vw, 25px);
	font-weight: bold;
}
#tabaluga .popup-tabaluga-content {
	display: flex;
}
.popup-close {
	cursor: pointer;
	position: absolute;
	display: inline-block;
	z-index: 20;
	top: 25px;
	right: 25px;
}
#about .popup .popup-content,
#markenwelten .popup .popup-content {
	position: relative;
	width: auto;
	padding: 10% 15% 15% 15%;
}
#markenwelten .popup .partner {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.popup .popup-content h2 {
	color: var(--main-color1);
	font-size: clamp(40px, 1vw, 30px);
	line-height: clamp(70px, 1vw, 50px);;
}
.popup .popup-content p {
	/*font-size: clamp(15px, .75vw, 20px);
	line-height: clamp(18px, .75vw, 23px);*/
	font-size: clamp(0.8rem, 1vw, 1rem);
	line-height: clamp(1rem, 1vw, 1.2rem);
	color: var(--main-color2);
}
.popup .popup-image-tabaluga,
.popup .popup-tabaluga {
	/*margin-top: -180px;*/
	position: absolute;
	bottom: 95px;
	right: 20px;
}


@media(max-width: 1500px) {
	.blog .container { width: 100%; }
}

@media(max-width: 1200px) {
	::root { overflow: hidden; }

	p { font-size: 1.8rem; line-height: 1.8rem; }
	.popup {
		overflow-x: hidden;
	}

	.no-mobile { display: none !important; }

	/* navigation */
	.container-nav-site { width: 75%; }
	.container-nav-site li { padding: 5px 0; }
	.container-nav-site li a,
	.container-nav-site .social-icons a { font-size: clamp(35px, 4vw, 80px); line-height: clamp(90px, 4vw, 135px); }

	.container-nav-main .wp-block-navigation-item__label,
	.container-nav-about .wp-block-navigation-item__label,
	.container-nav-tabaluga .wp-block-navigation-item__label,
	.container-nav-site a {
		font-size: 1.4rem;
		line-height: 1.8rem;
}

	/*.wp-block-columns { flex-wrap: wrap; }
	.wp-block-column { flex-basis: 100% !important; }*/

	/* home */
	#home .wp-block-site-logo { display: block; text-align: center; width: 100%; left: 0; top: 65px; }
	#home .wp-block-site-logo img { width: 100%; }
	#home h1 { font-size: clamp(35px, 8.25vw, 80px); line-height: clamp(90px, 4.25vw, 135px); display: block; text-align: center; }
	#home .home-claim { width: 100%; position: relative; top: 10vh; display: block; text-align: center; left: 0; padding: 50px 10%; }
	#home .scroll-down { font-size: clamp(25px, 2vw, 30px); bottom: 10px; line-height: clamp(30px, 2vw, 35px); }

	/* about */
	#about .burger-nav-site { color: var(--main-color2); }
	#about .wp-block-columns { flex-wrap: wrap !important; }
	#tabaluga .wp-block-column,
	#about .title, #tabaluga .title { margin-bottom: 30px; padding-top: 10px; padding-left: 20px; font-size: 1.4rem; line-height: 2rem; flex-basis:100% !important; }
	#about .container-nav-about { padding-left: 8%; }
	#about .wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column { flex-basis: 100% !important; }
	#about .wp-block-column:nth-child(2) { order:1; } 
	#about .wp-block-column:first-child { order:99; flex-basis: 100%; }
	#about .team-group .wp-block-column:first-child { order:0; flex-basis: 0 !important; }
	#about .team-group .wp-block-column:nth-child(2) { order:0; }
	#about .right { height: 25vh; }
	#about .left { height: 75vh; }
	#about blockquote {	font-size: clamp(50px, 1vw, 60px); line-height: clamp(65px, 1vw, 80px); display: block; width: 80%; height: 30vh; text-align: center; position: absolute; left: 10%; top: 40vh; }
	/*#about blockquote::before { left: -5px; top: 50px; font-size: 160px; }
	#about blockquote::after { bottom: 0px; font-size: 160px; }*/
	#about .team-group {  }
	#about .team-gallery { }

	.container-nav-about .title { margin-top: 30px; margin-bottom: 45px; }
	/*.container-nav-about .wp-block-navigation__container { margin-bottom: 30px; }
	.container-nav-about .wp-block-navigation-item__label { padding-left: 0; font-size: clamp(25px, 8vw, 30px); line-height: clamp(40px, 8vw, 60px); }

	/* tabaluga */
	#tabaluga { height: 100svh; }
	#tabaluga .tabaluga-top { height: 20vh; }
	#tabaluga .wp-block-columns { flex-wrap: wrap !important; }
	#tabaluga .wp-block-column, 
	#tabaluga .title { width: 100% !important; flex-basis: 100%; padding-top: 0; margin-bottom: 10px; }
	#tabaluga .title { margin-top: -10px; margin-left: 70px; }
	#tabaluga .container-nav-tabaluga { padding-left: 5%; }
	#tabaluga .popup-tabaluga-markenwerte .left p,
	#tabaluga .popup-tabaluga-markenwerte .right p { padding: 5%; line-height: clamp(1rem, 2vw, 1.2rem); }
	#tabaluga h2.typed-wrapper { width: 90%; margin-left: 0; text-align: center; padding: 0 5%; font-size: 3.4rem; line-height: 4rem; }
	#tabaluga .popup-content { padding-top: 10%; flex-direction: column; }
	#tabaluga .popup-content .left,
	#tabaluga .popup-content .right { flex-basis: 100% !important; flex-wrap: wrap; }
	#tabaluga .popup-content .wp-block-image figure { width: 100%; text-align: center; }
	#tabaluga .popup-tabaluga-sozialeziele figure img { height: auto; max-height: 30vh; }

	/* markenwelten */
	#markenwelten { height: 105vh; }
	#markenwelten h3 { margin-top: 0; font-size: clamp(45px, 1vw, 60px); line-height: clamp(60px, 1vw, 75px); letter-spacing: 0.15em; }
	#markenwelten .wp-block-buttons { top: 60%; left: 0; } 
	#markenwelten .wp-block-button__link { font-size: 30px; line-height: 50px;	width: 160px; }
	#markenwelten .column-container { flex-direction: column; }
	#markenwelten .column-container .column { flex-basis: 100%; min-height: 14.2vh !important; max-height: 14.2vh; width: 100%; }
	#markenwelten .popup { width: 90%; margin: 0 5%; }

	/* netzwerk */
	#netzwerk .netzwerk-top { height: 20vh; }
	#netzwerk .netzwerk-bottom { height: 80vh; }
	#netzwerk .netzwerk-bottom .wp-block-group__inner-container { height: 100%; }
	#netzwerk .netzwerk-bottom .n2-ss-slider-wrapper-inside { height: 80vh; }
	#netzwerk .netzwerk-bottom .n2-ss-slider-wrapper-inside .partner-content { width: 90%; padding: 0 5%; }
	#netzwerk .netzwerk-bottom .n2-ss-slider-wrapper-inside p { font-size: 1.2rem !important; line-height: 1.4rem !important; }
	#netzwerk .partner-logo { position: absolute; top: -350px; right: auto; min-width: 400px; }
	.n2-ss-slider .n2-ss-item-image-content { position: absolute; top: 0; }

	/* app */
	#app { height: 120vh; }
	#app .wp-block-columns { flex-direction: column; }
	#app .left { flex-basis: 100%; order: 1; max-height: 60vh; }
	#app .left .wp-block-cover,
	#app .theta-carousel-container { min-height: 60vh !important; max-height: 60vh; }
	#app .right { flex-basis: 100%; order: 2; padding-top: 10%; height: 40vh; opacity: 1 !important; }
	#app .right .wp-block-columns { flex-direction: row; }
	#app p { font-size: 1.2rem; line-height: 1.3rem; }

	/* kontakt */
	#kontakt { height: 120vh; }
	#kontakt .wp-block-columns { flex-direction: column; }
	#kontakt .left { flex-basis: 100%; order: 1; max-height: 40vh; min-height: 40vh; }
	#kontakt .left .wp-block-cover { max-height: 40vh; min-height: 40vh !important; }
	#kontakt .right { flex-basis: 100%; order: 2; max-height: 60vh; opacity: 1; }
	#kontakt .kontakt-content h2 { font-size: 1.8rem; line-height: 2rem; }
	#kontakt p { font-size: 1.4rem; line-height: 1.6rem; }
	#kontakt .form-element-text, #kontakt .form-element-quiz,
	input[type="text"], input[type="email"], textarea,
	input[type="text"]::placeholder, input[type="email"]::placeholder, textarea::placeholder { font-size: 1.2rem; line-height: 1.3rem; }


	/* blog */
	.blog .container { width: 100%; padding-left: 5%; background-repeat: repeat; background-size: contain; }
	.blog .post { width: 100%; margin: 50px 0; }

	/* single */
	.single .container { width: 100%; overflow: hidden; }
	.single .single-content { padding: 80px 5% 0 5%; }
	.single .post { flex-direction: column; width: 90%; }
	.single .content { width: 100%; order: 2; }
	.single .thumbnail { width: 100%; order: 1; }
	.single .blog-footer a .link-text { display: none; }

	/* page */
	.page .container { width: 90%; }
	.page .content { width: 100%; }
	.page .content h1 { text-align: center; }
	.page .content p { columns: 1; }


	/* popup */
	.popup { min-height: 70vh !important; }
	.popup .wp-block-cover__inner-container { height: 100svh !important; }

	/* navigation */
	.blog .burger-nav-site { color: #fff; }
}

@media(max-width: 780px) {
	body.home .is-layout-flex .wp-block-cover { 
		height: 50vh !important;
		min-height: 50vh !important;
		max-height: 50vh !important;
	}

	.home h1 { 
		max-width: 90%; 
		margin-left: 5%;   
	}

	.home-auswahl-logo img { 
		width: 50%; 
	}
}


.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column:not(:first-child) { margin-left: 25px; }
.home .wp-block-button { display: block; text-align: center; }

.home .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column:not(:first-child) { margin-left: 0; }