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 }
   9
  10 h1 {
  11   display: none;
  12 }
  13
  14 #menuArea {
  15   position: absolute;
  16   /* width: 30em; */
  17   left: 1%;
  18   top: 1em;
  19   z-index: 5;
  20 }
  21
  22 #zoomArea {
  23   position: absolute;
  24   right: 1%;
  25   top: 1em;
  26   z-index: 5;
  27   text-align: center;
  28 }
  29
  30 #fullscreenArea {
  31   position: absolute;
  32   right: 1%;
  33   bottom: 2em;
  34   z-index: 5;
  35   text-align: center;
  36 }
  37
  38 .overlayArea {
  39   transition-property: opacity;
  40   transition-duration: .2s;
  41 }
  42
  43 .overlayArea.hidden {
  44   opacity: 0;
  45   transition-duration: 1s;
  46 }
  47
  48 .overlayArea:-moz-system-metric(touch-enabled) {
  49   font-size: 3mozmm;
  50 }
  51
  52 .overlayArea input[type="button"]:-moz-system-metric(touch-enabled),
  53 .overlayArea select:-moz-system-metric(touch-enabled) {
  54   font-size: 3mozmm;
  55 }
  56
  57 #zoomLevel {
  58   background-color: rgba(255, 255, 255, .8);
  59   border-radius: 3px;
  60   padding: 0 3px;
  61 }
  62
  63 #settingsArea,
  64 #trackArea {
  65   display: none;
  66   background-color: rgba(255, 255, 255, .8);
  67   border: 0;
  68   border-radius: 5px;
  69 }
  70
  71 #settingsArea > legend,
  72 #trackArea > legend {
  73   display: none;
  74   background-color: rgba(255, 255, 255, .8);
  75   border-radius: 3px;
  76 }
  77
  78 #map, #track {
  79   position: fixed;
  80   border: 0;
  81   top: 0;
  82   left: 0;
  83   right: 0;
  84   bottom: 0;
  85   z-index: 1;
  86 }
  87
  88 #debug {
  89   position: absolute;
  90   bottom: 5px;
  91   left: .5em;
  92   margin: 0;
  93   z-index: 3;
  94   background-color: rgba(255, 255, 255, .8);
  95   border-radius: 3px;
  96   padding: 0 3px;
  97 }
  98
  99 .debugHide {
 100   display: none;
 101 }
 102
 103 #copyright {
 104   position: absolute;
 105   bottom: 5px;
 106   right: .5em;
 107   margin: 0;
 108   font-size: small;
 109   opacity: .66;
 110   z-index: 2;
 111   background-color: rgba(255, 255, 255, 1);
 112   border-radius: 3px;
 113   padding: 0 3px;
 114 }
 115
 116 #copyright.hidden {
 117   opacity: 0;
 118 }
 119
 120 @media screen and (max-width: 500px) {
 121   body {
 122     font-size: 10px;
 123   }
 124   #menuArea {
 125     top: 1px;
 126     left: 1px;
 127   }
 128   #zoomArea {
 129     top: 1px;
 130     right: 1px;
 131   }
 132   #fullscreenArea {
 133     right: 1px;
 134     bottom: 10px;
 135   }
 136   #copyright {
 137     bottom: 1px;
 138     right: 1px;
 139     font-size: 8px;
 140   }
 141 }