@charset "UTF-8";
@media only screen and (max-width: 75rem) {

	body {
		width: 65rem;
	}
	body, body > article, body > article > p {
		font-size: 1rem;
	}
	main {
	    overflow: hidden;
		grid-template-rows: 1.5rem 6.5rem 36rem 2rem;
		grid-row-gap: 1rem;
	}
	header {
		height: 5rem;
	    margin: -1rem auto 0;
	    padding: .85rem;
	}
	.Three-Dee, a h1.Three-Dee {
	    font-size: 4rem;
	}
	section {
		margin: -2rem auto 0;
		display: grid;
		grid-template-rows: 7.5rem 7.5rem 7.5rem 7.5rem;
		grid-row-gap: 2rem;
	}
	article {
		padding: 0 .75rem;
	    height: 7rem;
	    margin: 1.5rem auto;
	    border: .25rem solid #C0F;
	}
	article:after {
		content: "";
	    box-shadow: inset 0 0 1.5rem #0CF;
	}
	article > p {
		font-size: 1rem;
		margin: 0 .75rem;
	}
	article:hover {
	    box-shadow: inset 0 0 1.5rem #3FF, inset 0 0 2rem #C3F;
	    border: 1.5rem inset #0C3,1.25rem outset #0FF;
	}
	article h2 {
	    height: 2.25rem;
	    font-size: 2rem;
	    color: #C04;
	    text-shadow: .15rem .15rem 0 #FF0, .15rem .15rem 0 #333, .25rem .25rem 0 #C0C, .5rem .5rem 0 #30F;
	    z-index: 3;
	}

	article h2:hover {
	    color: #3D6;
	    text-shadow: .15rem .15rem 0 #494, .15rem .15rem 0 #696, .25rem .25rem 0 #439, .35rem .35rem 0 #C3C,
	                 -.15rem -.15rem 0 #36F, -.25rem -.25rem 0 #C6F, -.5rem -.5rem 0 #644;
	}
	.flexx {
		width: 65rem;
	    padding: .85rem;
	    border: .15rem solid #CF3;
	    font-size: .85rem;
	    color: #3A2;
	}
	.flexx label {
	    font-size: .85rem;
	    color: #3A2;
	}
	.nav > ul, ul li, ul ul li, ul ul ul li,
	ul li ul li, ul li ul li ul li, li, button {
		width: 4.5rem;
		height: 1.25rem;
	}
	.nav > ul a, .nav li a,
	.nav > ul a, .nav li a,
	button a {
		font-size: .85rem;
	}
}