PluginProbe
Powerkit – Supercharge your WordPress Site / 2.9.1
Powerkit – Supercharge your WordPress Site v2.9.1
3.1.1 3.1.0 3.0.9 3.0.8 trunk 2.2.6 2.2.7 2.2.8 2.2.9 2.3.0 2.3.1 2.3.2 2.3.3 2.3.4 2.3.5 2.3.6 2.3.7 2.3.8 2.3.9 2.4.0 2.4.1 2.4.2 2.4.3 2.4.4 2.4.5 All 87 releases
powerkit / assets / css / powerkit.css

powerkit.css in Powerkit – Supercharge your WordPress Site 2.9.1, at assets/css/powerkit.css

1,473 lines 25.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * All of the CSS for your public-facing functionality should be
3 * included in this file.
4 */
5 /**
6 * Environment for all styles (variables, additions, etc).
7 */
8 /*--------------------------------------------------------------*/
9 /* Include */
10 /*--------------------------------------------------------------*/
11 @font-face {
12 font-family: 'powerkit-icons';
13 src: url("../fonts/powerkit-icons.woff") format("woff"), url("../fonts/powerkit-icons.ttf") format("truetype"), url("../fonts/powerkit-icons.svg") format("svg");
14 font-weight: normal;
15 font-style: normal;
16 font-display: swap;
17 }
18
19 [class^="pk-icon-"],
20 [class*=" pk-icon-"] {
21 font-family: 'powerkit-icons' !important;
22 font-style: normal;
23 font-weight: normal;
24 font-variant: normal;
25 text-transform: none;
26 line-height: 1;
27 -webkit-font-smoothing: antialiased;
28 -moz-osx-font-smoothing: grayscale;
29 }
30
31 .pk-icon-twitter:before {
32 content: "\e94c";
33 }
34
35 .pk-icon-alert-circle:before {
36 content: "\e946";
37 }
38
39 .pk-icon-star-half:before {
40 content: "\e938";
41 }
42
43 .pk-icon-star-full:before {
44 content: "\e939";
45 }
46
47 .pk-icon-star-empty:before {
48 content: "\e93a";
49 }
50
51 .pk-icon-discord:before {
52 content: "\e947";
53 }
54
55 .pk-icon-tiktok:before {
56 content: "\e948";
57 }
58
59 .pk-icon-mix:before {
60 content: "\e93c";
61 }
62
63 .pk-icon-strava:before {
64 content: "\e93b";
65 }
66
67 .pk-icon-microblog:before {
68 content: "\e937";
69 }
70
71 .pk-icon-mastodon:before {
72 content: "\e935";
73 }
74
75 .pk-icon-goodreads:before {
76 content: "\e934";
77 }
78
79 .pk-icon-codepen:before {
80 content: "\e924";
81 }
82
83 .pk-icon-medium:before {
84 content: "\e906";
85 }
86
87 .pk-icon-powerkit:before {
88 content: "\e904";
89 }
90
91 .pk-icon-line:before {
92 content: "\e90e";
93 }
94
95 .pk-icon-fb-messenger:before {
96 content: "\e90a";
97 }
98
99 .pk-icon-pixelfed:before {
100 content: "\e936";
101 }
102
103 .pk-icon-steam:before {
104 content: "\e932";
105 }
106
107 .pk-icon-thumbtack:before {
108 content: "\e933";
109 }
110
111 .pk-icon-tripadvisor:before {
112 content: "\e931";
113 }
114
115 .pk-icon-slideshare:before {
116 content: "\e925";
117 }
118
119 .pk-icon-producthunt:before {
120 content: "\e930";
121 }
122
123 .pk-icon-meetup:before {
124 content: "\e92f";
125 }
126
127 .pk-icon-houzz:before {
128 content: "\e92e";
129 }
130
131 .pk-icon-deviantart:before {
132 content: "\e92d";
133 }
134
135 .pk-icon-delicious:before {
136 content: "\e92c";
137 }
138
139 .pk-icon-500px:before {
140 content: "\e92b";
141 }
142
143 .pk-icon-bitbucket:before {
144 content: "\e929";
145 }
146
147 .pk-icon-jsfiddle:before {
148 content: "\e928";
149 }
150
151 .pk-icon-freecodecamp:before {
152 content: "\e927";
153 }
154
155 .pk-icon-gitlab:before {
156 content: "\e926";
157 }
158
159 .pk-icon-stackoverflow:before {
160 content: "\e923";
161 }
162
163 .pk-icon-wechat:before {
164 content: "\e91e";
165 }
166
167 .pk-icon-xing:before {
168 content: "\e91c";
169 }
170
171 .pk-icon-ok:before {
172 content: "\e91d";
173 }
174
175 .pk-icon-snapchat:before {
176 content: "\e917";
177 }
178
179 .pk-icon-behance:before {
180 content: "\f1b4";
181 }
182
183 .pk-icon-diamond:before {
184 content: "\f219";
185 }
186
187 .pk-icon-dribbble:before {
188 content: "\f17d";
189 }
190
191 .pk-icon-facebook:before {
192 content: "\e949";
193 }
194
195 .pk-icon-feed:before {
196 content: "\f09e";
197 }
198
199 .pk-icon-rss:before {
200 content: "\f09e";
201 }
202
203 .pk-icon-get-pocket:before {
204 content: "\f265";
205 }
206
207 .pk-icon-pocket:before {
208 content: "\f265";
209 }
210
211 .pk-icon-google-plus:before {
212 content: "\f0d5";
213 }
214
215 .pk-icon-googleplus:before {
216 content: "\f0d5";
217 }
218
219 .pk-icon-linkedin:before {
220 content: "\f0e1";
221 }
222
223 .pk-icon-map-marker:before {
224 content: "\f041";
225 }
226
227 .pk-icon-phone:before {
228 content: "\f095";
229 }
230
231 .pk-icon-viber:before {
232 content: "\f095";
233 }
234
235 .pk-icon-pinterest:before {
236 content: "\f0d2";
237 }
238
239 .pk-icon-retweet:before {
240 content: "\f079";
241 }
242
243 .pk-icon-soundcloud:before {
244 content: "\f1be";
245 }
246
247 .pk-icon-spotify:before {
248 content: "\f1bc";
249 }
250
251 .pk-icon-stumbleupon:before {
252 content: "\f1a4";
253 }
254
255 .pk-icon-tumblr:before {
256 content: "\f173";
257 }
258
259 .pk-icon-old-twitter:before {
260 content: "\f099";
261 }
262
263 .pk-icon-vimeo:before {
264 content: "\f27d";
265 }
266
267 .pk-icon-vk:before {
268 content: "\f189";
269 }
270
271 .pk-icon-vkontakte:before {
272 content: "\f189";
273 }
274
275 .pk-icon-whatsapp:before {
276 content: "\f232";
277 }
278
279 .pk-icon-youtube:before {
280 content: "\e945";
281 }
282
283 .pk-icon-foursquare:before {
284 content: "\e92a";
285 }
286
287 .pk-icon-yelp:before {
288 content: "\e922";
289 }
290
291 .pk-icon-weibo:before {
292 content: "\e91f";
293 }
294
295 .pk-icon-apple:before {
296 content: "\e921";
297 }
298
299 .pk-icon-flickr:before {
300 content: "\e918";
301 }
302
303 .pk-icon-bloglovin:before {
304 content: "\e944";
305 }
306
307 .pk-icon-twitch:before {
308 content: "\e905";
309 }
310
311 .pk-icon-flipboard:before {
312 content: "\e94a";
313 }
314
315 .pk-icon-googlenews:before {
316 content: "\e94b";
317 }
318
319 .pk-icon-github:before {
320 content: "\e90f";
321 }
322
323 .pk-icon-instagram:before {
324 content: "\e90c";
325 }
326
327 .pk-icon-telegram:before {
328 content: "\e909";
329 }
330
331 .pk-icon-reddit:before {
332 content: "\e90b";
333 }
334
335 .pk-icon-android:before {
336 content: "\e920";
337 }
338
339 .pk-icon-link:before {
340 content: "\e91b";
341 }
342
343 .pk-icon-globe:before {
344 content: "\e91a";
345 }
346
347 .pk-icon-website:before {
348 content: "\e91a";
349 }
350
351 .pk-icon-bell:before {
352 content: "\e919";
353 }
354
355 .pk-icon-zoom-in:before {
356 content: "\e916";
357 }
358
359 .pk-icon-check:before {
360 content: "\e912";
361 }
362
363 .pk-icon-minus:before {
364 content: "\e90d";
365 }
366
367 .pk-icon-chevron-right:before {
368 content: "\e914";
369 }
370
371 .pk-icon-chevron-left:before {
372 content: "\e915";
373 }
374
375 .pk-icon-x:before {
376 content: "\e913";
377 }
378
379 .pk-icon-arrow-right-circle:before {
380 content: "\e911";
381 }
382
383 .pk-icon-arrow-left-circle:before {
384 content: "\e910";
385 }
386
387 .pk-icon-up:before {
388 content: "\e908";
389 }
390
391 .pk-icon-comment:before {
392 content: "\e900";
393 }
394
395 .pk-icon-refresh-cw:before {
396 content: "\e902";
397 }
398
399 .pk-icon-reply:before {
400 content: "\e903";
401 }
402
403 .pk-icon-like:before {
404 content: "\e901";
405 }
406
407 .pk-icon-mail:before {
408 content: "\e002";
409 }
410
411 .pk-icon-email:before {
412 content: "\e002";
413 }
414
415 .pk-icon-video:before {
416 content: "\e018";
417 }
418
419 .pk-icon-share:before {
420 content: "\e93d";
421 }
422
423 .pk-icon-watch:before {
424 content: "\e93f";
425 }
426
427 .pk-icon-eye:before {
428 content: "\e93e";
429 }
430
431 .pk-icon-arrow-right:before {
432 content: "\e940";
433 }
434
435 .pk-icon-arrow-left:before {
436 content: "\e941";
437 }
438
439 .pk-icon-arrow-down:before {
440 content: "\e942";
441 }
442
443 .pk-icon-arrow-up:before {
444 content: "\e943";
445 }
446
447 .pk-container {
448 width: 100%;
449 padding-right: 20px;
450 padding-left: 20px;
451 margin-right: auto;
452 margin-left: auto;
453 }
454
455 @media (min-width: 576px) {
456 .pk-container {
457 max-width: 540px;
458 }
459 }
460
461 @media (min-width: 768px) {
462 .pk-container {
463 max-width: 720px;
464 }
465 }
466
467 @media (min-width: 992px) {
468 .pk-container {
469 max-width: 960px;
470 }
471 }
472
473 @media (min-width: 1200px) {
474 .pk-container {
475 max-width: 1140px;
476 }
477 }
478
479 .pk-container-fluid {
480 width: 100%;
481 padding-right: 20px;
482 padding-left: 20px;
483 margin-right: auto;
484 margin-left: auto;
485 }
486
487 .pk-row {
488 display: flex;
489 flex-wrap: wrap;
490 margin-right: -20px;
491 margin-left: -20px;
492 }
493
494 .pk-col-1, .pk-col-2, .pk-col-3, .pk-col-4, .pk-col-5, .pk-col-6, .pk-col-7, .pk-col-8, .pk-col-9, .pk-col-10, .pk-col-11, .pk-col-12, .pk-col-sm-1, .pk-col-sm-2, .pk-col-sm-3, .pk-col-sm-4, .pk-col-sm-5, .pk-col-sm-6, .pk-col-sm-7, .pk-col-sm-8, .pk-col-sm-9, .pk-col-sm-10, .pk-col-sm-11, .pk-col-sm-12, .pk-col-md-1, .pk-col-md-2, .pk-col-md-3, .pk-col-md-4, .pk-col-md-5, .pk-col-md-6, .pk-col-md-7, .pk-col-md-8, .pk-col-md-9, .pk-col-md-10, .pk-col-md-11, .pk-col-md-12, .pk-col-lg-1, .pk-col-lg-2, .pk-col-lg-3, .pk-col-lg-4, .pk-col-lg-5, .pk-col-lg-6, .pk-col-lg-7, .pk-col-lg-8, .pk-col-lg-9, .pk-col-lg-10, .pk-col-lg-11, .pk-col-lg-12, .pk-col-xl-1, .pk-col-xl-2, .pk-col-xl-3, .pk-col-xl-4, .pk-col-xl-5, .pk-col-xl-6, .pk-col-xl-7, .pk-col-xl-8, .pk-col-xl-9, .pk-col-xl-10, .pk-col-xl-11, .pk-col-xl-12 {
495 position: relative;
496 width: 100%;
497 min-height: 1px;
498 padding-right: 20px;
499 padding-left: 20px;
500 }
501
502 .pk-col-1 {
503 flex: 0 0 8.3333333333%;
504 max-width: 8.3333333333%;
505 }
506
507 .pk-col-2 {
508 flex: 0 0 16.6666666667%;
509 max-width: 16.6666666667%;
510 }
511
512 .pk-col-3 {
513 flex: 0 0 25%;
514 max-width: 25%;
515 }
516
517 .pk-col-4 {
518 flex: 0 0 33.3333333333%;
519 max-width: 33.3333333333%;
520 }
521
522 .pk-col-5 {
523 flex: 0 0 41.6666666667%;
524 max-width: 41.6666666667%;
525 }
526
527 .pk-col-6 {
528 flex: 0 0 50%;
529 max-width: 50%;
530 }
531
532 .pk-col-7 {
533 flex: 0 0 58.3333333333%;
534 max-width: 58.3333333333%;
535 }
536
537 .pk-col-8 {
538 flex: 0 0 66.6666666667%;
539 max-width: 66.6666666667%;
540 }
541
542 .pk-col-9 {
543 flex: 0 0 75%;
544 max-width: 75%;
545 }
546
547 .pk-col-10 {
548 flex: 0 0 83.3333333333%;
549 max-width: 83.3333333333%;
550 }
551
552 .pk-col-11 {
553 flex: 0 0 91.6666666667%;
554 max-width: 91.6666666667%;
555 }
556
557 .pk-col-12 {
558 flex: 0 0 100%;
559 max-width: 100%;
560 }
561
562 @media (min-width: 576px) {
563 .pk-col-sm-1 {
564 flex: 0 0 8.3333333333%;
565 max-width: 8.3333333333%;
566 }
567 .pk-col-sm-2 {
568 flex: 0 0 16.6666666667%;
569 max-width: 16.6666666667%;
570 }
571 .pk-col-sm-3 {
572 flex: 0 0 25%;
573 max-width: 25%;
574 }
575 .pk-col-sm-4 {
576 flex: 0 0 33.3333333333%;
577 max-width: 33.3333333333%;
578 }
579 .pk-col-sm-5 {
580 flex: 0 0 41.6666666667%;
581 max-width: 41.6666666667%;
582 }
583 .pk-col-sm-6 {
584 flex: 0 0 50%;
585 max-width: 50%;
586 }
587 .pk-col-sm-7 {
588 flex: 0 0 58.3333333333%;
589 max-width: 58.3333333333%;
590 }
591 .pk-col-sm-8 {
592 flex: 0 0 66.6666666667%;
593 max-width: 66.6666666667%;
594 }
595 .pk-col-sm-9 {
596 flex: 0 0 75%;
597 max-width: 75%;
598 }
599 .pk-col-sm-10 {
600 flex: 0 0 83.3333333333%;
601 max-width: 83.3333333333%;
602 }
603 .pk-col-sm-11 {
604 flex: 0 0 91.6666666667%;
605 max-width: 91.6666666667%;
606 }
607 .pk-col-sm-12 {
608 flex: 0 0 100%;
609 max-width: 100%;
610 }
611 }
612
613 @media (min-width: 768px) {
614 .pk-col-md-1 {
615 flex: 0 0 8.3333333333%;
616 max-width: 8.3333333333%;
617 }
618 .pk-col-md-2 {
619 flex: 0 0 16.6666666667%;
620 max-width: 16.6666666667%;
621 }
622 .pk-col-md-3 {
623 flex: 0 0 25%;
624 max-width: 25%;
625 }
626 .pk-col-md-4 {
627 flex: 0 0 33.3333333333%;
628 max-width: 33.3333333333%;
629 }
630 .pk-col-md-5 {
631 flex: 0 0 41.6666666667%;
632 max-width: 41.6666666667%;
633 }
634 .pk-col-md-6 {
635 flex: 0 0 50%;
636 max-width: 50%;
637 }
638 .pk-col-md-7 {
639 flex: 0 0 58.3333333333%;
640 max-width: 58.3333333333%;
641 }
642 .pk-col-md-8 {
643 flex: 0 0 66.6666666667%;
644 max-width: 66.6666666667%;
645 }
646 .pk-col-md-9 {
647 flex: 0 0 75%;
648 max-width: 75%;
649 }
650 .pk-col-md-10 {
651 flex: 0 0 83.3333333333%;
652 max-width: 83.3333333333%;
653 }
654 .pk-col-md-11 {
655 flex: 0 0 91.6666666667%;
656 max-width: 91.6666666667%;
657 }
658 .pk-col-md-12 {
659 flex: 0 0 100%;
660 max-width: 100%;
661 }
662 }
663
664 @media (min-width: 992px) {
665 .pk-col-lg-1 {
666 flex: 0 0 8.3333333333%;
667 max-width: 8.3333333333%;
668 }
669 .pk-col-lg-2 {
670 flex: 0 0 16.6666666667%;
671 max-width: 16.6666666667%;
672 }
673 .pk-col-lg-3 {
674 flex: 0 0 25%;
675 max-width: 25%;
676 }
677 .pk-col-lg-4 {
678 flex: 0 0 33.3333333333%;
679 max-width: 33.3333333333%;
680 }
681 .pk-col-lg-5 {
682 flex: 0 0 41.6666666667%;
683 max-width: 41.6666666667%;
684 }
685 .pk-col-lg-6 {
686 flex: 0 0 50%;
687 max-width: 50%;
688 }
689 .pk-col-lg-7 {
690 flex: 0 0 58.3333333333%;
691 max-width: 58.3333333333%;
692 }
693 .pk-col-lg-8 {
694 flex: 0 0 66.6666666667%;
695 max-width: 66.6666666667%;
696 }
697 .pk-col-lg-9 {
698 flex: 0 0 75%;
699 max-width: 75%;
700 }
701 .pk-col-lg-10 {
702 flex: 0 0 83.3333333333%;
703 max-width: 83.3333333333%;
704 }
705 .pk-col-lg-11 {
706 flex: 0 0 91.6666666667%;
707 max-width: 91.6666666667%;
708 }
709 .pk-col-lg-12 {
710 flex: 0 0 100%;
711 max-width: 100%;
712 }
713 }
714
715 @media (min-width: 1200px) {
716 .pk-col-xl-1 {
717 flex: 0 0 8.3333333333%;
718 max-width: 8.3333333333%;
719 }
720 .pk-col-xl-2 {
721 flex: 0 0 16.6666666667%;
722 max-width: 16.6666666667%;
723 }
724 .pk-col-xl-3 {
725 flex: 0 0 25%;
726 max-width: 25%;
727 }
728 .pk-col-xl-4 {
729 flex: 0 0 33.3333333333%;
730 max-width: 33.3333333333%;
731 }
732 .pk-col-xl-5 {
733 flex: 0 0 41.6666666667%;
734 max-width: 41.6666666667%;
735 }
736 .pk-col-xl-6 {
737 flex: 0 0 50%;
738 max-width: 50%;
739 }
740 .pk-col-xl-7 {
741 flex: 0 0 58.3333333333%;
742 max-width: 58.3333333333%;
743 }
744 .pk-col-xl-8 {
745 flex: 0 0 66.6666666667%;
746 max-width: 66.6666666667%;
747 }
748 .pk-col-xl-9 {
749 flex: 0 0 75%;
750 max-width: 75%;
751 }
752 .pk-col-xl-10 {
753 flex: 0 0 83.3333333333%;
754 max-width: 83.3333333333%;
755 }
756 .pk-col-xl-11 {
757 flex: 0 0 91.6666666667%;
758 max-width: 91.6666666667%;
759 }
760 .pk-col-xl-12 {
761 flex: 0 0 100%;
762 max-width: 100%;
763 }
764 }
765
766 .pk-d-none {
767 display: none;
768 }
769
770 .pk-clearfix {
771 clear: both;
772 }
773
774 .pk-clearfix:after {
775 content: '';
776 clear: both;
777 display: table;
778 }
779
780 .pk-post-meta {
781 --pk-post-meta-color: #dee2e6;
782 padding-left: 0;
783 list-style: none;
784 color: var(--pk-post-meta-color);
785 padding: 0;
786 margin: 0;
787 }
788
789 .pk-post-meta > li {
790 display: inline-block;
791 }
792
793 .pk-post-meta > li:not(:last-child) {
794 margin-right: 0.5rem;
795 }
796
797 .pk-post-meta li + li:before {
798 margin-right: 0.5rem;
799 content: "\b7";
800 }
801
802 .pk-post-meta .pk-icon {
803 margin-right: 0.25rem;
804 }
805
806 .pk-meta-category .post-categories {
807 padding-left: 0;
808 list-style: none;
809 padding: 0;
810 margin: 0;
811 }
812
813 .pk-meta-category .post-categories > li {
814 display: inline-block;
815 }
816
817 .pk-meta-category .post-categories > li:not(:last-child) {
818 margin-right: 0.5rem;
819 }
820
821 .pk-meta-category .post-categories li:not(:last-child):after {
822 content: ",";
823 }
824
825 .post-meta .pk-meta-category .post-categories {
826 margin-bottom: 0;
827 }
828
829 .pk-meta-author span + a,
830 .pk-meta-author a + span {
831 margin-left: 0.25rem;
832 }
833
834 /* Blocks */
835 /*--------------------------------------------------------------*/
836 .wp-block-button.is-pk-button-full-width,
837 .entry-content .wp-block-button.is-pk-button-full-width {
838 width: 100%;
839 }
840
841 .wp-block-button.is-pk-button-full-width .wp-block-button__link,
842 .entry-content .wp-block-button.is-pk-button-full-width .wp-block-button__link {
843 width: 100%;
844 }
845
846 .wp-block-button.is-pk-button-size-sm .wp-block-button__link,
847 .entry-content .wp-block-button.is-pk-button-size-sm .wp-block-button__link {
848 padding: 0.25rem 0.5rem;
849 }
850
851 .wp-block-button.is-pk-button-size-lg .wp-block-button__link,
852 .entry-content .wp-block-button.is-pk-button-size-lg .wp-block-button__link {
853 padding: 1rem 2rem;
854 }
855
856 /* Color Styles */
857 /*--------------------------------------------------------------*/
858 .pk-color-primary {
859 --pk-primary-color: #343a40;
860 color: var(--pk-primary-color);
861 }
862
863 .pk-color-secondary {
864 --pk-secondary-color: #A0A0A0;
865 color: var(--pk-secondary-color);
866 }
867
868 .pk-bg-primary {
869 --pk-primary-background: #343a40;
870 background-color: var(--pk-primary-background);
871 }
872
873 .pk-bg-overlay {
874 --pk-overlay-background: rgba(52, 58, 64, 0.5);
875 background-color: var(--pk-overlay-background);
876 }
877
878 /* Font Styles */
879 /*--------------------------------------------------------------*/
880 .pk-font-primary {
881 --pk-primary-font-weight: 700;
882 font-weight: var(--pk-primary-font-weight);
883 }
884
885 .pk-font-secondary {
886 --pk-secondary-font-size: 80%;
887 --pk-secondary-font-color: #6c757d;
888 font-size: var(--pk-secondary-font-size);
889 color: var(--pk-secondary-font-color);
890 }
891
892 .pk-font-heading {
893 --pk-heading-font-weight: 700;
894 --pk-heading-font-color: #212529;
895 font-weight: var(--pk-heading-font-weight);
896 color: var(--pk-heading-font-color);
897 }
898
899 /* Background */
900 /*--------------------------------------------------------------*/
901 .pk-bg-primary {
902 background-color: #007bff;
903 }
904
905 a.pk-bg-primary:hover, a.pk-bg-primary:focus,
906 button.pk-bg-primary:hover,
907 button.pk-bg-primary:focus {
908 background-color: #0062cc;
909 }
910
911 .pk-bg-secondary {
912 background-color: #A0A0A0;
913 }
914
915 a.pk-bg-secondary:hover, a.pk-bg-secondary:focus,
916 button.pk-bg-secondary:hover,
917 button.pk-bg-secondary:focus {
918 background-color: #878686;
919 }
920
921 .pk-bg-success {
922 background-color: #28a745;
923 }
924
925 a.pk-bg-success:hover, a.pk-bg-success:focus,
926 button.pk-bg-success:hover,
927 button.pk-bg-success:focus {
928 background-color: #1e7e34;
929 }
930
931 .pk-bg-info {
932 background-color: #17a2b8;
933 }
934
935 a.pk-bg-info:hover, a.pk-bg-info:focus,
936 button.pk-bg-info:hover,
937 button.pk-bg-info:focus {
938 background-color: #117a8b;
939 }
940
941 .pk-bg-warning {
942 background-color: #ffc107;
943 }
944
945 a.pk-bg-warning:hover, a.pk-bg-warning:focus,
946 button.pk-bg-warning:hover,
947 button.pk-bg-warning:focus {
948 background-color: #d39e00;
949 }
950
951 .pk-bg-danger {
952 background-color: #dc3545;
953 }
954
955 a.pk-bg-danger:hover, a.pk-bg-danger:focus,
956 button.pk-bg-danger:hover,
957 button.pk-bg-danger:focus {
958 background-color: #bd2130;
959 }
960
961 .pk-bg-light {
962 background-color: #f8f9fa;
963 }
964
965 a.pk-bg-light:hover, a.pk-bg-light:focus,
966 button.pk-bg-light:hover,
967 button.pk-bg-light:focus {
968 background-color: #dae0e5;
969 }
970
971 .pk-bg-dark {
972 background-color: #343a40;
973 }
974
975 a.pk-bg-dark:hover, a.pk-bg-dark:focus,
976 button.pk-bg-dark:hover,
977 button.pk-bg-dark:focus {
978 background-color: #1d2124;
979 }
980
981 .pk-bg-white {
982 --pk-bg-white: #fff;
983 background-color: var(--pk-bg-white);
984 }
985
986 .pk-bg-transparent {
987 --pk-bg-transparent: transparent;
988 background-color: var(--pk-bg-transparent);
989 }
990
991 /* Alerts */
992 /*--------------------------------------------------------------*/
993 .pk-alert {
994 --pk-alert-background: #f8f9fa;
995 --pk-alert-heading-color: inherit;
996 --pk-alert-close-color: #000;
997 --pk-alert-close-hover-color: #000;
998 --pk-alert-font-size: 0.875rem;
999 --pk-alert-link-font-weight: 700;
1000 --pk-alert-close-font-size: 1rem;
1001 --pk-alert-close-line-height: 1;
1002 --pk-alert-close-text-shadow: 0 1px 0 #fff;
1003 --pk-alert-close-opacity: .75;
1004 }
1005
1006 /*--------------------------------------------------------------*/
1007 .pk-alert {
1008 position: relative;
1009 padding: 0.5rem 1rem;
1010 margin-bottom: 1rem;
1011 background: var(--pk-alert-background);
1012 font-size: var(--pk-alert-font-size);
1013 }
1014
1015 .pk-alert a {
1016 text-decoration: underline;
1017 text-shadow: none;
1018 border: none;
1019 }
1020
1021 .pk-alert a:hover {
1022 text-decoration: none;
1023 text-shadow: none;
1024 border: none;
1025 }
1026
1027 .pk-alert p {
1028 margin-bottom: 0.5rem;
1029 }
1030
1031 .pk-alert > *:last-child {
1032 margin-bottom: 0;
1033 }
1034
1035 .pk-alert-multiline {
1036 padding: 1.25rem 1.75rem;
1037 }
1038
1039 .pk-alert-heading {
1040 color: var(--pk-alert-heading-color);
1041 }
1042
1043 .pk-alert-link {
1044 font-weight: var(--pk-alert-link-font-weight);
1045 }
1046
1047 .pk-alert-dismissible {
1048 padding-right: 4rem;
1049 }
1050
1051 .pk-alert-dismissible .pk-close {
1052 position: absolute;
1053 top: 0;
1054 right: 0;
1055 height: 100%;
1056 padding: 0 1rem;
1057 color: inherit;
1058 }
1059
1060 .pk-close {
1061 float: right;
1062 font-size: var(--pk-alert-close-font-size);
1063 line-height: var(--pk-alert-close-line-height);
1064 color: var(--pk-alert-close-color);
1065 text-shadow: var(--pk-alert-close-text-shadow);
1066 opacity: var(--pk-alert-close-opacity);
1067 }
1068
1069 .pk-close:hover, .pk-close:focus {
1070 color: var(--pk-alert-close-hover-color);
1071 text-decoration: none;
1072 opacity: 1;
1073 }
1074
1075 button.pk-close {
1076 padding: 0;
1077 text-decoration: none !important;
1078 border: none !important;
1079 -webkit-appearance: none !important;
1080 background-color: transparent !important;
1081 box-shadow: none !important;
1082 }
1083
1084 .pk-alert-primary {
1085 border-left: #007bff 2px solid;
1086 }
1087
1088 .pk-alert-primary .pk-icon-close,
1089 .pk-alert-primary .pk-alert-title {
1090 color: #0062cc;
1091 }
1092
1093 .pk-alert-secondary {
1094 border-left: #A0A0A0 2px solid;
1095 }
1096
1097 .pk-alert-secondary .pk-icon-close,
1098 .pk-alert-secondary .pk-alert-title {
1099 color: #878686;
1100 }
1101
1102 .pk-alert-success {
1103 border-left: #28a745 2px solid;
1104 }
1105
1106 .pk-alert-success .pk-icon-close,
1107 .pk-alert-success .pk-alert-title {
1108 color: #1e7e34;
1109 }
1110
1111 .pk-alert-info {
1112 border-left: #17a2b8 2px solid;
1113 }
1114
1115 .pk-alert-info .pk-icon-close,
1116 .pk-alert-info .pk-alert-title {
1117 color: #117a8b;
1118 }
1119
1120 .pk-alert-warning {
1121 border-left: #ffc107 2px solid;
1122 }
1123
1124 .pk-alert-warning .pk-icon-close,
1125 .pk-alert-warning .pk-alert-title {
1126 color: #d39e00;
1127 }
1128
1129 .pk-alert-danger {
1130 border-left: #dc3545 2px solid;
1131 }
1132
1133 .pk-alert-danger .pk-icon-close,
1134 .pk-alert-danger .pk-alert-title {
1135 color: #bd2130;
1136 }
1137
1138 .pk-alert-light {
1139 border-left: #f8f9fa 2px solid;
1140 }
1141
1142 .pk-alert-light .pk-icon-close,
1143 .pk-alert-light .pk-alert-title {
1144 color: #dae0e5;
1145 }
1146
1147 .pk-alert-dark {
1148 border-left: #343a40 2px solid;
1149 }
1150
1151 .pk-alert-dark .pk-icon-close,
1152 .pk-alert-dark .pk-alert-title {
1153 color: #1d2124;
1154 }
1155
1156 /* ToolTip */
1157 /*--------------------------------------------------------------*/
1158 .pk-tippy .pk-alert {
1159 display: none;
1160 }
1161
1162 .tippy-content .pk-alert {
1163 border: none;
1164 background: none;
1165 color: inherit;
1166 font-size: inherit;
1167 padding: 0;
1168 margin: 0;
1169 max-width: 600px;
1170 }
1171
1172 /* Badges */
1173 /*--------------------------------------------------------------*/
1174 .pk-badge {
1175 --pk-badge-background: #f8f9fa;
1176 --pk-badge-color: inherit;
1177 --pk-badge-primary-background: #00A0D2;
1178 --pk-badge-primary-color: #FFFFFF;
1179 --pk-badge-light-background: #FFFFFF;
1180 --pk-badge-light-color: #000000;
1181 --pk-badge-border-radius: 30px;
1182 --pk-badge-font-size: 75%;
1183 --pk-badge-line-height: 1;
1184 }
1185
1186 /*--------------------------------------------------------------*/
1187 .pk-badge {
1188 background: var(--pk-badge-background);
1189 color: var(--pk-badge-color);
1190 display: inline-block;
1191 padding: 0.3em 0.6em;
1192 font-size: var(--pk-badge-font-size);
1193 text-align: center;
1194 white-space: nowrap;
1195 vertical-align: baseline;
1196 border-radius: var(--pk-badge-border-radius);
1197 text-transform: uppercase;
1198 line-height: var(--pk-badge-line-height);
1199 }
1200
1201 .pk-badge:empty {
1202 display: none;
1203 }
1204
1205 .menu-item .pk-badge {
1206 margin-left: 0.5rem;
1207 }
1208
1209 .pk-button .pk-badge {
1210 position: relative;
1211 top: -1px;
1212 }
1213
1214 .pk-badge-primary {
1215 background: rgba(0, 123, 255, 0.1);
1216 color: #0056b3;
1217 }
1218
1219 .pk-badge-secondary {
1220 background: rgba(160, 160, 160, 0.1);
1221 color: #7a7a7a;
1222 }
1223
1224 .pk-badge-success {
1225 background: rgba(40, 167, 69, 0.1);
1226 color: #19692c;
1227 }
1228
1229 .pk-badge-info {
1230 background: rgba(23, 162, 184, 0.1);
1231 color: #0f6674;
1232 }
1233
1234 .pk-badge-warning {
1235 background: rgba(255, 193, 7, 0.1);
1236 color: #ba8b00;
1237 }
1238
1239 .pk-badge-danger {
1240 background: rgba(220, 53, 69, 0.1);
1241 color: #a71d2a;
1242 }
1243
1244 .pk-badge-light {
1245 background: rgba(248, 249, 250, 0.1);
1246 color: #cbd3da;
1247 }
1248
1249 .pk-badge-dark {
1250 background: rgba(52, 58, 64, 0.1);
1251 color: #121416;
1252 }
1253
1254 .pk-badge-primary {
1255 background: var(--pk-badge-primary-background);
1256 color: var(--pk-badge-primary-color);
1257 }
1258
1259 .pk-badge-light {
1260 background: var(--pk-badge-light-background);
1261 color: var(--pk-badge-light-color);
1262 }
1263
1264 /* Tippy */
1265 /*--------------------------------------------------------------*/
1266 .tippy-tooltip {
1267 color: #fff;
1268 }
1269
1270 .tippy-tooltip a {
1271 text-decoration: underline;
1272 color: inherit;
1273 }
1274
1275 .tippy-tooltip a:hover {
1276 text-decoration: none;
1277 color: inherit;
1278 }
1279
1280 /* Flickity */
1281 /*--------------------------------------------------------------*/
1282 [pk-flickity="init"] {
1283 --pk-flickity-button-background: hsla(0, 0%, 100%, 0.75);
1284 --pk-flickity-button-color: #333;
1285 --pk-flickity-button-hover-background: white;
1286 --pk-flickity-button-focus-box-shadow: 0 0 0 5px #19F;
1287 --pk-flickity-button-active-opacity: 0.6;
1288 --pk-flickity-button-disabled-opacity: 0.3;
1289 --pk-flickity-button-icon-fill: #333;
1290 --pk-flickity-prev-next-border-radius: 50%;
1291 --pk-flickity-page-info-font-size: .75rem;
1292 --pk-flickity-page-info-line-height: 1;
1293 --pk-flickity-dot-width: 10px;
1294 --pk-flickity-dot-height: 10px;
1295 --pk-flickity-dot-margin: 0 3px;
1296 --pk-flickity-dot-background: #333;
1297 --pk-flickity-dot-border-radius: 50%;
1298 --pk-flickity-dot-opacity: 0.25;
1299 }
1300
1301 [pk-flickity="init"].flickity-enabled {
1302 position: relative;
1303 padding-bottom: 0;
1304 }
1305
1306 [pk-flickity="init"].flickity-enabled:focus {
1307 outline: none;
1308 }
1309
1310 [pk-flickity="init"].flickity-enabled.is-animate .flickity-viewport {
1311 transition: height 0.2s;
1312 }
1313
1314 [pk-flickity="init"].flickity-enabled.is-draggable {
1315 -webkit-tap-highlight-color: transparent;
1316 -webkit-user-select: none;
1317 -moz-user-select: none;
1318 -ms-user-select: none;
1319 user-select: none;
1320 }
1321
1322 [pk-flickity="init"].flickity-enabled.is-draggable .flickity-viewport {
1323 cursor: move;
1324 cursor: -webkit-grab;
1325 cursor: grab;
1326 }
1327
1328 [pk-flickity="init"].flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
1329 cursor: -webkit-grabbing;
1330 cursor: grabbing;
1331 }
1332
1333 [pk-flickity="init"] .flickity-viewport {
1334 overflow: hidden;
1335 position: relative;
1336 height: 100%;
1337 }
1338
1339 [pk-flickity="init"] .flickity-slider {
1340 position: absolute;
1341 width: 100%;
1342 height: 100%;
1343 }
1344
1345 [pk-flickity="init"] .flickity-button {
1346 position: absolute;
1347 background: var(--pk-flickity-button-background);
1348 border: none;
1349 color: var(--pk-flickity-button-color);
1350 }
1351
1352 [pk-flickity="init"] .flickity-button:hover {
1353 background: var(--pk-flickity-button-hover-background);
1354 cursor: pointer;
1355 }
1356
1357 [pk-flickity="init"] .flickity-button:focus {
1358 outline: none;
1359 box-shadow: var(--pk-flickity-button-focus-box-shadow);
1360 }
1361
1362 [pk-flickity="init"] .flickity-button:active {
1363 opacity: var(--pk-flickity-button-active-opacity);
1364 }
1365
1366 [pk-flickity="init"] .flickity-button:disabled {
1367 opacity: var(--pk-flickity-button-disabled-opacity);
1368 cursor: auto;
1369 /* prevent disabled button from capturing pointer up event. #716 */
1370 pointer-events: none;
1371 }
1372
1373 [pk-flickity="init"] .flickity-button-icon {
1374 fill: var(--pk-flickity-button-icon-fill);
1375 }
1376
1377 [pk-flickity="init"] .flickity-prev-next-button {
1378 top: 50%;
1379 width: 44px;
1380 height: 44px;
1381 border-radius: var(--pk-flickity-prev-next-border-radius);
1382 /* vertically center */
1383 margin-top: -22px;
1384 }
1385
1386 [pk-flickity="init"] .flickity-prev-next-button.previous {
1387 left: 1rem;
1388 }
1389
1390 [pk-flickity="init"] .flickity-prev-next-button.next {
1391 right: 1rem;
1392 }
1393
1394 [pk-flickity="init"] .flickity-rtl .flickity-prev-next-button.previous {
1395 left: auto;
1396 right: 10px;
1397 }
1398
1399 [pk-flickity="init"] .flickity-rtl .flickity-prev-next-button.next {
1400 right: auto;
1401 left: 10px;
1402 }
1403
1404 [pk-flickity="init"] .flickity-prev-next-button .flickity-button-icon {
1405 position: absolute;
1406 left: 30%;
1407 top: 30%;
1408 width: 40%;
1409 height: 40%;
1410 }
1411
1412 [pk-flickity="init"] [data-sg-page-info="true"],
1413 [pk-flickity="init"] [data-sg-page-dots="true"] {
1414 padding-bottom: 50px;
1415 }
1416
1417 [pk-flickity="init"] [data-sg-page-info="true"] .flickity-prev-next-button,
1418 [pk-flickity="init"] [data-sg-page-dots="true"] .flickity-prev-next-button {
1419 /* vertically center */
1420 margin-top: -52px;
1421 }
1422
1423 [pk-flickity="init"] .flickity-pages {
1424 position: relative;
1425 }
1426
1427 [pk-flickity="init"] .flickity-page-info {
1428 position: absolute;
1429 top: 50%;
1430 right: 0;
1431 transform: translateY(-50%);
1432 display: flex;
1433 align-items: center;
1434 font-size: var(--pk-flickity-page-info-font-size);
1435 line-height: var(--pk-flickity-page-info-line-height);
1436 }
1437
1438 [pk-flickity="init"] .flickity-page-info span:not(:last-child) {
1439 margin-right: .25rem;
1440 }
1441
1442 [pk-flickity="init"] .flickity-page-dots {
1443 padding: 1rem 3rem 0;
1444 list-style: none;
1445 text-align: center;
1446 list-style: none;
1447 text-align: center;
1448 line-height: 1;
1449 display: flex;
1450 justify-content: center;
1451 align-items: center;
1452 margin: 0;
1453 }
1454
1455 [pk-flickity="init"] .flickity-rtl .flickity-page-dots {
1456 direction: rtl;
1457 }
1458
1459 [pk-flickity="init"] .flickity-page-dots .dot {
1460 display: inline-block;
1461 width: var(--pk-flickity-dot-width);
1462 height: var(--pk-flickity-dot-height);
1463 margin: var(--pk-flickity-dot-margin);
1464 background: var(--pk-flickity-dot-background);
1465 border-radius: var(--pk-flickity-dot-border-radius);
1466 opacity: var(--pk-flickity-dot-opacity);
1467 cursor: pointer;
1468 }
1469
1470 [pk-flickity="init"] .flickity-page-dots .dot.is-selected {
1471 opacity: 1;
1472 }
1473