.subheader {
	background-color: $color-neutral-6;
	width: 100%;
	vertical-align: middle;
	cursor: default;
	position: relative;
	font-size: 0.85em;
	z-index: 10;

	&,
	a {
		color: $color-grey;
	}

	.page-container {
		
		padding-top: 8px;
		padding-bottom: 8px;
		min-height: $subheader-height;

		&.-full-w {
			
		    @include spacer(padding-left);
			@include spacer(padding-right);
		}

		&:after {
			display: none;
		}

		@include flex;
		@include align-items(center);
		@include flex-just(space-between);
	}

	@include tablet-screen {

		padding-right: $grid-spacer;
		padding-left: $grid-spacer;
	}

	@include sm-screen {

		padding-right: 0;
		padding-left: 0;
	}

	ul {

		&,
		li {

			@include flex;
			@include align-items(center);
		}

		&.-left,
		&.-right {

			> li {

				&:not(:last-child) {

					&::after {
						content: "";
						height: 1rem;
						width: 1px;
						background-color: $color-grey;
						margin: 0px 0.5rem;
						display: block;
					}
				}
			}
		}

		&.-right {

			&,
			li {

				@include flex-direction(row-reverse);
			}
		}
	}
}