diff --git a/materialious/src/lib/components/player/ClosedCaptions.svelte b/materialious/src/lib/components/player/ClosedCaptions.svelte
index 8e7cad3d..4246ef70 100644
--- a/materialious/src/lib/components/player/ClosedCaptions.svelte
+++ b/materialious/src/lib/components/player/ClosedCaptions.svelte
@@ -5,7 +5,7 @@
 	const captionTracks: Record<string, string> = {};
 
 	// Configurable settings for captions
-	let captionFontSize: string = $state('16px');
+	let captionFontSize: string = $state('1em');
 	let captionColor: string = $state('white');
 	let captionBackgroundColor: string = $state('rgba(0, 0, 0, 0.7)');
 	let captionOpacity: number = $state(1);
@@ -67,14 +67,12 @@
 
 	let {
 		video,
-		playerContainer,
 		currentTime = $bindable(),
 		showControls = $bindable()
 	}: {
 		video: VideoPlay;
 		currentTime: number;
 		showControls: boolean;
-		playerContainer: HTMLElement;
 	} = $props();
 
 	onMount(async () => {
@@ -107,10 +105,7 @@
 		(cue: VTTCue) => cue.endTime
 	)}
 	<div
-		{@attach draggable(() => [
-			bounds(BoundsFrom.element(playerContainer)),
-			touchAction('manipulation')
-		])}
+		{@attach draggable(() => [bounds(BoundsFrom.viewport()), touchAction('manipulation')])}
 		style="z-index: 5;cursor: grab;"
 	>
 		{#if currentCaption?.text}
diff --git a/materialious/src/lib/components/player/Player.svelte b/materialious/src/lib/components/player/Player.svelte
index a096e2b9..cbaa6512 100644
--- a/materialious/src/lib/components/player/Player.svelte
+++ b/materialious/src/lib/components/player/Player.svelte
@@ -873,7 +873,7 @@
 	}}
 	bind:this={playerContainer}
 >
-	<ClosedCaptions video={data.video} {playerContainer} bind:currentTime bind:showControls />
+	<ClosedCaptions video={data.video} bind:currentTime bind:showControls />
 
 	<video
 		controls={false}