aligned content to the center instead of to the left

static/index.css

@@ -14,6 +14,12 @@ GNU General Public License for more details.
 You should have received a copy of the GNU General Public License
 along with this program.  If not, see <https://www.gnu.org/licenses/>.Rawley Fowler, 2022
 */
+
+html {
+	max-width: 100vw;
+	min-height: 100vh;
+}
+
 body {
 	color: #242124;
 	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
@@ -21,10 +27,9 @@ body {
 	-moz-osx-font-smoothing: grayscale;
 	background-color: #fafafa;
 	font-size: calc(12px + 0.33vw);
-	max-width: 100vw;
-	min-height: 100vh;
-	margin-left: 3vw;
-	margin-right: 3vw;
+	margin: auto;
+	padding: 1.3em;
+	max-width: clamp(300px, 600px + 3vw, 900px);
 }
 
 h1 { 
@@ -32,6 +37,7 @@ h1 {
 	font-weight: 800;
 	margin-bottom: 0;
 	margin-top: 12px;
+	font-style: italic;
 }
 
 h2 {
@@ -75,7 +81,7 @@ a::after {
 	right: 0;
 	bottom: 0;
 	transition: 102ms cubic-bezier(0, 0.86, 0.1, 1);
-	background-color: rgba(72,61,139, 0.3);
+	background-color: rgba(255, 233, 0, 0.6);
 }
 
 a:hover:after {
@@ -84,8 +90,8 @@ a:hover:after {
 
 .header {
 	display: flex;
-	flex-direction: row;
-	justify-content: space-between;
+	flex-direction: column;
+	justify-content: center;
 }
 
 .nav-bar {
@@ -93,6 +99,7 @@ a:hover:after {
 	flex-direction: row;
 	font-size: 1.1em;
 	margin-top: calc(12px + 1vh);
+	margin-bottom: 3vw;
 }
 
 .nav-item {
@@ -102,6 +109,10 @@ a:hover:after {
 	font-weight: 800;
 }
 
+.nav-item:first-of-type {
+	margin-left: 0;
+}
+
 .content-wrapper {
 	margin: 12px;
 }
@@ -132,10 +143,3 @@ a:hover:after {
 .skill-keywords > i::after {
 	content: "' ";
 }
-
-@media only screen and (max-width: 508px) {
-	.header {
-		flex-direction: column;
-		justify-content: center;
-	}
-}