body {
	background-color: #a4b0a6;
	text-align: center;
	font-family:'Lato', sans-serif;
	display: grid;
	margin: 0;
	min-height: 100vh;
	max-width: 100vw;
}

header{
	background: #c7d6ca;
	margin-bottom: auto;
}

h1{
	font-size: 5rem;
	font-family: "Brush Script MT", cursive, sans-serif;
	padding: 0;
	margin: 0;
}

h2{
	font-size: 3rem;
	font-family: "Brush Script MT", cursive, sans-serif;
	padding: 0;
	margin: 0;
}

h3{
	font-size: 1.5rem;
	margin: 0;
	padding: 0 1em;
}

p{
	font-size: 1rem; 
	margin: 0;
	padding: 0;
}

img{
	width: 35em;
	margin: 1em;
	margin-bottom: 0;
}

audio{
	margin: 0.5em;
	max-width: 100%;
}

.container{
	display: grid;
	padding: 0 1em;
	grid-template-columns: 1fr 45em 1fr;
	justify-content: center;
	justify-content: space-between;
}

.fotos{
	display: grid;
	align-items: center;
	justify-items: center;
	object-fit: contain;
	grid-column: 2;
}

.about-me{
	display: grid;
	flex-direction: column;
	grid-column: 2;
}

.geluid{
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: auto;
	margin: 0;
	padding: 0;
	padding-bottom: 1em;
}

footer{
	background: #c7d6ca;
	margin-top: auto;
	padding-bottom: 0.5em;
}

@media only screen and (min-width: 770px) {
	h1{font-size: 6rem;}
	
	h2{font-size: 4rem;}
	
	h3{font-size: 1.5rem;}

	p{font-size: 1.3rem;}
}