diff --git a/www/index.html b/www/index.html
index dddfdda..968c47b 100644
--- a/www/index.html
+++ b/www/index.html
@@ -20,13 +20,15 @@
             <h2>LucalEncoded?</h2>
             <input type="checkbox" id="lucalEncodedInput">
             <h2>Shock</h2>
-            <input type="range" min="0" max="99" id="shockIntensity" oninput="this.nextElementSibling.value = this.value">
-            <output>0</output>
+            <input type="range" min="0" max="99" id="shockIntensity" oninput="document.getElementById('sliderValueFirst').value = this.value" class="sliderInput">
+            <br>
+            <output id="sliderValueFirst">0</output>
             <br>
             <button onclick="shock();">Shock!</button>
             <h2>Vibrate</h2>
-            <input type="range" min="0" max="99" id="vibrateIntensity" oninput="this.nextElementSibling.value = this.value">
-            <output>0</output>
+            <input type="range" min="0" max="99" id="vibrateIntensity" oninput="document.getElementById('sliderValueSecond').value = this.value" class="sliderInput">
+            <br>
+            <output id="sliderValueSecond">0</output>
             <br>
             <button onclick="vibrate();">Vibrate!</button>
         </div>
diff --git a/www/styles.css b/www/styles.css
index e24c070..36ef2f5 100644
--- a/www/styles.css
+++ b/www/styles.css
@@ -12,6 +12,7 @@ body {
     margin-bottom: 1%;
     padding: 1%;
     border-radius: 25px;
+    max-width: 100vw;
 }
 
 .contentBox{
@@ -23,4 +24,8 @@ body {
     padding: 1%;
     border-radius: 25px;
     max-width: 80%;
+}
+
+.sliderInput{
+    width: 90%;
 }
\ No newline at end of file