diff --git a/src/components/stage/stage.css b/src/components/stage/stage.css
index bcd69a17b6590e65fc12fafe2b05f99db181470b..a773f898048b0e7f2796fb83ac1e2a396fbd348f 100644
--- a/src/components/stage/stage.css
+++ b/src/components/stage/stage.css
@@ -23,9 +23,21 @@
     left: 0;
     right: 0;
     bottom: 0;
-    width: 100% !important;
-    height: 100% !important;
     z-index: 999;
+    background-color: rgba(255, 255, 255, 1);
+}
+
+.stage-overlay-content {
+    outline: none;
+    margin: auto;
+    border: 3px solid rgb(126, 133, 151);
+    padding: 0;
+    border-radius: $space;
+
+    overflow: hidden;
+    display: flex;
+    align-items: center;
+    justify-content: center;
 }
 
 .monitor-wrapper {
diff --git a/src/components/stage/stage.jsx b/src/components/stage/stage.jsx
index afb68e2d0def4fa8f51a6366b20fd85a2a361bba..4055db1638bafd2d169d2b70ee7d27a92d946b65 100644
--- a/src/components/stage/stage.jsx
+++ b/src/components/stage/stage.jsx
@@ -1,3 +1,4 @@
+import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
 
@@ -13,6 +14,12 @@ const StageComponent = props => {
         width,
         ...boxProps
     } = props;
+    let heightCorrectedAspect = window.innerHeight - 40;
+    let widthCorrectedAspect = heightCorrectedAspect + (heightCorrectedAspect / 3);
+    if (widthCorrectedAspect > window.innerWidth) {
+        widthCorrectedAspect = window.innerWidth;
+        heightCorrectedAspect = widthCorrectedAspect * .75;
+    }
     return isZoomed === false ? (
         <Box className={styles.stageWrapper}>
             <Box
@@ -30,11 +37,11 @@ const StageComponent = props => {
     ) : (
         <Box className={styles.stageWrapperOverlay}>
             <Box
-                className={styles.stage}
+                className={classNames(styles.stage, styles.stageOverlayContent)}
                 componentRef={canvasRef}
                 element="canvas"
-                height={'100%'}
-                width={'100%'}
+                height={heightCorrectedAspect}
+                width={widthCorrectedAspect}
                 {...boxProps}
             />
             <Box className={styles.monitorWrapper}>
diff --git a/src/containers/stage.jsx b/src/containers/stage.jsx
index e80ece5aa60567bdf146fdc8d49d444de52060e2..51a60fda7b2138b1bdd3bc14436af4c698e11093 100644
--- a/src/containers/stage.jsx
+++ b/src/containers/stage.jsx
@@ -212,7 +212,9 @@ class Stage extends React.Component {
         return (
             <StageComponent
                 canvasRef={this.setCanvas}
+                height={this.props.height}
                 isZoomed={this.state.isZoomed}
+                width={this.props.width}
                 onDoubleClick={this.handleDoubleClick}
                 {...props}
             />