.noDisplay { display:none!important; }
.noMargin>div {
    margin:0px!important;
} 
body {
    font-size:clamp(1rem, 3vw, 1.2rem)!important;
    --awb-size: clamp(1rem, 3vw, 1.2rem)!important;
    scroll-behavior: smooth;
	zoom: 100%;
    

  text-wrap: pretty;
}


/* ------------------------------------------------------ HEADER -------------------------------------------------------------- */

.cu_custom_navi {
    container-type: inline-size;
	/* Definiert den Container-Typ (inline-size = Breite) */
	container-name: cu_custom_navi_container;
	/* Optional: Name für den Container */
	//padding:2rem!important;
}


.fusion-tb-header {
    Xposition: absolute;
    margin: 0px auto;
    Xjustify-self: center;
}

.cu_custom_navi {
    width:100%;
}
.cu_custom_navi>.fusion-column-wrapper {
    padding:1rem 0px !important;
    margin:0px;
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    width:auto;
    -webkit-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out;
}

.cu_custom_navi>.fusion-column-wrapper>.fusion-builder-row {
    width:100!important;
    max-width:none!important;
    margin:0px!important;
    padding: 0px 1rem;
    -webkit-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out;
}

.cu_navi_logo,
.cu_navi_cta {
    -webkit-flex-basis:fit-content;
        -ms-flex-preferred-size:fit-content;
            flex-basis:fit-content;
}


.absoluteBox>.fusion-column-wrapper{
    position: relative;;
}

.customBox {
    border-radius:.5rem;
    padding:1rem;
    aspect-ratio:1 / 1;
    max-width:20vw;
    position: absolute!important;
    right:2rem!important;
    bottom:2rem!important;
} 
.absoluteBox .stoerer_text,
.absoluteBox .stoerer_text > *{
    font-size: clamp(1.2rem, 3vw, 2.5rem)!important;
    margin:0px!important;
    padding:0px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-self: center;
        -ms-flex-item-align: center;
            align-self: center;
}
.fusion-column-wrapper:has(.absoluteImage){
    position: relative;
}

.calendlyButton{
    border-radius: .35rem;
    background-color: var(--awb-color5);
    padding: .35rem 1rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    color: white;
}
.calendlyButton.white.off-canvas-close{
    border-radius: .35rem!important;
    background-color: white!important;
    padding: .35rem 1rem!important;
    display: -webkit-box!important;
    display: -webkit-flex!important;
    display: -ms-flexbox!important;
    display: flex!important;
    -webkit-box-align: center!important;
    -webkit-align-items: center!important;
        -ms-flex-align: center!important;
            align-items: center!important;
    color: var(--awb-color5)!important;
    font-size:1rem!important;
    text-transform: uppercase;
}

.calendlyButton i {
    font-size: 1rem!important;
    line-height: 1!important;
    margin: 0!important;
    }
    
.calendlyButton .calendlyText {
    font-family: 'Logo Regular', sans-serif;
    font-size:1rem;
    line-height: 1;
    margin: 0;
}

.awb-menu__i_sub {
    -webkit-padding-end: 0!important;
            padding-inline-end: 0!important;
}
.awb-menu__i_sub i:before{
    font-size:.8rem!important;
}

@container cu_custom_navi_container  (min-width: 100px) {
    p{}
    i.fas {
        margin:0px;
        aspect-ratio: 1 / 1;
    }
    a:has(i.fas) {
        padding:.5rem!important;
    }
     .bonnen_logo,
     .bonnen_claim {
        display:none!important;
    }
    .cu_navi_menu {
        width:auto!important;
    }
    .calendlyText {
        display:none;
    }
    .calendlyButton {
        padding:0px;
        background-color:transparent;
        color: var(--awb-color5);
    }
    
}
@container cu_custom_navi_container  (min-width: 400px) {
    p{}
     .bonnen_logo,
     .bonnen_claim {
        display:-webkit-box!important;
        display:-webkit-flex!important;
        display:-ms-flexbox!important;
        display:flex!important;
    }

}
@container cu_custom_navi_container  (min-width: 1024px) {
    p{}
    i.fas {
        margin-right:.7em!important;
    }
    a:has(i.fas) {
        padding:.5rem!important;
    }
    .calendlyText {
        display:-webkit-box;
        display:-webkit-flex;
        display:-ms-flexbox;
        display:flex;
    }
    .calendlyButton {
        background-color: var(--awb-color5);
        padding: .35rem 1rem;
        color:white;
    }

}



.fusion-image-element:has(.absoluteImage){
    position:absolute;
}
.absoluteImage img{
    max-width:180px;
}
.topLeft {
    top:2rem!important;
    right:2rem!important;
}
/*. hero */

.heroHeadline *{
    font-size: clamp(2rem,6vw,6rem)!important;
}
.heroText *{
    font-size: clamp(1.4rem,2vw,2rem)!important;
}

/* Logo */
.custom_navi .bonnen_logo {
    -webkit-filter: none;
            filter: none;  /* nur für images */
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    font-weight:700!important;
    font-size: clamp(1.1rem, 4vw + -1.056rem, 1.6rem)!important;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    padding:.7rem 0px!important;
}
.custom_navi.fusion-sticky-transition .bonnen_logo {
    padding:.3rem 0px!important;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    font-size: clamp(1rem, 3vw + -1.056rem, 1.4rem)!important;
}
/* ============================================================
   fancy logo animation
   ============================================================ */
.bonnen_logo {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  letter-spacing: 0.1em;
  font-size: clamp(1.2rem, 2vw,1.8rem);
  //text-transform: lowercase;
  font-weight: 600;
  color: #a08d69!important;
}

.logo-char {
  display: inline-block;
  color: transparent!important;
  //color:var(--awb-color5)!important;
  -webkit-transition: color 0.3s ease-in-out;
  transition: color 0.3s ease-in-out;
}

.logo-space {
  width: 0.1rem;
}

/* Zielfarben je nach Header-Klasse */
.fusion-tb-header .logo-char.logo-visible {
  color: #ffffff!important;
}

.fusion-tb-header .logo-char.logo-visible {
  color: #a08d69!important;
}

/* ------------------------------------------------------ Project PostCard -------------------------------------------------------------- */


.projectContainer {
    container-type: inline-size;
	/* Definiert den Container-Typ (inline-size = Breite) */
	container-name: project_container;
	/* Optional: Name für den Container */
    width:100%!important;
    margin:0px!important;
}

.projectContainer>.fusion-builder-row {
    max-width: var(--site_width)!important;
    margin: 0px!important;
    display: grid!important;
    position: relative;
    gap:2rem;
    grid-template-columns: 2fr 1fr;
}
.projectContainer .fusion-builder-row .fusion-layout-column{
    
    margin: 0px!important;
    width:100%;
}

.projectContainer > .fusion-image-element {
    margin:0px!important;
}

.fusion-builder-row.fusion-builder-row-inner:has(.projectContainerNest){
    margin:0px!important;
    width:100%!important;
    max-width:none!important;

}

.projectFeatureContainer {
    container-type: inline-size;
	/* Definiert den Container-Typ (inline-size = Breite) */
	container-name: project_feature_container;
	/* Optional: Name für den Container */
}
.projectFeatureContainer .fusion-builder-row  .projectElement {
    width:100%;
    Xpadding-top:2rem!important;
}
.projectFeatureContainer .fusion-builder-row  .projectElement>div {
    padding-top:2rem!important;
}

.projectFeatureContainer .fusion-builder-row {
    display:grid!important;
    gap:1rem;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr))!important;
    
    max-width: var(--site_width)!important;
    margin: 0px!important;
}



.absuluteImage{
    position: absolute!important;
    margin:0;
    height:auto;
    z-index:99;
}
.absuluteTitel {
    position: absolute!important;
    margin:0;
    height:auto;
    z-index:99;
    color:#fff!important;
    //font-size: clamp( 1.4rem, 5vw +1rem, 5rem)!important;
    line-height:1.1em!important;
    height:auto;
    font-weight:800;
    padding-bottom:2rem;
}
.bottomLeft {
    bottom:1rem;
    left:1rem;
}
.topRight {
    top:2rem;
    right:2rem;
}



@container project_container  (min-width: 100px) {
    p{}
    
    .fusion-builder-row {
        grid-template-columns: 1fr !important;
    }
}

@container project_container  (min-width: 1200px) {
    p{}
    
    .fusion-builder-row {
        grid-template-columns: 2fr 1fr !important;
    }
}




/* -------------------------------- BLOG Mod ------------------------------- */

.blog_elm:hover .blog_titel_date,
.blog_elm:hover .blog_titel_headline *,
.blog_elm:hover .fusion-tb-categories {
    color:white!important;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
._link_azah6_1 {
    --icon-color: var(--color-primary, #579eb0);
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: 3px;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    color: red!important;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: color .3s;
    transition: color .3s;
}
.custom_border {
    border: 1px solid var(--awb-color4);
    border-radius: .35rem;
    padding:1rem;
}




@media(prefers-reduced-motion: no-preference){
    @view-transition {
        navigation:auto;
    }
    #main {
        view-transition-name: page-content;
    }
    ::view-transition-group(page-content){
        -webkit-animation-duration: 1s;
                animation-duration: 1s;  
        -webkit-animation-timing-function: ease-in-out;  
                animation-timing-function: ease-in-out;
    }
    ::view-transition-old(page-content){
        -webkit-animation-name: slide-out;
                animation-name: slide-out;
    }
    ::view-transition-new(page-content){
        -webkit-animation-name: slide-in;
                animation-name: slide-in;
    }
    @-webkit-keyframes slide-out{
        to{
            //translateY:0;
            translate: 100vw;
            -webkit-transform: scale(.8);
                    transform: scale(.8);
        }
    }
    @keyframes slide-out{
        to{
            //translateY:0;
            translate: 100vw;
            -webkit-transform: scale(.8);
                    transform: scale(.8);
        }
    }
    @-webkit-keyframes slide-in{
        from{
            //translateY:0;
            translate: -100vw;
            -webkit-transform: scale(.8);
                    transform: scale(.8);
            //filter: blur(0,0,100);
            //backdrop-filter: blur(100px);
        }
    }
    @keyframes slide-in{
        from{
            //translateY:0;
            translate: -100vw;
            -webkit-transform: scale(.8);
                    transform: scale(.8);
            //filter: blur(0,0,100);
            //backdrop-filter: blur(100px);
        }
    }
}

/* check-list */

.fusion-li-item-content {
    line-height: 1.3!important;
    margin: .35rem 0px!important;
}

.counter-box-container {
    border:0px!important;
    border-radius:.5rem!important;
    background-color: var(--awb-color3)!important;

}
.content-box-counter span{
    color: var(--awb-color5)!important;
    font-weight: 900!important;
}
.display-counter {
    padding-right:.6rem!important;
}


/* ---------------------------  Mobile Navi ----------------*/

.calendly_button_mobile {
    position: relative!important;
}
.mobile_nav .menu-item ul{
    margin-bottom:1rem!important;

}
.mobile_nav .menu-item li a{
    margin-left:0px!important;
    padding-left:0px!important;

}
.mobile_nav .menu-item li a span.awb-menu__i {
    padding-right:.5rem!important;
}


/* ---------------- HERO --------------- */

.XXhero {
    container-type: inline-size;
	container-name: cu_custom_hero;

}

@container cu_custom_hero  (min-width: 100px) {
    p{}
    .hero {
        //background-position-x: calc(100vw - 10%)!important;
    }


}


.fusion-form-checkbox label:before { 
    margin:0px!important;
    padding:0px!important;
    -webkit-transform: translateY(0)!important;
        -ms-transform: translateY(0)!important;
            transform: translateY(0)!important;
    top:.5rem!important;
}



/* form */
.fusion-alert .alert-icon, .fusion-alert .fusion-alert-content {
    color: #a08d69!important;
}
.fusion-alert.alert-success.success {
    --awb-background-color: #ded7c8!important;
    --awb-accent-color: #a08d69!important;
    border-radius:.35rem!important;
}

.fusion-form-form-wrapper .fusion-form-field .fusion-form-checkbox input:checked+label:after,
.fusion-form-form-wrapper .fusion-form-field .fusion-form-checkbox input:checked+label:before {
    content: "";
    Xtop: .5rem!important;
    Xtransform: translateY(.5rem)!important;
}
.fusion-form-form-wrapper .fusion-form-field .fusion-form-checkbox input:checked+label:after{
    content: "";
    top: 1!important;
    -webkit-transform: translateY(10)!important;
        -ms-transform: translateY(10)!important;
            transform: translateY(10)!important;
}
.fusion-form-form-wrapper .fusion-form-field .label, 
.fusion-form-form-wrapper .fusion-form-field label {
    Xdisplay: flex!important;
}


.fusion-form-form-wrapper .fusion-form-field .fusion-form-checkbox {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align:start!important;
    -webkit-align-items:flex-start!important;
        -ms-flex-align:start!important;
            align-items:flex-start!important;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
}
.fusion-form-form-wrapper .fusion-form-field .fusion-form-checkbox input:checked + label::after {
    top: 6px!important;
    -webkit-transform: translateY(6px)!important;
        -ms-transform: translateY(6px)!important;
            transform: translateY(6px)!important;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}