.breadcrumbs {

	ul {
		display: flex;
		align-items: center;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	li {
		display: flex;
		align-items: center;
		margin: 0;
		padding: 0;
		.font-size(@font-size-medium);
		color: @body-color;
		line-height: 1.6rem;

		.active {
			font-weight: bold;
		}

		> span {
			flex: 0 0 auto;
			cursor: pointer;
		}
	}

	a {
		
	}

	svg {
		.square(16px);
		fill: @grey-400;
		vertical-align: text-bottom;
	}
}

@-webkit-keyframes breadcrumb {

	0% {
		background: fade(@primary, 50%);
	}

	100% {
		background: inherit;
	}
}

@keyframes breadcrumb {

	0% {
		background: fade(@primary, 50%);
	}

	100% {
		background: inherit;
	}
}

[data-breadcrumb-focus] {
	.animation(breadcrumb @animation-medium linear);
}