html {
  font-size: 10px;
}
@media (min-width: 1920px) {
  html {
    font-size: calc(100vw / 192);
  }
}
header {
  position: absolute;
  width: calc(100% - 4.8rem);
  top: 1.6rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  background-color: transparent !important;
}
@media (min-width: 768px) and (max-width: 1199px) {
  header {
    width: calc(100vw - 9.6rem);
  }
}
@media (min-width: 1200px) and (max-width: 1800px) {
  header {
    width: calc(100vw - 19.2rem);
    top: 2rem;
  }
}
@media (min-width: 1801px) {
  header {
    width: 74.6vw;
    top: 2rem;
  }
}
header #cd-header {
  padding: 1.2rem 1.8rem 1rem 1.2rem;
  background-color: #1c1c1c;
  border-radius: 0.8rem;
  /*.fl-menu-mobile-flyout {
            //width: 100%;
            top: 82px;
            border-radius: 0.8rem;
            #menu-header {
                .cd-header--menu-home {
                    a {
                        &::before {
                            background-color: $darkgrey;
                            right: 2rem;
                        }
                    }
                }

                li {
                    margin-bottom: 1.2rem;
                    a {
                        color: $darkgrey;
                        font-size: 2rem;
                        padding-right: 2rem;
                        &:hover {
                            color: $secondarycolor;
                        }
                    }
                    &.cd-header--menu-termin a {
                        color: $offwhite;;
                        text-align: center;
                        padding-right: 0rem;
                    }
                }
            }
        }*/
}
@media (min-width: 1200px) {
  header #cd-header {
    padding: 1.2rem 1.6rem 1rem 1.6rem;
    border-radius: 1.2rem;
  }
}
header #cd-header button.fl-menu-mobile-toggle.hamburger svg.hamburger-menu rect {
  fill: #f4f4f4 !important;
}
header #cd-header .fl-photo-content svg {
  height: 4rem;
  fill: #f4f4f4;
  transition: 0.2s ease-in-out;
}
header #cd-header .fl-photo-content svg:hover {
  fill: #0099BC;
  transition: 0.2s ease-in-out;
}
@media (min-width: 1200px) {
  header #cd-header .fl-photo-content svg {
    height: 4.8rem;
  }
}
header #cd-header #menu-header {
  gap: 3.2rem;
}
@media (min-width: 1801px) {
  header #cd-header #menu-header {
    gap: 4.8rem;
  }
}
header #cd-header #menu-header::after {
  display: none;
}
header #cd-header #menu-header a {
  color: #f4f4f4;
  font-weight: 500;
  font-size: 1.6rem;
}
header #cd-header #menu-header a:hover {
  color: #0099BC;
}
header #cd-header #menu-header .cd-header--menu-home a {
  visibility: hidden;
}
header #cd-header #menu-header .cd-header--menu-home a::before {
  visibility: visible;
  content: "";
  position: absolute;
  right: 0;
  height: 1.8rem;
  width: 2rem;
  background: #f4f4f4;
  mask-image: url(https://digitalcrumb.de/wp-content/uploads/2023/06/home.svg);
  -webkit-mask-image: url(https://digitalcrumb.de/wp-content/uploads/2023/06/home.svg);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-size: cover;
  -webkit-mask-size: cover;
  transition: 0.2s ease-in-out;
}
header #cd-header #menu-header .cd-header--menu-home a:hover::before {
  background: #0099BC;
  transition: 0.2s ease-in-out;
}
header #cd-header #menu-header .cd-header--menu-termin a {
  background: linear-gradient(#0090b2 0%, #007793 75%, #007793 100%);
  padding: 1rem 1.6rem 0.9rem 1.4rem;
  border-radius: 0.4rem;
  transition: 0.2s ease-in-out;
}
header #cd-header #menu-header .cd-header--menu-termin a:hover {
  background: linear-gradient(#007793 0%, #007793 75%, #007793 100%);
  transition: 0.2s ease-in-out;
  color: #f4f4f4;
}
header #cd-header .fl-menu-mobile-toggle.active .fl-menu-mobile-flyout {
  display: block;
}
@media (max-width: 991px) {
  header #cd-header .fl-menu-responsive-toggle-medium-mobile #menu-header {
    border-top: 1px solid #f4f4f4;
    margin: 1rem 0 1.2rem 0;
  }
}
@media (max-width: 991px) {
  header #cd-header .fl-menu-responsive-toggle-medium-mobile #menu-header .menu-item {
    margin-top: 1rem;
    text-align: left;
  }
  header #cd-header .fl-menu-responsive-toggle-medium-mobile #menu-header .menu-item:first-of-type {
    margin-top: 2.4rem;
  }
  header #cd-header .fl-menu-responsive-toggle-medium-mobile #menu-header .menu-item:last-of-type {
    display: flex;
  }
  header #cd-header .fl-menu-responsive-toggle-medium-mobile #menu-header .menu-item a::before {
    right: auto;
    left: 0;
  }
}