:root {
    --height-full: 100dvh;
    --announcement-height: 40px;
    --height-fill: calc(100dvh - var(--nav-height));
    --font-my-cube: "Sohne", sans-serif;
    --nav-main-height: 76px;
    --nav-height: calc(var(--nav-main-height) + var(--announcement-height));
    --color-dark-charcoal: #262525;
    --color-light-grey: #f1f1f1;
    --color-lines-2: #cacaca;
    --color-lines-3: #ebebeb;
    --product-card-max-height: 750px
}

@media(max-width: 767.98px) {
    :root {
        --nav-main-height: 60px
    }
}

.bg__lightgrey {
    background: #f1f1f1
}

.navbar__announcement {
    background: #2a4026
}

.announcement-bar {
    --gap: 76px;
    position: relative;
    z-index: 9;
    overflow: hidden;
    color: #f6f6f6
}

.announcement-bar__wrapper {
    position: relative
}

.announcement-bar__items {
    width: 100%;
    list-style: none;
    margin: 0;
    display: flex;
    --gap: 114px;
    gap: var(--gap)
}

.announcement-bar__items>li {
    margin: 0;
    width: fit-content
}

.announcement-bar__item {
    line-height: 130%;
    display: block;
    width: 100%;
    text-align: center;
    padding: 12.5px;
    font-weight: 400;
    font-size: 13px;
    line-height: 15px
}

.announcement-bar__close {
    height: calc(100% - 1px);
    padding: 0 37px 0 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 9;
    background-color: #151515
}

.announcement-bar__close svg path {
    stroke: #f6f6f6
}

@media(max-width: 767.98px) {
    .announcement-bar__close {
        padding-right: 25px
    }
}

.page-cart .announcement-bar {
    display: none
}

.marquee {
    display: flex;
    overflow: hidden;
    user-select: none;
    gap: var(--gap)
}

.marquee__content {
    flex-shrink: 0;
    display: flex;
    justify-content: space-around;
    min-width: 100%;
    gap: var(--gap);
    animation: scroll var(--duration, 40s) linear infinite
}

@keyframes scroll {
    from {
        transform: translateX(0)
    }

    to {
        transform: translateX(calc(-100% - var(--gap, 0)))
    }
}

/*# sourceMappingURL=component-announcement-bar.css.map */