starting new design by section with home taking all screen height

styles/elements/home.css

@@ -0,0 +1,3 @@
+.home {
+	height: 100vh;
+}

styles/elements/projects.css

@@ -2,8 +2,13 @@
 #projects .project_description {
 	padding: 20px 0px;
 }
+#projects article h2 {
+	text-align: center;
+}
 #projects .project {
 	max-width: 900px;
+	display: flex;
+	flex-direction: column;
 }
 #projects #ljdp iframe {
 	height: 550px;

styles/elements/sections.css

@@ -0,0 +1,33 @@
+
+section header  { grid-area: header; }
+section article { grid-area: article; }
+section footer  { grid-area: footer; }
+
+section {
+	display: grid;
+	margin: 0px;
+	width: 100vw;
+	grid:
+    ' .         header    .        ' 1fr
+    ' .         article   .        ' auto
+    ' footer    footer    footer   ' auto
+	  / 1fr       auto      1fr      ;
+	grid-gap: 10px;
+}
+
+section header {
+	display: flex;
+	flex-direction: column;
+	place-content: center;
+}
+section footer {
+	display: flex;
+	flex-direction: column;
+}
+section header h1 {
+	display: flex;
+	flex-direction: row;
+	flex-wrap: wrap;
+	justify-content: center;
+}
+

styles/elements/title.css

@@ -1,9 +1,9 @@
 
 #name {	
-	margin:30px 0px 40px 0px;
+	margin:30px 0px 20px 0px;
 }
 #title {	
-	margin:30px 0px 20px 0px;
+	margin:20px 0px 20px 0px;
 }
 .title {
 	gap:10px 30px;