/* ROOTGRIDMEDIAQUERIES */
@media only screen and (max-width: 460px) {
	body { display: block; padding: 0.2em; gap: 0.2em; overflow-x: hidden; width: 100%; padding-right: 0; }
	aside { margin-top: 3em; margin-bottom: 2em; }
	header { width: 96%; margin: auto; }
	main { display: block; }
	#section-b { background-color: var(--lightmax); margin-top: 2em; }
	#section-d, #section-i { margin: 3em auto 3em auto; }
	code { width: 90% }
	.footerdiv { display: block; }
	#footerdiv1, #footerdiv3 { margin-top: 3em; }
	.asidediv { display: block; }
	.asidediv div { display: block; margin-bottom: 1.1em; }
	nav { justify-items: center; padding: 0 1em 0 1em; border-radius: 2em/3em; font-size: 110%; }
	nav ul li { margin: auto 1em auto 1em; }
	nav ul li ul li a:link { font-size: 100%; }
	.main-nav a { font-size: 84%; }
	.main-nav { grid-auto-flow: unset; }
	nav ul li ul li { margin: auto; }
}
@media only screen and (min-width: 461px) and (max-width: 640px) {
	body { padding: 0.2em; gap: 0.2em; overflow-x: hidden; width: 100%; padding-right: 0; 	grid-template-columns: repeat(2, 1fr);
	grid-template-areas:
        "header header"
        "main main"
        "footer footer"
		"aside aside"; }
	aside { grid-area: aside; margin-top: 3em; margin-bottom: 2em; }
	header { grid-area: header; width: 96%; margin: auto; }
	main { display: block; }
	#section-b { background-color: var(--lightmax); margin-top: 2em; }
	#section-d, #section-i { margin: 3em auto 3em auto; }
	code { width: 90% }
	.footerdiv { display: block; }
	#footerdiv1, #footerdiv3 { margin-top: 3em; }
	.asidediv { display: block; }
	.asidediv div { display: block; margin-bottom: 1.1em; }
	nav { justify-items: center; padding: 0 1em 0 1em; border-radius: 2em/3em; }
	nav ul li { margin: auto 1em auto 1em; }
	nav ul li ul li a:link { font-size: 100%; }
	.main-nav a { text-decoration: none; }
	.main-nav { grid-auto-flow: unset; }
	nav ul li ul li { margin: auto; }
}