
.l-wrap__sabbath {
    width: calc(100vw/7 * 1 - 0.01px);
    background-color: #f5f5f5;
    z-index: 1;
    position: relative;
    min-height: 100vh
}

.l-sabbath {
    z-index: 10000;
    position: relative;
    padding-top: 0;
    cursor: pointer;
    background-color: #f5f5f5;
    margin: 0;
    display: block
}

.l-sabbath__logo--inner {
    position: relative;
    transition: all .25s ease
}

.l-sabbath__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    transition: all .5s ease
}

.l-sabbath__logo {
    padding-top: .625rem;
    padding-left: .625rem;
    padding-right: .625rem;
    display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    left: 0;
    right: 0;
    max-width: 9.6875rem
}

@media(min-width: 501px) {
    .l-sabbath__logo {
        padding-left:1.25rem;
        padding-right: 1.25rem;
        padding-top: 1.25rem
    }
}

.l-sabbath__logo svg {
    width: 100%
}

.l-sabbath__logo-light {
    z-index: 2;
    position: relative
}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active) {
    .l-sabbath__logo-light {
        top: 2px
    }
}

.l-sabbath__logo-dark {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 1
}

.l-sabbath:hover .l-sabbath__logo svg path {
    fill: #fff
}

.l-sabbath:hover .l-sabbath__overlay {
    opacity: 1!important
}

.u-path-fill--black path {
    fill: #000
}

.u-path-fill--gray--darker path {
    fill: #222
}

.u-path-fill--gray--dark path {
    fill: #4a4a4a
}

.u-path-fill--gray path {
    fill: #717171
}

.u-path-fill--gray--light path {
    fill: #f5f5f5
}

.u-path-fill--white path {
    fill: #fff
}
