website/css/leaflet.css

   1 /* http://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.css */
   2
   3 /* required styles */
   4
   5 .leaflet-map-pane,
   6 .leaflet-tile,
   7 .leaflet-marker-icon,
   8 .leaflet-marker-shadow,
   9 .leaflet-tile-pane,
  10 .leaflet-tile-container,
  11 .leaflet-overlay-pane,
  12 .leaflet-shadow-pane,
  13 .leaflet-marker-pane,
  14 .leaflet-popup-pane,
  15 .leaflet-overlay-pane svg,
  16 .leaflet-zoom-box,
  17 .leaflet-image-layer,
  18 .leaflet-layer {
  19         position: absolute;
  20         left: 0;
  21         top: 0;
  22         }
  23 .leaflet-container {
  24         overflow: hidden;
  25         -ms-touch-action: none;
  26         }
  27 .leaflet-tile,
  28 .leaflet-marker-icon,
  29 .leaflet-marker-shadow {
  30         -webkit-user-select: none;
  31            -moz-user-select: none;
  32                 user-select: none;
  33         -webkit-user-drag: none;
  34         }
  35 .leaflet-marker-icon,
  36 .leaflet-marker-shadow {
  37         display: block;
  38         }
  39 /* map is broken in FF if you have max-width: 100% on tiles */
  40 .leaflet-container img {
  41         max-width: none !important;
  42         }
  43 /* stupid Android 2 doesn't understand "max-width: none" properly */
  44 .leaflet-container img.leaflet-image-layer {
  45         max-width: 15000px !important;
  46         }
  47 .leaflet-tile {
  48         filter: inherit;
  49         visibility: hidden;
  50         }
  51 .leaflet-tile-loaded {
  52         visibility: inherit;
  53         }
  54 .leaflet-zoom-box {
  55         width: 0;
  56         height: 0;
  57         }
  58 /* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
  59 .leaflet-overlay-pane svg {
  60         -moz-user-select: none;
  61         }
  62
  63 .leaflet-tile-pane    { z-index: 2; }
  64 .leaflet-objects-pane { z-index: 3; }
  65 .leaflet-overlay-pane { z-index: 4; }
  66 .leaflet-shadow-pane  { z-index: 5; }
  67 .leaflet-marker-pane  { z-index: 6; }
  68 .leaflet-popup-pane   { z-index: 7; }
  69
  70 .leaflet-vml-shape {
  71         width: 1px;
  72         height: 1px;
  73         }
  74 .lvml {
  75         behavior: url(#default#VML);
  76         display: inline-block;
  77         position: absolute;
  78         }
  79
  80
  81 /* control positioning */
  82
  83 .leaflet-control {
  84         position: relative;
  85         z-index: 7;
  86         pointer-events: auto;
  87         }
  88 .leaflet-top,
  89 .leaflet-bottom {
  90         position: absolute;
  91         z-index: 1000;
  92         pointer-events: none;
  93         }
  94 .leaflet-top {
  95         top: 0;
  96         }
  97 .leaflet-right {
  98         right: 0;
  99         }
 100 .leaflet-bottom {
 101         bottom: 0;
 102         }
 103 .leaflet-left {
 104         left: 0;
 105         }
 106 .leaflet-control {
 107         float: left;
 108         clear: both;
 109         }
 110 .leaflet-right .leaflet-control {
 111         float: right;
 112         }
 113 .leaflet-top .leaflet-control {
 114         margin-top: 10px;
 115         }
 116 .leaflet-bottom .leaflet-control {
 117         margin-bottom: 10px;
 118         }
 119 .leaflet-left .leaflet-control {
 120         margin-left: 10px;
 121         }
 122 .leaflet-right .leaflet-control {
 123         margin-right: 10px;
 124         }
 125
 126
 127 /* zoom and fade animations */
 128
 129 .leaflet-fade-anim .leaflet-tile,
 130 .leaflet-fade-anim .leaflet-popup {
 131         opacity: 0;
 132         -webkit-transition: opacity 0.2s linear;
 133            -moz-transition: opacity 0.2s linear;
 134              -o-transition: opacity 0.2s linear;
 135                 transition: opacity 0.2s linear;
 136         }
 137 .leaflet-fade-anim .leaflet-tile-loaded,
 138 .leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
 139         opacity: 1;
 140         }
 141
 142 .leaflet-zoom-anim .leaflet-zoom-animated {
 143         -webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
 144            -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
 145              -o-transition:      -o-transform 0.25s cubic-bezier(0,0,0.25,1);
 146                 transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
 147         }
 148 .leaflet-zoom-anim .leaflet-tile,
 149 .leaflet-pan-anim .leaflet-tile,
 150 .leaflet-touching .leaflet-zoom-animated {
 151         -webkit-transition: none;
 152            -moz-transition: none;
 153              -o-transition: none;
 154                 transition: none;
 155         }
 156
 157 .leaflet-zoom-anim .leaflet-zoom-hide {
 158         visibility: hidden;
 159         }
 160
 161
 162 /* cursors */
 163
 164 .leaflet-clickable {
 165         cursor: pointer;
 166         }
 167 .leaflet-container {
 168         cursor: -webkit-grab;
 169         cursor:    -moz-grab;
 170         }
 171 .leaflet-popup-pane,
 172 .leaflet-control {
 173         cursor: auto;
 174         }
 175 .leaflet-dragging .leaflet-container,
 176 .leaflet-dragging .leaflet-clickable {
 177         cursor: move;
 178         cursor: -webkit-grabbing;
 179         cursor:    -moz-grabbing;
 180         }
 181
 182
 183 /* visual tweaks */
 184
 185 .leaflet-container {
 186         background: #ddd;
 187         outline: 0;
 188         }
 189 .leaflet-container a {
 190         color: #0078A8;
 191         }
 192 .leaflet-container a.leaflet-active {
 193         outline: 2px solid orange;
 194         }
 195 .leaflet-zoom-box {
 196         border: 2px dotted #38f;
 197         background: rgba(255,255,255,0.5);
 198         }
 199
 200
 201 /* general typography */
 202 .leaflet-container {
 203         font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
 204         }
 205
 206
 207 /* general toolbar styles */
 208
 209 .leaflet-bar {
 210         box-shadow: 0 1px 5px rgba(0,0,0,0.65);
 211         border-radius: 4px;
 212         }
 213 .leaflet-bar a,
 214 .leaflet-bar a:hover {
 215         background-color: #fff;
 216         border-bottom: 1px solid #ccc;
 217         width: 26px;
 218         height: 26px;
 219         line-height: 26px;
 220         display: block;
 221         text-align: center;
 222         text-decoration: none;
 223         color: black;
 224         }
 225 .leaflet-bar a,
 226 .leaflet-control-layers-toggle {
 227         background-position: 50% 50%;
 228         background-repeat: no-repeat;
 229         display: block;
 230         }
 231 .leaflet-bar a:hover {
 232         background-color: #f4f4f4;
 233         }
 234 .leaflet-bar a:first-child {
 235         border-top-left-radius: 4px;
 236         border-top-right-radius: 4px;
 237         }
 238 .leaflet-bar a:last-child {
 239         border-bottom-left-radius: 4px;
 240         border-bottom-right-radius: 4px;
 241         border-bottom: none;
 242         }
 243 .leaflet-bar a.leaflet-disabled {
 244         cursor: default;
 245         background-color: #f4f4f4;
 246         color: #bbb;
 247         }
 248
 249 .leaflet-touch .leaflet-bar a {
 250         width: 30px;
 251         height: 30px;
 252         line-height: 30px;
 253         }
 254
 255
 256 /* zoom control */
 257
 258 .leaflet-control-zoom-in,
 259 .leaflet-control-zoom-out {
 260         font: bold 18px 'Lucida Console', Monaco, monospace;
 261         text-indent: 1px;
 262         }
 263 .leaflet-control-zoom-out {
 264         font-size: 20px;
 265         }
 266
 267 .leaflet-touch .leaflet-control-zoom-in {
 268         font-size: 22px;
 269         }
 270 .leaflet-touch .leaflet-control-zoom-out {
 271         font-size: 24px;
 272         }
 273
 274
 275 /* layers control */
 276
 277 .leaflet-control-layers {
 278         box-shadow: 0 1px 5px rgba(0,0,0,0.4);
 279         background: #fff;
 280         border-radius: 5px;
 281         }
 282 .leaflet-control-layers-toggle {
 283         background-image: url(images/layers.png);
 284         width: 36px;
 285         height: 36px;
 286         }
 287 .leaflet-retina .leaflet-control-layers-toggle {
 288         background-image: url(images/layers-2x.png);
 289         background-size: 26px 26px;
 290         }
 291 .leaflet-touch .leaflet-control-layers-toggle {
 292         width: 44px;
 293         height: 44px;
 294         }
 295 .leaflet-control-layers .leaflet-control-layers-list,
 296 .leaflet-control-layers-expanded .leaflet-control-layers-toggle {
 297         display: none;
 298         }
 299 .leaflet-control-layers-expanded .leaflet-control-layers-list {
 300         display: block;
 301         position: relative;
 302         }
 303 .leaflet-control-layers-expanded {
 304         padding: 6px 10px 6px 6px;
 305         color: #333;
 306         background: #fff;
 307         }
 308 .leaflet-control-layers-selector {
 309         margin-top: 2px;
 310         position: relative;
 311         top: 1px;
 312         }
 313 .leaflet-control-layers label {
 314         display: block;
 315         }
 316 .leaflet-control-layers-separator {
 317         height: 0;
 318         border-top: 1px solid #ddd;
 319         margin: 5px -10px 5px -6px;
 320         }
 321
 322
 323 /* attribution and scale controls */
 324
 325 .leaflet-container .leaflet-control-attribution {
 326         background: #fff;
 327         background: rgba(255, 255, 255, 0.7);
 328         margin: 0;
 329         }
 330 .leaflet-control-attribution,
 331 .leaflet-control-scale-line {
 332         padding: 0 5px;
 333         color: #333;
 334         }
 335 .leaflet-control-attribution a {
 336         text-decoration: none;
 337         }
 338 .leaflet-control-attribution a:hover {
 339         text-decoration: underline;
 340         }
 341 .leaflet-container .leaflet-control-attribution,
 342 .leaflet-container .leaflet-control-scale {
 343         font-size: 11px;
 344         }
 345 .leaflet-left .leaflet-control-scale {
 346         margin-left: 5px;
 347         }
 348 .leaflet-bottom .leaflet-control-scale {
 349         margin-bottom: 5px;
 350         }
 351 .leaflet-control-scale-line {
 352         border: 2px solid #777;
 353         border-top: none;
 354         line-height: 1.1;
 355         padding: 2px 5px 1px;
 356         font-size: 11px;
 357         white-space: nowrap;
 358         overflow: hidden;
 359         -moz-box-sizing: content-box;
 360              box-sizing: content-box;
 361
 362         background: #fff;
 363         background: rgba(255, 255, 255, 0.5);
 364         }
 365 .leaflet-control-scale-line:not(:first-child) {
 366         border-top: 2px solid #777;
 367         border-bottom: none;
 368         margin-top: -2px;
 369         }
 370 .leaflet-control-scale-line:not(:first-child):not(:last-child) {
 371         border-bottom: 2px solid #777;
 372         }
 373
 374 .leaflet-touch .leaflet-control-attribution,
 375 .leaflet-touch .leaflet-control-layers,
 376 .leaflet-touch .leaflet-bar {
 377         box-shadow: none;
 378         }
 379 .leaflet-touch .leaflet-control-layers,
 380 .leaflet-touch .leaflet-bar {
 381         border: 2px solid rgba(0,0,0,0.2);
 382         background-clip: padding-box;
 383         }
 384
 385
 386 /* popup */
 387
 388 .leaflet-popup {
 389         position: absolute;
 390         text-align: center;
 391         }
 392 .leaflet-popup-content-wrapper {
 393         padding: 1px;
 394         text-align: left;
 395         border-radius: 12px;
 396         }
 397 .leaflet-popup-content {
 398         margin: 13px 19px;
 399         line-height: 1.4;
 400         }
 401 .leaflet-popup-content p {
 402         margin: 18px 0;
 403         }
 404 .leaflet-popup-tip-container {
 405         margin: 0 auto;
 406         width: 40px;
 407         height: 20px;
 408         position: relative;
 409         overflow: hidden;
 410         }
 411 .leaflet-popup-tip {
 412         width: 17px;
 413         height: 17px;
 414         padding: 1px;
 415
 416         margin: -10px auto 0;
 417
 418         -webkit-transform: rotate(45deg);
 419            -moz-transform: rotate(45deg);
 420             -ms-transform: rotate(45deg);
 421              -o-transform: rotate(45deg);
 422                 transform: rotate(45deg);
 423         }
 424 .leaflet-popup-content-wrapper,
 425 .leaflet-popup-tip {
 426         background: white;
 427
 428         box-shadow: 0 3px 14px rgba(0,0,0,0.4);
 429         }
 430 .leaflet-container a.leaflet-popup-close-button {
 431         position: absolute;
 432         top: 0;
 433         right: 0;
 434         padding: 4px 4px 0 0;
 435         text-align: center;
 436         width: 18px;
 437         height: 14px;
 438         font: 16px/14px Tahoma, Verdana, sans-serif;
 439         color: #c3c3c3;
 440         text-decoration: none;
 441         font-weight: bold;
 442         background: transparent;
 443         }
 444 .leaflet-container a.leaflet-popup-close-button:hover {
 445         color: #999;
 446         }
 447 .leaflet-popup-scrolled {
 448         overflow: auto;
 449         border-bottom: 1px solid #ddd;
 450         border-top: 1px solid #ddd;
 451         }
 452
 453 .leaflet-oldie .leaflet-popup-content-wrapper {
 454         zoom: 1;
 455         }
 456 .leaflet-oldie .leaflet-popup-tip {
 457         width: 24px;
 458         margin: 0 auto;
 459
 460         -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
 461         filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
 462         }
 463 .leaflet-oldie .leaflet-popup-tip-container {
 464         margin-top: -1px;
 465         }
 466
 467 .leaflet-oldie .leaflet-control-zoom,
 468 .leaflet-oldie .leaflet-control-layers,
 469 .leaflet-oldie .leaflet-popup-content-wrapper,
 470 .leaflet-oldie .leaflet-popup-tip {
 471         border: 1px solid #999;
 472         }
 473
 474
 475 /* div icon */
 476
 477 .leaflet-div-icon {
 478         background: #fff;
 479         border: 1px solid #666;
 480         }