body{
	font-family: system-ui, sans-serif;
	font-size: 100%;
	line-height: 135%;
	background: #bcd;
	margin: 0;
}
body.home{background: #cdb;}
body.about{background: #dbc;}
body.gallery {background: #cbd;}

.contact h2 {font-style: italic;}

/*.home li:nth-child(1) a	{
		pointer-events: none;
	}*/

a.current{pointer-events: none;}

footer {
	padding: 0 1em;
}
header {
	background-color: rgba(255,255,255,.4);
	display: flex;
	flex-direction: column;
	height: 50vh;
	align-items: center;
	justify-content: relative;
}

h1{
	font-size: 1em; 
	position: absolute;
	top: 0;
	left: 1em;
}
h2{
	font-size: 8vw;
}

ul.main-links{
	list-style: none;
	padding-left: 0;
	display: flex;
	flex-direction: column;
	height: 8em;
	justify-content: space-between;
	align-items: center;
}
li.main-link {
	width: 75%;
	height: 24px;
}

.main-links a {
	text-decoration: none;
	background-color: rgba(75,75,75,.5);
	color: #fff;
	display: block;
	height: 1.5em;
	text-align: center;
}
@media (min-width: 600px) {  /*override function that, when condition is met, rules override previous rules*/
	li.main-link{
		width: 20%;		
	}
	ul.main-links{
		flex-direction: row;
	}
	

}