.crumbsContainer {
    display: none;
}

@media screen and (min-width: 769px) {
    .crumbsContainer {
        display: block;
    }
}

.breadcrumbsList {
    list-style: none;
    overflow: hidden;
    font: 15px Helvetica, Arial, Sans-Serif;
    padding: 0;
    margin: 0;
    position: absolute;
}

    .breadcrumbsList li {
        float: left;
    }

        .breadcrumbsList li a {
            color: white;
            text-decoration: none;
            padding: 10px 0 10px 40px;
            position: relative;
            display: block;
            float: left;
        }

            .breadcrumbsList li a:after {
                content: " ";
                display: block;
                width: 0;
                height: 0;
                border-top: 50px solid transparent;
                border-bottom: 50px solid transparent;
                position: absolute;
                top: 50%;
                margin-top: -50px;
                left: 100%;
                z-index: 2;
            }

            .breadcrumbsList li a:before {
                content: " ";
                display: block;
                width: 0;
                height: 0;
                border-top: 50px solid transparent;
                border-bottom: 50px solid transparent;
                border-left: 30px solid white;
                position: absolute;
                top: 50%;
                margin-top: -50px;
                margin-left: 1px;
                left: 100%;
                z-index: 1;
            }
             
            .breadcrumbsList li:last-child a:before {
                border-left: solid 30px #fff;
            }
            .breadcrumbsList li:last-child a:after {
                border-left: solid 30px #fff;
            }

            .breadcrumbsList li:last-child a {
                background: #fff !important;
            }

        .breadcrumbsList li:first-child a {
            padding-left: 10px;
        }

        .breadcrumbsList li:last-child {
            padding-right: 10px;
        }


        .breadcrumbsList li a:hover {
            color: white !important;
        }

    .breadcrumbsList .active a {
        background: transparent !important;
        color: black;
        pointer-events: none;
        cursor: default;
    }

    .breadcrumbsList .active a:after {
        border-left-color: white !important;
    }

    .breadcrumbsList .inactive a {
        pointer-events: none;
        cursor: default;
    }

.crumbsContainer .spacer {
    height: 40px;
}