diff --git a/components/header.tsx b/components/header.tsx
index d1e64d1..1f067c7 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -5,10 +5,10 @@ const Header = styled.header`
 	display: flex;
 	align-items: center;
 	border-bottom: var(--border-size) var(--border-type) var(--border-color);
-	padding: var(--v-uni-padding) var(--h-uni-padding);
+	padding: 1rem 4rem;
+	gap: 2rem;
 
 	h1 {
-		font-size: 2rem;
 		font-weight: normal;
 	}
 
diff --git a/pages/index.tsx b/pages/index.tsx
index b55c12e..520e8c8 100755
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -1,11 +1,36 @@
 import type {NextPageWithLayout} from './_app'
 import type { ReactElement } from 'react'
 import Layout from '../components/layout'
+import styled from 'styled-components'
+
+const Section = styled.section`
+	display: flex;
+	justify-content: center;
+	flex-direction: column;
+	padding: 4rem 1rem;
+
+	h2 {
+		font-size: 2rem;
+	}
+
+	p {
+		color: var(--fg);
+	}
+`
 
 const Page: NextPageWithLayout = () => {
 	return (
 		<>
-			<p>I am a student with a passion for programming, physics/mathematics and *NIX (Linux, UNIX etc).</p>
+			<Section>
+				<h2 id="about">About</h2>
+				<p>I am a student with a passion for programming, physics, mathematics and *NIX (Linux, UNIX etc). </p>
+				<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque velit ligula, congue in nunc nec, aliquam rutrum massa. Aliquam pharetra, dui nec tincidunt feugiat, lacus metus dignissim augue, et lobortis nisi nisi vitae sapien. Sed consequat nisl quis tincidunt vulputate. Proin sem lectus, consequat imperdiet iaculis vel, tempus vitae enim. Pellentesque ullamcorper, arcu ut dignissim tincidunt, odio quam dignissim nisi, ut tempor dolor tortor at dui. Mauris porta velit est, sed condimentum nunc facilisis nec. Integer porta urna ac semper mattis. Cras vitae enim vitae urna tristique laoreet. Suspendisse justo diam, euismod pellentesque urna id, vestibulum sagittis diam. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nullam ut ante ac nibh dapibus egestas. Pellentesque id tellus sit amet diam aliquam pellentesque a sit amet enim. Phasellus vel luctus tortor. In orci erat, mattis tempor tellus ac, porta euismod erat. Praesent non vestibulum mauris, vitae commodo ante. Curabitur ut turpis nec arcu scelerisque viverra. </p>
+			</Section>
+
+			<Section>
+				<h2>Projects</h2>
+				<p>Check out my past projects bla bla</p>
+			</Section>
 		</>
 	)
 }
diff --git a/styles/globals.css b/styles/globals.css
index ff0de94..92bcccd 100755
--- a/styles/globals.css
+++ b/styles/globals.css
@@ -1,20 +1,21 @@
 :root {
-	font-size: 16px;
-	--border-type: dotted;
+	font-size: 18px;
+	--border-type: solid;
 	--border-size: 1px;
-	--border-color: #ddd;
+	--border-color: #373a44;
 	--border-radius: 1rem;
 
 	--content-max-width: 60rem;
 	--h-uni-padding: .8rem;
 	--v-uni-padding: .2rem;
 
-	--fg: #222;
+	--fg: #bbc2cf;
+	--fg-emph: #fff;
 	--fg-faded: #aaa;
-	--fg-button: #0a070a;
+	--fg-button: var(--fg-faded);
 	--fg-link: #abf;
 
-	--bg: #fefeff;
+	--bg: #272a34;
 	color: var(--fg);
 }
 
@@ -45,4 +46,11 @@ main {
 	min-height: 70vh;
 }
 
+h1, h2, h3, h4, h5 {
+	color: var(--fg-emph);
+}
+p {
+	margin: .5rem 0;
+}
+