#nav-wrapper {
	height: 126px;
	width: 100%;
	margin: 0 0 -1px 0;
	background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 25%);
}
nav {
	width: 100%;
	height: 80px;
	z-index: 1;
}
nav > div {
	display: grid;
	margin: 0 auto;
	min-width: 430px;
	max-width: 800px;
	line-height: 80px;
	grid-template-columns: 340px 1fr;
}
nav a {
	display: inline-block;
	text-decoration: none ! important;
	color: black;
}
nav #logo {
	width: 340px;
	font-size: 1.8rem;
	text-align: left;
	font-weight: bold;
	font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
}
nav #logo img {
	width: 125px;
	height: 125px;
	margin: 10px 10px 0 10px;
	vertical-align: top;
	transform: translateY(-32px);
	transition: 0.2s;
}

nav .flex-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	min-width: 132px;
}
nav .flex-grid a {
	flex: 0 0 125px;
	display: inline-block;
	width: 125px;
	height: 80px;
	line-height: 80px;
	font-size: 1.5rem;
	text-align: center;
}



nav .menu {
	position: relative;
	z-index: 1;
}
nav .menu .menu-check {
	display: none;
}
nav .menu .menu-button {
	display: none;
	background-color: white;
	position: relative;
	top: 1px;
	margin: 0 5px;
	border: 1px solid #ccc;
	border-radius: 10px;
	z-index: 1;
	cursor: pointer;
	width: 42px;
	height: 42px;
	padding: 6px;
}

nav .menu-check:checked + label .menu-button {
	background-color: white;
	border: 1px solid #ccc;
	border-bottom-color: white;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}
/**/

nav #languages.menu {
	margin-top: 12px;
	height: 56px;
}
nav #languages .menu-button {
	display: block;
}
nav #languages .menu-content {
	position: absolute;
	display: none;
	right: 5px;
	background-color: white;
	border: 1px solid #ccc;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}
nav #languages.menu a {
	display: block;
	text-align: right;
	width: calc(100% - 20px);
	font-size: 1.6rem;
	line-height: 3.5rem;
	height: 3.5rem;
	white-space: nowrap;
	padding: 0 10px;
}
nav #languages.menu a img {
	width: 32px;
	height: 32px;
	vertical-align: middle;
}
nav #languages a:hover {
	background-color: #ddd;
}

nav #languages .menu-check:checked + label .menu-button {
	/*content: url("/images/close.png");
	width: 32px;
	height: 32px;
	padding: 3px;
	*/
}
nav #languages .menu-check:checked + label + .menu-content {
	display: block;
}
/**/
@media (max-width: 800px) {
	#nav-wrapper {
		background-color: white;
	}
	nav #logo img {
		width: 100px !important;
		height: 100px !important;
		transform: translateY(0);
		transition: 0.2s;
	}
	nav .flex-grid {
		flex-direction: row-reverse;
		justify-content: flex-start;
	}
	nav .menu {
		margin-top: 12px;
		height: 56px;
	}
	nav .menu .menu-button {
		display: block;
		/*width: 50px;
		height: 50px;
		padding: 6px;
		*/
	}
	nav .menu-content {
		position: absolute;
		display: none;
		right: 5px;
		background-color: white;
		border: 1px solid #ccc;
		border-top-left-radius: 10px;
		border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
	}
	nav .menu a {
		display: block;
		width: calc(100% - 20px);
		font-size: 2.5rem;
		line-height: 5rem;
		height: 5rem;
		white-space: nowrap;
		padding: 0 10px;
	}
	nav #languages.menu a {
		font-size: 2.5rem;
		line-height: 5rem;
		height: 5rem;
	}
	nav #languages.menu a img {
		width: 48px;
		height: 48px;
	}
	nav .menu a:hover {
		background-color: #ddd;
	}
	
	nav .menu-check:checked + label .menu-button {
		/*content: url("/images/close.png");*/
	}
	nav .menu-check:checked + label + .menu-content {
		display: block;
	}
	/**/
}

nav.fixed {
	position: fixed;
	top: 0;
	left: 0;
	background-color: white;
	border-bottom: 1px solid #dddddd;
}
nav.fixed #logo img {
	width: 100px !important;
	height: 100px !important;
	transform: translateY(0);
	transition: 0.2s;
}