diff --git a/index.css b/index.css
new file mode 100644
index 0000000..893bdd9
--- /dev/null
+++ b/index.css
@@ -0,0 +1,38 @@
+ .nav-link a {
+        color:orange;
+        text-decoration: none;
+    }
+main{
+    width: 600px;
+    margin-top:24px ;
+    margin-bottom:24px;
+    margin-left: auto;
+    margin-right: auto;
+}
+section{
+    margin-top: 24px;
+    margin-bottom: 24px;
+    padding: 16px;
+}
+#title{
+    font-size: 40px;
+    font-weight: 800;
+}
+.d-inline{
+    display: inline;
+}
+nav > ul {
+    list-style: none;
+}
+body{
+    background-color: #222222;
+    color:#EEEEEE;
+
+}
+#avatar{
+    width: 100px;
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 32px;
+    margin-bottom: 32px;
+    }
\ No newline at end of file
diff --git a/index.html b/index.html
index 763c638..e40c37c 100644
--- a/index.html
+++ b/index.html
@@ -3,20 +3,23 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>CSS Intro</title>
-    <!-- Exercise 1: Add a link element with a href attribute that links your external css file to this document  -->
-  </head>
+      <!-- Exercise 1: Add a link element with a href attribute that links your external css file to this document  -->
+  <link rel="stylesheet" href="./index.css">
+    </head>
 
   <body>
     <header>
-      <nav>
+      <nav class="nav-link">
         <ul>
-          <li>
+          <li class="d-inline">
             <a href="/">Home</a>
           </li>
-          <li>
+          <li class="d-inline
+          ">
             <a href="/about">About</a>
           </li>
-          <li>
+          <li class="d-inline
+          ">
             <a href="/projects">Projects</a>
           </li>
         </ul>
@@ -25,8 +28,8 @@
 
     <main>
       <section>
-        <h1>Main Heading</h1>
-        <img src="./images/example.png" alt="Author Headshot" />
+        <h1 id="title">Main Heading</h1>
+        <img id="avatar" src="./images/example.png" alt="Author Headshot" />
         <p>Author.. Bio...</p>
       </section>
       <article>
@@ -48,10 +51,12 @@ <h3>Another Sub Heading</h3>
     <footer>
       <nav>
         <ul>
-          <li>
+          <li class="d-inline
+          ">
             <a href="/privacy">Privacy Policy</a>
           </li>
-          <li>
+          <li class="d-inline
+          ">
             <a href="/terms">Terms and Conditions</a>
           </li>
         </ul>
