﻿.breadcrumb-arrow {
            min-height: 36px;
            padding: 2px;
            line-height: 36px;
            list-style: none;
            overflow: auto;
            background-color: white;
            width:100%;
        }

.breadcrumb-arrow li:first-child a {
    border-radius: 4px 0 0 4px;
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
}

.breadcrumb-arrow li,
.breadcrumb-arrow li a,
.breadcrumb-arrow li span {
    display: inline-block;
    /*vertical-align: top;*/
}

.breadcrumb-arrow li:not(:first-child) {
    /*margin-left: -5px;*/
}

.breadcrumb-arrow li+li:before {
    padding: 0;
    content: "";
}

.breadcrumb-arrow li span {
    padding: 0 10px;
}

.breadcrumb-arrow li a,
.breadcrumb-arrow li:not(:first-child) span {
    height: 36px;
    padding: 0 10px 0 25px;
    line-height: 36px;
}

.breadcrumb-arrow li:first-child a {
    padding: 0 10px;
}

.breadcrumb-arrow li a {
    position: relative;
    color: #fff;
    text-decoration: none;
    background-color: #343a40;
    border: 1px solid #343a40;
}

.breadcrumb-arrow li:first-child a {
    padding-left: 10px;
}

.breadcrumb-arrow li a:after,
.breadcrumb-arrow li a:before {
    position: absolute;
    top: -1px;
    width: 0;
    height: 0;
    content: '';
    border-top: 18px solid transparent;
    border-bottom: 18px solid transparent;
}

.breadcrumb-arrow li a:before {
    right: -10px;
    z-index: 3;
    border-left-color: #343a40;
    border-left-style: solid;
    border-left-width: 10px;
}

.breadcrumb-arrow li a:after {
    right: -11px;
    z-index: 2;
    border-left: 11px solid #fff;
}

.breadcrumb-arrow li a:focus,
.breadcrumb-arrow li a:hover {
    background-color: #40474e;
    border: 1px solid #40474e;
}

.breadcrumb-arrow li a:focus:before,
.breadcrumb-arrow li a:hover:before {
    border-left-color: #40474e;
}

.breadcrumb-arrow li a:active {
    background-color: #40474e;
    border: 1px solid #40474e;
}

.breadcrumb-arrow li a:active:after,
.breadcrumb-arrow li a:active:before {
    border-left-color: #40474e;
}

/*set for Last child*/

.breadcrumb-arrow li.active span {
    position: relative;
    color: #fff;
    text-decoration: none;
    background-color: #007bff;
    border: 1px solid #007bff;
}

.breadcrumb-arrow li.active:first-child span {
    padding-left: 10px;
}

.breadcrumb-arrow li.active span:after,
.breadcrumb-arrow li.active span:before {
    position: absolute;
    top: -1px;
    width: 0;
    height: 0;
    content: '';
    border-top: 18px solid transparent;
    border-bottom: 18px solid transparent;
}

.breadcrumb-arrow li.active span:before {
    right: -10px;
    z-index: 3;
    border-left-color: #007bff;
    border-left-style: solid;
    border-left-width: 11px;
}

.breadcrumb-arrow li.active span:after {
    right: -11px;
    z-index: 2;
    border-left: 10px solid #007bff;
}