/**
 * Compact header: logo/menu and social icons share the same row.
 * Matches the Almanaque header on every page.
 */

header.header {
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-areas:
		"mid top"
		"mobile mobile";
	align-items: center;
}

.header-mid {
	grid-area: 1 / 1 / 2 / 3;
	min-width: 0;
}

.header-top {
	grid-area: 1 / 2 / 2 / 3;
	z-index: 6;
	align-self: stretch;
	display: flex;
	align-items: center;
	background: transparent !important;
	background-color: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

.header-top:before,
.header-top:after {
	display: none !important;
	border: 0 !important;
}

.header-top,
.header-top .container,
.header-top .container-wrapper,
.header-top .container-inner,
.header-socials {
	border: 0 !important;
	box-shadow: none !important;
}

.header-mid,
.header-logo-menu,
.header-logo-menu-wrapper,
.header-logo-menu .container-wrapper {
	border-left: 0 !important;
	border-right: 0 !important;
}

.header-top .container,
.header-top .container-inner {
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none;
}

.header-top .container-inner {
	display: flex;
	align-items: center;
	padding-left: 32px !important;
	padding-right: 20px !important;
}

.header-socials {
	float: none;
	margin: 0;
	padding: 0;
	text-align: right;
	white-space: nowrap;
}

.header-socials .om-social-icon,
.header-socials [class^="social-icon"],
.header-socials [class*=" social-icon"] {
	width: 24px !important;
	height: 24px !important;
	background-size: 24px 48px !important;
	margin-left: 8px !important;
	margin-right: 0 !important;
	margin-bottom: 0 !important;
}

.header-tagline,
.header-wpml-selector {
	display: none;
}

@media (min-width: 768px) {
	.logo-menu-wrapper .menu-box {
		padding-right: 110px;
	}
}