.nav-main, .nav-main path {
    transition-duration: 300ms;
}

body .nav-main.scrolled {
    background-color: rgba(248, 249, 250, 0.85) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);    
}

/* .nav-main.scrolled  .nav-item > a:not(.btn) {
    color: #191919;
} */

.nav-main.scrolled path {
    stroke: #708ec2;
}

.nav-main .navbar-main-nav .nav-link, .nav-main .navbar-extra .nav-link {
    padding: 8px 20px;
}

@media (max-width: 991px) {
    .nav-main .navbar-main-nav .nav-link {
        font-size: 20px;
    }
    
    /*For a guest in the main navigation*/
    .nav-main.navbar-dark .navbar-main-nav .nav-link {
        color: rgba(0, 0, 0, 0.65);
    }

    .nav-main.navbar-dark .navbar-main-nav .nav-link:hover, .nav-main.navbar-dark .navbar-main-nav .nav-link:focus {
        color: rgba(0, 0, 0, 0.8);
    }
      
    .nav-main.navbar-dark .navbar-main-nav .nav-link.active {
        color: black;
    }
      
    .nav-main.navbar-dark .navbar-main-nav .nav-link.disabled {
        color: rgba(0, 0, 0, 0.3);
    }
}

.nav-main .navbar-main-nav .btn {
    font-size: 14px;
}

@media (min-width: 991px) {
    .nav-main .navbar-main-nav .btn-outline-dark {
        border: none;
    }
    
    .nav-main.navbar-dark .navbar-main-nav .btn-outline-dark {
        color: #f8f9fa;
    }

    .nav-main.navbar-dark .navbar-main-nav .btn-aushelfen {
        color: #212529;
        background-color: #f8f9fa;
        border-color: #f8f9fa;
    }

    .nav-main.navbar-dark .navbar-main-nav .btn-aushelfen:hover, .nav-main.navbar-dark .navbar-main-nav .btn-aushelfen:focus {
        color: #212529;
        background-color: #e2e6ea;
        border-color: #dae0e5;
    }
      
    .nav-main.navbar-dark .navbar-main-nav .btn-aushelfen:active, .nav-main.navbar-dark .navbar-main-nav .btn-aushelfen.active {
        color: #212529 !important;
        background-color: #d3d9df !important;
        border-color: #c6ccd2 !important;
    }
}

/*Language icon on mobile*/
.nav-main .navbar-extra .nav-link {
    color: rgba(0, 0, 0, 0.65);
}

/* .nav-main .navbar-extra .nav-link:nover, .nav-main.navbar-dark .navbar-extra .nav-link:focus {
    color: rgba(0, 0, 0, 0.8);
}

.nav-main .navbar-extra .nav-link.active {
    color: black;
}

.nav-main .navbar-extra .nav-link.disabled {
    color: rgba(0, 0, 0, 0.3);
} */

.nav-main.navbar-dark .navbar-extra .nav-link {
    color: rgba(255, 255, 255, 0.55);
}

/* .nav-main.navbar-dark .navbar-extra .nav-link:nover, .nav-main.navbar-dark .navbar-extra .nav-link:focus {
    color: rgba(255, 255, 255, 0.75);
}

.nav-main.navbar-dark .navbar-extra .nav-link.active {
    color: white;
}

.nav-main.navbar-dark .navbar-extra .nav-link.disabled {
    color: rgba(255, 255, 255, 0.25);
} */


#language-selector .dropdown-item.active {
    color: var(--bs-dropdown-link-color);
    background-color: transparent;
    font-weight: 600;
}



.rating span input {
    position:absolute;
    top:0px;
    left:0px;
    opacity:0;
}

.rating span:hover ~ span label,
.rating span:hover label,
.rating span.checked label,
.rating span.checked ~ span label {
    color:#F90;
}

@media screen and (max-width: 768px) {
    #wizard-window {
        min-height: calc(100vh - 60px);
    }
}

html {
    scroll-snap-type: y proximity;
}

.scroll-magnet {
    scroll-snap-align: start;
}

.css-pattern {
    --s: 100px; /* control the size*/
    --c1: #f1f1f1;
    --c2: aliceblue;

    --_g:#0000, #0002 5%,
    var(--c2) 6%  14%,var(--c1) 16% 24%,var(--c2) 26% 34%,var(--c1) 36% 44%,
    var(--c2) 46% 54%,var(--c1) 56% 64%,var(--c2) 66% 74%,var(--c1) 76% 84%,
    var(--c2) 86% 94%,#0002 95%,#0000;
    background:
        radial-gradient(100% 50% at 100% 0   ,var(--_g)),
        radial-gradient(100% 50% at 0    50% ,var(--_g)),
        radial-gradient(100% 50% at 100% 100%,var(--_g));
    background-size: var(--s) calc(2*var(--s));
}


.fa-google {
    background: conic-gradient(from -45deg, #ea4335 110deg, #4285f4 90deg 180deg, #34a853 180deg 270deg, #fbbc05 270deg) 73% 55%/150% 150% no-repeat;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

/* .problemcard:hover {
    background-color: #eee;
} */

.flip {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
  }

.container-perfect {
    padding: max(48px, 7.407vw) 6px;
}

.container-perfect-top {
    padding: 75px 6px max(48px, 7.407vw);
}

a.anchor {
    display: block;
    position: relative;
    top: -250px;
    visibility: hidden;
}

/* Hilferuf page styles */
.mt-100 {
    margin-top: 100px;
}

.mb-120 {
    margin-bottom: 120px;
}

.rounded-xl {
    border-radius: 14px;
}

.rounded-start-xl {
    border-top-left-radius: 14px; 
    border-bottom-left-radius: 14px;
}

.rounded-end-xl {
    border-top-right-radius: 14px; 
    border-bottom-right-radius: 14px;
}

.rounded-top-xl {
    border-top-left-radius: 14px; 
    border-top-right-radius: 14px;
}

.rounded-bottom-xl {
    border-bottom-left-radius: 14px; 
    border-bottom-right-radius: 14px;
}

.text-truncate-1 {
    display: -webkit-box; 
    -webkit-line-clamp: 1; 
    -webkit-box-orient: vertical; 
    overflow: hidden;
    text-overflow: ellipsis;
}

.text-truncate-2 {
    display: -webkit-box; 
    -webkit-line-clamp: 2; 
    -webkit-box-orient: vertical; 
    overflow: hidden; 
    text-overflow: ellipsis;
}

.text-truncate-4 {
    display: -webkit-box; 
    -webkit-line-clamp: 4; 
    -webkit-box-orient: vertical; 
    overflow: hidden; 
    text-overflow: ellipsis;
}

.text-truncate-8 {
    display: -webkit-box; 
    -webkit-line-clamp: 8; 
    -webkit-box-orient: vertical; 
    overflow: hidden; 
    text-overflow: ellipsis;
    * {
        display: inline;
    }    
}

ul.bootstrap-autocomplete a {
    color: var(--color-footergray);
    text-decoration: none;
}

ul.bootstrap-autocomplete a:hover {
    color: black;
    text-decoration: none;
}

.text-underline-hover {
    text-decoration: none;
}

.text-underline-hover:hover {
    text-decoration: underline;
}

.cursor-pointer:hover {
    cursor: pointer;
}

.text-tiny {
    font-size: 12px;
}

.text-capitalize-first:first-letter {
    text-transform: uppercase
}

footer p {
    color: silver;
    font-size: 12px;
}

.footer-column a, .footer-column a:link, .footer-column a:visited {
    color: silver;
    text-decoration: none; 
    transition-duration: 150ms;
}

.footer-column a:hover, .footer-column a:active {
    color: white; 
} 

footer .btn {
    color: silver;
    transition-duration: 300ms;
}



.bg-lightblue {
    background-color: lightblue;
}

.bg-whitesmoke {
    background-color: whitesmoke;
}

.bg-90 {
    background-color: #e6e6e6;
}

.bg-aliceblue {
    background-color: aliceblue;
}

.bg-lightgray {
    background-color: lightgray;
}

.bg-darkgray {
    background-color: darkgray;
}

.bg-stripes {
    background: repeating-linear-gradient(
        45deg,
        #fdfbfb,
        #fdfbfb 2px,
        #ebedee 2px,
        #ebedee 4px
    );
}



.icon-darkblue {
    filter: invert(14%) sepia(34%) saturate(1830%) hue-rotate(168deg) brightness(94%) contrast(97%);
}

.icon-dark {
    filter: invert(14%) brightness(94%) contrast(97%);
}

.icon-white {
    filter: invert(100%);
}

.text-darkblue {
    color: #072d49;
}

.text-lightblue {
    color: lightblue;
}

.text-aliceblue {
    color: aliceblue;
}

.text-lightgray {
    color: lightgray;
}

.text-darkgray {
    color: darkgray;
}

.text-transparent {
    color: transparent;
}

.transparent-link {
    opacity: 0;
    transition-duration: 150ms;
}

.transparent-link:hover {
    opacity: 1;
    transition-duration: 150ms;
}

.border-whitesmoke {
    border-color: whitesmoke !important;
}

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

.notification a:link, 
.notification a:visited {
    color: #444;
    text-decoration: none;
    font-weight: bold;
}

.chat-bubble {
    word-wrap: break-word;
    margin-top: 12px;
    line-height: 24px;
    position: relative;
    padding: 10px 16px;
    border-radius: 14px;
}

.chat-bubble:before, .chat-bubble:after {
    content: "";
    position: absolute;
    bottom: 0;
    height: 25px;
}

.from-me, .from-me-dark { 
	background: aliceblue;
	align-self: flex-end;
}
.from-me:before, .from-me-dark:before {
    right: -7px;
    width: 20px;
    background-color: aliceblue;
    border-bottom-left-radius: 16px 14px;
}
.from-me:after {
    right: -16px;
    width: 16px;
    background-color: white;
    border-bottom-left-radius: 10px;
}
.from-me-dark:after {
    right: -16px;
    width: 16px;
    background-color: var(--color-aushelfen);
    border-bottom-left-radius: 10px;
}

.from-them, .from-them-dark {
	background: #eee;
    align-self: flex-start;
}
.from-them:before, .from-them-dark:before {
    left: -7px;
    width: 20px;
    background-color: #eee;
    border-bottom-right-radius: 16px 14px;
}
.from-them:after {
    left: -16px;
    width: 16px;
    background-color: white;
    border-bottom-right-radius: 10px;
}

.from-them-dark:after {
    left: -16px;
    width: 16px;
    background-color: var(--color-aushelfen);
    border-bottom-right-radius: 10px;
}

.button-card {
    /* min-width: 330px;
    min-height: 440px; */
    transition: .5s all ease;
    transform: rotateX(15deg) scale(0.92);
    box-shadow: 0px 20px 60px #aaa;
}

.button-card:hover {
    cursor: pointer;
    transform: rotate(0deg) scale(1) translateY(10px);
    box-shadow: 0px 20px 80px #bbb;
}

.shadow-bottom-sm {
    box-shadow: 0 0.8rem .5rem -.4rem rgba(0, 0, 0, .05);
}

.shadow-bottom {
    box-shadow: 0 1rem 0.7rem -.5rem rgba(0, 0, 0, .15);
}

.transition-500 {
    transition-duration: 500ms;
}

@media (min-width: 576px) {
    .text-sm-lead {
        font-size: 20px;
        font-weight: lighter;
    }
}