* {
	box-sizing: border-box;
}

.subtitle {
	font-size: 60%;
}

header {
	height: 10vh;
	background-color: #f57c14;
	color: #ffffff;
	padding: 5px;
}

@media screen and (max-width: 400px) {
	header {
		height: 13vh;
	}
}

.grid-container-header {
	display: grid;
}

nav {
	grid-column: 2;
	grid-row: 2;
	float: right;
}

nav a {
	padding: 3px;
	color: #ffffff;
	float: right;
	text-decoration: none;
	margin: 2px;
	border-radius: 5px;
	background-color: #ffffff4e;
}

nav a:hover {
	background-color: #ffffff87;
}

.grid-item-logo {
	float: right;
}

#asta-logo {
	grid-column: 2;
	grid-row: 1;
	height: 5vh;
	width: 10vh;
	float: right;
	align-self: end;
}

#hsg-portal-logo {
	grid-column: 1;
	grid-row: 1 / span 2;
	height: 9.4vh;
	width: 24vh;
	float: left;
	padding-left: 10px;
}

main {
	padding: 10px;
}