fixed findings

public/static/css/game.css

@@ -157,13 +157,14 @@
 #navigation .navigationItem {
     margin-top: 10px;
     opacity: 70%;
+    cursor: pointer;
 }
 
 #navigation .navigationItem:hover {
     opacity: 100%;
 }
 
-#navigation span {
+#navigation div {
     position: absolute;
 }
 
@@ -188,9 +189,9 @@
     }
     #showGuessButtonContainer {
         position: absolute;
-        left: 60px;
+        left: 65px;
         bottom: 30px;
-        right: 60px;
+        right: 20px;
         z-index: 2;
     }
     #guess {

public/static/js/game.js

@@ -334,6 +334,9 @@
             document.getElementById('guess').style.visibility = null;
             document.getElementById('guess').classList.remove('result');
 
+            // needs to be set visible after the show guess map hid it in mobile view
+            document.getElementById("navigation").style.visibility = 'visible';
+
             Game.initialize();
         },
 
@@ -379,9 +382,6 @@
             document.getElementById('currentRound').innerHTML = String(Game.rounds.length) + '/' + String(Game.NUMBER_OF_ROUNDS);
 
             Game.loadPano(Game.panoId, Game.pov);
-
-            // needs to be set visible after the show guess map hid it in mobile view
-            document.getElementById("navigation").style.visibility = 'visible';
         },
 
         handleErrorResponse: function (error) {

views/game.php

@@ -61,12 +61,12 @@
     </div>
     <div id="navigation">
         <div id="returnToStart" class="navigationItem">
-            <span>
+            <div>
                 <img src="<?= $_ENV['STATIC_ROOT'] ?>/img/circle_background.svg?rev=<?= REVISION ?>" alt="Circle Background" class="circleBackground" />
-            </span>
-            <span>
+            </div>
+            <div>
                 <img src="<?= $_ENV['STATIC_ROOT'] ?>/img/house-fill.svg?rev=<?= REVISION ?>" alt="Return to Start icon" class="navigationIcon" />
-            </span>
+            </div>
         </div>
     </div>
 @endsection