.breadcrumb {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: flex-start;
	width: 100%;
	padding: @15px 0 @30px 0;

	@media (max-width: @responsiveTablet) {
		display: none;
	}
}

.breadcrumb__item {
	margin-right: 0.5rem;
	text-transform: lowercase;
	font-size: @fontSizeBreadcrumb;
	@media (min-width: @responsiveDesktopXL) {
		font-size: calc(@fontSizeBreadcrumb * 1.5);
	}
	color: lighten(@colorFont, 40%);

	&:after {
		content : '-';
		display: inline-block;
		padding-left: 0.25rem;
	}

	&:last-child:after {
		display: none;
	}

	a {
		color: lighten(@colorFont, 40%);
	}
}