/*<div class="container">
            <div class="panel-breadcrm d-flex justify-content-between align-items-center">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item f-14"><a href="#" class="text-lllgray">Главная</a></li>
                    <li class="breadcrumb-item f-14"><a href="#" class=" text-lgray">Специалисты</a></li>
                    <li class="breadcrumb-item active text-lllgray f-14">Анжелика Горянова</li>
                </ol>
                <span class="id-num bg-lgray">ID: 2327687621</span>
            </div>
        </div>*/


.panel-breadcrm {
	position: relative;
}
.panel-breadcrm:before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
    width: 100%;
	height: 1px;
	background: #C4C4C4;
	top: 50%;
	transform: translate(0, -50%);
	z-index: -1;
}
.breadcrumb {
	background: #fff;
    display: inline-flex;
    padding: 0;
    padding-right: 50px;
}
.breadcrumb-item+.breadcrumb-item::before {
    display: inline-block;
    padding-right: .5rem;
    color: #C4C4C4;
    content: "•";
}
.breadcrumb-item.active {
    color: #C4C4C4;
}
.breadcrumb li a {
	border-bottom: 1px solid;
}
.breadcrumb li a:hover {
	text-decoration: none;
	border-bottom: 1px solid transparent;
}
.id-num {
	padding: 6px 11px;
	border-radius: 1px;
	border-left: 40px solid #fff; 
}
@media (max-width: 767px) {
	.id-num {
    	border-left: 15px solid #fff;
    	font-size: 12px;
	}
	.breadcrumb {
	    padding-right: 15px;
	}
	.breadcrumb-item {
		font-size: 10px;
	}
}
@media (max-width: 575px) {
	.id-num {
		position: absolute;
    	bottom: -40px;
    	border-left: 0px;
	}
}