/* ==========================================================================
   Override
   ========================================================================== */
   .accordion-item{
     border: 0px !important;
     border-bottom: 1px solid #F6F7FA !important;
    }
   .accordion-button:not(.collapsed){
     background: white !important;
     border-radius: 0px !important;
     border: 0px !important;
     box-shadow: none !important;
    }
    .fui-input:focus{
      box-shadow: none !important;
    }
   .accordion-button:focus, .fui-submit:focus, .fui-submit:active{
     box-shadow: none !important;
     border: none !important;
    }
    .accordion-button:focus{
      z-index: 2 !important;
    }
   .accordion-button::after{
     background-image: url('/uploads/Icons/open-container.svg') !important;
    }
   .accordion-button:not(.collapsed)::after{
     background-image: url('/uploads/Icons/close-container.svg') !important;
    }
   :focus-visible {
      outline: none !important;
    }
   .form-control:focus {
     outline: 0;
     box-shadow: none !important;
     border-color: #fff !important;
    }

/* ==========================================================================
   Allgemein
   ========================================================================== */
   .max-width{
     max-width: 1400px;
     padding-left: 1rem !important;
     padding-right: 1rem !important;
   }

   .max-width-left{
     padding-left: calc((100% - 1400px) / 2 + 1rem);
   }
   hr.solid{
     border-top: 7px solid #459e98;
     opacity: 1 !important;
   }
   .cursor-pointer{
     cursor: pointer;
   }
   .border-radius-small{
     border-radius: 4px !important;
   }
   .border-radius-big{
     border-radius: 12px;
   }
   .border-light-gray{
     border-color: #707070;
   }
   .vh-50{
     height: 50vh;
   }
   .vh-75{
    height: 75vh;
    }
    .min-vh-60{
        min-height: 60vh;
    }
   .gird-container-4 {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
     grid-template-rows: 1fr;
     gap: 1em 1em;
   }
   .gird-container-3 {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
     grid-template-rows: 1fr;
     gap: 3em 1em;
   }
   .bewertung .gird-container-2{
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
   }
   .gird-container-2 {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
     grid-template-rows: 1fr;
     gap: 1em 1em;
   }
   .mt-n4 {
      margin-top: -6rem !important;
    }
   .mt-n5 {
      margin-top: -12rem !important;
    }
    nav ul li{
      list-style-type: none;
    }
    /*
    .grecaptcha-badge { visibility: hidden; }
    */
    .hyphens{
        hyphens: auto;
    }
/* ==========================================================================
  Navigation
  ========================================================================== */

  .navigation-link .navigation-tab{
    position: relative;
  }
  .navigation-tab:before{
    content: "";
    position: absolute;
    width: 0;
    max-width: 70%;
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #FFF;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
  }
  .navigation-tab:hover:before {
    visibility: visible !important;
    width: 100% !important;
  }
  .navigation-main-icons{
    max-width: 50px;
    max-height: 50px;
  }
  .sticky-container-button.collapsed img{
    transform: rotate(0deg);
    transition: 0.3s;
  }
  .sticky-container-button img{
    transform: rotate(180deg);
    transition: 0.3s;
  }
  .mobile-navigation-title .haupt-menu-icon{
    transform: rotate(270deg) !important;
    transition: 0.3s;
  }
  .mobile-navigation-title.collapsed .haupt-menu-icon{
    transform: rotate(90deg) !important;
    transition: 0.3s;
  }

/* ==========================================================================
  Side Navigation
  ========================================================================== */
 .side-navigation li img{
   width: 20px;
 }
/* ==========================================================================
  Hover Scale Effect
  ========================================================================== */

    .hover-scale {
      transform: scale(1);
      transition: 0.3s;
    }
    .hover-scale:hover{
      transform: scale(1.03);
      transition: 0.3s;
    }
/* ==========================================================================
  Images Hover Effect
  ========================================================================== */
    .zoom-hover-image {
      -webkit-transition: all .5s;
      -moz-transition: all .5s;
      -o-transition: all .5s;
      transition: all .5s;
    }
    .parent-hover-zoom:hover .zoom-hover-image, .parent-hover-zoom:focus .zoom-hover-image {
      -ms-transform: scale(1.05);
      -moz-transform: scale(1.05);
      -webkit-transform: scale(1.05);
      -o-transform: scale(1.05);
      transform: scale(1.05);
    }

/* ==========================================================================
   Gradient Text
   ========================================================================== */

   .livingtechFontGradient:hover h3, .livingtechFontGradient:hover a , .livingtechFontGradient:hover p{
   --bg-size: 400%;
   --color-one: hsl(225, 29%, 97%);
   --color-two: hsl(176, 41%, 45%);
   background: linear-gradient(
       90deg,
       var(--color-one),
       var(--color-two),
       var(--color-one)
     )
     0 0 / var(--bg-size) 100%;
     background-clip: text;
    -webkit-background-clip: text;
    color: transparent !important;
    transition: 0.3s;
 }
 @media (prefers-reduced-motion: no-preference) {
   .livingtechFontGradient h3, .livingtechFontGradient a, .livingtechFontGradient p{
     animation: move-bg 8s linear infinite;
   }
   @keyframes move-bg {
     to {
       background-position: var(--bg-size) 0;
     }
   }
 }

/* ==========================================================================
  Separator Animation
  ========================================================================== */
    .trans-grow{
      -webkit-transition: width 1s ease-out; /* For Safari 3.1 to 6.0 */
      transition: width 1s  ease-out;
      width : 0%;
    }
    .grow{
      width:100%;
    }
    .hr{
      margin-left:0;
    }
/* ==========================================================================
  Fade In Effect
  ========================================================================== */
    .fadein {
      opacity: 0;
      -moz-transition: opacity 2s;
      -webkit-transition: opacity 2s;
      -o-transition: opacity 2s;
      transition: opacity 2s;
    }

    body.loaded.fadein {
      opacity: 1;
    }
/* ==========================================================================
  Sticky Logo
  ========================================================================== */
    header .main-logo{
      width: 190px;
      transition: 0.3s;
    }
    .sticky .main-logo{
      width: 131px;
      transition: 0.3s;
      }
    .sticky-container > div button{
      height: 250px;
    }

/* ==========================================================================
   Fonts
   ========================================================================== */
   p, .p, li, textarea, .fui-alert{
     font-size: 1.125rem !important;
     line-height: 1.5rem !important;
     font-family: 'Montserrat Light';
     margin-bottom: 0px !important;
   }
   a{
     text-decoration: none !important;
   }
   h1{
     font-size: 3.125rem !important;
     line-height: 3.125rem !important;
     margin-bottom: 0px !important;
   }
   h2, .h2{
     font-size: 2.125rem !important;
     line-height: 1.2 !important;
     font-family: 'Montserrat Medium';
     margin-bottom: 0px !important;
   }
   h3{
     font-size: 1.5rem !important;
     line-height: 1.5rem !important;
   }
   h4, .h4{
     font-size: 1.375rem !important;
     line-height: 1.5rem !important;
   }
   h5{
     font-size: 1rem !important;
     line-height: 1.375rem !important;
   }
   @font-face {
     font-family: 'Montserrat Thin';
     src: url('/fonts/Montserrat-Thin.ttf');
     font-display: swap;
   }
   @font-face {
     font-family: 'Montserrat ExtraLight.ttf';
     src: url('/fonts/Montserrat-ExtraLight.ttf.ttf');
     font-display: swap;
   }
   @font-face {
     font-family: 'Montserrat Light';
     src: url('/fonts/Montserrat-Light.ttf');
     font-display: swap;
   }
   @font-face {
     font-family: 'Montserrat Regular';
     src: url('/fonts/Montserrat-Regular.ttf');
     font-display: swap;
   }
   @font-face {
     font-family: 'Montserrat Medium';
     src: url('/fonts/Montserrat-Medium.ttf');
     font-display: swap;
   }
   @font-face {
     font-family: 'Montserrat SemiBold';
     src: url('/fonts/Montserrat-SemiBold.ttf');
     font-display: swap;
   }
   @font-face {
     font-family: 'Montserrat Bold';
     src: url('/fonts/Montserrat-Bold.ttf');
     font-display: swap;
   }
   @font-face {
     font-family: 'Montserrat ExtraBold';
     src: url('/fonts/Montserrat-ExtraBold.ttf');
     font-display: swap;
   }
   @font-face {
     font-family: 'Montserrat Black';
     src: url('/fonts/Montserrat-Black.ttf');
     font-display: swap;
   }
   .montserrat-Thin{
     font-family: 'Montserrat Thin';
   }
   .montserrat-ExtraLight{
     font-family: 'Montserrat ExtraLight';
   }
   .montserrat-Light{
     font-family: 'Montserrat Light';
   }
   .montserrat-Regular{
     font-family: 'Montserrat Regular';
   }
   .montserrat-Medium{
     font-family: 'Montserrat Medium';
   }
   .montserrat-SemiBold{
     font-family: 'Montserrat SemiBold';
   }
   .montserrat-Bold{
     font-family: 'Montserrat Bold';
   }
   .montserrat-ExtraBold{
     font-family: 'Montserrat ExtraBold';
   }
   .montserrat-Black{
     font-family: 'Montserrat Black';
   }
   .letter-spacing{
     letter-spacing: 2px;
   }
   .truncate-text-big{
     max-height: 6rem;
     -webkit-box-orient: vertical;
     display: block;
     display: -webkit-box;
     overflow: hidden !important;
     text-overflow: ellipsis;
     -webkit-line-clamp: 4;
   }
   .truncate-text-small{
     max-height: 3rem;
     -webkit-box-orient: vertical;
     display: block;
     display: -webkit-box;
     overflow: hidden !important;
     text-overflow: ellipsis;
     -webkit-line-clamp: 2;
   }

 /* ==========================================================================
    Colors - B&W
    ========================================================================== */
    .color-white{
      color: #fff;
    }
    .background-white{
      background-color: #fff;
    }
    .color-black{
      color: #000;
    }
    .background-black{
      background-color: #000;
    }
    .color-light-gray{
      color: #F6F7FA;
    }
    .background-light-gray{
      background-color: #F6F7FA;
    }
    .color-dark-gray{
      color: rgba(0,0,0,.5);
    }
    .background-dark-gray{
      background-color: rgba(0,0,0,.5);
    }
    .background-azureish{
      background-color: #daf1f0;
    }
    .background-white-light-gray-gradient{
      background: rgb(0,0,0);
      background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(246,247,250,1) 30%);
    }
 /* ==========================================================================
    Colors - Allgemein
    ========================================================================== */
    .color-zomp{
      color: #459e98;
    }
    .background-zomp{
      background-color: #459e98;
      transition: 0.3s;
    }
    .hover-zomp:hover{
      transition: 0.3s;
      background-color: #459e98;
    }
    .hover-zomp:hover h3, .hover-zomp:hover p{
      color: #fff;
      transition: 0.3s;
    }
    .color-yankees{
      color: #222343;
    }
    .background-yankees{
      background-color: #222343;
    }
    .background-dark-blue{
      background-color: #212236;
    }
 /* ==========================================================================
    Background Image
    ========================================================================== */
    .background-cover{
      background-size: cover !important;
    }
    .background-contain{
      background-size: contain;
    }
    .background-no-repeat{
      background-repeat: no-repeat;
    }
    .background-position-center{
      background-position: center center !important;
    }
    .background-position-botom{
      background-position: center bottom;
    }
    .background-minus-position{
      background-position-y: -400px !important;
    }
    .background-plus-position{
      background-position-y: 250px !important;
    }
    .filter-invert{
      filter: invert(1);
    }
/* ==========================================================================
   Background Gradient
   ========================================================================== */
   .gradient-radial-background{
     background: rgb(68,163,157);
     background: radial-gradient(circle, rgba(68,163,157,1) 0%, rgba(37,42,72,1) 100%);
   }
   @keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
  }
  .gradient {
    --size: 250px;
    --speed: 50s;
    --easing: cubic-bezier(0.8, 0.2, 0.2, 0.8);
    filter: blur(calc(var(--size) / 5));
    background-image: linear-gradient(rgb(39, 38, 57), #53767f, #374F54);
    animation: rotate var(--speed) var(--easing) alternate infinite;
    border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;
  }

  @media (min-width: 720px) {
    .gradient {
      --size: 1920px;
    }
  }

 /* ==========================================================================
   Buttons
   ========================================================================== */
   .button-home {
    border: 2px solid #fff;
    border-radius: 4px;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    outline: none;
    touch-action: manipulation;
    transition: box-shadow .2s,-ms-transform .1s,-webkit-transform .1s,transform .1s;
    user-select: none;
    -webkit-user-select: none;
    transition: 0.3s;
    background-color: #ffffff00 !important;
    color: #fff;
  }
  .button-home a{
    color: #fff;
  }
  .button-home:focus-visible {
    box-shadow: #222222 0 0 0 2px, rgba(255, 255, 255, 0.8) 0 0 0 4px;
    transition: box-shadow .2s;
    background-color: #fff !important;
  }

  .button-home:active {
    background-color: #F7F7F7;
    border-color: #fff;
    transform: scale(.96);
  }

  .button-home:hover {
    background-color: #fff !important;
    border-color: #fff;
    color: #000;
    transition: 0.3s;
  }

  .button-home:disabled {
    border-color: #DDDDDD;
    color: #DDDDDD;
    cursor: not-allowed;
    opacity: 1;
  }

  /* ==========================================================================
    Header
    ========================================================================== */
    #offcanvasMenu a, #offcanvasMenuMobile a{
      color: white;
    }
    .btn-close{
      transition: 0.3s;
      background-image: url('/uploads/Icons/close.svg') !important;
    }
    .close-button-box:hover .btn-close{
      transform: rotate(90deg);
      transition: 0.3s;
    }
    .hamburger-menu rect{
      transition: 0.3s;
    }
    .hamburger-menu:hover .hamburger-line-1{
      transform: translate(6px) rotate(90deg);
      transition: 0.3s;
    }
    .hamburger-menu:hover .hamburger-line-2{
      transform: translate(28px, 9px) rotate(90deg);
      transition: 0.3s;
    }
    .hamburger-menu:hover .hamburger-line-3{
      transform: translate(39px) rotate(90deg);
      transition: 0.3s;
    }
    .main-logo{
      transition: 0.3s;
    }

  /* ==========================================================================
    Footer
    ========================================================================== */
    .footer-person-image{
      transition: 0.3s;
    }
    .footer-kontakt-person:hover .footer-person-image{
      transition: 0.3s;
      transform: scale(1.1);
    }
    .newsletter .fui-form-container .fui-page{
      width: 100% !important;
      padding-right: 3rem !important;
      display: flex !important;
    }
    .newsletter .fui-form-container .fui-page .fui-btn{
      width: 100% !important;
    }
    .newsletter .fui-form-container .fui-page .fui-page-container{
      width: 60%;
      margin-right: 1rem;
    }
    .newsletter .fui-form-container .fui-page .fui-btn-wrapper{
      width: 40%;
      padding: 0px !important;
    }
    .newsletter .fui-form-container .fui-page .fui-page-container .fui-input{
      border: 2px solid white !important;
      border-radius: 5px !important;
      padding: 1rem !important;
    }
    .newsletter .fui-form-container .fui-page .fui-page-container .fui-input::placeholder{
      color: white !important;
      letter-spacing: 2px;
    }
    .newsletter .fui-form-container .fui-page .fui-btn-wrapper .fui-btn{
      height: 100% !important;
      background-color: #459e98;
      text-transform: uppercase!important;
      align-items: center!important;
      border: 0!important;
      font-family: 'Montserrat SemiBold';
      letter-spacing: 2px;
    }
    .footer-social-media-icons{
      width: 20px;
      height: 20px;
    }
    .kontakt-button .fui-btn, .karriere .fui-btn{
        padding-right: 3rem!important;
        padding-left: 3rem!important;
        padding-top: 1rem!important;
        padding-bottom: 1rem!important;
        border-radius: var(--bs-border-radius-sm)!important;
        text-transform: uppercase!important;
        align-items: center!important;
        border: 0!important;
        background-color: #459e98 !important;
        font-family: 'Montserrat SemiBold';
        letter-spacing: 2px;
    }
    .cc-banner.cc-bottom, .cc-window{
        background: radial-gradient(circle, rgba(68,163,157,1) 0%, rgba(37,42,72,1) 100%) !important;
    }

    /*  ==========================================================================
    Datenschutzerklaerung
    ========================================================================== */

    .newsPost h3{
        font-size: 2.2rem !important;
        line-height: 2.2rem !important;
    }

    .datenschutz .datenschutzContainer a{
        text-decoration: none !important;
        color: #fff !important;
    }

    .datenschutz .my-3{
        margin-top: 2rem !important;
        margin-bottom: 1rem;
    }

    .datenschutz .accordion-item:first-of-type .accordion-button.collapsed, .datenschutz .accordion-item:first-of-type{
        border-radius: 0 !important;
    }

    .datenschutz .accordion-item.datenschutz-border{
        border-top: 1px solid #ffffff25 !important;
    }

    .datenschutz .accordion-item:first-of-type .accordion-button{
        border-top-left-radius: 0.375rem !important;
        border-top-right-radius: 0.375rem !important;
    }

    .datenschutz .accordion-button.collapsed{
        background: transparent !important;
        transition: 0.3s;
    }

    .datenschutz .accordion-button, .accordion-collapse.collapse.show, .accordion-collapse.collapsing{
        background: #459e98 !important;
        transition: 0.3s;
    }

    .datenschutz .accordion-body{
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }

    .datenschutz .accordion-button.collapsed{
        border-radius: 0 !important;
        background: none !important;
    }

    .datenschutz.accordion-button{
        border-top-left-radius: 0 !important;
        border-top-right-radius: 0 !important;
    }

    .datenschutz .accordion-button h3{
        color: #fff !important;
        font-size: 2rem !important;
        line-height: 2.3rem !important;
    }

    .multi-content-heading{
        color: #fff !important;
        font-size: 1.7rem !important;
        line-height: 2rem !important;
    }

    .datenschutz .accordion-button::after{
        background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 68 68'%3E%3Cdefs%3E%3Cstyle%3E .cls-1, .cls-2 %7B stroke-width: 0px; %7D .cls-1, .cls-3 %7B fill: none; %7D .cls-2 %7B fill: %23fff; %7D .cls-3 %7B stroke: %23707070; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_1-2' data-name='Layer 1'%3E%3Cg id='Group_3902' data-name='Group 3902'%3E%3Cg id='Ellipse_92' data-name='Ellipse 92'%3E%3Ccircle class='cls-1' cx='34' cy='34' r='34'/%3E%3Ccircle class='cls-3' cx='34' cy='34' r='33.5'/%3E%3C/g%3E%3Cpolygon class='cls-2' points='41.42 32.78 35.44 32.78 35.44 26.8 33.21 26.8 33.21 32.78 27.24 32.78 27.24 35.01 33.21 35.01 33.21 40.99 35.44 40.99 35.44 35.01 41.42 35.01 41.42 32.78'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;    
        height: 4.25rem !important;
        width: 4.25rem !important;
        background: transparent;
        background-repeat: no-repeat;
        background-position: right;
    }

    .datenschutz .accordion-button:not(.collapsed)::after{
        background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 68 68'%3E%3Cdefs%3E%3Cstyle%3E .cls-1, .cls-2 %7B stroke-width: 0px; %7D .cls-1, .cls-3 %7B fill: none; %7D .cls-2 %7B fill: %23fff; %7D .cls-3 %7B stroke: %23707070; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_1-2' data-name='Layer 1'%3E%3Cg id='Group_3902' data-name='Group 3902'%3E%3Cg id='Ellipse_92' data-name='Ellipse 92'%3E%3Ccircle class='cls-1' cx='34' cy='34' r='34'/%3E%3Ccircle class='cls-3' cx='34' cy='34' r='33.5'/%3E%3C/g%3E%3C/g%3E%3Cg id='Layer_3' data-name='Layer 3'%3E%3Crect class='cls-2' x='27.24' y='32.78' width='14.18' height='2.23'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
        height: 4.25rem !important;
        width: 4.25rem !important;
        background: transparent;
        background-repeat: no-repeat;
        background-position: right;
    }
    
    .datenschutz .accordion-button:not(.collapsed){
        box-shadow: none !important;
    }

    .multi-content-bereich{
        border-top: 1px solid #ffffff25 !important;
    }

    .datenschutz .accordion-button::after{
        margin-top: 1rem !important;
    }

    .datenschutz-text p, .datenschutz-text li{
        color: #fff !important;
    }

    .datenschutz .accordion-item:hover{
        background: #459e98 !important;
        transition: 0.3s;
    }

    .datenschutz .accordion-item{
        transition: 0.3s;
    }

    .datenschutz-icon{
        max-width: 32px;
    }

    /* Glossar */

    .glossar-anchors{
        height: 60px !important;
        width: 60px !important;
    }

    .anchor-glossar{
        scroll-margin-top: 3rem !important;
    }

    .glossar-link{
        background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 937.51 937.5'%3E%3Cg id='Layer_1-2' data-name='Layer 1'%3E%3Cpath d='M862.51,468.75v356.34c0,61.97-50.44,112.41-112.41,112.41H112.41c-61.97,0-112.41-50.44-112.41-112.41V206.15c0-61.97,50.44-112.41,112.41-112.41h356.34c10.31,0,18.75,8.44,18.75,18.75s-8.44,18.75-18.75,18.75H112.41c-41.34,0-74.91,33.56-74.91,74.91v618.94c0,41.34,33.56,74.91,74.91,74.91h637.69c41.34,0,74.91-33.56,74.91-74.91v-356.34c0-10.31,8.44-18.75,18.75-18.75s18.75,8.44,18.75,18.75h0ZM937.14,15.09c-.09-.56-.28-1.12-.47-1.59-.19-.66-.38-1.22-.56-1.88-.28-.66-.66-1.22-.94-1.88-.28-.47-.47-.94-.75-1.41-1.41-2.06-3.19-3.84-5.16-5.16-.47-.28-.94-.47-1.41-.75-.56-.38-1.22-.66-1.88-.94s-1.22-.38-1.88-.56c-.56-.19-1.03-.38-1.59-.47-1.31-.38-2.53-.47-3.75-.47h-300c-10.31,0-18.75,8.44-18.75,18.75s8.44,18.75,18.75,18.75h254.72l-492.94,493.03c-7.31,7.31-7.31,19.22,0,26.53,3.66,3.56,8.44,5.44,13.22,5.44s9.56-1.88,13.22-5.53L900.01,64.03v254.72c0,10.31,8.44,18.75,18.75,18.75s18.75-8.44,18.75-18.75V18.75c0-1.22-.09-2.44-.38-3.66h0Z'/%3E%3C/g%3E%3C/svg%3E");
        width: 15px;
        height: 15px;
        background-size: contain;
        background-position: center center;
        background-repeat: no-repeat;
    }

    .glossar-zuruck{
        background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 388.44 244.86'%3E%3Cg id='Layer_1-2' data-name='Layer 1'%3E%3Cpath d='M133.01,10.58L122.43,0,0,122.43l122.43,122.43,10.58-10.58L28.72,129.99h359.72v-15.11H28.72L133.01,10.58Z'/%3E%3C/g%3E%3C/svg%3E");
        width: 15px;
        height: 9px;
        background-size: contain;
        background-position: center center;
        background-repeat: no-repeat;
    }

  /* ==========================================================================
    Slider
    ========================================================================== */
    .splide__pagination__page.is-active{
      background: #45A19B !important;
    }
    .splide__pagination__page{
      background: #929292 !important;
    }
    .immotrust-2nd-slider{
      flex: 0 0 auto !important;
      width: 40% !important;
    }
    #splide-home-dienstlistungen-list{
        height: 80vh;
    }
    #splide-home-dienstlistungen .splide__pagination__page, #splide-home-dienstlistungen-2 .splide__pagination__page, #splide-home-projekte .splide__pagination__page{
        margin: 3px 1rem;
    }
    #splide-home-dienstlistungen .splide__slide{
        height: 50vh;
        transition: 0.3s;
    }
    #splide-home-dienstlistungen .splide__slide.is-active{
        height: 80vh;
        transition: 0.3s;
    }
    #splide-home-dienstlistungen-2{
        height: 55vh;
    }
    #splide-home-dienstlistungen-2 .splide__pagination{
        left: 0;
        right: auto;
        bottom: 5rem;
        padding-left: calc((100% - 1400px) / 2);
    }

    #splide-home-dienstlistungen .splide__pagination {
        bottom: 1.5em;
        padding-left: 46%;
    }
    #splide-home-dienstlistungen-2 .splide__slide{
        transition: 0.3s;
    }
    #splide-home-dienstlistungen-2 .splide__slide .dienstleistung-text, #splide-home-dienstlistungen-2 .splide__slide .dienstleistung-title{
        opacity: 0.3;
        transition: visibility 0s, opacity 0.3s linear;
    }
    #splide-home-dienstlistungen-2 .splide__slide.is-active{
        height: 55vh !important;
        transition: 0.3s;
    }
    #splide-home-dienstlistungen-2 .splide__slide.is-active .dienstleistung-title, #splide-home-dienstlistungen-2 .splide__slide.is-active .dienstleistung-text {
        transition: visibility 0s, opacity 0.3s linear;
        opacity: 1;
    }
  /* ==========================================================================
    Off Market
    ========================================================================== */
    .off-market-verkauf .gird-container-2{
       gap: 1em 1em;
       grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    }

    @media (min-width: 1600px) {
      .slider-info-box{
        width: 33%;
      }
    }
    @media (max-width: 1600px) {
      .slider-info-box{
        width: 50%;
      }
      #splide-home-dienstlistungen .splide__pagination {
      bottom: -1.5em;
      padding-left: 48%;
      }
      .mt-n5{
        margin-top: -6rem !important;
      }
    }
    @media (max-width: 1400px) {
        .home .gird-container-4 {
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        }
        .gird-container-4 {
            grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
        }
        .gird-container-3 {
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        }
        h1{
            font-size: 2.525rem !important;
            line-height: 2.625rem !important;
            margin-bottom: 0px !important;
        }
        h2{
            font-size: 2.125rem !important;
            line-height: 1.2 !important;
            font-family: 'Montserrat Medium';
            margin-bottom: 0px !important;
        }
        h3{
            font-size: 1.5rem !important;
            line-height: 1.5rem !important;
        }
        h4{
            font-size: 1.375rem !important;
            line-height: 1.5rem !important;
        }
        h5{
            font-size: 1rem !important;
            line-height: 1.375rem !important;
        }
        .gird-container-2 {
            grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
        }
        .off-market-verkauf .gird-container-2{
            gap: 1em 1em;
            grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
        }
      .max-width-left, #splide-home-dienstlistungen-2 .splide__pagination {
        padding-left: 1.5rem !important;
      }
      .slider-info-box{
        width: 50%;
      }

    }

    @media (max-width: 1200px) {
        .slider-info-box{
        margin-right: 0px !important;
        }
        .gird-container-2 {
        grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
        }
        .home .gird-container-4 {
            grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
        }
        #splide-home-dienstlistungen .splide__pagination {
            bottom: -3.5em;
            padding-left: 1em;
        }
    }

    @media (max-width: 992px) {
      .leistungen-container{
        min-height: auto !important;
      }
      .gird-container-3 {
        gap: 1em 1em;
      }
      .mt-n5 {
         margin-top: 0rem !important;
       }
       #splide-home-dienstlistungen-2 .splide__pagination{
         bottom: -2.5rem !important;
       }
       .slider-info-box {
        width: 90%;
      }
    }
    @media (max-width: 768px) {
      .gird-container-4, .home .gird-container-4 {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      }
      .circle-progress {
          min-height: 8.5rem !important;
          min-width: 8.5rem !important;
          display: block;
      }
      .immotrust-2nd-slider{
        flex: 0 0 auto !important;
        width: 100% !important;
      }
      .kontakt-button .fui-btn{
        width: 100% !important;
      }
      .newsletter .fui-form-container .fui-page{
        padding-right: 0px !important;
      }
      .sticky-container > div button{
        height: auto !important;
      }
      header .main-logo {
        width: 150px;
        transition: 0.3s;
      }
      .sticky .main-logo {
        width: 140px;
      }
      .newsletter .fui-form-container .fui-page .fui-btn-wrapper{
        width: auto !important;
      }
      .immotrust-input{
        width: 100% !important;
        flex: auto !important;
      }
      .immotrust-mobile-objekt{
        display: none !important;
      }
      #splide-home-dienstlistungen .splide__pagination{
        padding-left: 1em;
        bottom: -3rem;
      }
      #splide-home-dienstlistungen .splide__slide{
        background: transparent !important;
      }
      .slider-info-box {
        width: 100%;
      }
      #splide-home-dienstlistungen-list, #splide-home-dienstlistungen .splide__slide, #splide-home-dienstlistungen .splide__slide.is-active{
        height: 50vh;
      }
    }

    @media (max-width: 576px) {

      .homepage-start-banner {
          margin-top: -120px !important;
      }
      .navigation-main-icons{
        max-height: 25px;
        max-width: 25px;
      }
      .gird-container-2, .off-market-verkauf .gird-container-2 {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      }
      
      h1 {
        font-size: 1.85rem !important;
        line-height: 2rem !important;
      }
      h2 {
        font-size: 1.65rem !important;
      }
      .projekte .mt-n4{
        margin-top: 0px !important;
      }
      #splide-home-dienstlistungen-2 .splide__slide{
        margin: 0px !important;
      }
      .background-white-light-gray-gradient {
        background: linear-gradient(180deg, rgba(0,0,0,0) 20%, rgba(246,247,250,1) 20%);
      }
      .news-title{
        font-size: 1.4rem !important;
      }

      #splide-home-dienstlistungen-2 .splide__slide, #splide-home-dienstlistungen-2 .splide__slide.is-active {
        height: 50vh !important;
        transition: 0.3s;
    }
    .dienstleistungen-arrow{
        width: 35px !important;
    }
    .form-kontakt-group{
        width: 100% !important;
        flex: auto !important;
    }
    .gird-container-4, .home .gird-container-4 {
        grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
      }
}