diff --git a/src/assets/stylesheets/info-dialog.scss b/src/assets/stylesheets/info-dialog.scss
index 25f61b7ddf499d1c5c604e4d9496a6856571f57a..47b06a43623b109a9fa27060d83f7da44889e59c 100644
--- a/src/assets/stylesheets/info-dialog.scss
+++ b/src/assets/stylesheets/info-dialog.scss
@@ -4,7 +4,6 @@
   top: 0;
   left: 0;
   position: fixed;
-  pointer-events: none;
   color: white;
   z-index: 2;
 }
@@ -59,7 +58,7 @@
         justify-content: center;
         margin: 16px 0;
         a {
-          margin: 0px 12px;
+          margin: 0 12px;
           color: $light-text;
         }
       }
diff --git a/src/react-components/info-dialog.js b/src/react-components/info-dialog.js
index 53ddda750f5d64702051355f004ae14b8b99ccb3..6e27e39c91262cf7e23a2597d00793f5f172f34b 100644
--- a/src/react-components/info-dialog.js
+++ b/src/react-components/info-dialog.js
@@ -27,23 +27,30 @@ class InfoDialog extends Component {
 
     const loc = document.location;
     this.shareLink = `${loc.protocol}//${loc.host}${loc.pathname}`;
-    this.onKeyPress = this.onKeyPress.bind(this);
+    this.onKeyDown = this.onKeyDown.bind(this);
+    this.onContainerClicked = this.onContainerClicked.bind(this);
   }
 
   componentDidMount() {
-    window.addEventListener("keypress", this.onKeyPress);
+    window.addEventListener("keydown", this.onKeyDown);
   }
 
   componentWillUnmount() {
-    window.removeEventListener("keypress", this.onKeyPress);
+    window.removeEventListener("keydown", this.onKeyDown);
   }
 
-  onKeyPress(e) {
+  onKeyDown(e) {
     if (e.key === "Escape") {
       this.props.onCloseDialog();
     }
   }
 
+  onContainerClicked(e) {
+    if (e.currentTarget === e.target) {
+      this.props.onCloseDialog();
+    }
+  }
+
   shareLinkClicked = () => {
     navigator.share({
       title: document.title,
@@ -226,7 +233,7 @@ class InfoDialog extends Component {
             <p>
               The <b>Bubble Toggle</b> hides avatars that enter your personal space.
             </p>
-            <div className="dialog__box__contents__links">
+            <p className="dialog__box__contents__links">
               <a target="_blank" rel="noopener noreferrer" href="https://github.com/mozilla/hubs/blob/master/TERMS.md">
                 <FormattedMessage id="profile.terms_of_use" />
               </a>
@@ -237,7 +244,7 @@ class InfoDialog extends Component {
               >
                 <FormattedMessage id="profile.privacy_notice" />
               </a>
-            </div>
+            </p>
           </div>
         );
         break;
@@ -250,7 +257,7 @@ class InfoDialog extends Component {
 
     return (
       <div className="dialog-overlay">
-        <div className={dialogClasses}>
+        <div className={dialogClasses} onClick={this.onContainerClicked}>
           <div className="dialog__box">
             <div className="dialog__box__contents">
               <button className="dialog__box__contents__close" onClick={this.props.onCloseDialog}>