style/lantea.css

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this file,
   3  * You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 body {
   6   font-family: sans-serif;
   7   margin: 0;
   8   background: url("loading.png") repeat;
   9 }
  10
  11 h1 {
  12   display: none;
  13 }
  14
  15 #menuArea {
  16   position: absolute;
  17   /* width: 30em; */
  18   left: 1%;
  19   top: 1em;
  20   z-index: 5;
  21 }
  22
  23 #zoomArea {
  24   position: absolute;
  25   right: 1%;
  26   top: 1em;
  27   z-index: 5;
  28   text-align: center;
  29 }
  30
  31 #fullscreenArea {
  32   position: absolute;
  33   right: 1%;
  34   bottom: 2em;
  35   z-index: 5;
  36   text-align: center;
  37 }
  38
  39 .overlayArea {
  40   transition-property: opacity;
  41   transition-duration: .2s;
  42 }
  43
  44 .overlayArea.hidden {
  45   opacity: 0;
  46   transition-duration: 1s;
  47 }
  48
  49 .overlayArea:-moz-system-metric(touch-enabled) {
  50   font-size: 3mozmm;
  51 }
  52
  53 .overlayArea input[type="button"]:-moz-system-metric(touch-enabled),
  54 .overlayArea select:-moz-system-metric(touch-enabled) {
  55   font-size: 3mozmm;
  56 }
  57
  58 #zoomLevel {
  59   background-color: rgba(255, 255, 255, .8);
  60   border-radius: 3px;
  61   padding: 0 3px;
  62 }
  63
  64 #settingsArea,
  65 #trackArea {
  66   display: none;
  67   background-color: rgba(255, 255, 255, .8);
  68   border: 0;
  69   border-radius: 5px;
  70 }
  71
  72 #settingsArea > legend,
  73 #trackArea > legend {
  74   display: none;
  75   background-color: rgba(255, 255, 255, .8);
  76   border-radius: 3px;
  77 }
  78
  79 #map, #track {
  80   position: fixed;
  81   border: 0;
  82   top: 0;
  83   left: 0;
  84   right: 0;
  85   bottom: 0;
  86   z-index: 1;
  87 }
  88
  89 #action {
  90   position: absolute;
  91   bottom: 5px;
  92   left: .5em;
  93   margin: 0;
  94   z-index: 3;
  95   background-color: rgba(255, 255, 255, .8);
  96   border-radius: 3px;
  97   padding: 0 3px;
  98 }
  99
 100 #actionimg {
 101   vertical-align: text-bottom;
 102 }
 103
 104 .debugHide {
 105   display: none;
 106 }
 107
 108 #copyright {
 109   position: absolute;
 110   bottom: 5px;
 111   right: .5em;
 112   margin: 0;
 113   font-size: small;
 114   opacity: .66;
 115   z-index: 2;
 116   background-color: rgba(255, 255, 255, 1);
 117   border-radius: 3px;
 118   padding: 0 3px;
 119 }
 120
 121 #copyright.hidden {
 122   opacity: 0;
 123 }
 124
 125 @media screen and (max-width: 500px) {
 126   body {
 127     font-size: 10px;
 128   }
 129   #menuArea {
 130     top: 1px;
 131     left: 1px;
 132   }
 133   #zoomArea {
 134     top: 1px;
 135     right: 1px;
 136   }
 137   #fullscreenArea {
 138     right: 1px;
 139     bottom: 10px;
 140   }
 141   #copyright {
 142     bottom: 1px;
 143     right: 1px;
 144     font-size: 8px;
 145   }
 146 }