.breadcrumb {
    display: flex;
    align-items: center;

    width: 110rem;
    height: 4.6rem;
    margin: 6rem auto 0 auto;

    transition: background 0.5s;

    border-radius: @radius @radius 0 0;
    background-color: rgba(255, 255, 255, 0.75);

    &:hover {
        background-color: rgba(255, 255, 255, 0.95);
    }

    &__wire {
        margin: 0 0.6rem;

        .font(@condensed_regular, 1.4rem, @smart, 1.8rem);

        &:hover:not(.breadcrumb__wire--selected) {
            text-decoration: underline;
        }

        &--selected {
            color: @vader;
        }
    }

    &__next {
        font-size: 1rem;

        color: @smart;
    }

    &__return {
        font-size: 2.2rem;
        line-height: 2.2rem;

        position: relative;
        left: -0.1rem;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 4.6rem;
        height: 4.6rem;
        margin-right: 0.6rem;

        transition: background 0.5s;
        text-decoration: none;

        color: @stormtrooper;
        border-radius: @radius 0 0 0;
        background-color: @smartSky;

        &:hover {
            background-color: @smart;
        }
    }
}