website/css/leaflet.css

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