MAPG-35 further adaptations for mobile devices

implicitely fix issue MAPG-17

public/static/css/mapguesser.css

@@ -194,15 +194,22 @@ div.buttonContainer.bottom {
     }
 
     #guess {
+        width: 500px;
+        height: 350px;
+        opacity: 0.95;
+    }
+
+    #guess.adapt {
+        top: initial;
         width: 250px;
-        height: 150px;
+        height: 175px;
         opacity: 0.5;
         transition-property: width, height, opacity;
         transition-duration: 0.1s;
         transition-delay: 0.8s;
     }
 
-    #guess:hover {
+    #guess.adapt:hover {
         width: 500px;
         height: 350px;
         opacity: 0.95;
@@ -227,4 +234,16 @@ div.buttonContainer.bottom {
     #scoreBarBase {
         width: 60%;
     }
+
+     @media screen and (max-height: 389px) {
+        #guess {
+            top: 20px;
+            height: initial;
+        }
+
+        #guess.adapt:hover {
+            top: 20px;
+            height: initial;
+        }
+    }
 }