.hero-banner {
    background-color: transparent;
    display: flex;
    height: 100%;
    position: static;
    overflow: hidden;
    margin: 0 1.5rem;
    margin: auto;
    gap: 100px;
    max-width: 1365px;
    min-height: 550px;
}
.hero-banner .waze-wrapper :nth-child(2) {
        justify-content: flex-end;
    }
.hero-banner .waze-wrapper :last-child {
        justify-content: flex-end;
    }
.hero-banner h1 {
        color: #fff;
    }
.hero-banner .hero-banner-img-container img {
        width: 100%;

        -o-object-fit: cover;

           object-fit: cover;
        -o-object-position: center;
           object-position: center;
        border-radius: 8px;
        max-height: 900px;
        overflow: hidden;
    }
.hero-banner .waze-button {
        background: #fff;
        max-width: 305px;
    }
.hero-banner .waze-button p {
            color: #282a6a;
        }
.hero-banner .phone-button {
        max-width: 105px;
    }
.hero-banner .title-wrapper {
        background: transparent;
        margin-left: 30px;
        margin-right: 30px;
        justify-content: space-between;
    }
.hero-banner .title-wrapper .waze-wrapper {
            gap: 20px;
            display: flex;
            flex-direction: column;
            width: 100%;
            bottom: 0;
        }
.hero-banner .hero-banner-img-container {
        left: 0;
        z-index: -1;
        margin: 1.5rem 1.5rem 0 1.5rem;
        min-height: 800px;
        height: 100%;
    }
.small-banner,
.small-banner-contact {
    background-color: transparent;
}
.small-banner-contact .small-banner-container {
    background: linear-gradient(90deg, #1a1c4f 0%, #3b3fa0 25%, #282a6a 50%, #3b3fa0 70%, #1a1c4f 100%);
}
.small-banner-contact .small-banner-container .background-circle {
        background-color: transparent;
    }
.small-banner-contact .small-banner-container svg {
        width: 40px;
        height: 40px;
    }
.end-layout {
    background-color: transparent;
}
@media (min-width: 1025px) {
    .logo-wrapper .christmas-logo img {
        display: flex;
    }
    .logo-wrapper .default-logo img {
        display: none;
    }
}

@media (max-width: 1025px) {
    .logo-wrapper .default-logo img {
        display: flex;
    }
    .logo-wrapper .christmas-logo img {
        display: none;
    }
            .hero-banner .hero-banner-img-container img {
                margin-top: 10px;
            }
}
@media (max-width: 1025px) and (orientation: portrait) {
    .hero-banner {
        min-height: 30vh;
    }
}
@media (max-width: 1093px) and (min-width: 769px) {
    .hero-banner .waze-phone-container {
        max-width: 43vw;
    }
    .hero-banner .title-wrapper {
        margin-top: 0px;
    }
    .small-banner {
        padding-top: 1rem;
    }
}
@media (max-width: 1093px) and (min-width: 769px) and (orientation: portrait) {
        .hero-banner .title-wrapper {
            min-height: 500px;
        }
}

@media (min-width: 1025px) {
    .header {
        background-color: transparent;
        z-index: 1;
    }
        .header .header-right a {
            color: #fff;
        }
        .header .header-left a {
            color: #fff;
        }
        .header .mobile-menu-toggle svg path {
            stroke: #fff;
        }
}
@media (min-width: 1280px) {
            .header .header-right svg path {
                fill: #fff;
            }
        .header .language-code {
            color: #fff;
        }
}
@media (min-width: 769px) {
    .hero-banner .title-wrapper {
        width: 100%;
        align-items: flex-start;
    }
        .hero-banner .title-wrapper .waze-wrapper {
            display: grid;
            grid-template-columns: auto auto;
            width: 100%;
        }
}
@media (max-width: 768px) {
    .hero-banner {
        position: relative;
        flex-direction: column;
        gap: 30px;
    }
        .hero-banner .title-wrapper {
            padding: 1rem;
            margin-left: 0px;
        }
        .hero-banner .title-wrapper .waze-wrapper {
            gap: 10px;
        }
        .hero-banner .hero-banner-img-container {
            margin: 0;
            min-height: 400px;
            margin-left: 1rem;
            margin-right: 1rem;
        }

            .hero-banner .hero-banner-img-container img {
                max-height: none;
                max-height: initial;
                -o-object-position: 45%;
                   object-position: 45%;
                height: 400px;
            }

        .hero-banner h1 {
            position: absolute;
            bottom: 120%;
        }
        .hero-banner .waze-button {
            max-width: 100%;
            background: #282a6a;
        }
            .hero-banner .waze-button p {
                color: #fff;
            }
        .hero-banner .phone-button {
            max-width: 100%;
        }
        .small-banner-contact .small-banner-container svg {
            width: 20px;
            height: 20px;
        }
}
@media (max-width: 375px) and (orientation: portrait) {
        .hero-banner .hero-banner-img-container {
            min-height: 350px;
        }
            .hero-banner .hero-banner-img-container img {
                height: 350px;
            }
}
@media (max-width: 1025px) and (orientation: landscape) {
        .hero-banner .hero-banner-img-container img {
            height: 150%;
        }
}
