.breadcrumbs-container {
	font-size: 13px;
	line-height: 20px;
	opacity: 0.86;
	margin-bottom: -50px;
	padding: {
		bottom: 15px;
		top: 15px;
	}
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 999;

	a,
	span {
		display: inline-block;
	}

	&.breadcrumbs-woocommerce {
		.fa {
			margin: 0 5px;
		}
	}

	&.breadcrumbs-yoast {
		.fa {
			margin: 0 2px;
		}
	}

	.archive-header-wrapper & {
		margin: {
			left: -15px;
			right: -15px;
		}
		width: calc(100% + 30px);
	}

	&,
	.archive-header-wrapper & {
		@include media(">=phone") {
			margin: {
				left: -9999px;
				right: -9999px;
			}
			padding: {
				left: 9999px;
				right: 9999px;
			}
			width: auto;
		}
	}
}

/** IE 11 Fix for Breadcrumbs **/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.breadcrumbs-container.breadcrumbs-yoast {
		margin-top: 0;
	}
}