diff --git a/js/common/view/RAPScreenView.js b/js/common/view/RAPScreenView.js
index 281ae984..2e03ace9 100644
--- a/js/common/view/RAPScreenView.js
+++ b/js/common/view/RAPScreenView.js
@@ -406,35 +406,11 @@ class RAPScreenView extends ScreenView {
    * @public
    */
   layout( viewBounds ) {
-    assert && assert( viewBounds instanceof Bounds2, 'should be Bounds2' );
+    this.matrix = ScreenView.getLayoutMatrix( this.layoutBounds, viewBounds, { yAlign: 'bottom' } );
+    this.visibleBoundsProperty.value = this.parentToLocalBounds( viewBounds );
 
-    const width = viewBounds.width;
-    const height = viewBounds.height;
-
-    this.resetTransform();
-
-    const scale = this.getLayoutScale( viewBounds );
-    this.setScaleMagnitude( scale );
-
-    let dx = 0;
-    let dy = 0;
-
-    // Move to bottom vertically
-    if ( scale === width / this.layoutBounds.width ) {
-      dy = ( height / scale - this.layoutBounds.height );
-    }
-
-    // Center horizontally
-    else if ( scale === height / this.layoutBounds.height ) {
-      dx = ( width / scale - this.layoutBounds.width ) / 2;
-    }
-    this.translate( dx, dy );
-
-    // set visible bounds, which are different from layout bounds
-    this.visibleBoundsProperty.set( new Bounds2( -dx, -dy, width / scale - dx, height / scale - dy ) );
-
-    // new bounds for each ratio half
-    this.layoutRAPScreeView( new Bounds2( 0, 0, ONE_QUARTER_LAYOUT_WIDTH, Math.min( height / scale, MAX_RATIO_HEIGHT ) ) );
+    const ratioHeight = Math.min( this.visibleBoundsProperty.value.height, MAX_RATIO_HEIGHT );
+    this.layoutRAPScreeView( new Bounds2( 0, 0, ONE_QUARTER_LAYOUT_WIDTH, ratioHeight ) );
   }
 
   /**