diff --git a/index.html b/index.html
index 0fbb7a4..788c690 100644
--- a/index.html
+++ b/index.html
@@ -9,19 +9,31 @@
   <body>
 
 
+ 
+
+
     <canvas id="bg"></canvas>
+
 <div id="div1" class="page-wrapper">
+  <div class="navbar">
+    <a href="#description">About</a>
+    <a href="#projects">Projects</a>
+    <a href="#jobs">Experience</a>
+    <a href="#school">Education</a>
+    <a href="https://whoisthisjoker.com">Blog</a>
+  </div>
     <header>
       <h1> Daniel Jones</h1>
       <p>Web Developer, Game Designer, and Blogger.</p>
     </header>
 <div id="description">
+  <h1>About Me</h1>
     <p>
       My name is Daniel Jones. I have been programming as a hobby since I was twelve years old.
       <br>
           I went to college for Information Systems, and have been using those skills professionally since 2021.
       <br>
-          My interests include geocaching, Rust programming, web development, and puzzle solving.
+          My interests include geocaching, programming, web development, and puzzle solving.
     </p>
   </div>
 
@@ -100,7 +112,9 @@
         </ul>
       </ul>
     </p>
-</div>
+
+
+  </div>
 
 <footer>
 <div id="attribution">
diff --git a/main.js b/main.js
index 82849a1..11663ce 100644
--- a/main.js
+++ b/main.js
@@ -2,7 +2,7 @@
 Author: Daniel Jones
 IDE: VSCodium
 Browsers tested: Firefox 125
-Last change: 08/01/24
+Last change: 08/02/24
 purpose: portfolio website to show to potential freelance customers/web developer positions
 */
 
@@ -38,16 +38,16 @@ renderer.render(scene, camera);
 
 
 //code to import GLTF file
-let loadedModel;
+let loadedCmpModel; // model for PC
 const cmpLoader = new GLTFLoader();
 cmpLoader.load('./assets/models/Comp_and_Floppy/scene.gltf',(gltfScene)=>{
-    loadedModel = gltfScene;
+    loadedCmpModel = gltfScene;
     console.log("UwU whats this? My comupter model loaded! OwO");
     gltfScene.scene.position.z = 50; //for reference tomorrow when I work on this again...gltfScene is the actual object that you set attributes to. Mess with that.
     gltfScene.scene.position.y = 20;
     gltfScene.scene.scale.set(10,10,10);
     
-    scene.add(loadedModel.scene);
+    scene.add(loadedCmpModel.scene);
    
 }
 );
@@ -63,7 +63,7 @@ scene.add(ambientLight);
 
 //background texture
 const spaceTexture = new THREE.TextureLoader().load('./assets/pics/galaxy.jpg');
-spaceTexture.magFilter = THREE.NearestFilter;
+spaceTexture.minFilter = THREE.LinearFilter;
 scene.background = spaceTexture;
 
 //turning off orbit controls and lighthelper. Not needed. Kept in code in case if I want to use it again.
@@ -98,6 +98,7 @@ window.addEventListener("scroll", updateCamera);
 //animation loop every cycle.
 function animate(){
     
+    renderer.setSize(window.innerWidth, window.innerHeight);
     requestAnimationFrame(animate);
     renderer.render(scene, camera);
 }
diff --git a/style.css b/style.css
index b4fea73..7eab809 100644
--- a/style.css
+++ b/style.css
@@ -32,17 +32,12 @@ body {
     display: grid;
     grid-template-columns: repeat(1, 1fr);
 }
-footer {
-    margin-top: 100px;
-    grid-column: 3 / 8;
-    background-color: rgb(128, 128, 128, 0.5);
-    border-radius: 10px;
-    padding: 10%;
-}
+
 
 header {
+    margin-top: 50px;
     grid-column: 2 / 8;
-    background-color: rgb(128, 128, 128, 0.5);
+    background-color: rgb(77, 76, 76, 0.5);
     border-radius: 10px;
     padding: 10%;
 }
@@ -51,7 +46,7 @@ header {
 #description {
     margin-top: 50px;
     grid-column: 2 / 8;
-    background-color: rgb(128, 128, 128, 0.5);
+    background-color: rgb(77, 76, 76, 0.5);
     border-radius: 10px;
     padding: 10%;
 }
@@ -60,8 +55,7 @@ header {
 #projects {
     margin-top: 100px;
     grid-column: 2 / 8;
-    background-color: rgb(128, 128, 128, 0.5);
-    
+    background-color: rgb(77, 76, 76, 0.5);
     border-radius: 10px;
     padding: 10%;
 }
@@ -69,7 +63,7 @@ header {
 #jobs {
     margin-top: 100px;
     grid-column: 2 / 8;
-    background-color: rgb(128, 128, 128, 0.5);
+    background-color: rgb(77, 76, 76, 0.5);
     border-radius: 10px;
     padding: 10%;
 }
@@ -77,8 +71,36 @@ header {
 #school {
     margin-top: 100px;
     grid-column: 2 / 8;
-    background-color: rgb(128, 128, 128, 0.5);
+    background-color: rgba(77, 76, 76, 0.5);
     border-radius: 10px;
     padding: 10%;
 }
 
+/* The navigation bar */
+.navbar {
+    position: fixed; /* Set the navbar to fixed position */
+    overflow: hidden;
+    background-color: #333;
+    top: 0; /* Position the navbar at the top of the page */
+    left:0;
+    right: 0;
+  }
+  
+  /* Links inside the navbar */
+  .navbar a {
+    margin: 0px;
+    float: left;
+    display: block;
+    color: #f2f2f2;
+    text-align: left;
+    padding: 14px 16px;
+    text-decoration: none;
+  }
+  
+  /* Change background on mouse-over */
+  .navbar a:hover {
+    background: #ddd;
+    color: black;
+  }
+  
+  /* Main content */
\ No newline at end of file
