html body {
	height: 100svh;
	margin: 1svh;
	background-color: var(--white);
	color: var(--black);
}

.nav_button {
	text-align: center;
}

.nav_button a {
	display: inline-block;
	text-decoration: none;
	font-size: small;
	margin: 0 15px;
	padding: 1svh;
	border-color: var(--pink);
	border-radius: 10%;
	color: var(--black);
	background-color: var(--green);
	cursor: pointer;
}

.nav_button a:hover{
	background-color: var(--green-hover);
}

.nav_button a:active{
	background-color: var(--green-hover);
}

body {
	display: flex;
	flex-direction: column;
	min-height: 100svh;
}

#hero-img {
	display: block;
	width: 100%;
	max-width: 40svh;
	height: auto;
	margin: 0 auto;
}

main	{
	flex: 1;
}

main p {
	text-align: justify;
	margin: 0 10svh;
}

.main_title {
	text-align: center;
	color: var(--pink);
}

h2 {
	color: var(--pink);
	text-align: center;
}

footer	{
	border-top: 1px solid var(--black);
	margin-top: 5svh;
	padding-top: 1svh;
	text-align: center;
	font-size: small;
}

footer a {
	text-decoration: none;
	color: grey;
}

footer a:hover {
	text-decoration: underline;
}

footer a:active {
	text-decoration: underline;
}