/* Breadcrumb under the page banner: centred, wraps cleanly on small screens, separators no longer overlap the text. */
.careerfy-breadcrumb { padding: 12px 15px 10px; }
.careerfy-breadcrumb ul { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; margin: 0; padding: 0; max-width: 100%; }
.careerfy-breadcrumb ul li { float: none; display: inline-flex; align-items: center; padding: 2px 0; line-height: 1.5; }
.careerfy-breadcrumb ul li:before { position: static; display: inline-block; margin: 0 12px; left: auto; top: auto; }
.careerfy-breadcrumb ul li:first-child:before { display: none; }
.careerfy-breadcrumb ul li a:hover { text-decoration: underline; }
@media (max-width: 767px) {
	/* One clean line on phones: the current page title is shortened with "..." instead of wrapping under a stray arrow. */
	.careerfy-breadcrumb ul { flex-wrap: nowrap; }
	.careerfy-breadcrumb ul li { font-size: 14px; flex: 0 0 auto; white-space: nowrap; }
	.careerfy-breadcrumb ul li:last-child { flex: 0 1 auto; min-width: 0; display: block; overflow: hidden; text-overflow: ellipsis; }
	.careerfy-breadcrumb ul li:last-child:before { display: inline-block; vertical-align: middle; }
	.careerfy-breadcrumb ul li:before { margin: 0 8px; }
}