.headerContainer {
	background: var(--white);
	height: 6.5rem;

	display: flex;
	align-items: center;

	padding: 2rem;

	border-bottom: 1px solid var(--gray-100);

	transition: all 0.1s ease-in-out;

	p {
		font-size: 1.1rem;
		margin-left: 2rem;
		padding: 0.25rem 0 0.25rem 2rem;
		border-left: 1px solid var(--gray-100);
	}

	span {
		font-size: 1.1rem;
		margin-left: auto;
		text-transform: capitalize;
	}

	button.themeSwitcher {
		margin-left: 25px;
		background: transparent;
		border: 0;
	}
}

@media screen and (max-width: 1024px) {
	.headerContainer {
		p {
			display: block;
		}
	}
}

@media screen and (max-width: 720px) {
	.headerContainer {
		p {
			display: none;
		}
	}
}

@media screen and (max-width: 400px) {
	.headerContainer {
		span {
			display: none;
		}
		button.themeSwitcher {
			margin-left: auto;
		}
	}
}
