/**
 * ===== XS =====
 */

/* --- HEADER --- */

body > .canvas > header,
header .header-inner,
header .header-nav {
	height: 80px;
}

/* --- HEADER Inner --- */

header .header-inner {
	top:       -80px;
	max-width: 1280px;
}

header .header-inner::before {
	max-width:          1920px;
	-webkit-box-shadow: 0 6px 6px rgba(155, 155, 155, 0.2);
	-moz-box-shadow:    0 6px 6px rgba(155, 155, 155, 0.2);
	box-shadow:         0 6px 6px rgba(155, 155, 155, 0.2);
}

header .header-inner.affix {
	margin-top: -80px;
	height:     80px;
}

/* --- HEADER Logo --- */

header .header-inner > a#logo::before {
	background: url(../img/logo.svg);
	width:      110px;
	height:     66px;
	top:        6px;
	left:       9px;
}

header .affix a#logo::before {
	content: '';
	width:   96px;
	height:  58px;
	top:     12px;
	left:    26px;
}

header .header-inner > a#bmvi {
	position: absolute;
}

header .header-inner > a#bmvi::before,
header .affix > a#bmvi::before {
	content: none;
}

/* --- Hamburger --- */

header #hamburgerToggle + label {
	position: absolute;
	top:      14px;
	right:    7px;
}

/* --- Navigation --- */

header .affix .header-nav {
	height: 80px;
}

header .header-grid {
	-webkit-box-shadow: 0 6px 6px rgba(155, 155, 155, 0.2);
	-moz-box-shadow:    0 6px 6px rgba(155, 155, 155, 0.2);
	box-shadow:         0 6px 6px rgba(155, 155, 155, 0.2);
	padding-bottom:     36px;
}

header #hamburgerToggle:checked ~ .header-grid {
	top: 80px;
}

header .affix #hamburgerToggle:checked ~ .header-grid {
	top: 80px;
}

header nav > ul > li {
	margin:        0;
	*padding:      4px 0 2px;
	padding:       7px 24px;
	font-size:     1rem;
	font-weight:   600;
	border-bottom: 1px solid rgb(233, 233, 233);
}

header nav > ul > li input.submenu-toggle,
header nav > ul > li input.submenu-toggle + label {
	display: none;
}

header nav.hauptmenue-container > ul ul.sub-menu li {
	font-weight: 400;
}

/**
 * ===== SM =====
 */

@media screen and (min-width: 500px) {

	body > .canvas > header,
	header .header-inner,
	header .header-nav {
		height: 160px;
	}

	header .header-inner {
		top: -160px;
	}

	header .header-inner:not(.affix) > a#logo::before {
		content: '';
		width:   180px;
		height:  112px;
		top:     24px;
	}

	header .header-inner:not(.affix) > a#bmvi::before {
		content:         '';
		position:        absolute;
		background:      url(../img/bmv.svg);
		background-size: cover;
		width:           136px;
		height:          93px;
		top:             32px;
		left:            220px;
		display:         block;
		z-index:         9;
	}

	header #hamburgerToggle:checked ~ .header-grid {
		top: 160px;
	}

	header .affix #hamburgerToggle:checked ~ .header-grid {
		top: 80px;
	}

}

/**
 * ===== MD =====
 */

@media screen and (min-width: 800px) {

	body > .canvas > header,
	header .header-inner,
	header .header-nav {
		height: 160px;
	}

	header .header-inner {
		top: -160px;
	}

	header .header-inner.affix,
	header .header-inner.affix .header-nav {
		height: 80px;
	}

	header .header-inner.affix {
		top:        0;
		margin-top: -80px;
	}

	header .header-inner:not(.affix) > a#bmvi::before {
		width:  116px;
		height: 80px;
	}

	header #hamburgerToggle,
	header #hamburgerToggle + label {
		display: none;
	}

	header .header-grid {
		-webkit-box-shadow: none;
		-moz-box-shadow:    none;
		box-shadow:         none;
		padding-bottom:     0;
	}

	header #hamburgerToggle:checked ~ .header-grid {
		top: 0;
	}

	header nav > ul > li {
		margin:        0;
		padding:       16px;
		font-size:     15px;
		border-bottom: none;
	}

	header nav > ul > li.current_page_item > a,
	header nav > ul > li.current_page_parent > a {
		font-weight: 700;
	}

	/* --- Top-Menü --- */
	header .affix nav.topmenue-container {
		display: none;
	}

	header nav.topmenue-container > ul > li {
		padding: 16px;
	}

	header nav.topmenue-container > ul > li > a {
		font-size:   12px;
		font-weight: 500;
		text-align:  right;
	}

	/* --- Haupt-Menü --- */
	header .affix nav.hauptmenue-container > ul > li {
		padding-bottom: 13px;
	}

	header nav.hauptmenue-container > ul ul.sub-menu {
		top:           54px;
		margin:        0 -12px;
		padding:       12px 12px 0;
		min-width:     150px;
		border-radius: 0 0 12px 12px;
		box-shadow:    0 6px 6px rgba(0, 0, 0, .175);
	}

	header .affix nav.hauptmenue-container > ul ul.sub-menu {
		top: 51px;
	}

	header nav.hauptmenue-container > ul ul.sub-menu li a {
		display: block;
		height:  36px;
		padding: 0;
	}

}

/**
 * ===== LG =====
 */

@media screen and (min-width: 1100px) {

	body > .canvas > header,
	header .header-inner,
	header .header-nav {
		height: 160px;
	}

	header .header-inner {
		top: -160px;
	}

	header .header-inner.affix {
		top:        0;
		margin-top: -80px;
	}

	header .header-inner.affix,
	header .affix .header-nav {
		height: 80px;
	}

	header .header-nav {
		max-width: 1920px;
	}

	header .affix .header-nav::before {
		content:           '';
		position:          absolute;
		width:             100vw;
		height:            100%;
		top:               0;
		left:              50%;

		-webkit-transform: translateX(-50%);
		-moz-transform:    translateX(-50%);
		-ms-transform:     translateX(-50%);
		-o-transform:      translateX(-50%);
		transform:         translateX(-50%);
	}

	header .header-nav .hauptmenue-container > ul ul.submenu li a {
		font-size: 0.9rem;
		height:    32px;
		display:   block;
	}

	header .header-inner:not(.affix) > a#bmvi::before {
		width:  136px;
		height: 93px;
	}

}

/**
 * ===== SPECIAL =====
 */

@media screen and (min-width: 1100px) and (max-width: 1340px) {

	header nav > ul {
		margin: 0 24px 0 0;
	}

}

@media screen and (min-width: 800px) and (max-width: 1040px) {

	header .header-inner:not(.affix) > a#logo::before {
		width:  140px;
		height: 87px;
	}

	header .header-inner > a#bmvi::before {
		width:  112px;
		height: 76px;
	}

}

@media screen and (min-width: 800px) and (max-width: 880px) {

	header .affix nav.hauptmenue-container > ul > li {
		padding: 16px 7px;
	}

}