diff --git a/css/menupages.scss b/css/menupages.scss
index 9e1c7cc6d..b97dadc36 100644
--- a/css/menupages.scss
+++ b/css/menupages.scss
@@ -12,6 +12,11 @@
   overflow-y: scroll;
 }
 
+#generic-react-container {
+  position: fixed;
+  padding: 10px;
+}
+
 /* Character Info */
 #character-container {
   padding-top: 10px;
diff --git a/src/Augmentation/ui/Root.tsx b/src/Augmentation/ui/Root.tsx
index b363e4763..aaabd43d7 100644
--- a/src/Augmentation/ui/Root.tsx
+++ b/src/Augmentation/ui/Root.tsx
@@ -44,47 +44,49 @@ export class AugmentationsRoot extends React.Component<IProps, IState> {
     }
 
     return (
-      <div id="augmentations-content">
-        <h1>Purchased Augmentations</h1>
-        <p>
-          Below is a list of all Augmentations you have purchased but not yet installed. Click the button below to
-          install them.
-        </p>
-        <p>WARNING: Installing your Augmentations resets most of your progress, including:</p>
-        <br />
-        <p>- Stats/Skill levels and Experience</p>
-        <p>- Money</p>
-        <p>- Scripts on every computer but your home computer</p>
-        <p>- Purchased servers</p>
-        <p>- Hacknet Nodes</p>
-        <p>- Faction/Company reputation</p>
-        <p>- Stocks</p>
-        <br />
-        <p>
-          Installing Augmentations lets you start over with the perks and benefits granted by all of the Augmentations
-          you have ever installed. Also, you will keep any scripts and RAM/Core upgrades on your home computer (but you
-          will lose all programs besides NUKE.exe)
-        </p>
-        <StdButton
-          onClick={this.props.installAugmentationsFn}
-          text="Install Augmentations"
-          tooltip="'I never asked for this'"
-        />
-        <StdButton
-          addClasses="flashing-button"
-          onClick={this.export}
-          text={`Backup Save ${exportBonusStr()}`}
-          tooltip="It's always a good idea to backup/export your save!"
-        />
-        <PurchasedAugmentations />
-        <h1>Installed Augmentations</h1>
-        <p>
-          {`List of all Augmentations ${Player.sourceFiles.length > 0 ? "and Source Files " : ""} ` +
-            `that have been installed. You have gained the effects of these.`}
-        </p>
-        <InstalledAugmentationsAndSourceFiles />
-        <br /> <br />
-        <PlayerMultipliers />
+      <div id="augmentations-container">
+        <div id="augmentations-content">
+          <h1>Purchased Augmentations</h1>
+          <p>
+            Below is a list of all Augmentations you have purchased but not yet installed. Click the button below to
+            install them.
+          </p>
+          <p>WARNING: Installing your Augmentations resets most of your progress, including:</p>
+          <br />
+          <p>- Stats/Skill levels and Experience</p>
+          <p>- Money</p>
+          <p>- Scripts on every computer but your home computer</p>
+          <p>- Purchased servers</p>
+          <p>- Hacknet Nodes</p>
+          <p>- Faction/Company reputation</p>
+          <p>- Stocks</p>
+          <br />
+          <p>
+            Installing Augmentations lets you start over with the perks and benefits granted by all of the Augmentations
+            you have ever installed. Also, you will keep any scripts and RAM/Core upgrades on your home computer (but
+            you will lose all programs besides NUKE.exe)
+          </p>
+          <StdButton
+            onClick={this.props.installAugmentationsFn}
+            text="Install Augmentations"
+            tooltip="'I never asked for this'"
+          />
+          <StdButton
+            addClasses="flashing-button"
+            onClick={this.export}
+            text={`Backup Save ${exportBonusStr()}`}
+            tooltip="It's always a good idea to backup/export your save!"
+          />
+          <PurchasedAugmentations />
+          <h1>Installed Augmentations</h1>
+          <p>
+            {`List of all Augmentations ${Player.sourceFiles.length > 0 ? "and Source Files " : ""} ` +
+              `that have been installed. You have gained the effects of these.`}
+          </p>
+          <InstalledAugmentationsAndSourceFiles />
+          <br /> <br />
+          <PlayerMultipliers />
+        </div>
       </div>
     );
   }
diff --git a/src/Bladeburner/ui/Root.tsx b/src/Bladeburner/ui/Root.tsx
index 1fc293c77..c66b045f0 100644
--- a/src/Bladeburner/ui/Root.tsx
+++ b/src/Bladeburner/ui/Root.tsx
@@ -15,7 +15,7 @@ interface IProps {
 
 export function Root(props: IProps): React.ReactElement {
   return (
-    <>
+    <div id="bladeburner-container">
       <div style={{ height: "60%", display: "block", position: "relative" }}>
         <div
           style={{
@@ -41,6 +41,6 @@ export function Root(props: IProps): React.ReactElement {
       >
         <AllPages bladeburner={props.bladeburner} player={props.player} />
       </div>
-    </>
+    </div>
   );
 }
diff --git a/src/Corporation/ui/CorporationRoot.tsx b/src/Corporation/ui/CorporationRoot.tsx
index 0895703bc..d6b655f41 100644
--- a/src/Corporation/ui/CorporationRoot.tsx
+++ b/src/Corporation/ui/CorporationRoot.tsx
@@ -56,7 +56,7 @@ export function CorporationRoot(props: IProps): React.ReactElement {
   }, []);
 
   return (
-    <>
+    <div id="corporation-container">
       <div>
         <HeaderTab
           current={divisionName === "Overview"}
@@ -75,6 +75,6 @@ export function CorporationRoot(props: IProps): React.ReactElement {
         <ExpandButton corp={props.corp} setDivisionName={setDivisionName} />
       </div>
       <MainPanel rerender={rerender} corp={props.corp} divisionName={divisionName} player={props.player} />
-    </>
+    </div>
   );
 }
diff --git a/src/DevMenu.tsx b/src/DevMenu.tsx
index 8f56df0fe..b7c9910d7 100644
--- a/src/DevMenu.tsx
+++ b/src/DevMenu.tsx
@@ -757,7 +757,7 @@ export function DevMenuRoot(props: IProps): React.ReactElement {
   }
 
   return (
-    <div className="col">
+    <div id="dev-menu-container" className="col">
       <div className="row">
         <h1>Development Menu - Only meant to be used for testing/debugging</h1>
       </div>
diff --git a/src/Faction/FactionHelpers.jsx b/src/Faction/FactionHelpers.jsx
index e8769b689..eca8288a7 100644
--- a/src/Faction/FactionHelpers.jsx
+++ b/src/Faction/FactionHelpers.jsx
@@ -86,7 +86,7 @@ export function displayFactionContent(factionName, initiallyOnAugmentationsPage
       p={Player}
       startHackingMissionFn={startHackingMission}
     />,
-    Engine.Display.factionContent,
+    Engine.Display.content,
   );
 }
 
diff --git a/src/Faction/ui/FactionList.tsx b/src/Faction/ui/FactionList.tsx
index 358771ed2..6633e0590 100644
--- a/src/Faction/ui/FactionList.tsx
+++ b/src/Faction/ui/FactionList.tsx
@@ -24,7 +24,7 @@ export function FactionList(props: IProps): React.ReactElement {
   }
 
   return (
-    <>
+    <div id="factions-container">
       <h1>Factions</h1>
       <p>Lists all factions you have joined</p>
       <br />
@@ -60,6 +60,6 @@ export function FactionList(props: IProps): React.ReactElement {
           </li>
         ))}
       </ul>
-    </>
+    </div>
   );
 }
diff --git a/src/Faction/ui/Root.tsx b/src/Faction/ui/Root.tsx
index 8a4652794..ba9cbae46 100644
--- a/src/Faction/ui/Root.tsx
+++ b/src/Faction/ui/Root.tsx
@@ -223,7 +223,7 @@ export class FactionRoot extends React.Component<IProps, IState> {
     }
 
     return (
-      <div>
+      <div id="faction-container">
         <h1>{faction.name}</h1>
         <Info faction={faction} factionInfo={factionInfo} />
         {canAccessGang && <Option buttonText={"Manage Gang"} infoText={gangInfo} onClick={this.manageGang} />}
@@ -266,7 +266,7 @@ export class FactionRoot extends React.Component<IProps, IState> {
 
   renderAugmentationsPage(): React.ReactNode {
     return (
-      <div>
+      <div id="faction-container">
         <AugmentationsPage faction={this.props.faction} p={this.props.p} routeToMainPage={this.routeToMain} />
       </div>
     );
diff --git a/src/Gang/ui/Root.tsx b/src/Gang/ui/Root.tsx
index d6c544a7e..587904fa9 100644
--- a/src/Gang/ui/Root.tsx
+++ b/src/Gang/ui/Root.tsx
@@ -30,7 +30,7 @@ export function Root(props: IProps): React.ReactElement {
   }
 
   return (
-    <>
+    <div id="gang-container">
       <a className="a-link-button" style={{ display: "inline-block" }} onClick={back}>
         Back
       </a>
@@ -53,6 +53,6 @@ export function Root(props: IProps): React.ReactElement {
       ) : (
         <TerritorySubpage gang={props.gang} />
       )}
-    </>
+    </div>
   );
 }
diff --git a/src/Hacknet/ui/HacknetRoot.tsx b/src/Hacknet/ui/HacknetRoot.tsx
index bad9cb2bb..948175c1c 100644
--- a/src/Hacknet/ui/HacknetRoot.tsx
+++ b/src/Hacknet/ui/HacknetRoot.tsx
@@ -121,7 +121,7 @@ export function HacknetRoot(props: IProps): React.ReactElement {
   });
 
   return (
-    <div>
+    <div id="hacknet-nodes-container">
       <h1>Hacknet {hasHacknetServers(props.player) ? "Servers" : "Nodes"}</h1>
       <GeneralInfo hasHacknetServers={hasHacknetServers(props.player)} />
 
diff --git a/src/Locations/ui/Root.tsx b/src/Locations/ui/Root.tsx
index f554e7e06..70d530625 100644
--- a/src/Locations/ui/Root.tsx
+++ b/src/Locations/ui/Root.tsx
@@ -144,7 +144,7 @@ export class LocationRoot extends React.Component<IProps, IState> {
 
   render(): React.ReactNode {
     if (this.state.inCity) {
-      return this.renderCity();
+      return <div id="location-container">{this.renderCity()}</div>;
     } else {
       return this.renderLocation();
     }
diff --git a/src/Milestones/ui/MilestonesRoot.tsx b/src/Milestones/ui/MilestonesRoot.tsx
index 46d682dd9..7aeec9748 100644
--- a/src/Milestones/ui/MilestonesRoot.tsx
+++ b/src/Milestones/ui/MilestonesRoot.tsx
@@ -30,7 +30,7 @@ export function MilestonesRoot(props: IProps): JSX.Element {
     }
   });
   return (
-    <>
+    <div id="milestones-container">
       <h1>Milestones</h1>
       <p>
         Milestones don't reward you for completing them. They are here to guide you if you're lost. They will reset when
@@ -40,6 +40,6 @@ export function MilestonesRoot(props: IProps): JSX.Element {
 
       <h2>Completing fl1ght.exe</h2>
       <li>{milestones}</li>
-    </>
+    </div>
   );
 }
diff --git a/src/PersonObjects/Resleeving/ui/ResleeveRoot.tsx b/src/PersonObjects/Resleeving/ui/ResleeveRoot.tsx
index 404f7bf29..d331dad0a 100644
--- a/src/PersonObjects/Resleeving/ui/ResleeveRoot.tsx
+++ b/src/PersonObjects/Resleeving/ui/ResleeveRoot.tsx
@@ -60,9 +60,11 @@ const SortFunctions: {
   Dexterity: (a: Resleeve, b: Resleeve): number => a.dexterity - b.dexterity,
   Agility: (a: Resleeve, b: Resleeve): number => a.agility - b.agility,
   Charisma: (a: Resleeve, b: Resleeve): number => a.charisma - b.charisma,
-  AverageCombatStats: (a: Resleeve, b: Resleeve): number => getAverage(a.strength, a.defense, a.dexterity, a.agility) -
+  AverageCombatStats: (a: Resleeve, b: Resleeve): number =>
+    getAverage(a.strength, a.defense, a.dexterity, a.agility) -
     getAverage(b.strength, b.defense, b.dexterity, b.agility),
-  AverageAllStats: (a: Resleeve, b: Resleeve): number => getAverage(a.hacking_skill, a.strength, a.defense, a.dexterity, a.agility, a.charisma) -
+  AverageAllStats: (a: Resleeve, b: Resleeve): number =>
+    getAverage(a.hacking_skill, a.strength, a.defense, a.dexterity, a.agility, a.charisma) -
     getAverage(b.hacking_skill, b.strength, b.defense, b.dexterity, b.agility, b.charisma),
   TotalNumAugmentations: (a: Resleeve, b: Resleeve): number => a.augmentations.length - b.augmentations.length,
 };
@@ -87,7 +89,7 @@ export function ResleeveRoot(props: IProps): React.ReactElement {
   props.player.resleeves.sort(sortFunction);
 
   return (
-    <>
+    <div id="resleeve-container">
       <p style={{ display: "block", width: "75%" }}>
         Re-sleeving is the process of digitizing and transferring your consciousness into a new human body, or 'sleeve'.
         Here at VitaLife, you can purchase new specially-engineered bodies for the re-sleeve process. Many of these
@@ -114,6 +116,6 @@ export function ResleeveRoot(props: IProps): React.ReactElement {
       {props.player.resleeves.map((resleeve, i) => (
         <ResleeveElem key={i} player={props.player} resleeve={resleeve} />
       ))}
-    </>
+    </div>
   );
 }
diff --git a/src/PersonObjects/Sleeve/ui/SleeveRoot.tsx b/src/PersonObjects/Sleeve/ui/SleeveRoot.tsx
index 9df9c22e6..12e61f5de 100644
--- a/src/PersonObjects/Sleeve/ui/SleeveRoot.tsx
+++ b/src/PersonObjects/Sleeve/ui/SleeveRoot.tsx
@@ -20,7 +20,7 @@ export function SleeveRoot(props: IProps): React.ReactElement {
   }, []);
 
   return (
-    <div style={{ width: "70%" }}>
+    <div id="sleeves-container" style={{ width: "70%" }}>
       <h1>Sleeves</h1>
       <p>
         Duplicate Sleeves are MK-V Synthoids (synthetic androids) into which your consciousness has been copied. In
diff --git a/src/Programs/ui/ProgramsRoot.tsx b/src/Programs/ui/ProgramsRoot.tsx
index a163e47c2..d588edf60 100644
--- a/src/Programs/ui/ProgramsRoot.tsx
+++ b/src/Programs/ui/ProgramsRoot.tsx
@@ -19,7 +19,7 @@ export function ProgramsRoot(props: IProps): React.ReactElement {
   }, []);
 
   return (
-    <>
+    <div id="create-program-container">
       <p id="create-program-page-text">
         This page displays any programs that you are able to create. Writing the code for a program takes time, which
         can vary based on how complex the program is. If you are working on creating a program you can cancel at any
@@ -44,6 +44,6 @@ export function ProgramsRoot(props: IProps): React.ReactElement {
           );
         })}
       </ul>
-    </>
+    </div>
   );
 }
diff --git a/src/StockMarket/StockMarket.tsx b/src/StockMarket/StockMarket.tsx
index bc1c5f6eb..3846e1889 100644
--- a/src/StockMarket/StockMarket.tsx
+++ b/src/StockMarket/StockMarket.tsx
@@ -307,7 +307,7 @@ export function processStockPrices(numCycles = 1): void {
 
 let stockMarketContainer: HTMLElement | null = null;
 function setStockMarketContainer(): void {
-  stockMarketContainer = document.getElementById("stock-market-container");
+  stockMarketContainer = document.getElementById("generic-react-container");
   document.removeEventListener("DOMContentLoaded", setStockMarketContainer);
 }
 
diff --git a/src/StockMarket/ui/Root.tsx b/src/StockMarket/ui/Root.tsx
index 613212035..ede734bbd 100644
--- a/src/StockMarket/ui/Root.tsx
+++ b/src/StockMarket/ui/Root.tsx
@@ -61,7 +61,7 @@ export class StockMarketRoot extends React.Component<IProps, IState> {
 
   render(): React.ReactNode {
     return (
-      <div>
+      <div id="stock-market-container">
         <InfoAndPurchases initStockMarket={this.props.initStockMarket} p={this.props.p} rerender={this.rerender} />
         {this.props.p.hasWseAccount && (
           <StockTickers
diff --git a/src/Tutorial/ui/TutorialRoot.tsx b/src/Tutorial/ui/TutorialRoot.tsx
index 3c21168b4..916c5eb5b 100644
--- a/src/Tutorial/ui/TutorialRoot.tsx
+++ b/src/Tutorial/ui/TutorialRoot.tsx
@@ -2,7 +2,7 @@ import React from "react";
 
 export function TutorialRoot(): React.ReactElement {
   return (
-    <>
+    <div id="tutorial-container">
       <h1>Tutorial (AKA Links to Documentation)</h1>
       <a
         id="tutorial-getting-started-link"
@@ -94,6 +94,6 @@ export function TutorialRoot(): React.ReactElement {
       <a className="a-link-button" target="_blank" href="https://bitburner.readthedocs.io/en/latest/shortcuts.html">
         Keyboard Shortcuts
       </a>
-    </>
+    </div>
   );
 }
diff --git a/src/engine.jsx b/src/engine.jsx
index 7e1165882..5964074d7 100644
--- a/src/engine.jsx
+++ b/src/engine.jsx
@@ -177,27 +177,11 @@ const Engine = {
   // Display objects
   // TODO-Refactor this into its own component
   Display: {
+    // Generic page that most react loads into.
+    content: null,
     // Main menu content
     terminalContent: null,
-    characterContent: null,
-    scriptEditorContent: null,
-    activeScriptsContent: null,
-    hacknetNodesContent: null,
-    createProgramContent: null,
-    factionsContent: null,
-    factionContent: null,
-    augmentationsContent: null,
-    milestonesContent: null,
-    devMenuContent: null,
-    tutorialContent: null,
     infiltrationContent: null,
-    stockMarketContent: null,
-    gangContent: null,
-    bladeburnerContent: null,
-    resleeveContent: null,
-    sleeveContent: null,
-    corporationContent: null,
-    locationContent: null,
     workInProgressContent: null,
     redPillContent: null,
     cinematicTextContent: null,
@@ -219,68 +203,65 @@ const Engine = {
 
   loadCharacterContent: function () {
     Engine.hideAllContent();
-    Engine.Display.characterContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.CharacterInfo);
-    ReactDOM.render(<CharacterInfo player={Player} />, Engine.Display.characterContent);
+    ReactDOM.render(<CharacterInfo player={Player} />, Engine.Display.content);
     MainMenuLinks.Stats.classList.add("active");
   },
 
   loadScriptEditorContent: function (filename = "", code = "") {
     Engine.hideAllContent();
-    Engine.Display.scriptEditorContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.ScriptEditor);
     MainMenuLinks.ScriptEditor.classList.add("active");
     ReactDOM.render(
       <ScriptEditorRoot filename={filename} code={code} player={Player} engine={this} />,
-      Engine.Display.scriptEditorContent,
+      Engine.Display.content,
     );
   },
 
   loadActiveScriptsContent: function () {
     Engine.hideAllContent();
-    Engine.Display.activeScriptsContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.ActiveScripts);
     MainMenuLinks.ActiveScripts.classList.add("active");
-    ReactDOM.render(
-      <ActiveScriptsRoot p={Player} workerScripts={workerScripts} />,
-      Engine.Display.activeScriptsContent,
-    );
+    ReactDOM.render(<ActiveScriptsRoot p={Player} workerScripts={workerScripts} />, Engine.Display.content);
   },
 
   loadHacknetNodesContent: function () {
     Engine.hideAllContent();
-    Engine.Display.hacknetNodesContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.HacknetNodes);
     MainMenuLinks.HacknetNodes.classList.add("active");
-    ReactDOM.render(<HacknetRoot player={Player} />, Engine.Display.hacknetNodesContent);
+    ReactDOM.render(<HacknetRoot player={Player} />, Engine.Display.content);
   },
 
   loadCreateProgramContent: function () {
     Engine.hideAllContent();
-    Engine.Display.createProgramContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.CreateProgram);
     MainMenuLinks.CreateProgram.classList.add("active");
-    ReactDOM.render(<ProgramsRoot player={Player} />, Engine.Display.createProgramContent);
+    ReactDOM.render(<ProgramsRoot player={Player} />, Engine.Display.content);
   },
 
   loadFactionsContent: function () {
     Engine.hideAllContent();
-    Engine.Display.factionsContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Factions);
     MainMenuLinks.Factions.classList.add("active");
-    ReactDOM.render(<FactionList player={Player} engine={this} />, Engine.Display.factionsContent);
+    ReactDOM.render(<FactionList player={Player} engine={this} />, Engine.Display.content);
   },
 
   // TODO reactify
   loadFactionContent: function () {
     Engine.hideAllContent();
-    Engine.Display.factionContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Faction);
   },
 
   loadAugmentationsContent: function () {
     Engine.hideAllContent();
-    Engine.Display.augmentationsContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Augmentations);
     MainMenuLinks.Augmentations.classList.add("active");
 
@@ -291,46 +272,45 @@ const Engine = {
 
     ReactDOM.render(
       <AugmentationsRoot exportGameFn={backup} installAugmentationsFn={installAugmentations} />,
-      Engine.Display.augmentationsContent,
+      Engine.Display.content,
     );
   },
 
   loadMilestonesContent: function () {
     Engine.hideAllContent();
-    Engine.Display.milestonesContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Milestones);
     MainMenuLinks.Milestones.classList.add("active");
-    ReactDOM.render(<MilestonesRoot player={Player} />, Engine.Display.milestonesContent);
+    ReactDOM.render(<MilestonesRoot player={Player} />, Engine.Display.content);
   },
 
   loadTutorialContent: function () {
     Engine.hideAllContent();
-    Engine.Display.tutorialContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Tutorial);
     MainMenuLinks.Tutorial.classList.add("active");
-    ReactDOM.render(<TutorialRoot />, Engine.Display.tutorialContent);
+    ReactDOM.render(<TutorialRoot />, Engine.Display.content);
   },
 
-  // TODO reactify
   loadDevMenuContent: function () {
     Engine.hideAllContent();
     if (process.env.NODE_ENV !== "development") {
       throw new Error("Cannot create Dev Menu because you are not in a dev build");
     }
-    Engine.Display.devMenuContent.style.display = "block";
-    ReactDOM.render(<DevMenuRoot player={Player} engine={this} />, Engine.Display.devMenuContent);
+    Engine.Display.content.style.display = "block";
+    ReactDOM.render(<DevMenuRoot player={Player} engine={this} />, Engine.Display.content);
     routing.navigateTo(Page.DevMenu);
     MainMenuLinks.DevMenu.classList.add("active");
   },
 
   loadLocationContent: function (initiallyInCity = true) {
     Engine.hideAllContent();
-    Engine.Display.locationContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Location);
     MainMenuLinks.City.classList.add("active");
     ReactDOM.render(
       <LocationRoot initiallyInCity={initiallyInCity} engine={Engine} p={Player} />,
-      Engine.Display.locationContent,
+      Engine.Display.content,
     );
   },
 
@@ -339,13 +319,10 @@ const Engine = {
     // and make sure that the 'City' main menu link doesnt become 'active'
     Engine.hideAllContent();
     Player.gotoLocation(LocationName.TravelAgency);
-    Engine.Display.locationContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Location);
     MainMenuLinks.Travel.classList.add("active");
-    ReactDOM.render(
-      <LocationRoot initiallyInCity={false} engine={Engine} p={Player} />,
-      Engine.Display.locationContent,
-    );
+    ReactDOM.render(<LocationRoot initiallyInCity={false} engine={Engine} p={Player} />, Engine.Display.content);
   },
 
   loadJobContent: function () {
@@ -359,13 +336,10 @@ const Engine = {
     }
     Engine.hideAllContent();
     Player.gotoLocation(Player.companyName);
-    Engine.Display.locationContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Location);
     MainMenuLinks.Job.classList.add("active");
-    ReactDOM.render(
-      <LocationRoot initiallyInCity={false} engine={Engine} p={Player} />,
-      Engine.Display.locationContent,
-    );
+    ReactDOM.render(<LocationRoot initiallyInCity={false} engine={Engine} p={Player} />, Engine.Display.content);
   },
 
   // TODO reactify
@@ -407,7 +381,7 @@ const Engine = {
 
   loadStockMarketContent: function () {
     Engine.hideAllContent();
-    Engine.Display.stockMarketContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.StockMarket);
     MainMenuLinks.StockMarket.classList.add("active");
     displayStockMarketContent();
@@ -416,10 +390,10 @@ const Engine = {
   loadGangContent: function () {
     if (!Player.inGang()) return;
     Engine.hideAllContent();
-    Engine.Display.gangContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Gang);
     MainMenuLinks.Gang.classList.add("active");
-    ReactDOM.render(<GangRoot engine={this} gang={Player.gang} player={Player} />, Engine.Display.gangContent);
+    ReactDOM.render(<GangRoot engine={this} gang={Player.gang} player={Player} />, Engine.Display.content);
   },
 
   loadMissionContent: function () {
@@ -433,100 +407,52 @@ const Engine = {
   loadCorporationContent: function () {
     if (!(Player.corporation instanceof Corporation)) return;
     Engine.hideAllContent();
-    Engine.Display.corporationContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Corporation);
     MainMenuLinks.Corporation.classList.add("active");
-    ReactDOM.render(<CorporationRoot corp={Player.corporation} player={Player} />, Engine.Display.corporationContent);
+    ReactDOM.render(<CorporationRoot corp={Player.corporation} player={Player} />, Engine.Display.content);
   },
 
   loadBladeburnerContent: function () {
     if (!(Player.bladeburner instanceof Bladeburner)) return;
     Engine.hideAllContent();
-    Engine.Display.bladeburnerContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Bladeburner);
     MainMenuLinks.Bladeburner.classList.add("active");
     ReactDOM.render(
       <BladeburnerRoot bladeburner={Player.bladeburner} player={Player} engine={this} />,
-      Engine.Display.bladeburnerContent,
+      Engine.Display.content,
     );
   },
 
   loadSleevesContent: function () {
     Engine.hideAllContent();
-    Engine.Display.sleevesContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     routing.navigateTo(Page.Sleeves);
-    ReactDOM.render(<SleeveRoot player={Player} />, Engine.Display.sleevesContent);
+    ReactDOM.render(<SleeveRoot player={Player} />, Engine.Display.content);
   },
 
   loadResleevingContent: function () {
     Engine.hideAllContent();
     routing.navigateTo(Page.Resleeves);
-    Engine.Display.resleeveContent.style.display = "block";
+    Engine.Display.content.style.display = "block";
     MainMenuLinks.City.classList.add("active");
-    ReactDOM.render(<ResleeveRoot player={Player} />, Engine.Display.resleeveContent);
+    ReactDOM.render(<ResleeveRoot player={Player} />, Engine.Display.content);
   },
 
   // Helper function that hides all content
   hideAllContent: function () {
     Engine.Display.terminalContent.style.display = "none";
-    Engine.Display.characterContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.characterContent);
 
-    Engine.Display.scriptEditorContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.scriptEditorContent);
-
-    Engine.Display.activeScriptsContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.activeScriptsContent);
+    Engine.Display.content.style.display = "none";
+    ReactDOM.unmountComponentAtNode(Engine.Display.content);
 
     Engine.Display.infiltrationContent.style.display = "none";
     ReactDOM.unmountComponentAtNode(Engine.Display.infiltrationContent);
 
-    Engine.Display.hacknetNodesContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.hacknetNodesContent);
-
-    Engine.Display.createProgramContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.createProgramContent);
-
-    Engine.Display.factionsContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.factionsContent);
-
-    Engine.Display.factionContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.factionContent);
-
-    Engine.Display.augmentationsContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.augmentationsContent);
-
-    Engine.Display.tutorialContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.tutorialContent);
-
-    Engine.Display.milestonesContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.milestonesContent);
-
-    Engine.Display.devMenuContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.devMenuContent);
-
-    Engine.Display.locationContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.locationContent);
-
-    Engine.Display.gangContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.gangContent);
-
-    Engine.Display.bladeburnerContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.bladeburnerContent);
-
-    Engine.Display.resleeveContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.resleeveContent);
-
-    Engine.Display.sleevesContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.sleevesContent);
-
-    Engine.Display.corporationContent.style.display = "none";
-    ReactDOM.unmountComponentAtNode(Engine.Display.corporationContent);
-
     Engine.Display.workInProgressContent.style.display = "none";
     Engine.Display.redPillContent.style.display = "none";
     Engine.Display.cinematicTextContent.style.display = "none";
-    Engine.Display.stockMarketContent.style.display = "none";
     Engine.Display.missionContent.style.display = "none";
 
     // Make nav menu tabs inactive
@@ -1186,71 +1112,15 @@ const Engine = {
   },
 
   setDisplayElements: function () {
+    Engine.Display.content = document.getElementById("generic-react-container");
+    Engine.Display.content.style.display = "none";
     // Content elements
     Engine.Display.terminalContent = document.getElementById("terminal-container");
     routing.navigateTo(Page.Terminal);
 
-    Engine.Display.characterContent = document.getElementById("character-container");
-    Engine.Display.characterContent.style.display = "none";
-
-    Engine.Display.scriptEditorContent = document.getElementById("script-editor-container");
-    Engine.Display.scriptEditorContent.style.display = "none";
-
-    Engine.Display.activeScriptsContent = document.getElementById("active-scripts-container");
-    Engine.Display.activeScriptsContent.style.display = "none";
-
-    Engine.Display.hacknetNodesContent = document.getElementById("hacknet-nodes-container");
-    Engine.Display.hacknetNodesContent.style.display = "none";
-
-    Engine.Display.createProgramContent = document.getElementById("create-program-container");
-    Engine.Display.createProgramContent.style.display = "none";
-
-    Engine.Display.factionsContent = document.getElementById("factions-container");
-    Engine.Display.factionsContent.style.display = "none";
-
-    Engine.Display.factionContent = document.getElementById("faction-container");
-    Engine.Display.factionContent.style.display = "none";
-
-    Engine.Display.augmentationsContent = document.getElementById("augmentations-container");
-    Engine.Display.augmentationsContent.style.display = "none";
-
-    Engine.Display.milestonesContent = document.getElementById("milestones-container");
-    Engine.Display.milestonesContent.style.display = "none";
-
-    Engine.Display.devMenuContent = document.getElementById("dev-menu-container");
-    Engine.Display.devMenuContent.style.display = "none";
-
-    Engine.Display.tutorialContent = document.getElementById("tutorial-container");
-    Engine.Display.tutorialContent.style.display = "none";
-
-    Engine.Display.infiltrationContent = document.getElementById("infiltration-container");
-    Engine.Display.infiltrationContent.style.display = "none";
-
-    Engine.Display.stockMarketContent = document.getElementById("stock-market-container");
-    Engine.Display.stockMarketContent.style.display = "none";
-
-    Engine.Display.gangContent = document.getElementById("gang-container");
-    Engine.Display.gangContent.style.display = "none";
-
-    Engine.Display.bladeburnerContent = document.getElementById("bladeburner-container");
-    Engine.Display.bladeburnerContent.style.display = "none";
-
-    Engine.Display.resleeveContent = document.getElementById("resleeve-container");
-    Engine.Display.resleeveContent.style.display = "none";
-
-    Engine.Display.sleevesContent = document.getElementById("sleeves-container");
-    Engine.Display.sleevesContent.style.display = "none";
-
-    Engine.Display.corporationContent = document.getElementById("corporation-container");
-    Engine.Display.corporationContent.style.display = "none";
-
     Engine.Display.missionContent = document.getElementById("mission-container");
     Engine.Display.missionContent.style.display = "none";
 
-    // Location page (page that shows up when you visit a specific location in World)
-    Engine.Display.locationContent = document.getElementById("location-container");
-    Engine.Display.locationContent.style.display = "none";
-
     // Work In Progress
     Engine.Display.workInProgressContent = document.getElementById("work-in-progress-container");
     Engine.Display.workInProgressContent.style.display = "none";
@@ -1259,6 +1129,9 @@ const Engine = {
     Engine.Display.redPillContent = document.getElementById("red-pill-container");
     Engine.Display.redPillContent.style.display = "none";
 
+    Engine.Display.infiltrationContent = document.getElementById("infiltration-container");
+    Engine.Display.infiltrationContent.style.display = "none";
+
     // Cinematic Text
     Engine.Display.cinematicTextContent = document.getElementById("cinematic-text-container");
     Engine.Display.cinematicTextContent.style.display = "none";
diff --git a/src/index.html b/src/index.html
index 1359fc3e7..238476295 100644
--- a/src/index.html
+++ b/src/index.html
@@ -147,26 +147,8 @@
         </table>
       </div>
 
-      <!-- Character Info page -->
-      <div id="character-container" class="generic-menupage-container"></div>
-      <div id="active-scripts-container" class="generic-menupage-container"></div>
-      <div id="script-editor-container" class="generic-menupage-container"></div>
-      <div id="hacknet-nodes-container" class="generic-menupage-container"></div>
-      <div id="create-program-container" class="generic-menupage-container"></div>
-      <div id="factions-container" class="generic-menupage-container"></div>
-      <div id="faction-container" class="generic-menupage-container"></div>
-      <div id="augmentations-container" class="generic-menupage-container"></div>
-      <div id="milestones-container" class="generic-menupage-container"></div>
-      <div id="tutorial-container" class="generic-menupage-container"></div>
-      <div id="location-container" class="generic-menupage-container"></div>
+      <div id="generic-react-container" class="generic-menupage-container"></div>
       <div id="infiltration-container" class="generic-fullscreen-container"></div>
-      <div id="stock-market-container" class="generic-menupage-container"></div>
-      <div id="bladeburner-container" class="generic-menupage-container"></div>
-      <div id="resleeve-container" class="generic-menupage-container"></div>
-      <div id="gang-container" class="generic-menupage-container"></div>
-      <div id="corporation-container" class="generic-menupage-container"></div>
-      <div id="sleeves-container" class="generic-menupage-container"></div>
-      <div id="dev-menu-container" class="generic-menupage-container"></div>
 
       <!-- Generic Yes/No Pop Up box -->
       <div id="yes-no-box-container" class="popup-box-container">
diff --git a/src/ui/ActiveScripts/Root.tsx b/src/ui/ActiveScripts/Root.tsx
index c5915d0c5..5273760bf 100644
--- a/src/ui/ActiveScripts/Root.tsx
+++ b/src/ui/ActiveScripts/Root.tsx
@@ -28,7 +28,7 @@ export function ActiveScriptsRoot(props: IProps): React.ReactElement {
   }, []);
 
   return (
-    <>
+    <div id="active-scripts-container">
       <p>
         This page displays a list of all of your scripts that are currently running across every machine. It also
         provides information about each script's production. The scripts are categorized by the hostname of the servers
@@ -37,6 +37,6 @@ export function ActiveScriptsRoot(props: IProps): React.ReactElement {
 
       <ScriptProduction {...props} />
       <ServerAccordions {...props} />
-    </>
+    </div>
   );
 }
diff --git a/src/ui/CharacterInfo.tsx b/src/ui/CharacterInfo.tsx
index 9f315b87f..3cddfdf81 100644
--- a/src/ui/CharacterInfo.tsx
+++ b/src/ui/CharacterInfo.tsx
@@ -257,228 +257,242 @@ export function CharacterInfo(props: IProps): React.ReactElement {
   timeRows.push(["Total Time played:", convertTimeMsToTimeElapsedString(props.player.totalPlaytime)]);
 
   return (
-    <pre>
-      <b>General</b>
-      <br />
-      <br />
-      <span>Current City: {props.player.city}</span>
-      <br />
-      <LastEmployer />
-      <LastJob />
-      <Employers />
-      <span>
-        Money: <Money money={props.player.money.toNumber()} />
-      </span>
-      <button className="popup-box-button" style={{ display: "inline-block", float: "none" }} onClick={openMoneyModal}>
-        Money Statistics & Breakdown
-      </button>
-      <br />
-      <br />
-      <b>Stats</b>
-      <table>
-        <tbody>
-          <tr key="0">
-            <td key="0">Hacking:</td>
-            <td key="1" style={{ textAlign: "right" }}>
-              {numeralWrapper.formatSkill(props.player.hacking_skill)}
-            </td>
-            <td key="2" style={{ textAlign: "right" }}>
-              ({numeralWrapper.formatExp(props.player.hacking_exp)} exp)
-            </td>
-          </tr>
-          <tr key="1">
-            <td key="0">Strength:</td>
-            <td key="1" style={{ textAlign: "right" }}>
-              {numeralWrapper.formatSkill(props.player.strength)}
-            </td>
-            <td key="2" style={{ textAlign: "right" }}>
-              ({numeralWrapper.formatExp(props.player.strength_exp)} exp)
-            </td>
-          </tr>
-          <tr key="2">
-            <td key="0">Defense:</td>
-            <td key="1" style={{ textAlign: "right" }}>
-              {numeralWrapper.formatSkill(props.player.defense)}
-            </td>
-            <td key="2" style={{ textAlign: "right" }}>
-              ({numeralWrapper.formatExp(props.player.defense_exp)} exp)
-            </td>
-          </tr>
-          <tr key="3">
-            <td key="0">Dexterity:</td>
-            <td key="1" style={{ textAlign: "right" }}>
-              {numeralWrapper.formatSkill(props.player.dexterity)}
-            </td>
-            <td key="2" style={{ textAlign: "right" }}>
-              ({numeralWrapper.formatExp(props.player.dexterity_exp)} exp)
-            </td>
-          </tr>
-          <tr key="4">
-            <td key="0">Agility:</td>
-            <td key="1" style={{ textAlign: "right" }}>
-              {numeralWrapper.formatSkill(props.player.agility)}
-            </td>
-            <td key="2" style={{ textAlign: "right" }}>
-              ({numeralWrapper.formatExp(props.player.agility_exp)} exp)
-            </td>
-          </tr>
-          <tr key="5">
-            <td key="0">Charisma:</td>
-            <td key="1" style={{ textAlign: "right" }}>
-              {numeralWrapper.formatSkill(props.player.charisma)}
-            </td>
-            <td key="2" style={{ textAlign: "right" }}>
-              ({numeralWrapper.formatExp(props.player.charisma_exp)} exp)
-            </td>
-          </tr>
-          <Intelligence />
-        </tbody>
-      </table>
-      <br />
-      <MultiplierTable
-        rows={[
-          ["Hacking Chance", props.player.hacking_chance_mult],
-          ["Hacking Speed", props.player.hacking_speed_mult],
-          [
-            "Hacking Money",
-            props.player.hacking_money_mult,
-            props.player.hacking_money_mult * BitNodeMultipliers.ScriptHackMoney,
-          ],
-          [
-            "Hacking Growth",
-            props.player.hacking_grow_mult,
-            props.player.hacking_grow_mult * BitNodeMultipliers.ServerGrowthRate,
-          ],
-        ]}
-      />
-      <br />
-      <MultiplierTable
-        rows={[
-          [
-            "Hacking Level",
-            props.player.hacking_mult,
-            props.player.hacking_mult * BitNodeMultipliers.HackingLevelMultiplier,
-          ],
-          [
-            "Hacking Experience",
-            props.player.hacking_exp_mult,
-            props.player.hacking_exp_mult * BitNodeMultipliers.HackExpGain,
-          ],
-        ]}
-      />
-      <br />
+    <div id="character-container">
+      <pre>
+        <b>General</b>
+        <br />
+        <br />
+        <span>Current City: {props.player.city}</span>
+        <br />
+        <LastEmployer />
+        <LastJob />
+        <Employers />
+        <span>
+          Money: <Money money={props.player.money.toNumber()} />
+        </span>
+        <button
+          className="popup-box-button"
+          style={{ display: "inline-block", float: "none" }}
+          onClick={openMoneyModal}
+        >
+          Money Statistics & Breakdown
+        </button>
+        <br />
+        <br />
+        <b>Stats</b>
+        <table>
+          <tbody>
+            <tr key="0">
+              <td key="0">Hacking:</td>
+              <td key="1" style={{ textAlign: "right" }}>
+                {numeralWrapper.formatSkill(props.player.hacking_skill)}
+              </td>
+              <td key="2" style={{ textAlign: "right" }}>
+                ({numeralWrapper.formatExp(props.player.hacking_exp)} exp)
+              </td>
+            </tr>
+            <tr key="1">
+              <td key="0">Strength:</td>
+              <td key="1" style={{ textAlign: "right" }}>
+                {numeralWrapper.formatSkill(props.player.strength)}
+              </td>
+              <td key="2" style={{ textAlign: "right" }}>
+                ({numeralWrapper.formatExp(props.player.strength_exp)} exp)
+              </td>
+            </tr>
+            <tr key="2">
+              <td key="0">Defense:</td>
+              <td key="1" style={{ textAlign: "right" }}>
+                {numeralWrapper.formatSkill(props.player.defense)}
+              </td>
+              <td key="2" style={{ textAlign: "right" }}>
+                ({numeralWrapper.formatExp(props.player.defense_exp)} exp)
+              </td>
+            </tr>
+            <tr key="3">
+              <td key="0">Dexterity:</td>
+              <td key="1" style={{ textAlign: "right" }}>
+                {numeralWrapper.formatSkill(props.player.dexterity)}
+              </td>
+              <td key="2" style={{ textAlign: "right" }}>
+                ({numeralWrapper.formatExp(props.player.dexterity_exp)} exp)
+              </td>
+            </tr>
+            <tr key="4">
+              <td key="0">Agility:</td>
+              <td key="1" style={{ textAlign: "right" }}>
+                {numeralWrapper.formatSkill(props.player.agility)}
+              </td>
+              <td key="2" style={{ textAlign: "right" }}>
+                ({numeralWrapper.formatExp(props.player.agility_exp)} exp)
+              </td>
+            </tr>
+            <tr key="5">
+              <td key="0">Charisma:</td>
+              <td key="1" style={{ textAlign: "right" }}>
+                {numeralWrapper.formatSkill(props.player.charisma)}
+              </td>
+              <td key="2" style={{ textAlign: "right" }}>
+                ({numeralWrapper.formatExp(props.player.charisma_exp)} exp)
+              </td>
+            </tr>
+            <Intelligence />
+          </tbody>
+        </table>
+        <br />
+        <MultiplierTable
+          rows={[
+            ["Hacking Chance", props.player.hacking_chance_mult],
+            ["Hacking Speed", props.player.hacking_speed_mult],
+            [
+              "Hacking Money",
+              props.player.hacking_money_mult,
+              props.player.hacking_money_mult * BitNodeMultipliers.ScriptHackMoney,
+            ],
+            [
+              "Hacking Growth",
+              props.player.hacking_grow_mult,
+              props.player.hacking_grow_mult * BitNodeMultipliers.ServerGrowthRate,
+            ],
+          ]}
+        />
+        <br />
+        <MultiplierTable
+          rows={[
+            [
+              "Hacking Level",
+              props.player.hacking_mult,
+              props.player.hacking_mult * BitNodeMultipliers.HackingLevelMultiplier,
+            ],
+            [
+              "Hacking Experience",
+              props.player.hacking_exp_mult,
+              props.player.hacking_exp_mult * BitNodeMultipliers.HackExpGain,
+            ],
+          ]}
+        />
+        <br />
 
-      <MultiplierTable
-        rows={[
-          [
-            "Strength Level",
-            props.player.strength_mult,
-            props.player.strength_mult * BitNodeMultipliers.StrengthLevelMultiplier,
-          ],
-          ["Strength Experience", props.player.strength_exp_mult],
-        ]}
-      />
-      <br />
+        <MultiplierTable
+          rows={[
+            [
+              "Strength Level",
+              props.player.strength_mult,
+              props.player.strength_mult * BitNodeMultipliers.StrengthLevelMultiplier,
+            ],
+            ["Strength Experience", props.player.strength_exp_mult],
+          ]}
+        />
+        <br />
 
-      <MultiplierTable
-        rows={[
-          [
-            "Defense Level",
-            props.player.defense_mult,
-            props.player.defense_mult * BitNodeMultipliers.DefenseLevelMultiplier,
-          ],
-          ["Defense Experience", props.player.defense_exp_mult],
-        ]}
-      />
-      <br />
+        <MultiplierTable
+          rows={[
+            [
+              "Defense Level",
+              props.player.defense_mult,
+              props.player.defense_mult * BitNodeMultipliers.DefenseLevelMultiplier,
+            ],
+            ["Defense Experience", props.player.defense_exp_mult],
+          ]}
+        />
+        <br />
 
-      <MultiplierTable
-        rows={[
-          [
-            "Dexterity Level",
-            props.player.dexterity_mult,
-            props.player.dexterity_mult * BitNodeMultipliers.DexterityLevelMultiplier,
-          ],
-          ["Dexterity Experience", props.player.dexterity_exp_mult],
-        ]}
-      />
-      <br />
+        <MultiplierTable
+          rows={[
+            [
+              "Dexterity Level",
+              props.player.dexterity_mult,
+              props.player.dexterity_mult * BitNodeMultipliers.DexterityLevelMultiplier,
+            ],
+            ["Dexterity Experience", props.player.dexterity_exp_mult],
+          ]}
+        />
+        <br />
 
-      <MultiplierTable
-        rows={[
-          [
-            "Agility Level",
-            props.player.agility_mult,
-            props.player.agility_mult * BitNodeMultipliers.AgilityLevelMultiplier,
-          ],
-          ["Agility Experience", props.player.agility_exp_mult],
-        ]}
-      />
-      <br />
+        <MultiplierTable
+          rows={[
+            [
+              "Agility Level",
+              props.player.agility_mult,
+              props.player.agility_mult * BitNodeMultipliers.AgilityLevelMultiplier,
+            ],
+            ["Agility Experience", props.player.agility_exp_mult],
+          ]}
+        />
+        <br />
 
-      <MultiplierTable
-        rows={[
-          [
-            "Charisma Level",
-            props.player.charisma_mult,
-            props.player.charisma_mult * BitNodeMultipliers.CharismaLevelMultiplier,
-          ],
-          ["Charisma Experience", props.player.charisma_exp_mult],
-        ]}
-      />
-      <br />
+        <MultiplierTable
+          rows={[
+            [
+              "Charisma Level",
+              props.player.charisma_mult,
+              props.player.charisma_mult * BitNodeMultipliers.CharismaLevelMultiplier,
+            ],
+            ["Charisma Experience", props.player.charisma_exp_mult],
+          ]}
+        />
+        <br />
 
-      <MultiplierTable
-        rows={[
-          [
-            "Hacknet Node production",
-            props.player.hacknet_node_money_mult,
-            props.player.hacknet_node_money_mult * BitNodeMultipliers.HacknetNodeMoney,
-          ],
-          ["Hacknet Node purchase cost", props.player.hacknet_node_purchase_cost_mult],
-          ["Hacknet Node RAM upgrade cost", props.player.hacknet_node_ram_cost_mult],
-          ["Hacknet Node Core purchase cost", props.player.hacknet_node_core_cost_mult],
-          ["Hacknet Node level upgrade cost", props.player.hacknet_node_level_cost_mult],
-        ]}
-      />
-      <br />
+        <MultiplierTable
+          rows={[
+            [
+              "Hacknet Node production",
+              props.player.hacknet_node_money_mult,
+              props.player.hacknet_node_money_mult * BitNodeMultipliers.HacknetNodeMoney,
+            ],
+            ["Hacknet Node purchase cost", props.player.hacknet_node_purchase_cost_mult],
+            ["Hacknet Node RAM upgrade cost", props.player.hacknet_node_ram_cost_mult],
+            ["Hacknet Node Core purchase cost", props.player.hacknet_node_core_cost_mult],
+            ["Hacknet Node level upgrade cost", props.player.hacknet_node_level_cost_mult],
+          ]}
+        />
+        <br />
 
-      <MultiplierTable
-        rows={[
-          ["Company reputation gain", props.player.company_rep_mult],
-          [
-            "Faction reputation gain",
-            props.player.faction_rep_mult,
-            props.player.faction_rep_mult * BitNodeMultipliers.FactionWorkRepGain,
-          ],
-          ["Salary", props.player.work_money_mult, props.player.work_money_mult * BitNodeMultipliers.CompanyWorkMoney],
-        ]}
-      />
-      <br />
+        <MultiplierTable
+          rows={[
+            ["Company reputation gain", props.player.company_rep_mult],
+            [
+              "Faction reputation gain",
+              props.player.faction_rep_mult,
+              props.player.faction_rep_mult * BitNodeMultipliers.FactionWorkRepGain,
+            ],
+            [
+              "Salary",
+              props.player.work_money_mult,
+              props.player.work_money_mult * BitNodeMultipliers.CompanyWorkMoney,
+            ],
+          ]}
+        />
+        <br />
 
-      <MultiplierTable
-        rows={[
-          ["Crime success", props.player.crime_success_mult],
-          ["Crime money", props.player.crime_money_mult, props.player.crime_money_mult * BitNodeMultipliers.CrimeMoney],
-        ]}
-      />
-      <br />
+        <MultiplierTable
+          rows={[
+            ["Crime success", props.player.crime_success_mult],
+            [
+              "Crime money",
+              props.player.crime_money_mult,
+              props.player.crime_money_mult * BitNodeMultipliers.CrimeMoney,
+            ],
+          ]}
+        />
+        <br />
 
-      <BladeburnerMults />
-      <br />
+        <BladeburnerMults />
+        <br />
 
-      <b>Misc.</b>
-      <br />
-      <br />
-      <span>{`Servers owned: ${props.player.purchasedServers.length} / ${getPurchaseServerLimit()}`}</span>
-      <br />
-      <Hacknet />
-      <span>{`Augmentations installed: ${props.player.augmentations.length}`}</span>
-      <br />
-      <br />
-      {StatsTable(timeRows)}
-      <br />
-      <CurrentBitNode />
-    </pre>
+        <b>Misc.</b>
+        <br />
+        <br />
+        <span>{`Servers owned: ${props.player.purchasedServers.length} / ${getPurchaseServerLimit()}`}</span>
+        <br />
+        <Hacknet />
+        <span>{`Augmentations installed: ${props.player.augmentations.length}`}</span>
+        <br />
+        <br />
+        {StatsTable(timeRows)}
+        <br />
+        <CurrentBitNode />
+      </pre>
+    </div>
   );
 }