diff --git a/copyparty/web/browser.css b/copyparty/web/browser.css
index 77f85b24..9e85a7a1 100644
--- a/copyparty/web/browser.css
+++ b/copyparty/web/browser.css
@@ -1423,6 +1423,7 @@ html.y #widget.open {
 #pvolbg {
 	height: 100%;
 	padding: .3em;
+	cursor: pointer;
 	align-content: center;
 	align-items: center;
 	display: flex;
@@ -3479,7 +3480,17 @@ html.d #treepar {
 		opacity: 1;
 		pointer-events: all;
 	}
-
+	/* makes touch more intuitive by hiding after timeout */
+	@media (hover: none) {
+		#pvolbg:hover #pvol {
+			animation: timeout_hide 5s forwards;
+		}
+		@keyframes timeout_hide {
+			0% {opacity: 1; display: block;}
+			90% {opacity: 1; display: block;}
+			100% {opacity: 0; display: none;}
+		}
+	}
 }
 @media (max-width: 32em) {
 	#u2conf {
diff --git a/copyparty/web/browser.js b/copyparty/web/browser.js
index 16fb3184..1eac6c01 100644
--- a/copyparty/web/browser.js
+++ b/copyparty/web/browser.js
@@ -871,9 +871,9 @@ ebi('widget').innerHTML = (
 	'			<input type="range" min="0" max="1" step="0.001" value="0" id="sliderpos"></input>' +
 	'			<span id="txtsongend"/>0:00</span>' +
 	'		</div>' +
-	'		<a class="tgl btn" id="cyclebtn_loopmode" tt="' + L.mt_loop + '$N' + L.mt_mloop + '">🔁</a>' +
-	'		<a class="tgl btn" id="au_shuf" tt="' + L.mt_shuf + '">🔀</a>' +
-	'		<div id="pvolbg">' + svg_vol + '<canvas id="pvol"></canvas></div>' +
+	'		<a class="tgl btn" tabindex="0" id="cyclebtn_loopmode" tt="' + L.mt_loop + '$N' + L.mt_mloop + '">🔁</a>' +
+	'		<a class="tgl btn" tabindex="0" id="au_shuf" tt="' + L.mt_shuf + '">🔀</a>' +
+	'		<div id="pvolbg" tabindex="0">' + svg_vol + '<canvas id="pvol"></canvas></div>' +
 	'	</div>' +
 	'</div>'+
 	'<div id="np_inf">' +
diff --git a/copyparty/web/ui.css b/copyparty/web/ui.css
index 2a8c2114..6f283c06 100644
--- a/copyparty/web/ui.css
+++ b/copyparty/web/ui.css
@@ -377,9 +377,9 @@ html.y #tth {
 	border-radius: .2em;
 }
 @keyframes outline_fadeOut {
-0% {outline: var(--a) solid .1em;}
-30% {outline: color-mix(var(--a) 75%, transparent 25%) solid .1em;}
-100% {outline: transparent solid .1em;}
+	0% {outline: var(--a) solid .1em;}
+	30% {outline: color-mix(var(--a) 75%, transparent 25%) solid .1em;}
+	100% {outline: transparent solid .1em;}
 }
 html.y *:focus,
 html.y *:focus+label,