PluginProbe
WP Directory Kit / 1.2.5
WP Directory Kit v1.2.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.2.5, at public/css/wpdirectorykit-public.scss

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