@media only screen and (min-width: 64em) {
/* Only CSS rules that need to be changed to meet the layout needs from medium to large/wide go in here */

	.hamburger {
		display: none;
	}

	.navigation {
		background-color: #333;
		overflow: hidden;
		text-align: left;
	}

	.navigation li {
		display: inline-block;
		margin-left: .25rem;
	}

	.navigation a {
		display: block;
		color: #eee;
		padding: .5rem;
		text-align: center;
		text-decoration: none;
	}

	.navigation a:hover {
		color: #000;
		background-color: #777;
	}

	nav {
		background-color: #1e2023;
	}

	nav button {}  /* hamburger button does not need to be shown */

	nav ul {
		list-style-type: none;
		margin: 0;
		padding: 0;
		overflow: hidden;
		background-color: #333;
		width:auto;
	}

	nav ul li {
		float: left;
		border-right: 1px solid #bbb;

	}

	nav ul li a {
		display: block;
		color: white;
		text-align: center;
		padding: 14px 16px;
		text-decoration: none;
	}

	nav ul li.active a {
		background-color: #4CAF50;
	}
	nav ul li a:hover {
		background-color: #111;
	}

	/*---------------BEGIN PAGE------------*/

	.picWrapper {
		display: grid;
		grid-template-columns: 250px 250px 250px;
		grid-row-gap: 40px;
		grid-column-gap: 40px;
	}

	.pic {
		height: 150px;
		width: 150px;
	}


}
