1 /* required styles */
\r
5 .leaflet-marker-icon,
\r
6 .leaflet-marker-shadow,
\r
8 .leaflet-overlay-pane,
\r
9 .leaflet-shadow-pane,
\r
10 .leaflet-marker-pane,
\r
11 .leaflet-popup-pane,
\r
12 .leaflet-overlay-pane svg,
\r
14 .leaflet-image-layer,
\r
15 .leaflet-layer { /* TODO optimize classes */
\r
19 .leaflet-container {
\r
22 -ms-touch-action: none;
\r
25 .leaflet-marker-icon,
\r
26 .leaflet-marker-shadow {
\r
27 -moz-user-select: none;
\r
28 -webkit-user-select: none;
\r
31 .leaflet-marker-icon,
\r
32 .leaflet-marker-shadow {
\r
35 .leaflet-clickable {
\r
38 .leaflet-dragging, .leaflet-dragging .leaflet-clickable {
\r
41 .leaflet-container img {
\r
42 /* map is broken in FF if you have max-width: 100% on tiles */
\r
43 max-width: none !important;
\r
45 .leaflet-container img.leaflet-image-layer {
\r
46 /* stupid Android 2 doesn't understand "max-width: none" properly */
\r
47 max-width: 15000px !important;
\r
50 .leaflet-tile-pane { z-index: 2; }
\r
51 .leaflet-objects-pane { z-index: 3; }
\r
52 .leaflet-overlay-pane { z-index: 4; }
\r
53 .leaflet-shadow-pane { z-index: 5; }
\r
54 .leaflet-marker-pane { z-index: 6; }
\r
55 .leaflet-popup-pane { z-index: 7; }
\r
61 .leaflet-tile-loaded {
\r
62 visibility: inherit;
\r
70 /* Leaflet controls */
\r
75 pointer-events: auto;
\r
81 pointer-events: none;
\r
99 .leaflet-right .leaflet-control {
\r
102 .leaflet-top .leaflet-control {
\r
105 .leaflet-bottom .leaflet-control {
\r
106 margin-bottom: 10px;
\r
108 .leaflet-left .leaflet-control {
\r
111 .leaflet-right .leaflet-control {
\r
112 margin-right: 10px;
\r
115 .leaflet-control-zoom {
\r
116 -moz-border-radius: 7px;
\r
117 -webkit-border-radius: 7px;
\r
118 border-radius: 7px;
\r
120 .leaflet-control-zoom {
\r
122 background: rgba(0, 0, 0, 0.25);
\r
124 .leaflet-control-zoom a {
\r
125 background-color: rgba(255, 255, 255, 0.75);
\r
127 .leaflet-control-zoom a, .leaflet-control-layers-toggle {
\r
128 background-position: 50% 50%;
\r
129 background-repeat: no-repeat;
\r
132 .leaflet-control-zoom a {
\r
133 -moz-border-radius: 4px;
\r
134 -webkit-border-radius: 4px;
\r
135 border-radius: 4px;
\r
139 .leaflet-control-zoom a:hover {
\r
140 background-color: #fff;
\r
142 .leaflet-touch .leaflet-control-zoom a {
\r
146 .leaflet-control-zoom-in {
\r
147 background-image: url(images/zoom-in.png);
\r
148 margin-bottom: 5px;
\r
150 .leaflet-control-zoom-out {
\r
151 background-image: url(images/zoom-out.png);
\r
154 .leaflet-control-layers {
\r
155 box-shadow: 0 1px 7px #999;
\r
156 background: #f8f8f9;
\r
157 -moz-border-radius: 8px;
\r
158 -webkit-border-radius: 8px;
\r
159 border-radius: 8px;
\r
161 .leaflet-control-layers-toggle {
\r
162 background-image: url(images/layers.png);
\r
166 .leaflet-touch .leaflet-control-layers-toggle {
\r
170 .leaflet-control-layers .leaflet-control-layers-list,
\r
171 .leaflet-control-layers-expanded .leaflet-control-layers-toggle {
\r
174 .leaflet-control-layers-expanded .leaflet-control-layers-list {
\r
176 position: relative;
\r
178 .leaflet-control-layers-expanded {
\r
179 padding: 6px 10px 6px 6px;
\r
180 font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
\r
184 .leaflet-control-layers-selector {
\r
186 position: relative;
\r
189 .leaflet-control-layers label {
\r
192 .leaflet-control-layers-separator {
\r
194 border-top: 1px solid #ddd;
\r
195 margin: 5px -10px 5px -6px;
\r
198 .leaflet-container .leaflet-control-attribution {
\r
199 background-color: rgba(255, 255, 255, 0.7);
\r
200 box-shadow: 0 0 5px #bbb;
\r
204 .leaflet-control-attribution,
\r
205 .leaflet-control-scale-line {
\r
210 .leaflet-container .leaflet-control-attribution,
\r
211 .leaflet-container .leaflet-control-scale {
\r
212 font: 11px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
\r
215 .leaflet-left .leaflet-control-scale {
\r
218 .leaflet-bottom .leaflet-control-scale {
\r
219 margin-bottom: 5px;
\r
222 .leaflet-control-scale-line {
\r
223 border: 2px solid #777;
\r
228 padding-bottom: 2px;
\r
229 text-shadow: 1px 1px 1px #fff;
\r
230 background-color: rgba(255, 255, 255, 0.5);
\r
232 .leaflet-control-scale-line:not(:first-child) {
\r
233 border-top: 2px solid #777;
\r
235 border-bottom: none;
\r
238 .leaflet-control-scale-line:not(:first-child):not(:last-child) {
\r
239 border-bottom: 2px solid #777;
\r
242 .leaflet-touch .leaflet-control-attribution, .leaflet-touch .leaflet-control-layers {
\r
245 .leaflet-touch .leaflet-control-layers {
\r
246 border: 5px solid #bbb;
\r
250 /* Zoom and fade animations */
\r
252 .leaflet-fade-anim .leaflet-tile, .leaflet-fade-anim .leaflet-popup {
\r
255 -webkit-transition: opacity 0.2s linear;
\r
256 -moz-transition: opacity 0.2s linear;
\r
257 -o-transition: opacity 0.2s linear;
\r
258 transition: opacity 0.2s linear;
\r
260 .leaflet-fade-anim .leaflet-tile-loaded, .leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
\r
264 .leaflet-zoom-anim .leaflet-zoom-animated {
\r
265 -webkit-transition: -webkit-transform 0.25s cubic-bezier(0.25,0.1,0.25,0.75);
\r
266 -moz-transition: -moz-transform 0.25s cubic-bezier(0.25,0.1,0.25,0.75);
\r
267 -o-transition: -o-transform 0.25s cubic-bezier(0.25,0.1,0.25,0.75);
\r
268 transition: transform 0.25s cubic-bezier(0.25,0.1,0.25,0.75);
\r
271 .leaflet-zoom-anim .leaflet-tile,
\r
272 .leaflet-pan-anim .leaflet-tile,
\r
273 .leaflet-touching .leaflet-zoom-animated {
\r
274 -webkit-transition: none;
\r
275 -moz-transition: none;
\r
276 -o-transition: none;
\r
280 .leaflet-zoom-anim .leaflet-zoom-hide {
\r
281 visibility: hidden;
\r
288 position: absolute;
\r
289 text-align: center;
\r
291 .leaflet-popup-content-wrapper {
\r
295 .leaflet-popup-content {
\r
298 .leaflet-popup-tip-container {
\r
302 position: relative;
\r
305 .leaflet-popup-tip {
\r
310 margin: -8px auto 0;
\r
312 -moz-transform: rotate(45deg);
\r
313 -webkit-transform: rotate(45deg);
\r
314 -ms-transform: rotate(45deg);
\r
315 -o-transform: rotate(45deg);
\r
316 transform: rotate(45deg);
\r
318 .leaflet-container a.leaflet-popup-close-button {
\r
319 position: absolute;
\r
322 padding: 4px 5px 0 0;
\r
323 text-align: center;
\r
326 font: 16px/14px Tahoma, Verdana, sans-serif;
\r
328 text-decoration: none;
\r
331 .leaflet-container a.leaflet-popup-close-button:hover {
\r
334 .leaflet-popup-content p {
\r
337 .leaflet-popup-scrolled {
\r
339 border-bottom: 1px solid #ddd;
\r
340 border-top: 1px solid #ddd;
\r
344 /* Visual appearance */
\r
346 .leaflet-container {
\r
349 .leaflet-container a {
\r
352 .leaflet-container a.leaflet-active {
\r
353 outline: 2px solid orange;
\r
355 .leaflet-zoom-box {
\r
356 border: 2px dotted #05f;
\r
360 .leaflet-div-icon {
\r
362 border: 1px solid #666;
\r
364 .leaflet-editing-icon {
\r
365 border-radius: 2px;
\r
367 .leaflet-popup-content-wrapper, .leaflet-popup-tip {
\r
370 box-shadow: 0 3px 14px rgba(0,0,0,0.35);
\r
371 -webkit-box-shadow: 0 3px 18px rgba(0,0,0,0.33);
\r
373 .leaflet-popup-content-wrapper {
\r
374 -moz-border-radius: 20px;
\r
375 -webkit-border-radius: 20px;
\r
376 border-radius: 20px;
\r
378 .leaflet-popup-content {
\r
379 font: 12px/1.4 "Helvetica Neue", Arial, Helvetica, sans-serif;
\r