diff --git a/home/index.css b/home/index.css
index 9916371..024a8bb 100644
--- a/home/index.css
+++ b/home/index.css
@@ -135,8 +135,4 @@ main {
 
 main > h1 {
     max-width: 20em;
-}
-
-.hidenav {
-    display: none;
 }
\ No newline at end of file
diff --git a/home/index.html b/home/index.html
index 5f37425..9f67d28 100644
--- a/home/index.html
+++ b/home/index.html
@@ -17,6 +17,7 @@
     <link rel="stylesheet" href="home/index.css" media="screen">
     <link rel="stylesheet" href="style/mobile.css" media ="screen and (max-width:800px)">
 </head>
+
 <body id="clicked">
 
     <nav class="navigation">
@@ -25,7 +26,7 @@
         <a class="nav link" id="port" href="portfolio/portfolio.html"><h2>Portfolio</h2></a>
         <a class="nav link" id="blog" href="blog/blog.html"><h2>Blog</h2></a>
         <a class="nav link" id="contact" href="contact/contact.html"><h2>Contact</h2></a>
-        <a class="arrow right"></a>
+        <a class="arrow"></a>
     </nav>
     
     <main>
diff --git a/portfolio/portfolio.css b/portfolio/portfolio.css
index e69de29..9f4dc63 100644
--- a/portfolio/portfolio.css
+++ b/portfolio/portfolio.css
@@ -0,0 +1,48 @@
+body {
+    grid-template-areas:
+        "nav nav nav"
+        "main main main"
+        "footer footer footer";
+}
+
+main {
+    display: grid;
+    grid-template-rows: auto;
+    grid-template-areas:
+    "ardent"
+    "efron"
+    "website"
+    ;
+}
+
+.project {
+    background-color: rgba(0, 0, 0, 70%);
+    color: #e5e5e5;
+}
+.right {
+    margin-top: 2em;
+    margin-left: 40em;
+    border-top-left-radius: 10em;
+    border-bottom-left-radius: 10em;
+    padding-left: 2.5em;
+}
+
+.left {
+    margin-top: 2em;
+    margin-right: 40em;
+    border-top-right-radius: 10em;
+    border-bottom-right-radius: 10em;
+    padding-left: 0.5em;
+}
+
+#ardent {
+    grid-area: ardent;
+}
+
+#efron {
+    grid-area: efron;
+}
+
+#website {
+    grid-area: website;
+}
\ No newline at end of file
diff --git a/portfolio/portfolio.html b/portfolio/portfolio.html
index 9c1d415..623644b 100644
--- a/portfolio/portfolio.html
+++ b/portfolio/portfolio.html
@@ -25,11 +25,29 @@
         <a class="nav link" id="port" href="portfolio/portfolio.html"><h2>Portfolio</h2></a>
         <a class="nav link" id="blog" href="blog/blog.html"><h2>Blog</h2></a>
         <a class="nav link" id="contact" href="contact/contact.html"><h2>Contact</h2></a>
-        <a class="arrow right"></a>
+        <a class="arrow"></a>
     </nav>
 
     <main>
         <a class="shownav" href="portfolio/portfolio.html#clicked"></a>
+
+        <section class="project left">
+            <h1 class="title">Ardent</h1>
+            <img src=""/>
+            <p class="description">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Facere, odit aut quod quam dolores fuga dolor illum neque, sunt laboriosam consequuntur harum, assumenda id soluta aliquid dolorum ullam deleniti vero.</p>
+        </section>
+        
+        <section class="project right">
+            <h1 class="title">Efron's Dice</h1>
+            <img src=""/>
+            <p class="description">Lorem ipsum dolor sit amet consectetur adipisicing elit. Explicabo commodi eveniet porro hic saepe ratione adipisci soluta consectetur voluptates id, asperiores voluptatum fugiat reiciendis impedit quasi quae aliquam? Atque, ipsum!</p>
+        </section>
+
+        <section class="project left">
+            <h1 class="title">Portfolio Website</h1>
+            <img src=""/>
+            <p class="description">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Facere, odit aut quod quam dolores fuga dolor illum neque, sunt laboriosam consequuntur harum, assumenda id soluta aliquid dolorum ullam deleniti vero.</p>
+        </section>
     </main>
 
     <footer>
diff --git a/style/main.css b/style/main.css
index 0dc7abc..ddbd998 100644
--- a/style/main.css
+++ b/style/main.css
@@ -25,7 +25,8 @@ main {
 .navigation {
     top: 0em;
     margin: 0;
-    margin-right: -24em;
+    grid-area: nav;
+    width: 80em;
     display: grid;
     grid-template-columns: 20% 20% 20% 20% 20%;
     grid-template-areas: "home port blog contact arrow";
@@ -95,7 +96,7 @@ nav > .link:hover {
 }
 
 .arrow {
-    margin-left: 6em;
+    margin-left: 12em;
     margin-top: 1em;
     border:0.5em solid #f29602;
     border-width: 0em 0.5em 0.5em 0em;
@@ -105,12 +106,10 @@ nav > .link:hover {
     padding: 0.5em;
     opacity: 1;
     transition: opacity 1s ease-in;
-}
-
-.right {
     transform: rotate(-45deg);
 }
 
+
 .moreInfo {
     position: relative;
     text-decoration: underline;
@@ -147,4 +146,8 @@ nav > .link:hover {
 @font-face {
     font-family: body;
     src: url("../assets/fonts/Yomogi-Regular.woff");
+}
+
+.hidenav {
+    display: none;
 }
\ No newline at end of file
