.phff-header {
	display: block;
	width: 100%;
	font-size: calc(2.5 * var(--asize));

	.logo {
		display: block;
		width: auto;
		height: calc(5 * var(--asize));
		margin: var(--asize);
		padding: 7px;
	}
	.logo-small {
		display: block;
		width: auto;
		height: calc(2.5 * var(--asize));
		margin: min(2vw, 1.5 * var(--asize));
	}
	a {
		color: var(--white);
      		border: none;
      		cursor: pointer;
      		text-decoration: none;
	}
	a:hover {
		color: var(--yellow);
	}
	.container {
  		display: flex;
		justify-content: space-between;
		padding: 0px;
		background: var(--green);
		text-align: center;
		font-weight: bold;
		.side-menu {
			display: flex;
			justify-content: space-evenly;
			align-items: center;
			padding: var(--asize);
			.language-choice {
				padding: var(--asize);
			}
		}
		.navigation-menu {
			display: flex;
			align-items: center;
			color: var(--white);
		}
		.navigation-menu div {
			min-width: max-content;
			margin-left: 1vw;
			margin-right: 1vw;
		}
		.navigation-dropdown {
			position: relative;
			display: inline-block;
			overflow: visible;
			height: 100%;

			.dropbutton {
				color: var(--white);
				background-color: var(--green);
				text-align: center;
				font-weight: bold;
				padding: 0;
				height: 100%;
				border: none;
				cursor: pointer;
				font-size: inherit;
			}
			.dropdown-content {
				display: none;
			  	position: absolute;
				transform: translate(-4vw);
			  	background-color: var(--green);
			  	min-width: max-content;
			  	box-shadow: 0px calc(0.6 * var(--asize)) var(--asize) 0px rgba(0,0,0,0.2);
			  	z-index: 1;
			  	font-weight: bold;
			  	text-align: left;
				padding: 1vh 3vw 1vh 3vw;
			}
			.dropdown-content > div {
				padding: 1vh 1vw 1vh 1vw;
			}
		}
		.navigation-dropdown:hover .dropdown-content {
			display: block;
		}
		.navigation-dropdown:hover .dropbutton {
			color: var(--yellow);
		}
	}

}