/*
   Theme Name: Main Theme
   Description: Template MAIN THEME
   Author: 3-mal-1 GmbH
   Author URI: http://3-mal-1.de
*/
/* mainstyle */
@import url('assets/css/style.css');
@font-face {
	font-family: 'roboto';
	src: url("assets/fonts/Roboto-Black.woff") format("woff");
	font-weight: 900;
	font-style: normal;
}
@font-face {
	font-family: 'roboto';
	src: url("assets/fonts/Roboto-Thin.woff") format("woff");
	font-weight: 100;
	font-style: normal;
}
@font-face {
	font-family: 'roboto';
	src: url("assets/fonts/Roboto-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
}

.image-stroke{
	border:1px solid #cfcfd6;
	display: inline-block;
}
.wp-block-column figure a,.wp-block-column figure img{
	width:100%;
	height:auto;
}
body [id^=cb_scrollable_pdf_] .flip-book-wrapper {
    width: 100%;
}
body [id^=cb_scrollable_pdf_].mode_live {
    --grid-container-columns-repeat: 3;
}
body [id^=cb_scrollable_pdf_] .flip-book-wrapper canvas {
    aspect-ratio: 2/3;
}
.teaser_boxes_container {
    --teaser_boxes_container-gap: 2rem;
}
.teaser_box_as_link>* {
    position: relative;
}
.teaser_box_body-title {
    display: none;
}
.teaser_box a{
    box-sizing: border-box;
    display: inline-flex;
    font-size: .875rem;
    border: 1px solid var(--brand-btn-backgroundcolor);
    padding: 0.5rem 1rem;
    line-height: 1;
    color: var(--main-color-blue-1);
}
.teaser_box_as_link a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
xbody[blendload]{
	opacity:0;
	transition:opacity 1s ease;
}
xbody[blendload][loaded]{
	opacity:1;
	
}

html{
	font-family:roboto;
}
body {
   max-width: 100vw;
   overflow-x: hidden;
	transition:opacity 1s ease;
 }
.grid-container {
  --grid-container-font-size: 1rem;
  --grid-container-display: grid;
  --grid-container-position: relative;
  --grid-container-margin: 0 auto;
  --grid-container-padding: 0em;
  --grid-container-columns-repeat: 1;
  --grid-container-columns-basis: 1fr;
  --grid-container-columns-position: [col-start];
  --grid-container-gap: 1em;
  --grid-container-background-color: #fff;
  --grid-container-template-columns: repeat(var(--grid-container-columns-repeat), var(--grid-container-columns-basis) var(--grid-container-columns-position));
  --grid-container-first-box-start: 1;
  --grid-box-position: relative;
  --grid-box-padding: 1em;
  --grid-box-ratio-a: 0;
  --grid-box-ratio-b: 1;
  --grid-box-ratio: var(--grid-box-ratio-a)/var(--grid-box-ratio-b);
  --grid-box-background-color: #fff;
  --grid-box-body-position: ;
  --grid-box-body-padding: 1em;
  --grid-box-body-background-color: #fff;
  --grid-box-body-item-align: ;
  --grid-box-body-content-justify: ;
  --box-footer-display: ;
  --box-footer-position: ;
  --box-footer-left: ;
  --box-footer-top: ;
  --box-footer-right: ;
  --box-footer-bottom: ;
  --struggle-width: 100%;
  font-size: var(--grid-container-font-size);
  display: var(--grid-container-display);
  position: var(--grid-container-position);
  grid-gap: var(--grid-container-gap);
  grid-template-columns: var(--grid-container-template-columns);
  padding: var(--grid-container-padding);
  background-color: var(--grid-container-background-color);
  max-width: var(--struggle-width);
}
.grid-container .grid-box {
  position: var(--grid-box-position);
  background-color: var(--grid-box-background-color);
  padding: var(--grid-box-padding);
  aspect-ratio: var(--grid-box-ratio);
  display: flex;
  flex-flow: column nowrap;
}
.grid-container .grid-box > .box-body {
  background-color: var(--grid-box-body-background-color);
  padding: var(--grid-box-body-padding);
  flex-grow: 1;
  display: flex;
  flex-flow: row wrap;
  align-items: var(--grid-box-body-item-align);
  justify-content: var(--grid-box-body-content-justify);
  position: var(--grid-box-body-position);
}
.grid-container .grid-box > .box-body + .box-footer {
  display: var(--box-footer-display);
  position: var(--box-footer-position);
  left: var(--box-footer-left);
  top: var(--box-footer-top);
  right: var(--box-footer-right);
  bottom: var(--box-footer-bottom);
}
.grid-container .grid-box > .box-body .controller-container {
  background: transparent;
  position: absolute;
  top: 0;
  right: 0;
}

.grid-form .grid-container {
  --grid-container-background-color: initial;
  --grid-box-body-background-color: initial;
  --grid-box-background-color: initial;
  --grid-container-columns-repeat: 6;
  --grid-container-gap: 1em;
  --grid-box-padding: 0rem;
}
.grid-form .grid-container .grid-box {
  --box-grid-column: initial;
  grid-column: var(--box-grid-column);
  border: none;
  padding: var(--grid-box-padding);
}
.grid-form .grid-container .grid-box.span-1 {
  --box-grid-column: 1 span;
}
.grid-form .grid-container .grid-box.span-2 {
  --box-grid-column: 2 span;
}
.grid-form .grid-container .grid-box.span-3 {
  --box-grid-column: 3 span;
}
.grid-form .grid-container .grid-box.span-4 {
  --box-grid-column: 4 span;
}
.grid-form .grid-container .grid-box.span-5 {
  --box-grid-column: 5 span;
}
.grid-form .grid-container .grid-box.span-6 {
  --box-grid-column: 6 span;
}
.grid-form .grid-container .grid-box .acf-label {
  margin-bottom: 3px;
}
/*
 
.grid-container {
	--first-start:1;
  --grid-container-font-size: 1rem;
  --grid-container-display: grid;
  --grid-container-position: relative;
  --grid-container-padding: 0em;
  --grid-container-columns-repeat: 1;
  --grid-container-columns-basis: 1fr;
  --grid-container-columns-position: [col-start];
  --grid-container-gap: 1em;
  --grid-container-background-color: #fff;
  --grid-container-template-columns: repeat(var(--grid-container-columns-repeat), var(--grid-container-columns-basis) var(--grid-container-columns-position));
  --grid-container-first-box-start: 1;
  --grid-box-position: relative;
  --grid-box-padding: 0em;
  --grid-box-ratio-a: 0;
  --grid-box-ratio-b: 1;
  --grid-box-ratio: var(--grid-box-ratio-a)/var(--grid-box-ratio-b);
  --grid-box-background-color: #fff;
  --grid-box-body-position: ;
  --grid-box-body-padding: 0em;
  --grid-box-body-background-color: #fff;
  --grid-box-body-item-align: ;
  --grid-box-body-content-justify: ;
	--box-footer-display:;
	--box-footer-position:;
	--box-footer-left:;
--box-footer-top:;
--box-footer-right:;
--box-footer-bottom:;
  font-size: var(--grid-container-font-size);
  display: var(--grid-container-display);
  	position:var(--grid-container-position);
  grid-gap: var(--grid-container-gap);
  grid-template-columns: var(--grid-container-template-columns);
  padding: var(--grid-container-padding);
  background-color: var(--grid-container-background-color);

  .grid-box {
  	position:var(--grid-box-position);
    background-color: var(--grid-box-background-color);
    padding: var(--grid-box-padding);
    aspect-ratio: var(--grid-box-ratio);
    display: flex;
    flex-flow: column nowrap;

    &:first-child {
      grid-column-start: var(--grid-container-first-box-start);
    }

    >.box-body {
      background-color: var(--grid-box-body-background-color);
      padding: var(--grid-box-body-padding);
      flex-grow: 1;
      display: flex;
      flex-flow: row wrap;
      align-items: var(--grid-box-body-item-align);
			justify-content:var(--grid-box-body-content-justify);
  		position:var(--grid-box-body-position);			
			&+.box-footer{
				display:var(--box-footer-display);
  			position:var(--box-footer-position);
				left:var(--box-footer-left);
				top:var(--box-footer-top);
				right:var(--box-footer-right);
				bottom:var(--box-footer-bottom);
			}
			.body-content{
				&:where([class*="media-"]){
					--image-ratio:16/9;
					flex-grow: 1;
					img{
						width: 100%;
						aspect-ratio: var(--image-ratio);
						object-fit: cover;
						scale:1;
						transition:scale 1s ease;
					}
					&.almost-quadratic{
					--image-ratio:5/4;
					}
					>*{
						overflow:hidden;
					}
				}
				.box-content-data{
					padding:0 0rem;
						transition:padding 1s ease;
				}
			}
      .controller-container {
      	--box-controller-background:;
				--controler-container-opacity:0.5;
				--controler-container-transiton-speed:0.5s;
				width: 0;
				max-width: max-content;
				overflow: hidden;

        background: var(--box-controller-background);
				transition:all var(--controler-container-transiton-speed) ease;
				opacity:var(--controler-container-opacity);
        position: absolute;
				direction: rtl;
        top: 0;
        right: 0;
				
      }
    }
		
		&:hover{
			.body-content{
				&:where([class*="media-"]){
					flex-grow: 1;
					img{
						scale:1.02;
							}
				}
				.box-content-data{
					padding:0 0.5rem;
				}
			}
			.controller-container{
				--controler-container-opacity:1;
				width: 100%;
			}
		}
  }
}
*/

 #App [id^=cb_post_teaser_]{
  --cb_post_teaser_title-line-height: 1.2;
  --cb_post_teaser_title-padding: 0.7rem 1rem 0.1rem 1rem;
  --cb_post_teaser_title-margin-bottom: 1rem;
  --cb_post_teaser_title-color: var(--main-color-blue-1);
  --cb_post_teaser_font-size: 1.2em;
  --cb_post_teaser_slide-arrow-color: var(--contentTeaserSlider-arrow-color);
}
 #App [id^=cb_post_teaser_] .uk-card .uk-card-body > .teaser-title {
  display: flex;
  justify-content: start;
  align-items: flex-start;
  line-height: var(--cb_post_teaser_title-line-height);
  padding: var(--cb_post_teaser_title-padding);
  margin-bottom: var(--cb_post_teaser_title-margin-bottom);
  text-shadow: 0px 0px 0.4px var(--cb_post_teaser_title-color);
  color: var(--cb_post_teaser_title-color);
  font-size: var(--cb_post_teaser_font-size);
}
#App [id^=cb_post_teaser_] .uk-invisible[hidden] {
  visibility: visible !important;
  display: inherit !important;
}
#App [id^=cb_post_teaser_] .uk-slidenav[class*="uk-slidenav-"] {
  color:var(--cb_post_teaser_slide-arrow-color);
}
.uk-slider.uk-slider-container-offset {
    margin: -11px -50px -39px -50px;
    padding: 11px 50px 39px 50px;
}
 .height-index-hero {
   min-height: 100vh;
 }
 .flip-book-wrapper canvas+img {
  object-fit: contain;
}
 .hero-logo {
   left: 50%;
   transform: translateX(-50%);
   display: inline-block;
   position: absolute;
   top: 1rem;
   margin: 0 auto;
   width: 12vw;
   min-width: 12rem;
   max-width: 14rem;
   padding: 1rem;
   background-color: #ffffff66;
   border-radius: 1em;
   backdrop-filter: blur(1rem);
   transition: all 0.33s ease;
 }

 .hero-logo>* {
   width: 100%;
   height: auto;
 }

 .uk-breadcrumb.uk-grid {
   margin: 0;
   overflow: hidden;
 }

 .uk-breadcrumb.uk-grid>* {
   display: contents;
 }

 .uk-breadcrumb>*>* {
   clip-path: polygon();
 }

 .uk-breadcrumb>:nth-child(n+1)>* {
   background-color: #88e;
   color: #333;
   padding: 0.2rem 2rem;
   clip-path: polygon(1rem 0%, 100% 0%, calc(100% - 1rem) 100%, 0% 100%);
   text-shadow: 0px 0px 0.4px #000;
   transition: all 0.25s ease;
   text-transform: uppercase;
 }
 .uk-breadcrumb>:nth-child(n+1)>*:hover {
     text-shadow: 0px 0px 0.4px #fff,0px 0px 0.4px #fff,0px 0px 0.4px #fff;
     letter-spacing: 1px;
 }
 .uk-breadcrumb>:nth-child(n+1):not(:nth-child(1))>* {
   margin-left: -0.9rem;
   color: #fff;
   flex-grow: 1;
 }

 .uk-breadcrumb>:not(:nth-child(even))>* {
   background-color: #449;
 }

 .uk-breadcrumb>:nth-child(1)>* {
   padding-left: 1rem;
   clip-path: polygon(0% 0%, 100% 0%, calc(100% - 1rem) 100%, 0% 100%);
   background-color: #007;
   color: #fff;
 }

 .uk-breadcrumb>:nth-child(n+1):not(:nth-child(1)):before {
   content: " ";
   margin: 0;
 }

 .uk-section>*>.uk-grid>* {
   min-width: 300px;
 }

 .footer {
   justify-self: flex-end;
 }

 @media(min-width: 960px) {
   .height-index-hero {
     min-height: 36vw;
   }

   .hero-logo {
     min-width: 6rem;
     transform: translateX(0%);
     left: 1rem;
   }
   .footer>*{
     width:100%;
   }
 }

@media(max-width: 800px){
	
body [id^=cb_scrollable_pdf_].mode_live {
    --grid-container-columns-repeat: 2;
}
}