PluginProbe
WP Directory Kit / 1.1.6
WP Directory Kit v1.1.6
1.5.6 1.5.5 1.5.4 1.5.3 trunk 1.1.0 1.1.6 1.1.8 1.2.3 1.2.4 1.2.5 1.2.6 1.2.7 1.2.8 1.2.9 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 1.3.6 1.3.8 1.4.0 1.4.1 All 35 releases
wpdirectorykit / elementor-elements / assets / css / widgets / wdk-map.css

wdk-map.css in WP Directory Kit 1.1.6, at elementor-elements/assets/css/widgets/wdk-map.css

1,197 lines 28.3 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 @-webkit-keyframes wdk_placeHolderShimmer {
2 0% {
3 background-position: -468px 0;
4 }
5 100% {
6 background-position: 468px 0;
7 }
8 }
9
10 @keyframes wdk_placeHolderShimmer {
11 0% {
12 background-position: -468px 0;
13 }
14 100% {
15 background-position: 468px 0;
16 }
17 }
18
19 .wdk-element .wdk-map {
20 /* custom marker */
21 /* end custom marker */
22 /* leaftet map */
23 }
24
25 .wdk-element .wdk-map .wdk-favorites-actions a.wdk-add-favorites-action {
26 color: #fff;
27 }
28
29 .wdk-element .wdk-map .wdk-listing-card .wdk-footer {
30 z-index: 5;
31 position: relative;
32 }
33
34 .wdk-element .wdk-map img.leaflet-tile {
35 box-shadow: none !important;
36 }
37
38 .wdk-element .wdk-map .wdk-listing-card .wdk-thumbnail .wdk-image {
39 height: 190px;
40 }
41
42 .wdk-element .wdk-map .animated-background {
43 animation-duration: 1s;
44 animation-fill-mode: forwards;
45 animation-iteration-count: infinite;
46 animation-name: wdk_placeHolderShimmer;
47 animation-timing-function: linear;
48 -webkit-animation-duration: 1s;
49 -webkit-animation-fill-mode: forwards;
50 -webkit-animation-iteration-count: infinite;
51 -webkit-animation-name: wdk_placeHolderShimmer;
52 -webkit-animation-timing-function: linear;
53 background: #f6f7f8;
54 background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
55 background-size: 800px 104px;
56 height: 96px;
57 position: relative;
58 }
59
60 .wdk-element .wdk-map .map_infowindow .loading_content {
61 height: 280px;
62 margin: 0;
63 margin-bottom: 5px;
64 width: 100%;
65 position: relative;
66 z-index: 5;
67 }
68
69 .wdk-element .wdk-map .map_infowindow .loading_content .box_line {
70 height: 10px;
71 background: #fff;
72 width: 100%;
73 margin: 0;
74 margin-bottom: 0px;
75 float: left;
76 height: 16px;
77 }
78
79 .wdk-element .wdk-map .map_infowindow .loading_content .box_line.m20 {
80 margin-bottom: 16px;
81 }
82
83 .wdk-element .wdk-map .map_infowindow .loading_content .box_line.side {
84 width: 48%;
85 }
86
87 .wdk-element .wdk-map .map_infowindow .loading_content .box_line.side:nth-child(odd) {
88 margin-right: 2%;
89 }
90
91 .wdk-element .wdk-map .map_infowindow .loading_content .box_line.side:nth-child(even) {
92 margin-left: 2%;
93 }
94
95 .wdk-element .wdk-map .map_infowindow .loading_content .box_line.m170 {
96 margin-bottom: 125px;
97 height: 1px;
98 }
99
100 .wdk-element .wdk-map div#wdk_map_results {
101 height: 350px;
102 }
103
104 .wdk-element .wdk-map .wdk_marker-cluster img,
105 .wdk-element .wdk-map .wdk_cluster img {
106 display: none !important;
107 }
108
109 .wdk-element .wdk-map .wdk_marker-cluster,
110 .wdk-element .wdk-map .wdk_cluster {
111 background: transparent !important;
112 }
113
114 .wdk-element .wdk-map .wdk_marker-cluster div,
115 .wdk-element .wdk-map .wdk_cluster div {
116 color: #fff !important;
117 width: 36px !important;
118 height: 36px !important;
119 line-height: 36px !important;
120 background: #0074e4 !important;
121 -webkit-border-radius: 50% !important;
122 border-radius: 50% !important;
123 position: relative;
124 text-align: center;
125 font-size: 14px !important;
126 -webkit-animation: cluster-animation 2.5s infinite;
127 animation: cluster-animation 2.5s infinite;
128 }
129
130 @-webkit-keyframes cluster-animation {
131 0%,
132 100% {
133 -webkit-transform: scale(1.3) rotate(0deg);
134 transform: scale(1.3) rotate(0deg);
135 }
136 50% {
137 -webkit-transform: scale(1.55) rotate(90deg);
138 transform: scale(1.55) rotate(90deg);
139 }
140 }
141
142 @keyframes cluster-animation {
143 0%,
144 100% {
145 -webkit-transform: scale(1.3) rotate(0deg);
146 transform: scale(1.3) rotate(0deg);
147 }
148 50% {
149 -webkit-transform: scale(1.55) rotate(90deg);
150 transform: scale(1.55) rotate(90deg);
151 }
152 }
153
154 .wdk-element .wdk-map .wdk_map-marker-container {
155 position: absolute;
156 margin-top: 10px;
157 -webkit-transform: translate3d(-50%, -100%, 0);
158 transform: translate3d(-50%, -100%, 0);
159 }
160
161 .wdk-element .wdk-map .wdk_marker-container {
162 position: relative;
163 margin: 10px auto;
164 width: 49px;
165 height: 49px;
166 z-index: 1;
167 -webkit-border-radius: 50%;
168 border-radius: 50%;
169 cursor: pointer;
170 top: -5px;
171 margin-bottom: 21px;
172 }
173
174 .wdk-element .wdk-map .wdk_marker-container {
175 -webkit-perspective: 1000;
176 perspective: 1000;
177 }
178
179 .wdk-element .wdk-map .wdk_marker-card {
180 width: 100%;
181 height: 100%;
182 -webkit-transform-style: preserve-3d;
183 transform-style: preserve-3d;
184 -webkit-transition: all 0.4s ease-in-out;
185 -o-transition: all 0.4s ease-in-out;
186 transition: all 0.4s ease-in-out;
187 position: absolute;
188 z-index: 1;
189 }
190
191 .wdk-element .wdk-map .wdk_marker-arrow {
192 display: none;
193 width: 0;
194 content: "";
195 height: 0;
196 /* filter: drop-shadow(0px 0px 1px #0074e4); */
197 border-style: solid;
198 border-width: 40px 24px 0;
199 margin-left: -0px;
200 border-color: #0074e4 transparent transparent;
201 top: 31px;
202 left: 50%;
203 -webkit-transform: translateX(-50%);
204 -ms-transform: translateX(-50%);
205 transform: translateX(-50%);
206 position: absolute;
207 -webkit-border-radius: 0;
208 border-radius: 0;
209 z-index: 1;
210 }
211
212 .wdk-element .wdk-map .wdk_face {
213 position: absolute;
214 width: 100%;
215 height: 124%;
216 -webkit-backface-visibility: hidden;
217 backface-visibility: hidden;
218 text-align: center;
219 -webkit-border-radius: 10%;
220 border-radius: 10%;
221 color: #fff;
222 z-index: 100;
223 -webkit-border-radius: 0;
224 border-radius: 0;
225 -webkit-transform: perspective(100px);
226 transform: perspective(100px);
227 }
228
229 .wdk-element .wdk-map .wdk_face i {
230 line-height: 61px;
231 font-size: 18px;
232 position: relative;
233 z-index: 78;
234 color: #0074e4;
235 -webkit-transform: perspective(0);
236 transform: perspective(0);
237 left: -1px;
238 transition: all .15s;
239 }
240
241 .wdk-element .wdk-map .wdk_face.front {
242 color: #0074e4;
243 z-index: 100;
244 position: relative;
245 z-index: 100;
246 position: absolute;
247 }
248
249 .wdk-element .wdk-map .wdk_marker-container:hover .wdk_face i {
250 color: #fff;
251 }
252
253 .wdk-element .wdk-map .wdk_marker-card:after {
254 content: '';
255 position: absolute;
256 top: 4px;
257 margin-top: 0px;
258 left: 2px;
259 width: 44px;
260 height: 63px;
261 z-index: 1;
262 -webkit-transition: all 0.4s ease-in-out;
263 -o-transition: all 0.4s ease-in-out;
264 transition: all 0.4s ease-in-out;
265 -webkit-transform: perspective(34px) rotateX(20deg) rotateZ(-45deg);
266 transform: perspective(34px) rotateX(20deg) rotateZ(-45deg);
267 -webkit-transform-origin: 50% 50%;
268 -ms-transform-origin: 50% 50%;
269 transform-origin: 50% 50%;
270 -webkit-border-radius: 60% 50% 60% 0;
271 border-radius: 60% 50% 60% 0;
272 padding: 0 3px 3px 0;
273 width: 43px;
274 height: 43px;
275 background: #fff;
276 z-index: 0;
277 filter: blur(0.25px);
278 }
279
280 .wdk-element .wdk-map .wdk_marker-container:hover .wdk_marker-card:after {
281 background: #0074e4;
282 }
283
284 .wdk-element .wdk-map .wdk_marker-card:before {
285 content: '';
286 position: absolute;
287 top: 2px;
288 left: 0px;
289 width: 44px;
290 height: 63px;
291 z-index: 1;
292 -webkit-transition: all 0.4s ease-in-out;
293 -o-transition: all 0.4s ease-in-out;
294 transition: all 0.4s ease-in-out;
295 -webkit-transform: perspective(38px) rotateX(20deg) rotateZ(-45deg);
296 transform: perspective(38px) rotateX(20deg) rotateZ(-45deg);
297 -webkit-transform-origin: 50% 50%;
298 -ms-transform-origin: 50% 50%;
299 transform-origin: 50% 50%;
300 -webkit-border-radius: 60% 50% 60% 0;
301 border-radius: 60% 50% 60% 0;
302 padding: 0 3px 3px 0;
303 width: 47px;
304 height: 47px;
305 background: #0074e4;
306 z-index: 0;
307 filter: blur(0.25px);
308 }
309
310 .wdk-element .wdk-map .wdk_marker-container:hover .wdk_marker-card:after {
311 opacity: 0;
312 }
313
314 .wdk-element .wdk-map .wdk_face.back {
315 -webkit-transform: rotateY(180deg);
316 transform: rotateY(180deg);
317 -webkit-box-sizing: border-box;
318 box-sizing: border-box;
319 background: #0074e4;
320 border-color: #0074e4;
321 color: #fff;
322 z-index: 25;
323 }
324
325 .wdk-element .wdk-map .wdk_face.back i {
326 transform: scaleX(-1);
327 line-height: 38px;
328 font-size: 18px;
329 }
330
331 .wdk-element .wdk-map .wdk_face.back:after {
332 content: "";
333 display: block;
334 width: 36px;
335 height: 36px;
336 top: 2px;
337 left: 2px;
338 -webkit-border-radius: 10%;
339 border-radius: 10%;
340 position: absolute;
341 }
342
343 .wdk-element .wdk-map .wdk_marker-container.wdk_marker_label {
344 height: auto;
345 width: auto;
346 padding: 0;
347 border-radius: 0;
348 margin: 0;
349 margin-left: 0px;
350 top: 0;
351 position: initial;
352 display: inline-block;
353 margin-left: -50%;
354 box-shadow: 0 0 2px 0 #ffffff69;
355 transition: all .15s;
356 }
357
358 .wdk-element .wdk-map .wdk_marker-container.wdk_marker_label:not(.wdk_marker_clear) {
359 padding: 1px 5px;
360 border: 1px solid #d9304f;
361 background: #e93e5f;
362 color: #fff;
363 }
364
365 .wdk-element .wdk-map .wdk_marker-container.wdk_marker_label img {
366 max-width: 55px !important;
367 max-height: 50px !important;
368 }
369
370 .wdk-element .wdk-map .custom-zoom-in,
371 .wdk-element .wdk-map .custom-zoom-out {
372 background-color: #fff;
373 color: #333;
374 cursor: pointer;
375 -webkit-border-radius: 50%;
376 border-radius: 50%;
377 margin: 5px 15px;
378 -webkit-transition: color 0.3s, background-color 0.3s;
379 -o-transition: color 0.3s, background-color 0.3s;
380 transition: color 0.3s, background-color 0.3s;
381 -webkit-box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.2);
382 box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.2);
383 text-align: center;
384 font-size: 15px;
385 height: 34px;
386 width: 34px;
387 }
388
389 .wdk-element .wdk-map .custom-zoom-in:hover,
390 .wdk-element .wdk-map .custom-zoom-out:hover {
391 background-color: #66676b;
392 color: #fff;
393 }
394
395 .wdk-element .wdk-map .custom-zoom-in:before,
396 .wdk-element .wdk-map .custom-zoom-out:before {
397 font-family: "FontAwesome";
398 width: 100%;
399 line-height: 35px;
400 transition: -webkit-text-stroke 0.3s;
401 -webkit-text-stroke: 1px #fff;
402 }
403
404 .wdk-element .wdk-map .zoomControlWrapper {
405 position: absolute;
406 left: 0;
407 right: auto;
408 width: 70px;
409 }
410
411 .wdk-element .wdk-map .custom-zoom-in:before {
412 content: "\f067";
413 }
414
415 .wdk-element .wdk-map .custom-zoom-out:before {
416 content: "\f068";
417 }
418
419 .wdk-element .wdk-map .custom-zoom-in:hover:before,
420 .wdk-element .wdk-map .custom-zoom-out:hover:before {
421 -webkit-text-stroke: 1px #66676b;
422 }
423
424 .wdk-element .wdk-map #mapnav-buttons {
425 position: absolute;
426 -webkit-transform: translate(0, 0);
427 -ms-transform: translate(0, 0);
428 transform: translate(0, 0);
429 z-index: 999;
430 font-size: 14px;
431 display: inline-block;
432 bottom: 20px;
433 right: 20px;
434 list-style: none;
435 padding: 0;
436 }
437
438 .wdk-element .wdk-map #mapnav-buttons.top {
439 top: 20px;
440 right: 20px;
441 bottom: auto;
442 }
443
444 .wdk-element .wdk-map #mapnav-buttons li {
445 float: left;
446 margin-left: 4px;
447 line-height: 20px;
448 }
449
450 .wdk-element .wdk-map #geoLocation,
451 .wdk-element .wdk-map #mapnav-buttons a,
452 .wdk-element .wdk-map #scrollEnabling,
453 .wdk-element .wdk-map #streetView {
454 color: #333;
455 background-color: #fff;
456 padding: 9px 18px 7px;
457 font-weight: 500;
458 -transition: all 0.2s ease-in-out;
459 -webkit-box-sizing: border-box;
460 box-sizing: border-box;
461 display: inline-block;
462 -webkit-border-radius: 50px;
463 border-radius: 50px;
464 -webkit-box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.2);
465 box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.2);
466 }
467
468 .wdk-element .wdk-map #geoLocation:hover,
469 .wdk-element .wdk-map #mapnav-buttons a:hover,
470 .wdk-element .wdk-map #scrollEnabling.enabled,
471 .wdk-element .wdk-map #scrollEnabling:hover,
472 .wdk-element .wdk-map #streetView:hover {
473 background-color: #66676b;
474 color: #fff;
475 }
476
477 .wdk-element .wdk-map #nextpoint:after,
478 .wdk-element .wdk-map #prevpoint:before {
479 font-family: "FontAwesome";
480 position: relative;
481 font-weight: 500;
482 margin: 0 0 0 6px;
483 font-size: 17px;
484 top: 0;
485 line-height: 1px;
486 }
487
488 .wdk-element .wdk-map #prevpoint:before {
489 content: "\f104";
490 margin: 0 6px 0 0;
491 }
492
493 .wdk-element .wdk-map #nextpoint:after {
494 content: "\f105";
495 margin: 0 0 0 6px;
496 }
497
498 .wdk-element .wdk-map #geoLocation,
499 .wdk-element .wdk-map #scrollEnabling,
500 .wdk-element .wdk-map #streetView {
501 position: absolute;
502 top: 20px;
503 right: 20px;
504 z-index: 999;
505 font-size: 13px;
506 line-height: 21px;
507 }
508
509 .wdk-element .wdk-map #geoLocation:before,
510 .wdk-element .wdk-map #scrollEnabling:before,
511 .wdk-element .wdk-map #streetView:before {
512 content: "\e015";
513 font-family: "simple-line-icons";
514 position: relative;
515 top: 2px;
516 margin: 0 6px 0 0;
517 font-size: 15px;
518 line-height: 1px;
519 }
520
521 .wdk-element .wdk-map #scrollEnabling:before {
522 margin-left: -3px;
523 }
524
525 .wdk-element .wdk-map #streetView:before {
526 content: "\f21d";
527 font-family: "FontAwesome";
528 font-size: 16px;
529 top: 1px;
530 margin-right: 8px;
531 }
532
533 .wdk-element .wdk-map #geoLocation {
534 right: auto;
535 left: 20px;
536 padding: 8px 11px;
537 }
538
539 .wdk-element .wdk-map #geoLocation:before {
540 content: "\f192";
541 font-family: "FontAwesome";
542 font-size: 16px;
543 margin: 0;
544 top: 2px;
545 }
546
547 .wdk-element .wdk-map .map-box {
548 background-color: #fff;
549 margin-bottom: 5px;
550 border-radius: 0;
551 -webkit-box-shadow: 0 0 40px 0 rgba(3, 3, 3, 0.15);
552 box-shadow: 0 0 40px 0 rgba(3, 3, 3, 0.15);
553 position: relative;
554 }
555
556 .wdk-element .wdk-map .map-box .rate-info {
557 position: absolute;
558 bottom: 84px;
559 left: 0;
560 padding-bottom: 20px;
561 width: 100%;
562 padding: 10px 10px 15px;
563 display: -webkit-box;
564 display: -ms-flexbox;
565 display: -webkit-flex;
566 display: flex;
567 -webkit-box-align: center;
568 -ms-flex-align: center;
569 -webkit-align-items: center;
570 align-items: center;
571 -ms-flex-wrap: wrap;
572 -webkit-flex-wrap: wrap;
573 flex-wrap: wrap;
574 -webkit-box-pack: justify;
575 -ms-flex-pack: justify;
576 -webkit-justify-content: space-between;
577 justify-content: space-between;
578 z-index: 5;
579 }
580
581 .wdk-element .wdk-map .map-box .rate-info > h5 {
582 top: 4px;
583 float: left;
584 color: #fff;
585 margin: 0px;
586 color: #fff;
587 font-size: 20px;
588 font-weight: 600;
589 float: left;
590 /* padding-left: 24px; */
591 position: relative;
592 top: 2px;
593 z-index: 5;
594 }
595
596 .wdk-element .wdk-map .map-box h4 {
597 margin: 0;
598 padding: 0;
599 }
600
601 .wdk-element .wdk-map .map-box h4 a {
602 padding: 0 0 2px;
603 font-size: 17px;
604 line-height: 25px;
605 display: inline-block;
606 }
607
608 .wdk-element .wdk-map .listing-img-container {
609 position: relative;
610 height: 100%;
611 display: block;
612 -webkit-box-shadow: none !important;
613 box-shadow: none !important;
614 }
615
616 .wdk-element .wdk-map .map-box h4 a:hover {
617 color: #66676b;
618 }
619
620 .wdk-element .wdk-map .map-box p {
621 padding: 0;
622 line-height: 25px;
623 margin: 2px 0 0;
624 font-size: 14px;
625 }
626
627 .wdk-element .wdk-map .map-box ul.listing-details {
628 padding: 0;
629 font-size: 14px;
630 display: none;
631 }
632
633 .wdk-element .wdk-map .map-box .listing-title {
634 padding: 16px 22px;
635 }
636
637 .wdk-element .wdk-map .map-box .listing-img-content {
638 padding: 18px 22px;
639 }
640
641 .wdk-element .wdk-map .map-box .listing-img-content span {
642 font-size: 21px;
643 }
644
645 .wdk-element .wdk-map .map-box .listing-img-content .listing-price i {
646 font-size: 15px;
647 margin: -7px 0 0;
648 }
649
650 .wdk-element .wdk-map .infoBox > img {
651 position: absolute !important;
652 right: 0;
653 top: 0;
654 }
655
656 .wdk-element .wdk-map .map-box .listing-img-container::before {
657 content: "";
658 display: none;
659 position: absolute;
660 height: 100%;
661 width: 100%;
662 background: -o-linear-gradient(bottom, rgba(35, 35, 37, 0.85) 0%, rgba(35, 35, 37, 0.4) 35%, rgba(22, 22, 23, 0) 60%, transparent 100%);
663 background: -webkit-gradient(linear, left bottom, left top, from(rgba(35, 35, 37, 0.85)), color-stop(35%, rgba(35, 35, 37, 0.4)), color-stop(60%, rgba(22, 22, 23, 0)), to(transparent));
664 background: linear-gradient(to top, rgba(35, 35, 37, 0.85) 0%, rgba(35, 35, 37, 0.4) 35%, rgba(22, 22, 23, 0) 60%, transparent 100%);
665 background-color: rgba(35, 35, 37, 0.2);
666 }
667
668 .wdk-element .wdk-map .map-box .listing-item-content {
669 position: static;
670 width: 100%;
671 margin-top: -3px;
672 background-color: #fff;
673 padding: 15px 23px 20px 23px;
674 border-left: 1px solid #e0e1e5;
675 border-right: 1px solid #e0e1e5;
676 border-bottom: 0;
677 -webkit-box-shadow: none;
678 box-shadow: none;
679 }
680
681 .wdk-element .wdk-map .map-box .listing-item-content h3 {
682 color: #242526;
683 font-size: 16px;
684 padding: 0 0 2px;
685 font-weight: 500;
686 margin: 0;
687 line-height: 27px;
688 margin-bottom: 5px;
689 }
690
691 .wdk-element .wdk-map .map-box .listing-item-content span {
692 font-size: 12px;
693 font-weight: 400;
694 display: inline-block;
695 color: #aeb4b6;
696 }
697
698 .wdk-element .wdk-map .map-box .listing-item-content span i {
699 padding-right: 5px;
700 }
701
702 .wdk-element .wdk-map .infoBox-close {
703 position: absolute;
704 top: 10px;
705 right: 10px;
706 display: inline-block;
707 z-index: 999;
708 text-align: center;
709 line-height: 29px;
710 cursor: pointer;
711 font-size: 15px;
712 font-weight: 500;
713 height: 29px;
714 width: 29px;
715 background-color: #fff;
716 color: #333;
717 font-family: "FontAwesome";
718 -webkit-border-radius: 50%;
719 border-radius: 50%;
720 -webkit-text-stroke: 1px #fff;
721 }
722
723 .wdk-element .wdk-map .infoBox-close:hover {
724 color: #fff;
725 background-color: #66676b;
726 -webkit-text-stroke: 1px #66676b;
727 }
728
729 .wdk-element .wdk-map .map-box-icon {
730 height: 38px;
731 width: 38px;
732 position: absolute;
733 bottom: 0;
734 right: 0;
735 background-color: #3685cf;
736 display: block;
737 color: #fff;
738 font-size: 12px;
739 z-index: 101;
740 text-align: center;
741 -webkit-transform: translateX(50%);
742 -ms-transform: translateX(50%);
743 transform: translateX(50%);
744 opacity: 0;
745 visibility: hidden;
746 }
747
748 .wdk-element .wdk-map .map-box-icon:before {
749 content: "\f064";
750 font-family: "FontAwesome";
751 position: relative;
752 top: 7px;
753 display: block;
754 }
755
756 .wdk-element .wdk-map .map-box-image:hover .map-box-icon {
757 opacity: 1;
758 visibility: visible;
759 -webkit-transform: translateY(0);
760 -ms-transform: translateX(0);
761 transform: translateX(0);
762 }
763
764 .wdk-element .wdk-map .map-box-image {
765 position: relative;
766 overflow: hidden;
767 display: block;
768 }
769
770 .wdk-element .wdk-map .infoBox .star-rating {
771 font-size: 16px;
772 margin-top: 1px;
773 }
774
775 .wdk-element .wdk-map .infoBox .star-rating span {
776 margin-right: 3px;
777 }
778
779 .wdk-element .wdk-map .infoBox .rating-counter {
780 position: relative;
781 top: -1px;
782 }
783
784 .wdk-element .wdk-map .infoBox:after {
785 content: "";
786 position: absolute;
787 bottom: -5px;
788 left: 50%;
789 -webkit-transform: translateX(-50%);
790 -ms-transform: translateX(-50%);
791 transform: translateX(-50%);
792 width: 0;
793 height: 0;
794 border-left: 12px solid transparent;
795 border-right: 12px solid transparent;
796 border-top: 12px solid #fff;
797 }
798
799 .wdk-element .wdk-map .wdk-listing-card {
800 border: 0;
801 overflow: hidden;
802 }
803
804 .wdk-element .wdk-map .leaflet-container .leaflet-marker-pane .wdk_marker-container-image img {
805 max-width: 100% !important;
806 max-height: 100% !important;
807 }
808
809 .wdk-element .wdk-map .leaflet-container .leaflet-marker-pane .wdk_marker-container-image.clicked .wdk_marker-card,
810 .wdk-element .wdk-map .leaflet-container .leaflet-marker-pane .wdk_marker-container-image:hover .wdk_marker-card {
811 -webkit-transform: initial;
812 -ms-transform: initial;
813 transform: initial;
814 }
815
816 .wdk-element .wdk-map .google_marker span {
817 position: absolute;
818 z-index: 2;
819 width: 29px;
820 height: 29px;
821 left: 50%;
822 -webkit-transform: translate(-50%, -50%);
823 -ms-transform: translate(-50%, -50%);
824 transform: translate(-50%, -50%);
825 top: 50%;
826 background: white;
827 -webkit-border-radius: 50%;
828 border-radius: 50%;
829 color: #18ad50;
830 display: -ms-flexbox;
831 display: -webkit-box;
832 display: -webkit-flex;
833 display: flex;
834 -webkit-box-align: center;
835 -ms-flex-align: center;
836 -webkit-align-items: center;
837 align-items: center;
838 -ms-flex-line-pack: center;
839 -webkit-align-content: center;
840 align-content: center;
841 -webkit-box-pack: center;
842 -ms-flex-pack: center;
843 -webkit-justify-content: center;
844 justify-content: center;
845 text-align: center;
846 }
847
848 .wdk-element .wdk-map .google_marker span i {
849 line-height: 1;
850 font-size: 16px;
851 margin-left: 0;
852 }
853
854 .wdk-element .wdk-map .leaflet-container .leaflet-marker-pane .google_marker img {
855 position: absolute;
856 z-index: 2;
857 max-width: 20px !important;
858 max-height: 20px !important;
859 max-width: 20px;
860 max-height: 22px;
861 left: 50%;
862 -ms-transform: translate(-50%, -50%);
863 transform: translate(-50%, -50%);
864 -webkit-transform: translate(-50%, -50%);
865 top: 50%;
866 max-width: 18px;
867 }
868
869 .wdk-element .wdk-map .gm-style .google_marker img {
870 max-width: 18px;
871 }
872
873 .wdk-element .wdk-map .leaflet-popup-content-wrapper .leaflet-popup-content,
874 .wdk-element .wdk-map .popupCustom .leaflet-popup-content-wrapper .leaflet-popup-content {
875 margin: 0;
876 margin-bottom: 0;
877 }
878
879 .wdk-element .wdk-map .leaflet-popup-content-wrapper .leaflet-popup-content,
880 .wdk-element .wdk-map .popupCustom .leaflet-popup-content-wrapper .leaflet-popup-content {
881 position: relative;
882 }
883
884 .wdk-element .wdk-map .leaflet-popup-content-wrapper .infoBox-close,
885 .wdk-element .wdk-map .popupCustom .leaflet-popup-content-wrapper .infoBox-close {
886 display: none;
887 }
888
889 .wdk-element .wdk-map .infobox:after {
890 content: "";
891 position: absolute;
892 bottom: -17px;
893 left: 50%;
894 width: 20px;
895 height: 20px;
896 border-left: 12px solid transparent;
897 border-right: 12px solid transparent;
898 border-top: 12px solid #fff;
899 background: #fff;
900 -webkit--transform: rotate(45deg) translateX(-50%);
901 -webkit-transform: rotate(45deg) translateX(-50%);
902 -ms-transform: rotate(45deg) translateX(-50%);
903 transform: rotate(45deg) translateX(-50%);
904 border: 1px solid #e0e1e5;
905 border-width: 0 1px 1px 0;
906 margin-left: -4px;
907 }
908
909 .wdk-element .wdk-map .leaflet-container a.leaflet-popup-close-button {
910 position: absolute;
911 top: 8px;
912 right: 8px;
913 display: -ms-flexbox;
914 display: -webkit-box;
915 display: -webkit-flex;
916 display: flex;
917 -webkit-box-pack: center;
918 -ms-flex-pack: center;
919 -webkit-justify-content: center;
920 justify-content: center;
921 -webkit-box-align: center;
922 -ms-flex-align: center;
923 -webkit-align-items: center;
924 align-items: center;
925 text-align: center;
926 line-height: 29px;
927 cursor: pointer;
928 font-size: 15px;
929 font-weight: 500;
930 height: 29px;
931 width: 29px;
932 padding: 0;
933 background-color: #fff;
934 color: #333;
935 -webkit-border-radius: 50%;
936 border-radius: 50%;
937 -webkit-text-stroke: 1px #fff;
938 font: normal normal normal 14px/1 FontAwesome;
939 font-size: 14px;
940 font-size: 0;
941 text-rendering: auto;
942 -webkit-font-smoothing: antialiased;
943 -webkit-transition: all 0.4s linear;
944 -o-transition: all 0.4s linear;
945 transition: all 0.4s linear;
946 z-index: 15;
947 }
948
949 .wdk-element .wdk-map a.leaflet-popup-close-button::after {
950 content: "\f00d";
951 font-size: 15px;
952 }
953
954 .wdk-element .wdk-map .leaflet-container a.leaflet-popup-close-button:hover {
955 color: #fff;
956 background-color: #66676b;
957 }
958
959 .wdk-element .wdk-map .leaflet-container:hover a.leaflet-popup-close-button {
960 opacity: 1;
961 }
962
963 .wdk-element .wdk-map .popupcustom-default .leaflet-popup-content-wrapper .leaflet-popup-content {
964 min-width: 150px;
965 background: #fff;
966 text-align: center;
967 padding: 25px 18px 15px 18px;
968 margin: 0;
969 }
970
971 .wdk-element .wdk-map .widget-property-map .popupcustom-default .leaflet-popup-content-wrapper .leaflet-popup-content {
972 padding: 0;
973 }
974
975 .wdk-element .wdk-map .widget-property-map .leaflet-container .popupcustom-default .map-box {
976 border-bottom: 0;
977 }
978
979 .wdk-element .wdk-map .leaflet-container .popupcustom-default a.leaflet-popup-close-button {
980 position: absolute;
981 top: 8px;
982 right: 8px;
983 }
984
985 .wdk-element .wdk-map .leaflet-top,
986 .wdk-element .wdk-map .leaflet-bottom,
987 .wdk-element .wdk-map .leaflet-pane {
988 z-index: 1 !important;
989 }
990
991 .wdk-element .wdk-map .leaflet-top,
992 .wdk-element .wdk-map .leaflet-bottom {
993 z-index: 10;
994 }
995
996 .wdk-element .wdk-map .infobox {
997 width: 250px;
998 height: auto;
999 box-shadow: none;
1000 background: transparent;
1001 border: 0;
1002 }
1003
1004 .wdk-element .wdk-map .infobox.wdk-infobox-basic {
1005 background: #fff;
1006 padding: 10px 10px;
1007 }
1008
1009 .wdk-element .wdk-map .infobox.wdk-infobox-basic .title {
1010 margin: 0;
1011 }
1012
1013 .wdk-element .wdk-map.infobox-basic .leaflet-container a.leaflet-popup-close-button {
1014 position: absolute;
1015 top: -12px;
1016 right: -12px;
1017 }
1018
1019 .wdk-element .wdk-map .leaflet-popup-content-wrapper, .wdk-element .wdk-map .leaflet-popup-tip {
1020 box-shadow: none;
1021 background: transparent;
1022 border: 0;
1023 }
1024
1025 .wdk-element .wdk-map .map-box .listing-img-container img {
1026 width: 100%;
1027 -webkit-border-radius: 4px 4px 0 0;
1028 border-radius: 4px 4px 0 0;
1029 position: relative;
1030 height: calc(100% - 84px);
1031 -o-object-fit: cover;
1032 object-fit: cover;
1033 -webkit-box-shadow: none;
1034 box-shadow: none;
1035 }
1036
1037 .wdk-element .wdk-map .map-box .rate-info > span {
1038 color: #fff;
1039 text-transform: uppercase;
1040 font-size: 12px;
1041 background: rgba(145, 147, 152, 0.7);
1042 -webkit-border-radius: 50px;
1043 border-radius: 50px;
1044 padding: 5px 13px;
1045 float: right;
1046 margin-top: 2px;
1047 background: #a357de;
1048 z-index: 5;
1049 }
1050
1051 .wdk-element .wdk-map .rate-info:before {
1052 content: '';
1053 position: absolute;
1054 top: 0;
1055 left: 0;
1056 width: 100%;
1057 height: 100%;
1058 background-image: -o-linear-gradient(rgba(255, 255, 255, 0.02), rgba(44, 44, 47, 0.75));
1059 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.02)), to(rgba(44, 44, 47, 0.75)));
1060 background-image: linear-gradient(rgba(255, 255, 255, 0.02), rgba(44, 44, 47, 0.75));
1061 z-index: 0;
1062 }
1063
1064 .wdk-element .wdk-map a {
1065 -webkit-box-shadow: none !important;
1066 box-shadow: none !important;
1067 }
1068
1069 .wdk-element .wdk-map .leaflet-top {
1070 top: 50%;
1071 margin-top: -37px;
1072 }
1073
1074 .wdk-element .wdk-map .leaflet-touch .leaflet-bar {
1075 border: 0;
1076 background-clip: padding-box;
1077 }
1078
1079 .wdk-element .wdk-map .leaflet-touch .leaflet-bar a {
1080 background-color: #fff;
1081 color: #333;
1082 cursor: pointer;
1083 border-radius: 50% !important;
1084 margin: 5px 15px;
1085 -webkit-transition: color 0.3s, background-color 0.3s;
1086 -o-transition: color 0.3s, background-color 0.3s;
1087 transition: color 0.3s, background-color 0.3s;
1088 -webkit-box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.2) !important;
1089 box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.2) !important;
1090 text-align: center;
1091 font-size: 15px;
1092 height: 34px;
1093 width: 34px;
1094 display: flex;
1095 align-items: center;
1096 justify-content: center;
1097 line-height: 1;
1098 }
1099
1100 .wdk-element .wdk-map .leaflet-touch .leaflet-bar a:hover {
1101 background-color: #66676b;
1102 color: #fff;
1103 }
1104
1105 .wdk-element .wdk-map .wdk-infobox {
1106 padding: 15px 20px;
1107 width: 180px;
1108 }
1109
1110 .wdk-element .wdk-map .wdk-infobox .wdk-infobox_title {
1111 font-size: 16px;
1112 margin: 0;
1113 padding-bottom: 10px;
1114 }
1115
1116 .wdk-element .wdk-map .wdk-infobox .wdk-infobox_text {
1117 font-size: 12px;
1118 margin: 0;
1119 }
1120
1121 .wdk-element .wdk-map .gmnoprint img {
1122 max-width: initial;
1123 }
1124
1125 .wdk-element .wdk-map .marker-cluster {
1126 background: transparent !important;
1127 }
1128
1129 .wdk-element .wdk-map .marker-cluster div {
1130 background: #0074e4;
1131 color: #fff;
1132 }
1133
1134 .wdk-element .wdk-map .marker-cluster div::before {
1135 border: 7px solid #0074e4;
1136 opacity: 0.25;
1137 -webkit-box-shadow: inset 0 0 0 4px #0074e4;
1138 box-shadow: inset 0 0 0 4px #0074e4;
1139 content: '';
1140 position: absolute;
1141 border-radius: 50%;
1142 top: 0;
1143 left: 0;
1144 width: 100%;
1145 height: 100%;
1146 -webkit-animation: cluster-animation 2.5s infinite;
1147 animation: cluster-animation 2.5s infinite;
1148 }
1149
1150 .wdk-element .wdk-map .wdk-listing-card .wdk-subtitle-part span {
1151 overflow: hidden;
1152 text-overflow: ellipsis;
1153 display: -webkit-box;
1154 -webkit-line-clamp: 2;
1155 -webkit-box-orient: vertical;
1156 }
1157
1158 @media not all and (min-resolution: 0.001dpcm) {
1159 @supports (-webkit-appearance: none) and (stroke-color: transparent) {
1160 body .wdk-element .wdk-map .wdk_marker-card::before,
1161 body .wdk-element .wdk-map .wdk_marker-card::after {
1162 -webkit-transform: perspective(0) rotateX(0deg) rotateZ(-44deg);
1163 transform: perspective(0) rotateX(0deg) rotateZ(-44deg);
1164 }
1165 body .wdk-element .wdk-map .wdk_marker-card::after {
1166 top: 10px;
1167 }
1168 body .wdk-element .wdk-map .wdk_marker-card::before {
1169 top: 8px;
1170 }
1171 }
1172 }
1173
1174 @-webkit-keyframes cluster-animation {
1175 0%,
1176 100% {
1177 -webkit-transform: scale(1.1) rotate(0deg);
1178 transform: scale(1.1) rotate(0deg);
1179 }
1180 50% {
1181 -webkit-transform: scale(1.35) rotate(90deg);
1182 transform: scale(1.35) rotate(90deg);
1183 }
1184 }
1185
1186 @keyframes cluster-animation {
1187 0%,
1188 100% {
1189 -webkit-transform: scale(1.1) rotate(0deg);
1190 transform: scale(1.1) rotate(0deg);
1191 }
1192 50% {
1193 -webkit-transform: scale(1.35) rotate(90deg);
1194 transform: scale(1.35) rotate(90deg);
1195 }
1196 }
1197