diff --git a/src/components/Info.tsx b/src/components/Info.tsx
index da92edc..46328be 100644
--- a/src/components/Info.tsx
+++ b/src/components/Info.tsx
@@ -2,7 +2,7 @@ import '../styles/info.css'
 
 function Info(props) {
     return(
-        <div className="infoSection">
+        <div className="infoSection" style={{visibility: props.optionsOn ? 'hidden' : 'visible'}}>
             <div>
                 { props.live === true &&  <h2 className="loggedDisplay">You are live!</h2> }
                 { props.live === false && <h2 className="loggedDisplay">Offline</h2> }
diff --git a/src/components/Marker.tsx b/src/components/Marker.tsx
index 7c23607..141058b 100644
--- a/src/components/Marker.tsx
+++ b/src/components/Marker.tsx
@@ -180,7 +180,7 @@ function Marker(props) {
     }, [props.live])
 
     return(
-        <div id="markerBackdrop" style={{display: props.optionsOn ? 'hidden' : 'visible'}}>
+        <div id="markerBackdrop" style={{visibility: props.optionsOn ? 'hidden' : 'visible'}}>
             <section className="hotkeySection">
                 <h1 id="hotkeyTitle" className="heading">Hotkey</h1>    
                 <button className="hotkeyButton modeButton"