diff --git a/images/screenshot.png b/images/screenshot.png
index 2fb3bbb..fdf2e9b 100644
Binary files a/images/screenshot.png and b/images/screenshot.png differ
diff --git a/index.html b/index.html
index 0d59113..190b790 100644
--- a/index.html
+++ b/index.html
@@ -8,23 +8,28 @@
 	</head>
 
 	<body>
-		<div class="wrapper">
+		<main>
 			<header>
-				<img class="logo" src="images/icon256.png">
+				<div class="logoContainer">
+					<img src="images/icon256.png">
+				</div>
 
-				<h1 class="">phi code editor</h1>
-				<div class="section">
+				<div class="aboutContainer">
+					<h1 class="title">phi code editor</h1>
 					<p>
 						Phi is a code editor whose main goals are simplicity,
-						speed, and beauty. The editor is still a work in progress.
+						speed, and beauty.
+					</p>
+					<p>
+						The editor is still a work in progress.
 					</p>
 				</div>
-
-				<div class="section">
-					<img alt="screenshot of the editor" class="fit" src="https://raw.githubusercontent.com/felixangell/phi/master/screenshot.png">
-				</div>
 			</header>
-		</div>
+
+			<div class="screenshotContainer">
+				<img alt="screenshot of the editor" class="fit" src="./images/screenshot.png">
+			</div>
+		</main>
 	</body>
 
 </html>
diff --git a/main.css b/main.css
index 54d42ca..d006502 100644
--- a/main.css
+++ b/main.css
@@ -13,48 +13,31 @@ body {
 }
 
 header {
-	display: block;
-	width: 100%;
-	margin-bottom: 40px;
+	display: grid;
+	grid-template-columns: 30% 70%;
 }
 
-header nav {
-	display: inline-block;
-	width: 100%;
+h1.title {
+	margin: 1em 0;
 }
 
-header nav ul li {
-	display: block;
-	float: left;
-	margin: 15px;
+.logoContainer {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	justify-content: center;
+}
+.logoContainer img {
+	width: 65%;
 }
 
-a {
-	color: #f8f273;;
-}
-
-.section {
-	display: block;
-	margin: 20px 0 20px 0;
-}
-
-.logo {
-	display: block;
-	margin: 40px auto;
-	width: 10%;
-}
-
-.text-center {
-	text-align: center;
-}
-
-img.fit {
-	display: block;
-	max-width: 100%;
-}
-
-.wrapper {
+main {
 	display: block;
 	width: 800px;
-	margin: 0 auto;
+	margin: 5em auto;
+}
+
+.screenshotContainer img {
+	display: block;
+	width: 100%;
 }
\ No newline at end of file
