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 #map {
  89   background: url("style/loading.png") repeat;
  90 }
  91
  92 #debug {
  93   position: absolute;
  94   bottom: 5px;
  95   left: .5em;
  96   margin: 0;
  97   z-index: 3;
  98   background-color: rgba(255, 255, 255, .8);
  99   border-radius: 3px;
 100   padding: 0 3px;
 101 }
 102
 103 .debugHide {
 104   display: none;
 105 }
 106
 107 #copyright {
 108   position: absolute;
 109   bottom: 5px;
 110   right: .5em;
 111   margin: 0;
 112   font-size: small;
 113   opacity: .66;
 114   z-index: 2;
 115   background-color: rgba(255, 255, 255, 1);
 116   border-radius: 3px;
 117   padding: 0 3px;
 118 }
 119
 120 #copyright.hidden {
 121   opacity: 0;
 122 }
 123
 124 @media screen and (max-width: 500px) {
 125   body {
 126     font-size: 10px;
 127   }
 128   #menuArea {
 129     top: 1px;
 130     left: 1px;
 131   }
 132   #zoomArea {
 133     top: 1px;
 134     right: 1px;
 135   }
 136   #fullscreenArea {
 137     right: 1px;
 138     bottom: 10px;
 139   }
 140   #copyright {
 141     bottom: 1px;
 142     right: 1px;
 143     font-size: 8px;
 144   }
 145 }