diff --git a/src/lib/components/custom/loading-spinner.svelte b/src/lib/components/custom/loading-spinner.svelte
index 31baa0f..9a52609 100644
--- a/src/lib/components/custom/loading-spinner.svelte
+++ b/src/lib/components/custom/loading-spinner.svelte
@@ -4,6 +4,7 @@
 	export let src = '/mdev_triangle_loading.riv';
 	export let stateMachine = null;
 	export let size = 120;
+	export let classes = '';
 
 
 	let canvas;
@@ -38,4 +39,4 @@
 	});
 </script>
 
-<canvas bind:this={canvas} width={size} height={size} />
\ No newline at end of file
+<canvas bind:this={canvas} class={classes} />
\ No newline at end of file
diff --git a/src/lib/components/custom/submit-item-dialog.svelte b/src/lib/components/custom/submit-item-dialog.svelte
index f034624..b07fca6 100644
--- a/src/lib/components/custom/submit-item-dialog.svelte
+++ b/src/lib/components/custom/submit-item-dialog.svelte
@@ -121,10 +121,10 @@
 
 
 <div
-	class="fixed inset-0 bg-black/75 z-[999999] w-screen h-screen flex justify-center items-center transition-opacity duration-150"
+	class="fixed inset-0 bg-black/75 z-[999999] w-screen h-screen flex justify-center items-center transition-opacity duration-150 flex-col md:flex-row"
 	class:opacity-0={!isGenerating}
 	class:pointer-events-none={!isGenerating}
 >
-	<LoadingSpinner size={150} />
-	<p class="text-6xl ml-4">Loading...</p>
+	<LoadingSpinner classes="w-28 md:w-48 mb-2 md:-mb-4" />
+	<p class="text-4xl md:text-6xl">Loading...</p>
 </div>