
/* ############################################################
	MOBILE-NAVIGATION
############################################################ */

/* Hamburger */
a.nav-button {
	cursor: pointer;
	display: flex;
	align-items: center;
	position: relative;
	width: 100%;
	height: calc((12 * var(--col-width-1)) * var(--height-logo));
	overflow: hidden;
	background-color: var(--main-color-2);
}
	a.nav-button svg {
		display: block;
		width: 100%;
		height: auto;
	}
	a.nav-button.open svg.open, a.nav-button svg.close {
		display: none;
	}
	a.nav-button.open svg.close {
		display: block;
	}
@media screen and (min-width: 992px) {
	a.nav-button {
		height: calc((12 * var(--col-width-1)) * var(--height-logo-s));
		padding-left: 12px;
		background-color: var(--main-color-1);
		font-size: var(--font-size-large); /* 80px */
		line-height: 0.5; /* 40px */
		letter-spacing: calc(-1 * ((30 * var(--font-size-large)) / 1000)); /* -30px */
		color: var(--main-color-white);
	}
	a.nav-button:hover, a.nav-button:focus {
		letter-spacing: calc(-1 * ((150 * var(--font-size-large)) / 1000)); /* -150px */
	}
		a.nav-button svg.open, a.nav-button svg.close,
		a.nav-button.open svg.open, a.nav-button.open svg.close {
			display: none;
		}
}