Improved the solutions to be more mobile friendly

src/exams/Listening.tsx

@@ -71,7 +71,7 @@ export default function Listening({exam, showSolutions = false, onFinish}: Props
 
 	return (
 		<>
-			<div className="w-full h-full relative flex flex-col gap-8 items-center justify-center p-8 px-16 overflow-hidden">
+			<div className="w-full relative flex flex-col gap-8 items-center justify-center p-8 px-16 overflow-hidden">
 				{renderAudioPlayer()}
 				{exerciseIndex > -1 &&
 					exerciseIndex < exam.exercises.length &&
@@ -82,7 +82,9 @@ export default function Listening({exam, showSolutions = false, onFinish}: Props
 					showSolutions &&
 					renderSolution(exam.exercises[exerciseIndex], nextExercise, previousExercise)}
 				{exerciseIndex === -1 && (
-					<button className={clsx("btn btn-wide gap-4 relative text-white self-end", infoButtonStyle)} onClick={() => nextExercise()}>
+					<button
+						className={clsx("btn md:btn-wide w-full gap-4 relative text-white self-end", infoButtonStyle)}
+						onClick={() => nextExercise()}>
 						Next
 						<div className="absolute right-4">
 							<Icon path={mdiArrowRight} color="white" size={1} />