PluginProbe
WP Directory Kit / 1.3.5
WP Directory Kit v1.3.5
1.5.9 1.5.7 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 All 37 releases
wpdirectorykit / public / css / wpdirectorykit-public.scss

wpdirectorykit-public.scss in WP Directory Kit 1.3.5, at public/css/wpdirectorykit-public.scss

1,876 lines 41.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 $color_hover: #0074e4;
2 $primary_color: #0074e4;
3 $secondary_color: #0052a2;
4 $text_color: #161616;
5
6 body {
7 height: 100%;
8 overflow-x: hidden;
9 z-index: 0;
10 position: relative;
11 }
12
13 .wdk-listing-card {
14 & {
15 display: flex;
16 flex-direction: column;
17 overflow: hidden;
18 }
19
20 &.list {
21 display: flex;
22 flex-direction: row;
23 }
24
25 &.grid .wdk-thumbnail {
26 flex: initial !important;
27 }
28
29 &.list .wdk-content {
30 display: flex;
31 flex-direction: column;
32 flex: 1 2 auto
33 }
34
35 &.list .wdk-content .wdk-features-part {
36 -webkit-flex: 1 2 auto;
37 flex: 1 2 auto;
38 white-space: normal;
39 }
40
41 &.list .wdk-thumbnail {
42 flex: 0 0 270px;
43 font-size: 0;
44 overflow: hidden;
45 min-height: 180px;
46 }
47
48 .agent_logo_link {
49 display: inline-block;
50 .agent_logo {
51 display: block;
52 }
53 }
54
55 .agent_logo {
56 max-width: 40px;
57 max-height: 40px;
58 }
59
60 .wdk-thumbnail .wdk-image.media {
61 position: relative;
62 z-index: 15;
63 background-color: #000;
64
65 iframe,video {
66 height: 100% !important;
67 }
68 }
69
70 .wdk-thumbnail .wdk-image {
71 width: 100%;
72 height: 16vw;
73 object-fit: cover;
74 }
75
76 &.list .wdk-thumbnail .wdk-image {
77 width: 100%;
78 height: 100%;
79 object-fit: cover;
80 position: absolute;
81 height: 100% !important;
82 }
83
84 &{
85 background: #fff;
86 box-shadow: 0 0 10px rgba(1, 1, 1, 0.11);
87 }
88
89 .wdk-thumbnail .wdk-thumbnail_link {
90 position: absolute;
91 bottom: 0;
92 left: 0;
93 right: 0;
94 top: 0;
95 height: 100%;
96 width: 100%;
97 z-index: 10;
98 }
99
100 .wdk-thumbnail {
101 position: relative;
102 font-size: 0;
103 }
104
105 .wdk-thumbnail .wdk-over-image-bottom,
106 .wdk-thumbnail .wdk-over-image-top {
107 position: absolute;
108 color: #fff;
109 font-size: 12px;
110 font-weight: 600;
111 z-index: 21;
112 }
113
114 .wdk-thumbnail .wdk-over-image-top {
115 margin: 18px 17px;
116 top: 0;
117 left: 0;
118 }
119
120 .wdk-divider {
121 border-bottom: 1px solid #e7e7e7;
122 margin: 19px 20px 0;
123 }
124
125 .wdk-thumbnail .wdk-over-image-bottom {
126 bottom: 0;
127 left: 0;
128 width: 100%;
129 padding: 13px 21px 13px;
130 background-color: rgba(0, 0, 0, 0.32);
131 font-weight: 800;
132 text-transform: uppercase;
133 .wdk-item {
134 line-height: 1.5;
135 }
136 }
137
138 .wdk-thumbnail .wdk-over-image-top span {
139 top: 0;
140 left: 0;
141 padding: 4px 20px 8px;
142 background-color: #0074e4;
143 margin: 2px 4px;
144 font-size: 11px;
145 text-transform: uppercase;
146 padding: 4px 12px;
147 border-radius: 3px;
148 display: inline-block;
149 }
150
151 .wdk-thumbnail:before,
152 .wdk-thumbnail:after {
153 content: '';
154 position: absolute;
155 top: 0;
156 left: 0;
157 width: 50%;
158 height: 100%;
159 background: rgba(0, 82, 162, 0.95);
160 opacity: 0;
161 visibility: hidden;
162 transition: all 0.4s ease-in-out;
163 z-index: 1;
164 }
165 .wdk-thumbnail:after {
166 right: 0;
167 left: auto;
168 }
169
170 .overlay {
171 position: absolute;
172 left: 0;
173 right: 0;
174 top: 0;
175 bottom: 0;
176 background: rgba(0, 82, 162, 0.7);
177 opacity: 0;
178 transition: all 0.4s ease-in-out;
179 }
180
181 &:hover .wdk-thumbnail::before,
182 &:hover .wdk-thumbnail::after {
183 opacity: 1;
184 visibility: visible;
185 width: 0;
186 }
187
188 &:hover .overlay {
189 opacity: 1;
190 }
191
192 .wdk-title .title {
193 &{
194 color: $text_color;
195 font-weight: 700;
196 margin-top: 0;
197 margin-bottom: 0;
198 font-size: 18px;
199 padding: 15px 20px 0;
200 }
201 &:hover {
202 color: $color_hover;
203 }
204 }
205
206 .wdk-title .title a:hover,
207 .wdk-title .title a {
208 color: inherit
209 }
210
211 .wdk-subtitle-part {
212 color: #a3a3a3;
213 padding: 3px 20px 8px;
214 font-size: 13px;
215 font-weight: 300;
216
217 .wdk-stroke {
218 display: -webkit-box;
219 -webkit-box-orient: vertical;
220 -webkit-line-clamp: 1;
221 overflow: hidden;
222
223 span {
224 display: inline;
225 }
226 }
227 }
228
229 .wdk-sublistings-part{
230 color: #000;
231 padding: 3px 20px 8px;
232 font-size: 13px;
233 font-weight: 300;
234
235 > span {
236 overflow: hidden;
237 text-overflow: ellipsis;
238 display: -webkit-box;
239 -webkit-line-clamp: 3;
240 -webkit-box-orient: vertical;
241 }
242
243 ul>li {
244 padding: 10px 0;
245 display: flex;
246 align-items: center;
247 flex-wrap: wrap;
248 overflow: hidden;
249 justify-content: space-between;
250
251 span,a {
252
253 }
254 }
255
256 ul>li:not(:last-child) {
257 border-bottom: 1px solid #eee;
258 }
259
260 a {
261 transition: all .15s;
262 font-weight: 500;
263 &:hover {
264 color: #0074e4;
265 }
266 }
267
268 .stars-lst {
269 display: inline-block;
270 padding-right: 1px;
271 span {
272 display: inline-block;
273 margin: 0;
274 margin-right: -2px;
275
276 i {
277 display: inline-block;
278 color: #f3b00f;
279 font-size: 13px;
280
281 &.innactive {
282 color: #aaa;
283 }
284 }
285
286 img {
287 display: inline-block;
288 margin: 0;
289 margin-right: -2px;
290 max-width: 15px;
291 max-height: 15px;
292 }
293 }
294 }
295
296 }
297
298 .wdk-features-part {
299 color: $text_color;
300 font-size: 13px;
301 font-weight: 400;
302 padding-top: 0;
303 margin: 0 20px;
304 display: block;
305 text-overflow: ellipsis;
306 white-space: nowrap;
307 max-width: 100%;
308 overflow: hidden;
309 padding-bottom: 3px;
310 .wdk-icon {
311 max-height: 16px;
312 max-width: 16px;
313 margin-right: 3px;
314 display: inline-block;
315 }
316
317
318 span.wdk-field-item span {
319 &:before {
320 display: none !important;
321 }
322
323 margin: initial !important;
324 top: initial !important;
325 }
326 }
327
328 .wdk-features-part span {
329 margin-right: 2px;
330 position: relative;
331 top: 3px;
332 }
333
334 .wdk-features-part span:not(:empty):not(:first-child)::before {
335 content: '\2022';
336 position: initial;
337 display: inline-block;
338 line-height: 15px;
339 padding: 0 4px 0 4px;
340 background: initial;
341 font-size: 14px;
342 }
343
344 .wdk-footer {
345 display: flex;
346 }
347
348 .wdk-footer .wdk-left {
349 flex: 1 2 auto;
350 }
351
352 .wdk-footer .wdk-right {
353 flex: 0 0;
354 display: flex;
355 justify-content: center;
356 align-content: center;
357 align-items: center;
358 }
359
360 .wdk-footer .wdk-btn {
361 text-align: center;
362 font-size: 18px;
363 padding: 10px 20px;
364 display: flex;
365 justify-content: center;
366 align-content: center;
367 align-items: center;
368 color: $text_color;
369 }
370
371 .wdk-footer .wdk-btn:hover {
372 color: $color_hover;
373 }
374
375 .wdk-footer .wdk-price {
376 color: $color_hover;
377 font-size: 22px;
378 padding: 10px 20px;
379 font-weight: 500;
380 }
381
382 &.is_featured .wdk-thumbnail .wdk-over-image-bottom {
383 background-color: #0074e494;
384 }
385
386 &.is_featured {
387 box-shadow: 0 0 10px #0074e475;
388 }
389
390 &.list .wdk-subtitle-part {
391 padding: 15px 20px 8px;
392 }
393
394 .wdk-thumbnail .wdk-over-image-bottom .wdk-favorites-actions {
395 float: right;
396 margin-left: 10px;
397 }
398
399 .wdk-thumbnail .wdk-over-image-bottom .wdk-compare-listing-button-actions {
400 float: right;
401 margin-top: -2px;
402 margin-bottom: -2px;
403
404 .fa-custom-ajax-indicator {
405 margin-top: 4px;
406 }
407 }
408
409 .wdk-thumbnail .wdk-over-image-bottom .wdk-compare-listing-button-actions a {
410 color: #fff;
411 }
412
413 .wdk-thumbnail .wdk-compare-listing-button-actions.loading .fa-custom-ajax-indicator {
414 margin-top: 2px;
415 }
416
417 .wdk-thumbnail .wdk-favorites-actions .fa-custom-ajax-indicator {
418 margin-top: 0;
419 }
420 }
421
422 .wdk-listing-card.is_multiline_enabled .wdk-features-part {
423 text-overflow: initial;
424 white-space: initial;
425 overflow: initial;
426 flex-wrap: wrap;
427 >span {
428 display: inline-block;
429 }
430 }
431
432
433 .view-list .wdk-row .wdk-col {
434 -webkit-flex: 0 0 calc(100% / 1) !important;
435 -ms-flex: 0 0 calc(100% / 1) !important;
436 flex: 0 0 calc(100% / 1) !important;
437 }
438
439 .wdk-filter-head {
440 &{
441 display: flex;
442 align-items: center;
443 justify-content: space-between;
444 margin: -25px -10px;
445 padding-bottom: 15px;
446 color: $text_color;
447 font-size: 14px;
448 -webkit-flex-wrap: wrap;
449 flex-wrap: wrap;
450 }
451
452 .filter-group {
453 padding: 15px 10px;
454 display: flex;
455 align-items: center;
456 justify-content: flex-start;
457
458 &.filter-status {
459 color: #161616;
460 font-size: 14px;
461 &>span {
462 color: inherit;
463 font-size: inherit;
464 }
465 }
466 }
467
468 .filter-group select {
469 border: 0;
470 color: #80868c;
471 font-size: 15px;
472 font-weight: 300;
473 }
474
475 .filter-group.wmvc-view-type {
476 flex: 1 2 auto;
477 }
478
479 .filter-group.wmvc-view-type a {
480 display: inline-flex;
481 padding: 3px 5px;
482 color: $text_color;
483 align-items: center;
484 justify-content: center;
485 }
486
487 .filter-group.wmvc-view-type a.active,
488 .filter-group.wmvc-view-type a:hover {
489 color: $color_hover;
490 }
491 }
492
493
494 /* pagination */
495 .wdk-pagination.pagination {
496 & {
497 margin-top: 25px;
498 margin-bottom: 0;
499 display: flex;
500 }
501
502 .displaying-num {
503 display: flex;
504 justify-content: center;
505 align-items: center;
506 margin-right: 10px;
507 }
508
509 .nav-links > *.wdk_pages_range
510 {
511 border: 0;
512 }
513
514 .nav-links > *.disabled
515 {
516 cursor: not-allowed;
517 pointer-events: all !important;
518 }
519
520 .nav-links {
521 & {
522 display: -ms-flexbox;
523 display: flex;
524 padding-left: 0;
525 border-radius: .25rem;
526 flex-wrap: wrap;
527 }
528
529 & >* {
530 display: inline-block;
531 margin-right: 10px;
532 margin-bottom: 10px;
533 }
534
535 & >*:first-child,
536 & >*:last-child {
537 border-radius: 100px;
538 }
539
540 & >*:last-child {
541 margin-right: 0;
542 }
543
544 & >* {
545 position: relative;
546 display: flex;
547 justify-content: center;
548 align-items: center;
549 width: 40px;
550 height: 40px;
551 border: 1px solid #e1e2e6;
552 color: #7e7f82;
553 background-color: white;
554 font-size: 14px;
555 text-align: center;
556 text-decoration: none !important;
557 transition: border-color .3s, color .3s, background-color .3s;
558 border-radius: 100px;
559 }
560
561 & >*.current,
562 & >*:hover {
563 border-color: $color_hover;
564 color: $color_hover;
565 background-color: inherit;
566 }
567
568 & >*> span {
569 width: initial;
570 height: initial;
571 border: initial;
572 color: inherit;
573 background-color: initial;
574 font-size: inherit;
575 text-align: inherit;
576 line-height: initial;
577 margin-right: initial;
578 }
579
580 .wdk_pages_range {
581 white-space: nowrap;
582 }
583 }
584 }
585
586 /* end pagination */
587
588 /* alerts css */
589 body .wdk_alert a {
590 text-decoration: underline !important;
591 text-underline-offset: 2px;
592 color: inherit;
593 }
594
595 .wdk_alert {
596 &{
597 position: relative;
598 padding: .75rem 1.25rem;
599 margin-bottom: 1rem;
600 border: 1px solid transparent;
601 border-radius: .25rem;
602 width: 100%;
603 }
604
605 a {
606 text-decoration: underline !important;
607 text-underline-offset: 2px;
608 color: inherit;
609 }
610
611 &.wdk_alert-primary {
612 color: #004085;
613 background-color: #cce5ff;
614 border-color: #b8daff;
615 }
616 &.wdk_alert-secondary {
617 color: #383d41;
618 background-color: #e2e3e5;
619 border-color: #d6d8db;
620 }
621 &.wdk_alert-success {
622 color: #155724;
623 background-color: #d4edda;
624 border-color: #c3e6cb;
625 }
626 &.wdk_alert-danger {
627 color: #721c24;
628 background-color: #f8d7da;
629 border-color: #f5c6cb;
630 }
631 &.wdk_alert-warning {
632 color: #856404;
633 background-color: #fff3cd;
634 border-color: #ffeeba;
635 }
636 &.wdk_alert-info {
637 color: #0c5460;
638 background-color: #d1ecf1;
639 border-color: #bee5eb;
640 }
641 &.wdk_alert-light {
642 color: #818182;
643 background-color: #fefefe;
644 border-color: #fdfdfe;
645 }
646 &.wdk_alert-dark {
647 color: #1b1e21;
648 background-color: #d6d8d9;
649 border-color: #c6c8ca;
650 }
651 }
652
653 .wdk_label {
654 &{
655 position: relative;
656 padding: .75rem 1.25rem;
657 margin-bottom: 1rem;
658 border: 1px solid transparent;
659 border-radius: .25rem;
660 display: inline-block;
661 }
662
663 &.wdk_label-primary {
664 color: #004085;
665 background-color: #cce5ff;
666 border-color: #b8daff;
667 }
668 &.wdk_label-secondary {
669 color: #383d41;
670 background-color: #e2e3e5;
671 border-color: #d6d8db;
672 }
673 &.wdk_label-success {
674 color: #155724;
675 background-color: #d4edda;
676 border-color: #c3e6cb;
677 }
678 &.wdk_label-danger {
679 color: #721c24;
680 background-color: #f8d7da;
681 border-color: #f5c6cb;
682 }
683 &.wdk_label-warning {
684 color: #856404;
685 background-color: #fff3cd;
686 border-color: #ffeeba;
687 }
688 &.wdk_label-info {
689 color: #0c5460;
690 background-color: #d1ecf1;
691 border-color: #bee5eb;
692 }
693 &.wdk_label-light {
694 color: #818182;
695 background-color: #fefefe;
696 border-color: #fdfdfe;
697 }
698 &.wdk_label-dark {
699 color: #1b1e21;
700 background-color: #d6d8d9;
701 border-color: #c6c8ca;
702 }
703 }
704 /* end alerts css */
705
706 /* wdk-field */
707
708 .wdk-search {
709 & {
710 position: relative;
711 }
712
713 .wdk-search-tabs {
714 position: absolute;
715 bottom: 100%;
716 margin-bottom: 20px;
717 max-width: 100%;
718 left: 0;
719 font-size: 0;
720 label {
721 position: relative;
722 background: #fff;
723 color: #000;
724 padding: 12px 60px;
725 display: inline-block;
726 cursor: pointer;
727 font-size: 15px;
728 font-family: "Montserrat";
729 margin: 3px 4px;
730 transition: all .15s;
731 font-weight: 300;
732 border-radius: 0;
733 &:hover {
734 background: #0A2138;
735 color: #fff;
736 }
737 transition: all .15s;
738
739 &:after {
740 content: '';
741 position: absolute;
742 width: 0;
743 height: 0;
744 border-left: 7px solid transparent;
745 border-right: 7px solid transparent;
746 border-top: 7px solid #fff;
747 top: 100%;
748 left: 50%;
749 margin-left: -5px;
750 transition: all .15s;
751 }
752
753 &:hover:after {
754 border-top-color: #0a2138;
755 }
756 }
757
758 input {
759 display: none;
760 }
761
762 input:checked + label {
763 background: #0A2138;
764 color: #fff;
765 }
766
767 input:checked + label:after {
768 border-top-color: #0a2138;
769 }
770
771 label:first-of-type {
772 margin-left: 0 !important;
773 }
774
775 label:last-of-type {
776 margin-right: 0 !important;
777 }
778
779 @media (max-width: 767px) {
780 position: initial;
781 flex-wrap: wrap;
782 justify-content: space-between;
783 margin-left: -5px;
784 margin-right: -5px;
785 width: initial;
786 max-width: initial;
787 display: flex;
788
789 label::after {
790 display: none;
791 }
792
793 label {
794 flex: 2 1 auto;
795 margin: 5px 5px;
796 text-align: center;
797 }
798
799
800 label:first-of-type {
801 margin-left: 5px !important;
802 }
803
804 label:last-of-type {
805 margin-right: 5px !important;
806 }
807
808 }
809 }
810
811 &:not(.layout_inline) .wdk-search-tabs {
812 width: 100%;
813 text-align: center;
814
815 label {
816 background: #0074e4;
817 color: #fff;
818 padding: 5px 12px;
819 &:hover {
820 background: #0A2138;
821 }
822 transition: all .15s;
823
824 &:after {
825 border-top: 7px solid #0074e4;
826 }
827
828 &:hover:after {
829 border-top-color: #0A2138;
830 }
831 }
832
833 }
834
835 .wdk-field.CHECKBOX .wdk-field-label {
836 padding: 3px 0;
837 }
838
839 .wdk-field-label {
840 padding: 7px 0px 0 9px;
841 }
842
843 .min_max_row {
844 flex-wrap: nowrap !important;
845 }
846
847 .min_max_row .wdk-col.wdk-col-6 {
848 flex: 0 50% !important;
849 width: initial !important;
850 }
851
852 &.layout_inline .min_max_wdk-field {
853 flex: 10000 0 !important;
854 min-width: 160px;
855 }
856
857 &.layout_inline .wdk-field {
858 display: flex;
859 align-items: flex-end;
860 flex-direction: row;
861 }
862
863 &.layout_inline .wdk-field.CHECKBOX {
864 align-items: flex-end;
865 }
866
867 .wdk-col-btns {
868 align-items: flex-end;
869 display: flex;
870 }
871
872 &.layout_inline .wdk-field .wdk-field-group {
873 flex: 1 2 auto;
874 }
875
876 &.layout_inline .wdk-field .wdk-field-label,
877 &.layout_inline .wdk-field .wdk-field-group {
878 margin-left: 0 !important;
879 margin-right: 0 !important;
880 }
881
882 &.layout_inline .wdk-field .wdk-field-label {
883 padding-right: 10px;
884 padding-top: 10px;
885 }
886
887 .wdk-field.wdk-field-btn {
888 display: flex;
889 flex-direction: column;
890 }
891
892 #wdk-form-additional {
893 display: block;
894 flex: 0 0 calc(100%) !important;
895 width: 100%;
896
897 }
898
899 #wdk-form-additional .wdk-row .wdk-col.CHECKBOX:first-child .wdk-field-label {
900 padding-left: 0;
901 }
902
903 .wdk-field select:not(.sel_class),
904 .wdk_dropdown_tree > .btn-group:not(.sel_class) .btn {
905 color: #9f9898ed !important;
906 }
907
908 input::-webkit-placeholder {
909 color: #9f9898ed;
910 opacity: 1;
911 }
912
913 input::-moz-placeholder {
914 color: #9f9898ed;
915 opacity: 1;
916 }
917
918 input::placeholder {
919 color: #9f9898ed;
920 opacity: 1;
921 }
922
923 /* inline */
924 &.layout_inline .wdk-row div.wdk-col {
925 width: auto;
926 -webkit-flex: 1 2 150px;
927 flex: 1 2 150px;
928 padding-left: 0;
929 padding-right: 0;
930 margin-bottom: 0;
931 }
932
933 &.layout_inline .wdk-field input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]), &.layout_inline .wdk-field select,
934 &.layout_inline .wdk-field input,
935 &.layout_inline .wdk-row div.wdk-col .wdk-field input[type="text"]="text""] {
936 //border-radius: 0 0 0 0;
937 }
938
939 &.layout_inline .wdk-row .wdk-field-btn {
940 margin-left: 0;
941 margin-right: 0;
942 display: flex;
943 flex-direction: row;
944 margin-bottom: 0;
945 }
946
947 &.layout_inline .wdk-row .wdk-col:not(.wdk-field) {
948 width: auto;
949 -webkit-flex: 0 0 auto;
950 flex: 0 0 auto;
951 }
952
953 &.layout_inline .wdk-row .wdk-field-btn .wdk-field-group {
954 padding-left: 0;
955 padding-right: 0;
956 width: auto;
957 -webkit-flex: 0 0 auto;
958 flex: 0 0 auto;
959 margin-bottom: 0;
960 }
961
962 &.layout_inline .wdk-field button.wdk-search-additional-btn,
963 &.layout_inline .wdk-field button.wdk-search-start,
964 &.layout_inline .wdk-row .wdk-field button.wdk-search-additional-btn {
965 border-radius: 0 0 0 0;
966 }
967
968 &.layout_inline .wdk-row {
969 margin-left: 0;
970 margin-right: 0;
971 margin-bottom: 0;
972 }
973
974 .wdk-field-btn .wdk-field-group {
975 margin-bottom: 10px;
976 }
977
978 .wdk-field.MORE {
979 width: 100% !important;
980 padding: 0 !important;
981 margin: 0 !important;
982 }
983
984 /* [START] Search form Edit Control */
985
986 &:hover .section-widget-control {
987 opacity: 1;
988 visibility: visible;
989 }
990
991 .section-widget-control {
992 position: absolute;
993 right: -15px;
994 top: -15px;
995 z-index: 100;
996 opacity: 0;
997 visibility: hidden;
998 -webkit-transition: all .5s;
999 -o-transition: all .5s;
1000 transition: all .5s;
1001 font-size: 0;
1002 z-index: 1;
1003 &.right {
1004 z-index: 0;
1005 right: initial;
1006 left: 100%;
1007 top: 0;
1008 }
1009
1010 &.right .wdk-c-btn {
1011 height: 46px;
1012 padding: 10px 10px;
1013 display: flex;
1014 align-items: center;
1015 justify-content: center;
1016 }
1017 }
1018 .section-widget-control .wdk-c-btn {
1019 display: inline-block;
1020 padding: 5px 5px;
1021 color: white;
1022 -webkit-transition: all .5s;
1023 -o-transition: all .5s;
1024 transition: all .5s;
1025 z-index: 1;
1026 }
1027
1028 .section-widget-control .wdk-save-search-button {
1029 z-index: 0;
1030 .fas {
1031 font-family: 'FontAwesome';
1032 color: #fff;
1033 font-size: 16px;
1034 }
1035 }
1036
1037 .section-widget-control .wdk-c-save {
1038 background-color: #31f731;
1039 border-color: #31f731;
1040 }
1041
1042 .section-widget-control .wdk-c-save:hover {
1043 background-color: #27bd27;
1044 border-color: #27bd27;
1045 }
1046
1047 .section-widget-control .wdk-c-edit {
1048 background-color: #F9B418;
1049 border-color: #F9B418;
1050 }
1051
1052 .section-widget-control .wdk-c-edit:hover {
1053 background-color: #e78800;
1054 border-color: #e78800;
1055 }
1056
1057 .widget-with-control .section-widget-control {
1058 opacity: 0;
1059 -webkit-transition: all .5s;
1060 -o-transition: all .5s;
1061 transition: all .5s;
1062 }
1063
1064 .widget-with-control:hover .section-widget-control {
1065 opacity: 1;
1066 }
1067
1068 .widget-with-control .form-horisontal.wdk_search_form {
1069 position: relative;
1070 }
1071
1072 .widget-with-control .form-horisontal.wdk_search_form .section-widget-control {
1073 right: 20px;
1074 bottom: calc(100% - 27px);
1075 }
1076
1077 .side-search-form.widget-with-control {
1078 position: relative;
1079 }
1080
1081 .side-search-form.widget-with-control .section-widget-control {
1082 right: 0;
1083 top: 0;
1084 }
1085
1086 /* [End] Search form Edit Control */
1087
1088 }
1089
1090 /* shortcode */
1091
1092 .wdk-shortcode {
1093 .wdk-listings-list .wdk-row .wdk-col {
1094 padding: 0 0;
1095 }
1096 }
1097
1098 .wdk-element .wdk-search.layout_inline .wdk-field {
1099 .wdk-field-group {
1100 position: relative;
1101 }
1102
1103 &.LOCATION,
1104 &.CATEGORY {
1105 min-width: 185px;
1106 }
1107 }
1108
1109 .wdk-field {
1110 .wdk-field-group {
1111 position: relative;
1112 width: 100%;
1113 }
1114
1115 &.LOCATION,
1116 &.CATEGORY {
1117 min-width: 185px;
1118 }
1119
1120 &.LOCATION .wdk-field-group,
1121 &.CATEGORY .wdk-field-group {
1122 max-width: 100%;
1123 .select2 {
1124 overflow: hidden;
1125 min-height: 46px;
1126 }
1127 }
1128
1129 &.CHECKBOX {
1130 align-items: flex-end;
1131 }
1132
1133 &.CHECKBOX .wdk-field-label {
1134 padding: 3px 10px;
1135 }
1136
1137 &.CHECKBOX .wdk-field-label input {
1138 position: relative;
1139 top: -1px;
1140 }
1141
1142 &{
1143 display: flex;
1144 flex-wrap: wrap;
1145 flex-direction: column;
1146 justify-content: flex-start;
1147 margin-bottom: 10px;
1148 }
1149
1150 .wdk-field-label {
1151 display: block;
1152 margin-bottom: 10px;
1153 text-align: left;
1154 width: 100%;
1155 cursor: pointer;
1156 }
1157
1158 input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
1159 .select2.select2-container,
1160 select.form-control[multiple]],
1161 select[multiple]],
1162 select {
1163 height: 46px;
1164 padding: 0 10px;
1165 width: 100%;
1166 color: #000;
1167 font-size: 15px;
1168 font-family: "Montserrat";
1169 font-weight: 300;
1170 border: 1px solid #eaeaea;
1171 border-radius: 0;
1172 background: #fff;
1173 box-shadow: none;
1174 outline: none;
1175 }
1176
1177 .select2.select2-container .select2-search__field:not([type="submit"]):not([type="checkbox"]):not([type="radio"]) {
1178 height: 44px;
1179 padding-left: 0;
1180 padding-right: 0;
1181 }
1182
1183 select.form-control.select_ajax[multiple]] {
1184 option {
1185 height: 100%;
1186 display: flex;
1187 align-items: center;
1188 background: transparent;
1189 color: #000;
1190 }
1191 }
1192
1193 .select2.select2-container {
1194 .select2-selection__rendered,
1195 .select2-selection,
1196 .selection {
1197 height: 100%;
1198 }
1199 }
1200
1201 select {
1202 -webkit-appearance: none;
1203 background: #fff url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E') no-repeat right 15px top 55%;
1204 background-size: auto;
1205 background-size: 16px 16px;
1206 cursor: pointer;
1207 vertical-align: middle;
1208
1209 }
1210
1211 select option:hover {
1212 background: $secondary_color;
1213 color: #fff;
1214 }
1215
1216 &.checkbox label {
1217 display: flex;
1218 flex-wrap: wrap;
1219 flex-direction: row;
1220 justify-content: flex-start;
1221 align-items: center;
1222 }
1223
1224 button.wdk-search-additional-btn,
1225 button.wdk-search-start {
1226 color: #fff;
1227 font-family: "Montserrat";
1228 font-weight: 400;
1229 background-color: $color_hover;
1230 height: 46px;
1231 border: none;
1232 border-radius: 3px;
1233 width: 100%;
1234 padding: 0 30px;
1235 font-size: 16px;
1236 cursor: pointer;
1237 }
1238
1239 button.wdk-search-additional-btn {
1240 background-color: $secondary_color;
1241 }
1242
1243 button.wdk-search-start:hover {
1244 background: $secondary_color;
1245 }
1246
1247 button.wdk-search-start.wdk-search-reset {
1248 background: #000;
1249 }
1250
1251 button.wdk-search-start.wdk-search-reset:hover {
1252 background: #383838;
1253 }
1254 }
1255
1256 .wdk-search .wdk-row .wdk-field-btn,
1257 .wdk-search.layout_inline .wdk-row .wdk-field-btn {
1258 margin-left: -15px;
1259 margin-right: -15px;
1260 width: calc(100% + 15px + 15px);
1261 .wdk-field-group {
1262 padding-left: 15px;
1263 padding-right: 15px;
1264 }
1265 }
1266
1267 .wdk-element .wdk-search {
1268 .wdk-row .wdk-col {
1269 -webkit-flex: 0 0 calc(100% / 1);
1270 -ms-flex: 0 0 calc(100% / 1);
1271 flex: 0 0 calc(100% / 1);
1272 flex: 0 0 calc(100% / 1);
1273 padding: 0 15px;
1274 }
1275 }
1276
1277 .wdk-load-animation,
1278 .wdk-click-load-animation {
1279 position: relative;
1280 }
1281
1282 .wdk-load-animation i.fa-ajax-indicator,
1283 .wdk-click-load-animation i.fa-ajax-indicator {
1284 position: absolute;
1285 top: 50%;
1286 margin-top: -7px;
1287 margin-left: 1px;
1288 }
1289
1290 /* end wdk-field */
1291
1292 body .elementinvader-addons-for-elementor .wl-menu-toggle {
1293 background-color: transparent;
1294 width: auto;
1295 display: inline-block;
1296 }
1297
1298 /* ui select */
1299
1300 .wdk-hidden {
1301 display: none !important;
1302 }
1303
1304 #ui-datepicker-div {
1305 z-index: 100 !important;
1306 margin-top: -30px;
1307 }
1308
1309 .elementinvader_contact_form .wdk-booking {
1310 display: inline-block;
1311 margin-top: 15px;
1312 color: #fff;
1313 font-family: "Montserrat";
1314 font-weight: 400;
1315 background: #0074e4;
1316 border: none;
1317 border-radius: 3px;
1318 padding: 13.5px 30px;
1319 font-size: 16px;
1320 cursor: pointer;
1321 text-align: center;
1322 transition: all .15s;
1323
1324 &:hover {
1325 background: #0052a2;
1326 }
1327 }
1328
1329 .wdk-search .section-widget-control .wdk-c-btn {
1330 position: relative;
1331
1332 .fa-ajax-indicator {
1333 display: inline-block;
1334 font-family: 'FontAwesome';
1335 font-size: 20px;
1336 position: absolute;
1337 top: 50%;
1338 left: 50%;
1339 transform: translate(-50%, 25px);
1340 margin-left: -10px;
1341 margin-top: -9px;
1342 opacity: 0;
1343 }
1344
1345 &.loading {
1346 i,.dashicons {
1347 opacity: .1;
1348 }
1349 i.fa-ajax-indicator {
1350 opacity: 1;
1351 }
1352 }
1353 }
1354
1355 .wdk-field-group .select2-container--default {
1356 height: initial !important;
1357 position: relative;
1358
1359 &.select2-container--focus .select2-selection--multiple,
1360 & {
1361 width: 100% !important;
1362 border: 0;
1363 min-width: 150px;
1364 }
1365
1366 .select2-selection--multiple,
1367 .select2-selection--multiple .select2-search,
1368 .select2-selection--multiple input.select2-search__field,
1369 .select2-container--focus .select2-selection--multiple,
1370 & {
1371 background: transparent;
1372 }
1373 .select2-selection--multiple {
1374 &.select2-container--focus .select2-selection--multiple,
1375 &{
1376 border: 0;
1377 }
1378
1379 .select2-search__field {
1380 border: 0 !important;
1381 padding-left: 0;
1382 padding-right: 0;
1383 }
1384
1385 .select2-selection__rendered li {
1386 list-style: none;
1387 margin: 0;
1388
1389 &.select2-search--inline {
1390 flex: 1 2 auto;
1391 }
1392
1393 input.select2-search__field[style*="width: 0"]*="width: 0""] {
1394 min-width: 100%;
1395 }
1396
1397 &.select2-selection__choice {
1398 padding: 5px 6px;
1399 margin: 3px 3px;
1400 }
1401 }
1402
1403 .select2-selection__rendered {
1404 padding: 0;
1405 flex-wrap: nowrap;
1406 display: flex;
1407 justify-content: flex-start;
1408 align-items: center;
1409 }
1410 @media (max-width: 767px) {
1411 .select2-selection__rendered {
1412 flex-wrap: wrap;
1413 }
1414 }
1415 }
1416 &.select2 .select2-selection::after {
1417 content: "\f107";
1418 font-family: 'Font Awesome 5 Free';
1419 font-weight: 900;
1420 position: absolute;
1421 right: 0;
1422 font-size: 16px;
1423 transform: translateY(-50%);
1424 top: 50%;
1425 }
1426 .select2-selection {
1427 position: relative;
1428 display: flex;
1429 align-items: center;
1430 }
1431 .select2.select2-container {
1432 width: 100%;
1433 }
1434 .select2-search {
1435 position: relative;
1436 }
1437 }
1438
1439 .elementinvader_contact_form {
1440 .list_booking_price {
1441 width: 100%;
1442 font-size: 14px;
1443 td, th {
1444 padding: 10px;
1445 border: 1px solid #ddd;
1446 text-align: left;
1447 }
1448
1449 th {
1450 font-weight: 400;
1451 }
1452
1453 tr.total_price {
1454 th,td {
1455 font-weight: 500;
1456 }
1457
1458 }
1459
1460 td {
1461 font-size: 13px;
1462 color: #0074e4;
1463 margin-bottom: 2px;
1464
1465 &.price {
1466
1467 }
1468
1469 &.total_price {
1470 color: #b31111;
1471 }
1472
1473 .title {
1474 font-weight: 600;
1475 }
1476 }
1477 }
1478 .fee_group {
1479 .fee_price {
1480 font-size: 13px;
1481 color: #0074e4;
1482 font-style: italic;
1483 margin-left: 3px;
1484 font-weight: 500;
1485 }
1486 }
1487
1488 input[type="checkbox"]="checkbox""] {
1489 cursor: pointer;
1490 }
1491 }
1492
1493 .wdk-element .wdk-listing-agent .agent-cont .meta-item i.fab {
1494 font-family: 'Font Awesome 5 Brands';
1495 }
1496
1497
1498 .wdk-listing-card .wdk_js_gallery_slider_box {
1499
1500 & .wdk_js_gallery_slider,
1501 & .slick-slide,
1502 & .slick-track,
1503 & .slick-list,
1504 & {
1505 height: 100%;
1506 }
1507
1508 .wdk_js_gallery_slider {
1509 margin-bottom: 0;
1510 position: relative;
1511 z-index: 15;
1512
1513 & .slick-track {
1514 display: flex;
1515 }
1516
1517 & .slick-slide,
1518 & .slick-track,
1519 & .slick-list,
1520 & {
1521 height: 100%;
1522 }
1523
1524 & .slick-list {
1525 width: 100%;
1526 }
1527
1528 &.slick-dotted.slick-slider {
1529 margin-bottom: 0;
1530 }
1531
1532
1533 .slick-dots li button::before {
1534 display: none;
1535 }
1536
1537 .slick-dots {
1538 list-style: none !important;
1539 position: absolute;
1540 bottom: 5px !important;
1541 display: none !important;
1542 }
1543
1544 .slick-next {
1545 right: 16px;
1546 z-index: 2;
1547 }
1548
1549 .slick-prev {
1550 left: 16px;
1551 z-index: 2;
1552 }
1553
1554 .slick-next, .slick-prev {
1555 z-index: 20;
1556 }
1557
1558 .slick-dots li button {
1559 border: 1px solid transparent;
1560 }
1561
1562 .slick-dots li.slick-active button {
1563 border: 1px solid #0979e5;
1564 }
1565
1566 &:not(.slick-initialized) >div:not(:nth-child(1)):not(.wdk_js_gallery_slider-carousel_arrows) {
1567 display: none !important;
1568 }
1569 }
1570
1571 .wdk_js_gallery_slider-carousel_arrows > a {
1572 position: absolute;
1573 top: 50%;
1574 transform: translateY(-50%);
1575 color: #fff;
1576 font-size: 18px;
1577 z-index: 15;
1578 cursor: pointer;
1579 opacity: 0.1;
1580 text-shadow: -2px 0px 2px #00000075;
1581
1582 &.wdk-slider-prev {
1583 left: 10px;
1584 }
1585
1586 &.wdk-slider-next {
1587 right: 10px;
1588 }
1589
1590 span {
1591 font-size: 35px;
1592 width: initial;
1593 height: initial;
1594 }
1595
1596 transition: all 0.4s;
1597 }
1598 .wdk_js_gallery_slider-carousel_arrows > a:focus,
1599 &:hover .wdk_js_gallery_slider-carousel_arrows > a {
1600 opacity: 1;
1601 color: #fff;
1602 }
1603 }
1604
1605 .wdk-depend-hidden {
1606 display: none !important;
1607 }
1608
1609 .wdk_mobile_footer_menu {
1610 display: none;
1611
1612 @media (max-width: 767px) {
1613 display: flex;
1614 }
1615
1616 background: #fff;
1617 border-top: 1px solid #777;
1618 color: #777;
1619 position: fixed;
1620 bottom: 0;
1621 width: 100%;
1622 z-index: 1000;
1623 justify-content: space-between;
1624 align-items: center;
1625
1626 &>.wdk-footer-menu,
1627 &>a {
1628 flex: 1 1 auto;
1629 text-align: center;
1630 font-size: 26px;
1631 &:hover {
1632 box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.11) inset;
1633 }
1634
1635 .dashicons {
1636 font-size: inherit;
1637 width: initial;
1638 height: initial;
1639 }
1640 }
1641
1642 /* custom */
1643
1644 .dash-btn {
1645 font-size: 20px;
1646 padding-top: 16px;
1647 padding-bottom: 15px;
1648 }
1649
1650 .sign-btn {
1651 font-size: 18px;
1652 padding-top: 17px;
1653 padding-bottom: 16px;
1654 }
1655
1656 .wdk-footer-menu label {
1657 font-size: 29px;
1658 padding-top: 7px;
1659 padding-bottom: 7px;
1660 display: flex;
1661 justify-content: center;
1662 align-items: center;
1663 }
1664
1665 & label,
1666 &>a {
1667 padding: 11px 5px 11px 5px;
1668 display: flex;
1669 align-items: center;
1670 justify-content: center;
1671 }
1672
1673 a,label {
1674 transition: all .15s;
1675
1676 &:hover {
1677 color: #0074e4
1678 }
1679 }
1680
1681 .wdk-footer-menu {
1682 flex: 1 1 auto;
1683 text-align: center;
1684 position: relative;
1685
1686 input {
1687 display: none;
1688 };
1689
1690 label {
1691 cursor: pointer;
1692 width: 100%;
1693 height: 100%;
1694 }
1695
1696 .menu__box {
1697 position: absolute;
1698 bottom: 100%;
1699 right: 0;
1700 margin-bottom: 15px;
1701 background: #fff;
1702 padding: 5px 10px;
1703 width: auto;
1704 border: 1px solid #777;
1705 visibility: hidden;
1706 opacity: 0;
1707 transition: all .15s;
1708
1709 a {
1710 padding: 3px 0;
1711 display: block;
1712 font-size: 14px;
1713 }
1714 }
1715
1716
1717 input:checked ~ .menu__box {
1718 visibility: visible;
1719 opacity: 1;
1720 }
1721
1722 input:not(:checked) ~ .wdk_mobile_footer_menu_gumb-open {
1723
1724 }
1725
1726 .wdk_mobile_footer_menu_gumb {
1727
1728
1729 }
1730 }
1731 }
1732
1733 body .elementor-element.elementor-widget .wdk-search {
1734 .wdk-row {
1735 & {
1736 display: -ms-flexbox;
1737 display: flex;
1738 -ms-flex-wrap: wrap;
1739 flex-wrap: wrap;
1740 margin-right: -15px;
1741 margin-left: -15px;
1742 }
1743
1744 & > [class*='wdk-col-']*='wdk-col-']:not(.wdk-col-btns)
1745 {
1746 position: relative;
1747 width: 100%;
1748 padding-right: 15px;
1749 padding-left: 15px;
1750 box-sizing: border-box;
1751 }
1752
1753 @for $i from 1 through 12 {
1754 .wdk-col-#{$i} {
1755 -webkit-flex: 0 0 calc(100% / 12 * #{$i});
1756 flex: 0 0 calc(100% / 12 * #{$i});
1757 max-width: calc(100% / 12 * #{$i});
1758 }
1759 }
1760
1761 @media (min-width:992px){
1762 @for $i from 1 through 12 {
1763 .wdk-col-md-#{$i} {
1764 -webkit-flex: 0 0 calc(100% / 12 * #{$i});
1765 flex: 0 0 calc(100% / 12 * #{$i});
1766 max-width: calc(100% / 12 * #{$i});
1767 }
1768 }
1769 }
1770 }
1771 }
1772
1773 body .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-rectangle
1774 {
1775 background-position: -58px 3px;
1776 }
1777
1778 body .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-rectangle-remove
1779 {
1780 background-position: -178px 1px;
1781 }
1782
1783 body .leaflet-control-custom.leaflet-draw-toolbar {
1784 margin-top: 0;
1785 }
1786
1787 .wdk_dropdown_tree .list_container {
1788 max-width: 100%;
1789
1790 .list_scroll ul li {
1791 white-space: nowrap;
1792 overflow: hidden;
1793 text-overflow: ellipsis;
1794 max-width: 100%;
1795 }
1796 }
1797
1798 @media (max-width: 767px) {
1799 .WdkScrollMobileSwipe {
1800 display: flex;
1801 flex-wrap: nowrap !important;
1802 overflow: auto !important;
1803 }
1804 .WdkScrollMobileSwipe .elementor-column {
1805 width: 100%;
1806 flex: 0 0 100%;
1807 }
1808 }
1809
1810 .wdk-textarea-load-more-wrapper {
1811 text-align: center;
1812 overflow: hidden;
1813 .wdk-textarea-load-more-button {
1814 cursor: pointer;
1815 position: relative;
1816 }
1817
1818 .wdk-textarea-load-more-button:before,
1819 .wdk-textarea-load-more-button:after {
1820 content: "";
1821 position: absolute;
1822 font-size: 12px;
1823 vertical-align: middle;
1824 top: 50%;
1825 border-bottom: 1px dashed #636363;
1826 margin-top: 0px;
1827 letter-spacing: 4px;
1828 width: 100vw;
1829 height: 1px;
1830 }
1831
1832 .wdk-textarea-load-more-button:after {
1833 left: 105%;
1834 }
1835
1836 .wdk-textarea-load-more-button:before {
1837 right: 105%;
1838 }
1839 }
1840
1841 .elementor-editor-active {
1842
1843 .wdk-listing-card .wdk_js_gallery_slider_box .wdk_js_gallery_slider .slick-track {
1844 width: 100% !important;
1845
1846 .slick-slide {
1847 width: 100% !important;
1848 }
1849
1850 .slick-slide:not(:first-child) {
1851 display: none;
1852 }
1853
1854 }
1855 }
1856
1857 .wdk-compare-table,
1858 .woocommerce,
1859 .wdk-compare-listing-button-element,
1860 .wdk-currencies-list-elementt,
1861 .wdk-facebook-comments-element,
1862 .wdk-favorites-element,
1863 .wdk-listing-claim-element,
1864 .wdk-membership-element,
1865 .wdk-mortgage-element,
1866 .wdk-payments-element,
1867 .wdk-pdf-export-element,
1868 .wdk-report-abuse-element,
1869 .wdk-reviews-element,
1870 .wdk-save-search-element,
1871 .wdk-svg-map-element,
1872 .wdk-booking-element {
1873 word-break: normal;
1874 }
1875
1876 @import 'animation.scss';