diff --git a/devstory5.html b/devstory5.html
index fcca3b5..dbb69bf 100644
--- a/devstory5.html
+++ b/devstory5.html
@@ -242,7 +242,7 @@ <h1 style="font-size: 1.6em;">Know Your Body Buddies</h1>
                     <source src="img/video5-1.mov">
                 </video>
                 <div class="vidcontrols" id="buttons1">
-                    <img src="img/downarrowbutton.svg" class="nextsectionbutton" onclick="scroll1()">
+                    <img src="img/downarrowbutton.svg" class="nextsectionbutton" id="scroller1">
                     <img src="img/repeatbutton.svg" class="repeatbutton" onclick="repeatmovie1()">
                 </div>
             </div>
@@ -1225,31 +1225,6 @@ <h1 style="font-size: 1.6em;">Know Your Body Buddies</h1>
 
     window.history.scrollRestoration = "manual";
 
-    //drop in 1
-    /* gsap.timeline({
-        scrollTrigger: {
-            autoAlpha: 1,
-            scrub: 0.2,
-            trigger: ".imageintrosec",
-            start: "-=50%",
-            end: "top",
-            scrub: true,
-            pin: false,
-        }
-    })
-        .from(".imageintro1", {
-            opacity: 100,
-
-        })
-        .from(".imageintro2", {
-            opacity: 0,
-
-        })
-        .from(".imageintro3", {
-            opacity: 0,
-        }) */
-
-
     gsap.timeline({
         scrollTrigger: {
             autoAlpha: 1,
@@ -1287,12 +1262,14 @@ <h1 style="font-size: 1.6em;">Know Your Body Buddies</h1>
         enableScrolling();
     }
 
+    document.getElementById("scroller1").addEventListener("click", scroll1);
+
     function scroll1() {
         const scrollitem1 = document.getElementById("scrollto1");
-
         setTimeout(() => {
             scrollitem1.scrollIntoView({ behavior: "smooth", block: "end", inline: "nearest" });
-        }, 10);        enableScrolling();
+        }, 10);        
+        enableScrolling();
 
     }
 
diff --git a/style.css b/style.css
index 1edd894..2156f97 100644
--- a/style.css
+++ b/style.css
@@ -2621,23 +2621,29 @@ body:has(#bar9:hover) #label9 {
     top: 8vh;
     position: relative;
     z-index: 1000;
-    opacity: 0;
+    opacity: 1;
 }
 
 .vidcontrols {
     position: relative;
-    opacity: 0;
+    opacity: 1;
     display: flex;
     justify-content: space-between;
     margin-left: auto;
     margin-right: 15px;
     width: 50%;
     top: -8vh;
+    z-index: 1000;
 
 }
 
+.nextsectionbutton{
+    opacity:1;
+}
+
 .vidcontrols img,
 .toparrowbutton {
+    opacity: 1;
     -moz-window-dragging: none;
     user-drag: none;
     user-select: none;
@@ -2648,7 +2654,7 @@ body:has(#bar9:hover) #label9 {
 
 }
 
-#buttons1 {
+/* #buttons1 {
     opacity: 0;
 }
 
@@ -2662,7 +2668,7 @@ body:has(#bar9:hover) #label9 {
 
 #buttons4 {
     opacity: 0;
-}
+} */
 
 .nextsectionbutton {
     animation: float-up-down 2s ease-in-out infinite both;