diff --git a/assets/audio.png b/assets/audio.png
new file mode 100644
index 0000000..f7045f4
Binary files /dev/null and b/assets/audio.png differ
diff --git a/assets/mute.png b/assets/mute.png
new file mode 100644
index 0000000..0938548
Binary files /dev/null and b/assets/mute.png differ
diff --git a/css/style.css b/css/style.css
index 95a0711..2934a3d 100644
--- a/css/style.css
+++ b/css/style.css
@@ -490,4 +490,42 @@ body {
 }
 .next{
     cursor: pointer;
-}
\ No newline at end of file
+}
+
+.toggle-audio-container {
+    display: flex;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    justify-content: flex-end;
+    color: #fff;
+    padding: 15px 25px 0 0;
+    z-index: 10000;
+    transition: 0ms;
+    animation: none;
+}
+
+
+.toggle-audio {
+    background-image: url(../assets/mute.png);
+    height: 30px;
+    width: 30px;
+    opacity: 0.3;
+    background-repeat: no-repeat;
+    background-position: center;
+    background-size: contain;
+    cursor: pointer;
+    transition: 0ms;
+}
+
+.toggle-audio.active{
+    height: 30px;
+    width: 30px;
+    background-image: url(../assets/audio.png);
+    opacity: 0.3;
+    background-repeat: no-repeat;
+    background-position: center;
+    background-size: contain;
+    transition: 0ms;
+}
diff --git a/index.html b/index.html
index f247d17..65ee2f8 100644
--- a/index.html
+++ b/index.html
@@ -11,62 +11,6 @@
     <script src="js/integrate.js" defer></script>
     <link rel="stylesheet" href="css/style.css">
     <link rel="stylesheet" href="css/glitch.css">
-    <script defer>
-         // Get the modal
-    var modal = document.getElementById("startModal");
-    var modal2 = document.getElementById("endModal");
-    var modal3 = document.getElementById("nextModal");
-    var modals1 = document.getElementById("M1");
-    var modals2 = document.getElementById("M2");
-    var modals3 = document.getElementById("M3");
-    var modals4 = document.getElementById("M4");
-    var modals5 = document.getElementById("M5");
-
-    // When the user clicks anywhere outside of the modal, close it
-    window.onclick = function(event) {
-        if (event.target === modal) {
-            modal.style.display = "none";
-        }
-        if (event.target === modal2) {
-            modal2.style.display = "none";
-        }
-        if (event.target === modal3) {
-            modal3.style.display = "none";
-        }
-    }
-
-    //audio-DO-NOT-REMOVE
-    let x = document.createElement("audio");
-    x.src = "audio/blue.mp3";
-    x.setAttribute("loop", "loop");
-    document.body.addEventListener("mousemove", function() {
-        x.play();
-    })
-
-    function bricktouch() {
-        let x = document.createElement("audio");
-        x.src = "audio/bricktouch.wav";
-        x.play();
-    }
-
-    function gameover() {
-        let x = document.createElement("audio");
-        x.src = "audio/gameover.wav";
-        x.play();
-    }
-
-    function jump() {
-        let x = document.createElement("audio");
-        x.src = "audio/jump.wav";
-        x.play();
-    }
-
-    function brickbroken() {
-        let x = document.createElement("audio");
-        x.src = "audio/brickbroken.wav";
-        x.play();
-    }
-    </script>
 </head>
 <body>
 <div id="startModal" class="modal active">
@@ -221,7 +165,86 @@ <h1 class="game-text">Game</h1>
             Score: <span id="score">10000</span>
         </div>
     </div>
+    <div class="toggle-audio-container">
+        <div class="toggle-audio active">
+        </div>
+    </div>
 </body>
+<script>
+    // Get the modal
+    var modal = document.getElementById("startModal");
+    var modal2 = document.getElementById("endModal");
+    var modal3 = document.getElementById("nextModal");
+    var modals1 = document.getElementById("M1");
+    var modals2 = document.getElementById("M2");
+    var modals3 = document.getElementById("M3");
+    var modals4 = document.getElementById("M4");
+    var modals5 = document.getElementById("M5");
+
+    // When the user clicks anywhere outside of the modal, close it
+    window.onclick = function(event) {
+    if (event.target === modal) {
+        modal.style.display = "none";
+    }
+    if (event.target === modal2) {
+        modal2.style.display = "none";
+    }
+    if (event.target === modal3) {
+        modal3.style.display = "none";
+    }
+    }
+
+    let playAudio = true;
+
+    //audio-DO-NOT-REMOVE
+    let x = document.createElement("audio");
+    x.src = "audio/blue.mp3";
+    x.setAttribute("loop", "loop");
+    document.body.addEventListener("mousemove", function() {
+    if(playAudio)
+        x.play();
+    })
+
+    function bricktouch() {
+    let x = document.createElement("audio");
+    x.src = "audio/bricktouch.wav";
+    if(playAudio)
+        x.play();
+    }
+
+    function gameover() {
+    let x = document.createElement("audio");
+    x.src = "audio/gameover.wav";
+    if(playAudio)
+        x.play();
+    }
+
+    function jump() {
+    let x = document.createElement("audio");
+    x.src = "audio/jump.wav";
+    if(playAudio)
+        x.play();
+    }
+
+    function brickbroken() {
+    let x = document.createElement("audio");
+    x.src = "audio/brickbroken.wav";
+    if(playAudio)
+        x.play();
+    }
+
+    const toggleAudio = document.querySelector('.toggle-audio');
+    toggleAudio.addEventListener('click', (e) => {
+    if(toggleAudio.classList.contains('active')){
+        x.pause();
+        playAudio = false;
+    } else {
+        playAudio = true;
+        x.play();
+    }
+    toggleAudio.classList.toggle('active');
+    })
 
+</script>
 
 </html>
