Create project grid items

src/Grid.css

@@ -5,7 +5,7 @@
 }
 
 .grid-item {
-	background: linear-gradient(135deg, #87e0fd 0%,#53cbf1 40%,#05abe0 100%);
+	//background: linear-gradient(135deg, #87e0fd 0%,#53cbf1 40%,#05abe0 100%);
 	position: relative;
 
 	float: left;
@@ -23,6 +23,79 @@
 	padding: 1rem;
 }
 
+.menu {
+	display: flex;
+	flex-flow: column;
+}
+
+.menu .logo {
+	width: 100%;
+	padding: 1rem 5rem 0;
+}
+
+.menu section {
+	display: flex;
+	min-height: 0;
+}
+
+.menu aside {
+	flex: 1;
+	align-self: center;
+	text-align: right;
+}
+
+.menu .mug {
+	height: 100%;
+	padding: 2rem;
+}
+
+.project {
+	display: flex;
+	flex-flow: column;
+}
+
+.project header {
+	font-size: 2.25rem;
+	line-height: 1.2;
+}
+
+.project section {
+	min-height: 0;
+	flex: 1;
+	display: flex;
+}
+
+.project footer {
+	display: flex;
+	justify-content: space-between;
+	margin: 0 1em;
+	font-size: 1rem;
+	font-family: monospace;
+}
+
+.project.bottom section {
+	flex-flow: column;
+}
+
+.project.left section p {
+	align-self: center;
+}
+
+.project.left section img {
+	height: 100%;
+	padding: 1rem;
+}
+
+.project.bottom section p {
+	margin-bottom: 1rem;
+}
+
+.project.bottom section img {
+	object-fit: contain;
+	min-height: 0;
+	padding: 1rem;
+}
+
 @media all and (max-width: 120rem) {
 	.grid-item {
 		width: 25%;
@@ -49,7 +122,7 @@
 
 @media all and (max-width: 51rem) {
 	.grid-container {
-		max-width: 34rem;;
+		max-width: 34rem;
 	}
 	.grid-item {
 		width: 100%;