html,body{
	font-size:110%;
	margin:0;
	padding:0;
}
body{
	background-color:#C6FBF0;
}
body>nav{
	background-color:#7D7ABC;
	a{
		display:inline-block;
		padding:1rem;
		color:white;
		text-decoration:none;
		&.current{
			background-color:#EF767A;
		}
	}
}

main{
	background-color:#ECFEFA;
	max-width:80rem;
	margin:0 auto;
	padding:1rem;
	border:1px solid #09AE8B;
	border-top:0;
	border-radius:0 0 1rem 1rem;
}


.flash{
	position:absolute;
	right:3rem;
	top:3rem;
}
.flash p{
	background-color:#eee;
	border:1px solid #888;
	padding:1rem;
	border-radius:3px;
	&.info{
		background-color:#29e329;
		border-color:#0e620e;
	}
}


.index{
	display:flex;
	gap:1rem;
	flex-wrap:wrap;

	&>a{
		display:inline-block;
		width:12rem;
		height:4rem;
		background-color:#e8e8e8;
		border:1px solid #888;
		border-radius:3px;
		transition:background .1s;
		text-decoration:none;
		color:black;
		padding:1rem;

		&:hover{
			background-color:#eee;
		}
	}
}