Rework full page mode.

css/apple2.css

@@ -77,7 +77,11 @@ body {
     border-radius: 10px;
 }
 
-.zoomwindow {
+.full-page {
+    background: black;
+}
+
+.full-page #display {
     width: 100vw;
     height: 68.5714vw; /* 384px / 560px * 100% */
     max-height: 100vh;
@@ -94,28 +98,28 @@ body {
     margin: auto !important;
 }
 
-.maxhw {
-    width: 100%;
-    height: 100%;
-}
-
-.flexbox-centering {
+.full-page .overscan {
+    margin: initial;
+    padding: 0;
+    width: initial;
+    height: 384px;
+    border: 0;
+    border-radius: 0;
     height: 100%;
     display: flex;
     justify-content: center;
     align-items: center;
-    background: green;
 }
 
-.hidden {
-    display: none !important;
-}
-
-.fillparent {
+.full-page #screen {
     width: 100%;
     height: 100%;
 }
 
+.full-page #header, .full-page .inset, .full-page #reset {
+    display: none;
+}
+
 #power {
     padding: 2px;
     border: 1px inset #888;

js/ui/apple2.js

@@ -531,13 +531,7 @@ function _keydown(evt) {
     } else if (evt.keyCode === 113) { // F2 - Full Screen
         var elem = document.getElementById('screen');
         if (evt.shiftKey) { // Full window, but not full screen
-            document.querySelector('#display').classList.toggle('zoomwindow');
-            document.querySelector('#display > div').classList.toggle('overscan');
-            document.querySelector('#display > div').classList.toggle('flexbox-centering');
-            document.querySelector('#screen').classList.toggle('maxhw');
-            document.querySelector('#header').classList.toggle('hidden');
-            document.querySelectorAll('.inset').forEach(function(el) { el.classList.toggle('hidden'); });
-            document.querySelector('#reset').classList.toggle('hidden');
+            document.body.classList.toggle('full-page');
         } else if (document.webkitCancelFullScreen) {
             if (document.webkitIsFullScreen) {
                 document.webkitCancelFullScreen();