diff --git a/dance-app/src/Recording.css b/dance-app/src/Recording.css
index 1af33f1..5a7e33f 100644
--- a/dance-app/src/Recording.css
+++ b/dance-app/src/Recording.css
@@ -66,11 +66,19 @@
   align-items: center;
   justify-content: center;
   height: 100dvh;
+  width: calc(1.778 * 100dvh);
 }
+
 video {
-  margin: auto;;
+  max-width: 600px;
+  margin: auto;
+}
+
+.video-container > video {
   width: 100%;
-  max-width: 700px;
+  transform: translateX(calc((100dvw - 1.778 * 100dvh) / 2));
+  max-width: 60000px;
+  margin: none;
 }
 
 .countdown:before {
diff --git a/dance-app/src/sections/recording.tsx b/dance-app/src/sections/recording.tsx
index a7220e1..fbad90c 100644
--- a/dance-app/src/sections/recording.tsx
+++ b/dance-app/src/sections/recording.tsx
@@ -47,9 +47,9 @@ const RecordingPage = ({
   const classes = useStyles(theme);
 
   const constraints: { aspectRatio: number; height: number; width: number } = {
-    aspectRatio: 2.33,
-    height: 200,
-    width: 100,
+    aspectRatio: 3,
+    height: 720,
+    width: 1280,
   };
   const {
     applyConstraints,