/* ---------------------------------------------------------------------------------------------------- */

          :root { --normal: 1640px; --wide: 1920px; --gridA: 4.86453201970443%; --gridB: 1.47783251231527%; }

          body { moz-hyphens: auto; -o-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }

          header { border-bottom: 2px solid var(--wp--preset--color--custom-hellgrau); }

     @media only screen and (max-width: 467px)
     {
          .wp-block-site-logo img { max-width: 70% }
     }

     @media only screen and (max-width: 900px)
     {
          .wp-block-navigation { display: none; }
          .wp-block-navigation__responsive-container-open { display: block !important; }
          .hideonmobile { display: none; }
     }

     @media only screen and (max-width: 467px)
     {
          .nosmallscreen { display: none !important; }
     }

     @media only screen and (min-width: 468px)
     {
          .nobigscreen { display: none !important; }
     }

          ul.wp-block-navigation__container > li.current-menu-item > a,
          ul.wp-block-navigation__container > li > ul > li.current-menu-item > a,
          ul.wp-block-navigation__container > li.current-menu-parent > a,
          ul.wp-block-navigation__container > li > a.current-menu-ancestor {
          font-weight: bold !important;
          }

          .wp-block-navigation .wp-block-navigation__submenu-container { border: 0px solid #000000 !important; }
          .wp-block-navigation .wp-block-navigation__submenu-container li:first-child { padding-top: 0.6em; }
          .wp-block-navigation .wp-block-navigation__submenu-container li:last-child { padding-bottom: 0.6em; }
          .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item a { padding: 0.2em 1em !important; }

          @media only screen and (max-width: 799px) {
/*
     #XXmodal-1 { max-width: 70% !important; margin: 0 auto !important; }    
     .XXwp-block-navigation__responsive-dialog { background-color: #00ffff; max-width: 90% !important; margin: 0 auto !important; }    
     #XXmodal-1-content { background-color: #c0c0c0; max-width: 70% !important; margin: 0 auto !important; }    
          #modal-1-content ul { max-width: 80vw; }    
*/
          #modal-1 { background-color: var(--wp--preset--color--custom-dunkelblau) !important; color: #ffffff !important; }    
          #modal-1 .wp-block-navigation__submenu-container { padding: 0 !important; }
          #modal-1 .wp-block-navigation-item { font-size: 1.4rem !important; }
          #modal-1 .wp-block-navigation-item__content { color: #ffffff !important; }
          a.wp-block-navigation-item__content { font-size: var(--wp--preset--font-size--medium); }
          }

          .wp-element-button { border: 0; transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out; text-decoration: none !important; }
          .wp-element-button:hover { background-color: var(--wp--preset--color--custom-dunkelblau) !important; color: #ffffff !important; text-decoration: none !important; }

          .wp-block-list { margin-left: -20px; }
          .wp-block-list li { font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.375), 1.25rem); }

          header a, .layoutgrid a, footer a { text-decoration: none; }
          header a:hover, .layoutgrid a:hover, footer a:hover { text-decoration: underline; }

          .special.is-layout-flex { flex-wrap: wrap !important; }

/* ---------------------------------------------------------------------------------------------------- */

          .background, .photo01, .photo02, .photo03, .photo04, .photo05, .photo06, .text01, .text02, .text03, .text04 { margin-block-start: 0 !important; }

          .background { background-color: var(--wp--preset--color--custom-hellgrau) !important; }

     @media only screen and (max-width: 467px)
     {
          .wp-block-button,.wp-block-button__link { width: 100%; }
     }
     @media only screen and (max-width: 799px)
     {
          .distance32 { height: 16px; margin-bottom: -1rem !important; }
          .distance96 { height: 48px; margin-bottom: -1rem !important; }
          .background { padding-top: 48px; padding-bottom: 48px; }
          .photo02 .wp-block-column:nth-child(2) { margin-left: -2rem; margin-right: -2rem; }
          .photo03 .wp-block-column:nth-child(1) { padding-top: 48px; padding-bottom: 48px; }
          .photo03 .wp-block-column:nth-child(2) { margin-left: -2rem; margin-right: -2rem; }
          .photo04 .wp-block-column:nth-child(1) { margin-left: -2rem; margin-right: -2rem; }
          .photo04 .wp-block-column:nth-child(2) { padding-top: 48px; padding-bottom: 48px; }
     }
     @media only screen and (min-width: 800px)
     {
          .distance32 { height: 32px; margin-bottom: -1rem !important; }
          .distance96 { height: 96px; margin-bottom: -1rem !important; }
          .background { padding-top: 96px; padding-bottom: 96px; }
     }
     
     @media (max-width: 799px)
     {
          div.reverse { flex-direction: column-reverse; }
          div.reverse .wp-block-column:nth-child(2).is-vertically-aligned-bottom { width: auto; }
     }

          .photo01 figure { margin-bottom: -1rem !important; }

     @media only screen and (min-width: 1920px)
     {
          .photo01 figure { max-width: var(--wide) !important; margin-left: auto !important; margin-right: auto !important; }
     }

     @media only screen and (min-width: 800px)
     {

/*
          .layoutgrid { background-image: url('layoutgrid.png'); background-repeat: repeat-y; background-size: 100% auto; background-position: top left; }
          .layoutgrid { padding-bottom: 20px; }
*/

          .layoutgrid .wp-block-columns { display: flex !important; gap: 0 !important; margin: 0 !important; padding: 0 !important; }
          .layoutgrid .wp-block-column { padding: 0 !important; }
          .layoutgrid2 { background-image: url('layoutgrid.png'); background-repeat: repeat-y; background-size: 100% auto; background-position: top left; }

          .photo02 .wp-block-column:nth-child(1) {
          margin-left:  0;
          flex-basis:   calc(6 * var(--gridA) + 5 * var(--gridB)); max-width: calc(6 * var(--gridA) + 5 * var(--gridB));
          margin-right: 0;
          }
          .photo02 .wp-block-column:nth-child(2) {
          display:      flex;
          flex-grow:    1;
          align-items:  stretch;	
          margin-left:  calc(0 * var(--gridA) + 1 * var(--gridB));
          flex-basis:   calc(10 * var(--gridA) + 9 * var(--gridB));
          margin-right: -2rem;
          }
          @media (min-width: 1640px) and (max-width: 1920px) { .photo02 .wp-block-column:nth-child(2) { margin-right: calc( ( ( var(--normal) - 100vw ) / 2 ) + 2rem ); } }
          @media (min-width: 1920px)                         { .photo02 .wp-block-column:nth-child(2) { margin-right: calc((var(--normal) - var(--wide)) / 2); } }
                                                               .photo02 .wp-block-column:nth-child(2) img { width: 100% !important; height: 100% !important; object-fit: cover !important;}

          .photo03 .wp-block-column:nth-child(1) {
          margin-left:  calc(1 * var(--gridA) + 1 * var(--gridB));
          flex-basis:   calc(6 * var(--gridA) + 5 * var(--gridB)); max-width: calc(6 * var(--gridA) + 5 * var(--gridB));
          margin-right: calc(1 * var(--gridA) + 1 * var(--gridB));
          }
          .photo03 .wp-block-column:nth-child(2) {
          display:      flex;
          flex-grow:    1;
          align-items:  stretch;	
          margin-left:  0;
          flex-basis:   calc(8 * var(--gridA) + 8 * var(--gridB));
          margin-right: -2rem;
          }
          @media (min-width: 1640px) and (max-width: 1920px) { .photo03 .wp-block-column:nth-child(2) { margin-right: calc( ( ( var(--normal) - 100vw ) / 2 ) + 2rem ); } }
          @media (min-width: 1920px)                         { .photo03 .wp-block-column:nth-child(2) { margin-right: calc((var(--normal) - var(--wide)) / 2); } }
                                                               .photo03 .wp-block-column:nth-child(2) img { width: 100% !important; height: 100% !important; object-fit: cover !important; }

          .photo04 .wp-block-column:nth-child(1) {
          display:      flex;
          flex-grow:    1;
          align-items:  stretch;	
          margin-left:  -2rem;
          flex-basis:   calc(8 * var(--gridA) + 8 * var(--gridB));
          margin-right: 0;
          }
          @media (min-width: 1640px) and (max-width: 1920px) { .photo04 .wp-block-column:nth-child(1) { margin-left: calc( ( ( var(--normal) - 100vw ) / 2 ) + 2rem ); } }
          @media (min-width: 1920px)                         { .photo04 .wp-block-column:nth-child(1) { margin-left: calc((var(--normal) - var(--wide)) / 2); } }
                                                               .photo04 .wp-block-column:nth-child(1) img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
          .photo04 .wp-block-column:nth-child(2) {
          margin-left:  calc(1 * var(--gridA) + 1 * var(--gridB));
          flex-basis:   calc(6 * var(--gridA) + 5 * var(--gridB)); max-width: calc(6 * var(--gridA) + 5 * var(--gridB));
          margin-right: calc(1 * var(--gridA) + 1 * var(--gridB));
          }

          .photo05 .wp-block-column:nth-child(1) {
          margin-left:  calc(4 * var(--gridA) + 4 * var(--gridB));
          flex-basis:   calc(4 * var(--gridA) + 3 * var(--gridB));
          margin-right: 0;
          }
          .photo05 .wp-block-column:nth-child(2) {
          margin-left:  calc(1 * var(--gridA) + 2 * var(--gridB));
          flex-basis:   calc(5 * var(--gridA) + 4 * var(--gridB));
          margin-right: calc(2 * var(--gridA) + 2 * var(--gridB));
          }

          .photo06 .wp-block-column:nth-child(1) {
          margin-left:  calc(1 * var(--gridA) + 1 * var(--gridB));
          flex-basis:   calc(4 * var(--gridA) + 3 * var(--gridB));
          margin-right: 0;
          }
          .photo06 .wp-block-column:nth-child(2) {
          margin-left:  calc(1 * var(--gridA) + 2 * var(--gridB));
          flex-basis:   calc(5 * var(--gridA) + 4 * var(--gridB));
          margin-right: 0;
          }
          .photo06 .wp-block-column:nth-child(3) {
          margin-left:  calc(0 * var(--gridA) + 1 * var(--gridB));
          flex-basis:   calc(5 * var(--gridA) + 4 * var(--gridB));
          margin-right: 0;
          }

          .photo07 .wp-block-column:nth-child(1) {
          margin-left:  calc(6 * var(--gridA) + 6 * var(--gridB));
          flex-basis:   calc(5 * var(--gridA) + 4 * var(--gridB));
          margin-right: 0;
          }
          .photo07 .wp-block-column:nth-child(2) {
          margin-left:  calc(0 * var(--gridA) + 1 * var(--gridB));
          flex-basis:   calc(5 * var(--gridA) + 4 * var(--gridB));
          margin-right: 0;
          }

          .photo08 .wp-block-column:nth-child(1) {
          margin-left:  calc(1 * var(--gridA) + 1 * var(--gridB));
          flex-basis:   calc(6 * var(--gridA) + 6 * var(--gridB));
          margin-right: 0;
          }
          .photo08 .wp-block-column:nth-child(2) {
          margin-left:  calc(1 * var(--gridA) + 1 * var(--gridB));
          flex-basis:   calc(6 * var(--gridA) + 6 * var(--gridB));
          margin-right: calc(2 * var(--gridA) + 1 * var(--gridB));
          }

          .text01 .wp-block-column:nth-child(1) {
          margin-left:  calc(4 * var(--gridA) + 4 * var(--gridB));
          flex-basis:   calc(8 * var(--gridA) + 7 * var(--gridB));
          margin-right: calc(4 * var(--gridA) + 4 * var(--gridB));
          }

          .text02 .wp-block-column:nth-child(1) {
          margin-left:  calc(1 * var(--gridA) + 1 * var(--gridB));
          flex-basis:   calc(4 * var(--gridA) + 3 * var(--gridB));
          margin-right: 0;
          text-align:   right;
          }
          .text02 .wp-block-column:nth-child(2) {
          margin-left:  calc(1 * var(--gridA) + 2 * var(--gridB));
          flex-basis:   calc(8 * var(--gridA) + 7 * var(--gridB));
          margin-right: calc(2 * var(--gridA) + 2 * var(--gridB));
          }

          .text03 .wp-block-column:nth-child(1) {
          margin-left:  calc(1 * var(--gridA) + 1 * var(--gridB));
          flex-basis:   calc(5 * var(--gridA) + 4 * var(--gridB));
          margin-right: 0;
          text-align:   right;
          }
          .text03 .wp-block-column:nth-child(2) {
          margin-left:  calc(1 * var(--gridA) + 2 * var(--gridB));
          flex-basis:   calc(7 * var(--gridA) + 6 * var(--gridB));
          margin-right: calc(2 * var(--gridA) + 2 * var(--gridB));
          }

          .text04 .wp-block-column:nth-child(1) {
          margin-left:  calc(1 * var(--gridA) + 1 * var(--gridB));
          flex-basis:   calc(6 * var(--gridA) + 5 * var(--gridB));
          margin-right: 0;
          text-align:   right;
          }
          .text04 .wp-block-column:nth-child(2) {
          margin-left:  calc(1 * var(--gridA) + 2 * var(--gridB));
          flex-basis:   calc(7 * var(--gridA) + 6 * var(--gridB));
          margin-right: calc(1 * var(--gridA) + 1 * var(--gridB));
          }

     }

     @media (min-width: 468px) {
          .box01 .is-layout-grid .wp-block-group {
          min-height: 10rem !important;
          }
          .box02 .is-layout-grid .wp-block-group {
          min-height: 15rem !important;
          }
     }

          .box01 .is-layout-grid .wp-block-group:hover {
          background-color: var(--wp--preset--color--custom-hellblau) !important;
          color: var(--wp--preset--color--custom-dunkelblau) !important;
          }
          .box01 .is-layout-grid .wp-block-group a {
          text-decoration: none !important;
          }
          .box01 .is-layout-grid .wp-block-group a:hover {
          color: var(--wp--preset--color--custom-dunkelblau) !important;
          text-decoration: underline !important;
          }

/* ---------------------------------------------------------------------------------------------------- */

     .wpcf7-form label { margin: 1.0rem 0 0.5rem 0 !important; }

     .wpcf7-form input[type="text"],
     .wpcf7-form input[type="email"],
     .wpcf7-form select,
     .wpcf7-form textarea
     {
     display: block;
     width: 90% !important;
     margin: 0.25rem 0 0.25rem 0 !important;
     padding: 0.75rem 0.75rem 0.75rem 1rem !important;
     border: 1px solid var(--wp--preset--color--custom-dunkelblau) !important;
     font-family: var(--wp--preset--font-family--montserrat-thin); 
     }

     .wpcf7-form input[type="checkbox"] { margin-right: 0.5rem !important; }
     .wpcf7-form select { width: 100%; }
     .wpcf7-form textarea { height: 10rem !important; }

     .wpcf7-form input[type="submit"]
     {
     border-top-left-radius: 0;
     border-top-right-radius: 0;
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
     padding-top: 16px;
     padding-right: 32px;
     padding-bottom: 16px;
     padding-left: 32px;	 
     text-decoration: none !important;
     background-color: var(--wp--preset--color--custom-hellblau) !important;
     transition: background-color 0.3s ease-in-out;
     border: 1px solid var(--wp--preset--color--custom-hellblau) !important; 
     color: var(--wp--preset--color--custom-dunkelblau) !important;
     font-family: var(--wp--preset--font-family--montserrat-thin);
     font-weight: 500;
     font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.375), 1.25rem);
     letter-spacing: 1px;
     text-transform: uppercase;
     line-height: inherit;
     }

     .wpcf7-form input[type="submit"]:hover
     {
     background-color: #ffffff !important;
     border: 1px solid var(--wp--preset--color--custom-dunkelblau) !important; 
     }

     .wpcf7-form input:active,
     .wpcf7-form input:focus,
     .wpcf7-form select:active,
     .wpcf7-form select:focus,
     .wpcf7-form textarea:active,
     .wpcf7-form textarea:focus
     {
     border: 1px solid var(--wp--preset--color--custom-dunkelblau) !important;
     }

     .wpcf7-form-control { font-family: var(--wp--preset--font-family--montserrat-thin); }
     .wpcf7-form .control { font-size: 0.9rem; }
     .wpcf7-list-item { margin: 0 !important; display: block !important; }

      button:focus { outline: 0 !important; }

     *:focus:not(:focus-visible) { outline: none }
     *:focus-visible { outline: 2px dashed currentColor; outline-offset: 2px; }      

/* ---------------------------------------------------------------------------------------------------- */

     @media (min-width: 468px) {
     .slick-prev { left: -50px; }
     .slick-next { right: -40px; }
     .slick-next::before, .slick-prev::before { font-size: 30px; }
     }   
     .wp-block-cb-carousel .slick-prev::before, .wp-block-cb-carousel .slick-next::before, .slick-dots li button::before { color: var(--wp--preset--color--custom-dunkelblau); }
     .slick-dots { bottom: -40px; }
     .wp-block-cb-slide .wp-block-group { min-height: 200px !important; }
     .wp-block-cb-slide .wp-block-group:hover { background-color: var(--wp--preset--color--custom-hellblau) !important; }
     .wp-block-cb-slide .wp-block-group a:hover { color: var(--wp--preset--color--custom-dunkelblau) !important; }

/*
     .sp-ea-one.sp-easy-accordion .sp-ea-single .ea-header a, .ea-body { padding-left: 0 !important; }
*/

     details summary { list-style: none; display: flex; justify-content: space-between; align-items: flex-start; cursor: pointer; padding: 0; font-weight: bold; user-select: none; outline: none; }
     details summary::after { content: "+"; font-size: 24px; font-weight: bold; transition: transform 1.3s ease; margin-top: -2px; }
     details[open] summary::after { content: "−"; }
     details p { margin-block-start: 0 !important; }

/* ---------------------------------------------------------------------------------------------------- */
/*
     E   F  =>  alle        F innerhalb E (Kind)
     E > F  =>  alle ersten F innerhalb E (Kind)
     E + F  =>       erstes F hinter    E (Nachbar)
     E ~ F  =>  alle ersten F hinter    E (Nachbar)
     https://www.toptal.com/designers/htmlarrows/arrows/
*/