html,body{
	margin:0;
	padding:0;
	font-family: "Teachers", sans-serif;
	background:#eee;
}
body>header{
	background:#1e0b87;
	color:#fff;
	padding:2rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap:2rem;
}
body>header>div>h1{
	margin:0;
	display: inline-block;
	text-align: center;
}
body>header>div>img{
	max-width: 5rem;
}
header>nav,header>div{
	width:100%;
	display:flex; 
}
header>div{
	justify-content: center;
	flex-wrap:wrap;
	gap:1rem;
}
header>nav{
	justify-content: space-evenly;
	max-width: 80rem;
	flex-wrap: wrap;
}
header>nav>a{
	color:#fff;
	text-decoration: none;
}
header>nav>a:hover{
	text-decoration: underline;
	color:#fff218;
}
main, aside{
	margin:1rem;
	background-color: #fff;
	padding:1rem;
	max-width: 60rem;
}
img{
	max-width: 100%;
}
h2{
	color:#0170de;
}
a{
	color:#0170de;
}
a:hover{
	color:#1e0b87;
}
form{
	max-width: 40rem;
}
form>div{
	margin:.5rem 0;
}
.field{
	display: grid;
	grid-template-columns: 1fr 5fr;
}
select, input[type=date]{
	justify-self: flex-start;
}
textarea{
	width:100%;
	height:10rem;
}
button, input[type=submit]{
	font-family: "Teachers", sans-serif;
	font-size: 1rem;
	padding:.25rem 1rem;
	color:#fff;
	background-color: #0170de;
	outline:none;
}
button:hover, input:hover[type=submit]{
	background-color: #1e0b87;
}
@media (min-width:992px){
	main, aside{
		max-width: unset;
	}
	main{
		margin:1rem .5rem 1rem 1rem;
	}
	aside{
		margin:1rem 1rem 1rem .5rem;
	}
	body{
		display: grid;
		grid-template-columns: 3fr 1fr;
	}
	header{
		grid-area:1/1/2/3;
	}
}


.flash{
	.info{
		padding:1rem;
		background:#f9c349;
		border:1px solid #b78920;
	}
}