.breadcrumbs {
    position: relative;
    top: var(--breadcrumb-top);
}

.breadcrumbs ul {
    position: absolute;
    z-index: 10;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    line-height: 1.5rem;
    font-size: var(--p-s-size);
    padding: 0 .5rem;
    margin: 0;
    background-color: var(--white);
    border-radius: var(--radius);
    font-family: "Open Sans", sans-serif;
}

.breadcrumbs li {
    color: var(--blue);
}

.breadcrumbs li + li:before {
    content: '/';
    margin: 0 .25rem;
    font-weight: 400;
    color: var(--blue);
}

/* 1024px */
@media screen and (min-width: 64rem) {

    .breadcrumbs ul {
        top: 0;
        left: 3.5rem;
    }

    .breadcrumbs-item:last-child {
        font-weight: 700;
    }
}