PluginProbe
StreamCast – bring live radio to your site with a sleek player / 2.2.5
StreamCast – bring live radio to your site with a sleek player v2.2.5
2.4.5 2.4.4 trunk 1.0 1.1 2.0.0 2.1.10 2.1.2 2.1.4 2.1.5 2.1.8 2.2.1 2.2.3 2.2.4 2.2.5 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 All 29 releases
streamcast / admin / codestar-framework / assets / scss / partials / _flatpickr.scss

_flatpickr.scss in StreamCast – bring live radio to your site with a sleek player 2.2.5, at admin/codestar-framework/assets/scss/partials/_flatpickr.scss

795 lines 19.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * Flatpickr
3 */
4 .flatpickr-calendar {
5 background: transparent;
6 opacity: 0;
7 display: none;
8 text-align: center;
9 visibility: hidden;
10 padding: 0;
11 -webkit-animation: none;
12 animation: none;
13 direction: ltr;
14 border: 0;
15 font-size: 14px;
16 line-height: 24px;
17 border-radius: 5px;
18 position: absolute;
19 width: 307.875px;
20 -webkit-box-sizing: border-box;
21 box-sizing: border-box;
22 -ms-touch-action: manipulation;
23 touch-action: manipulation;
24 background: #fff;
25 -webkit-box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
26 box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
27 }
28 .flatpickr-calendar.open,
29 .flatpickr-calendar.inline {
30 opacity: 1;
31 max-height: 640px;
32 visibility: visible;
33 }
34 .flatpickr-calendar.open {
35 display: inline-block;
36 z-index: 99999;
37 }
38 .flatpickr-calendar.animate.open {
39 -webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
40 animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
41 }
42 .flatpickr-calendar.inline {
43 display: block;
44 position: relative;
45 top: 2px;
46 }
47 .flatpickr-calendar.static {
48 position: absolute;
49 top: calc(100% + 2px);
50 }
51 .flatpickr-calendar.static.open {
52 z-index: 999;
53 display: block;
54 }
55 .flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) {
56 -webkit-box-shadow: none !important;
57 box-shadow: none !important;
58 }
59 .flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {
60 -webkit-box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
61 box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
62 }
63 .flatpickr-calendar .hasWeeks .dayContainer,
64 .flatpickr-calendar .hasTime .dayContainer {
65 border-bottom: 0;
66 border-bottom-right-radius: 0;
67 border-bottom-left-radius: 0;
68 }
69 .flatpickr-calendar .hasWeeks .dayContainer {
70 border-left: 0;
71 }
72 .flatpickr-calendar.hasTime .flatpickr-time {
73 height: 40px;
74 border-top: 1px solid #e6e6e6;
75 }
76 .flatpickr-calendar.noCalendar.hasTime .flatpickr-time {
77 height: auto;
78 }
79 .flatpickr-calendar:before,
80 .flatpickr-calendar:after {
81 position: absolute;
82 display: block;
83 pointer-events: none;
84 border: solid transparent;
85 content: '';
86 height: 0;
87 width: 0;
88 left: 22px;
89 }
90 .flatpickr-calendar.rightMost:before,
91 .flatpickr-calendar.arrowRight:before,
92 .flatpickr-calendar.rightMost:after,
93 .flatpickr-calendar.arrowRight:after {
94 left: auto;
95 right: 22px;
96 }
97 .flatpickr-calendar.arrowCenter:before,
98 .flatpickr-calendar.arrowCenter:after {
99 left: 50%;
100 right: 50%;
101 }
102 .flatpickr-calendar:before {
103 border-width: 5px;
104 margin: 0 -5px;
105 }
106 .flatpickr-calendar:after {
107 border-width: 4px;
108 margin: 0 -4px;
109 }
110 .flatpickr-calendar.arrowTop:before,
111 .flatpickr-calendar.arrowTop:after {
112 bottom: 100%;
113 }
114 .flatpickr-calendar.arrowTop:before {
115 border-bottom-color: #e6e6e6;
116 }
117 .flatpickr-calendar.arrowTop:after {
118 border-bottom-color: #fff;
119 }
120 .flatpickr-calendar.arrowBottom:before,
121 .flatpickr-calendar.arrowBottom:after {
122 top: 100%;
123 }
124 .flatpickr-calendar.arrowBottom:before {
125 border-top-color: #e6e6e6;
126 }
127 .flatpickr-calendar.arrowBottom:after {
128 border-top-color: #fff;
129 }
130 .flatpickr-calendar:focus {
131 outline: 0;
132 }
133 .flatpickr-wrapper {
134 position: relative;
135 display: inline-block;
136 }
137 .flatpickr-months {
138 display: -webkit-box;
139 display: -webkit-flex;
140 display: -ms-flexbox;
141 display: flex;
142 }
143 .flatpickr-months .flatpickr-month {
144 background: transparent;
145 color: rgba(0,0,0,0.9);
146 fill: rgba(0,0,0,0.9);
147 height: 34px;
148 line-height: 1;
149 text-align: center;
150 position: relative;
151 -webkit-user-select: none;
152 -moz-user-select: none;
153 -ms-user-select: none;
154 user-select: none;
155 overflow: hidden;
156 -webkit-box-flex: 1;
157 -webkit-flex: 1;
158 -ms-flex: 1;
159 flex: 1;
160 }
161 .flatpickr-months .flatpickr-prev-month,
162 .flatpickr-months .flatpickr-next-month {
163 text-decoration: none;
164 cursor: pointer;
165 position: absolute;
166 top: 0;
167 height: 34px;
168 padding: 10px;
169 z-index: 3;
170 color: rgba(0,0,0,0.9);
171 fill: rgba(0,0,0,0.9);
172 }
173 .flatpickr-months .flatpickr-prev-month.flatpickr-disabled,
174 .flatpickr-months .flatpickr-next-month.flatpickr-disabled {
175 display: none;
176 }
177 .flatpickr-months .flatpickr-prev-month i,
178 .flatpickr-months .flatpickr-next-month i {
179 position: relative;
180 }
181 .flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,
182 .flatpickr-months .flatpickr-next-month.flatpickr-prev-month {
183 /*
184 /*rtl:begin:ignore*/
185 /*
186 */
187 left: 0;
188 /*
189 /*rtl:end:ignore*/
190 /*
191 */
192 }
193 /*
194 /*rtl:begin:ignore*/
195 /*
196 /*rtl:end:ignore*/
197 .flatpickr-months .flatpickr-prev-month.flatpickr-next-month,
198 .flatpickr-months .flatpickr-next-month.flatpickr-next-month {
199 /*
200 /*rtl:begin:ignore*/
201 /*
202 */
203 right: 0;
204 /*
205 /*rtl:end:ignore*/
206 /*
207 */
208 }
209 /*
210 /*rtl:begin:ignore*/
211 /*
212 /*rtl:end:ignore*/
213 .flatpickr-months .flatpickr-prev-month:hover,
214 .flatpickr-months .flatpickr-next-month:hover {
215 color: #959ea9;
216 }
217 .flatpickr-months .flatpickr-prev-month:hover svg,
218 .flatpickr-months .flatpickr-next-month:hover svg {
219 fill: #f64747;
220 }
221 .flatpickr-months .flatpickr-prev-month svg,
222 .flatpickr-months .flatpickr-next-month svg {
223 width: 14px;
224 height: 14px;
225 }
226 .flatpickr-months .flatpickr-prev-month svg path,
227 .flatpickr-months .flatpickr-next-month svg path {
228 -webkit-transition: fill 0.1s;
229 transition: fill 0.1s;
230 fill: inherit;
231 }
232 .numInputWrapper {
233 position: relative;
234 height: auto;
235 }
236 .numInputWrapper input,
237 .numInputWrapper span {
238 display: inline-block;
239 }
240 .numInputWrapper input {
241 width: 100%;
242 }
243 .numInputWrapper input::-ms-clear {
244 display: none;
245 }
246 .numInputWrapper input::-webkit-outer-spin-button,
247 .numInputWrapper input::-webkit-inner-spin-button {
248 margin: 0;
249 -webkit-appearance: none;
250 }
251 .numInputWrapper span {
252 position: absolute;
253 right: 0;
254 width: 14px;
255 padding: 0 4px 0 2px;
256 height: 50%;
257 line-height: 50%;
258 opacity: 0;
259 cursor: pointer;
260 border: 1px solid rgba(57,57,57,0.15);
261 -webkit-box-sizing: border-box;
262 box-sizing: border-box;
263 }
264 .numInputWrapper span:hover {
265 background: rgba(0,0,0,0.1);
266 }
267 .numInputWrapper span:active {
268 background: rgba(0,0,0,0.2);
269 }
270 .numInputWrapper span:after {
271 display: block;
272 content: "";
273 position: absolute;
274 }
275 .numInputWrapper span.arrowUp {
276 top: 0;
277 border-bottom: 0;
278 }
279 .numInputWrapper span.arrowUp:after {
280 border-left: 4px solid transparent;
281 border-right: 4px solid transparent;
282 border-bottom: 4px solid rgba(57,57,57,0.6);
283 top: 26%;
284 }
285 .numInputWrapper span.arrowDown {
286 top: 50%;
287 }
288 .numInputWrapper span.arrowDown:after {
289 border-left: 4px solid transparent;
290 border-right: 4px solid transparent;
291 border-top: 4px solid rgba(57,57,57,0.6);
292 top: 40%;
293 }
294 .numInputWrapper span svg {
295 width: inherit;
296 height: auto;
297 }
298 .numInputWrapper span svg path {
299 fill: rgba(0,0,0,0.5);
300 }
301 .numInputWrapper:hover {
302 background: rgba(0,0,0,0.05);
303 }
304 .numInputWrapper:hover span {
305 opacity: 1;
306 }
307 .flatpickr-current-month {
308 font-size: 135%;
309 line-height: inherit;
310 font-weight: 300;
311 color: inherit;
312 position: absolute;
313 width: 75%;
314 left: 12.5%;
315 padding: 7.48px 0 0 0;
316 line-height: 1;
317 height: 34px;
318 display: inline-block;
319 text-align: center;
320 -webkit-transform: translate3d(0px, 0px, 0px);
321 transform: translate3d(0px, 0px, 0px);
322 }
323 .flatpickr-current-month span.cur-month {
324 font-family: inherit;
325 font-weight: 700;
326 color: inherit;
327 display: inline-block;
328 margin-left: 0.5ch;
329 padding: 0;
330 }
331 .flatpickr-current-month span.cur-month:hover {
332 background: rgba(0,0,0,0.05);
333 }
334 .flatpickr-current-month .numInputWrapper {
335 width: 6ch;
336 width: 7ch\0;
337 display: inline-block;
338 }
339 .flatpickr-current-month .numInputWrapper span.arrowUp:after {
340 border-bottom-color: rgba(0,0,0,0.9);
341 }
342 .flatpickr-current-month .numInputWrapper span.arrowDown:after {
343 border-top-color: rgba(0,0,0,0.9);
344 }
345 .flatpickr-current-month input.cur-year {
346 background: transparent;
347 -webkit-box-sizing: border-box;
348 box-sizing: border-box;
349 color: inherit;
350 cursor: text;
351 padding: 0 0 0 0.5ch;
352 margin: 0;
353 display: inline-block;
354 font-size: inherit;
355 font-family: inherit;
356 font-weight: 300;
357 line-height: inherit;
358 height: auto;
359 border: 0;
360 border-radius: 0;
361 vertical-align: initial;
362 -webkit-appearance: textfield;
363 -moz-appearance: textfield;
364 appearance: textfield;
365 }
366 .flatpickr-current-month input.cur-year:focus {
367 outline: 0;
368 }
369 .flatpickr-current-month input.cur-year[disabled]],
370 .flatpickr-current-month input.cur-year[disabled]]:hover {
371 font-size: 100%;
372 color: rgba(0,0,0,0.5);
373 background: transparent;
374 pointer-events: none;
375 }
376 .flatpickr-current-month .flatpickr-monthDropdown-months {
377 appearance: menulist;
378 background: transparent;
379 border: none;
380 border-radius: 0;
381 box-sizing: border-box;
382 color: inherit;
383 cursor: pointer;
384 font-size: inherit;
385 font-family: inherit;
386 font-weight: 300;
387 height: auto;
388 line-height: inherit;
389 margin: -1px 0 0 0;
390 outline: none;
391 padding: 0 0 0 0.5ch;
392 position: relative;
393 vertical-align: initial;
394 -webkit-box-sizing: border-box;
395 -webkit-appearance: menulist;
396 -moz-appearance: menulist;
397 width: auto;
398 }
399 .flatpickr-current-month .flatpickr-monthDropdown-months:focus,
400 .flatpickr-current-month .flatpickr-monthDropdown-months:active {
401 outline: none;
402 }
403 .flatpickr-current-month .flatpickr-monthDropdown-months:hover {
404 background: rgba(0,0,0,0.05);
405 }
406 .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
407 background-color: transparent;
408 outline: none;
409 padding: 0;
410 }
411 .flatpickr-weekdays {
412 background: transparent;
413 text-align: center;
414 overflow: hidden;
415 width: 100%;
416 display: -webkit-box;
417 display: -webkit-flex;
418 display: -ms-flexbox;
419 display: flex;
420 -webkit-box-align: center;
421 -webkit-align-items: center;
422 -ms-flex-align: center;
423 align-items: center;
424 height: 28px;
425 }
426 .flatpickr-weekdays .flatpickr-weekdaycontainer {
427 display: -webkit-box;
428 display: -webkit-flex;
429 display: -ms-flexbox;
430 display: flex;
431 -webkit-box-flex: 1;
432 -webkit-flex: 1;
433 -ms-flex: 1;
434 flex: 1;
435 }
436 span.flatpickr-weekday {
437 cursor: default;
438 font-size: 90%;
439 background: transparent;
440 color: rgba(0,0,0,0.54);
441 line-height: 1;
442 margin: 0;
443 text-align: center;
444 display: block;
445 -webkit-box-flex: 1;
446 -webkit-flex: 1;
447 -ms-flex: 1;
448 flex: 1;
449 font-weight: bolder;
450 }
451 .dayContainer,
452 .flatpickr-weeks {
453 padding: 1px 0 0 0;
454 }
455 .flatpickr-days {
456 position: relative;
457 overflow: hidden;
458 display: -webkit-box;
459 display: -webkit-flex;
460 display: -ms-flexbox;
461 display: flex;
462 -webkit-box-align: start;
463 -webkit-align-items: flex-start;
464 -ms-flex-align: start;
465 align-items: flex-start;
466 width: 307.875px;
467 }
468 .flatpickr-days:focus {
469 outline: 0;
470 }
471 .dayContainer {
472 padding: 0;
473 outline: 0;
474 text-align: left;
475 width: 307.875px;
476 min-width: 307.875px;
477 max-width: 307.875px;
478 -webkit-box-sizing: border-box;
479 box-sizing: border-box;
480 display: inline-block;
481 display: -ms-flexbox;
482 display: -webkit-box;
483 display: -webkit-flex;
484 display: flex;
485 -webkit-flex-wrap: wrap;
486 flex-wrap: wrap;
487 -ms-flex-wrap: wrap;
488 -ms-flex-pack: justify;
489 -webkit-justify-content: space-around;
490 justify-content: space-around;
491 -webkit-transform: translate3d(0px, 0px, 0px);
492 transform: translate3d(0px, 0px, 0px);
493 opacity: 1;
494 }
495 .dayContainer + .dayContainer {
496 -webkit-box-shadow: -1px 0 0 #e6e6e6;
497 box-shadow: -1px 0 0 #e6e6e6;
498 }
499 .flatpickr-day {
500 background: none;
501 border: 1px solid transparent;
502 border-radius: 150px;
503 -webkit-box-sizing: border-box;
504 box-sizing: border-box;
505 color: #393939;
506 cursor: pointer;
507 font-weight: 400;
508 width: 14.2857143%;
509 -webkit-flex-basis: 14.2857143%;
510 -ms-flex-preferred-size: 14.2857143%;
511 flex-basis: 14.2857143%;
512 max-width: 39px;
513 height: 39px;
514 line-height: 39px;
515 margin: 0;
516 display: inline-block;
517 position: relative;
518 -webkit-box-pack: center;
519 -webkit-justify-content: center;
520 -ms-flex-pack: center;
521 justify-content: center;
522 text-align: center;
523 }
524 .flatpickr-day.inRange,
525 .flatpickr-day.prevMonthDay.inRange,
526 .flatpickr-day.nextMonthDay.inRange,
527 .flatpickr-day.today.inRange,
528 .flatpickr-day.prevMonthDay.today.inRange,
529 .flatpickr-day.nextMonthDay.today.inRange,
530 .flatpickr-day:hover,
531 .flatpickr-day.prevMonthDay:hover,
532 .flatpickr-day.nextMonthDay:hover,
533 .flatpickr-day:focus,
534 .flatpickr-day.prevMonthDay:focus,
535 .flatpickr-day.nextMonthDay:focus {
536 cursor: pointer;
537 outline: 0;
538 background: #e6e6e6;
539 border-color: #e6e6e6;
540 }
541 .flatpickr-day.today {
542 border-color: #959ea9;
543 }
544 .flatpickr-day.today:hover,
545 .flatpickr-day.today:focus {
546 border-color: #959ea9;
547 background: #959ea9;
548 color: #fff;
549 }
550 .flatpickr-day.selected,
551 .flatpickr-day.startRange,
552 .flatpickr-day.endRange,
553 .flatpickr-day.selected.inRange,
554 .flatpickr-day.startRange.inRange,
555 .flatpickr-day.endRange.inRange,
556 .flatpickr-day.selected:focus,
557 .flatpickr-day.startRange:focus,
558 .flatpickr-day.endRange:focus,
559 .flatpickr-day.selected:hover,
560 .flatpickr-day.startRange:hover,
561 .flatpickr-day.endRange:hover,
562 .flatpickr-day.selected.prevMonthDay,
563 .flatpickr-day.startRange.prevMonthDay,
564 .flatpickr-day.endRange.prevMonthDay,
565 .flatpickr-day.selected.nextMonthDay,
566 .flatpickr-day.startRange.nextMonthDay,
567 .flatpickr-day.endRange.nextMonthDay {
568 background: #569ff7;
569 -webkit-box-shadow: none;
570 box-shadow: none;
571 color: #fff;
572 border-color: #569ff7;
573 }
574 .flatpickr-day.selected.startRange,
575 .flatpickr-day.startRange.startRange,
576 .flatpickr-day.endRange.startRange {
577 border-radius: 50px 0 0 50px;
578 }
579 .flatpickr-day.selected.endRange,
580 .flatpickr-day.startRange.endRange,
581 .flatpickr-day.endRange.endRange {
582 border-radius: 0 50px 50px 0;
583 }
584 .flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),
585 .flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),
586 .flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
587 -webkit-box-shadow: -10px 0 0 #569ff7;
588 box-shadow: -10px 0 0 #569ff7;
589 }
590 .flatpickr-day.selected.startRange.endRange,
591 .flatpickr-day.startRange.startRange.endRange,
592 .flatpickr-day.endRange.startRange.endRange {
593 border-radius: 50px;
594 }
595 .flatpickr-day.inRange {
596 border-radius: 0;
597 -webkit-box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
598 box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
599 }
600 .flatpickr-day.flatpickr-disabled,
601 .flatpickr-day.flatpickr-disabled:hover,
602 .flatpickr-day.prevMonthDay,
603 .flatpickr-day.nextMonthDay,
604 .flatpickr-day.notAllowed,
605 .flatpickr-day.notAllowed.prevMonthDay,
606 .flatpickr-day.notAllowed.nextMonthDay {
607 color: rgba(57,57,57,0.3);
608 background: transparent;
609 border-color: transparent;
610 cursor: default;
611 }
612 .flatpickr-day.flatpickr-disabled,
613 .flatpickr-day.flatpickr-disabled:hover {
614 cursor: not-allowed;
615 color: rgba(57,57,57,0.1);
616 }
617 .flatpickr-day.week.selected {
618 border-radius: 0;
619 -webkit-box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
620 box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
621 }
622 .flatpickr-day.hidden {
623 visibility: hidden;
624 }
625 .rangeMode .flatpickr-day {
626 margin-top: 1px;
627 }
628 .flatpickr-weekwrapper {
629 float: left;
630 }
631 .flatpickr-weekwrapper .flatpickr-weeks {
632 padding: 0 12px;
633 -webkit-box-shadow: 1px 0 0 #e6e6e6;
634 box-shadow: 1px 0 0 #e6e6e6;
635 }
636 .flatpickr-weekwrapper .flatpickr-weekday {
637 float: none;
638 width: 100%;
639 line-height: 28px;
640 }
641 .flatpickr-weekwrapper span.flatpickr-day,
642 .flatpickr-weekwrapper span.flatpickr-day:hover {
643 display: block;
644 width: 100%;
645 max-width: none;
646 color: rgba(57,57,57,0.3);
647 background: transparent;
648 cursor: default;
649 border: none;
650 }
651 .flatpickr-innerContainer {
652 display: block;
653 display: -webkit-box;
654 display: -webkit-flex;
655 display: -ms-flexbox;
656 display: flex;
657 -webkit-box-sizing: border-box;
658 box-sizing: border-box;
659 overflow: hidden;
660 }
661 .flatpickr-rContainer {
662 display: inline-block;
663 padding: 0;
664 -webkit-box-sizing: border-box;
665 box-sizing: border-box;
666 }
667 .flatpickr-time {
668 text-align: center;
669 outline: 0;
670 display: block;
671 height: 0;
672 line-height: 40px;
673 max-height: 40px;
674 -webkit-box-sizing: border-box;
675 box-sizing: border-box;
676 overflow: hidden;
677 display: -webkit-box;
678 display: -webkit-flex;
679 display: -ms-flexbox;
680 display: flex;
681 }
682 .flatpickr-time:after {
683 content: "";
684 display: table;
685 clear: both;
686 }
687 .flatpickr-time .numInputWrapper {
688 -webkit-box-flex: 1;
689 -webkit-flex: 1;
690 -ms-flex: 1;
691 flex: 1;
692 width: 40%;
693 height: 40px;
694 float: left;
695 }
696 .flatpickr-time .numInputWrapper span.arrowUp:after {
697 border-bottom-color: #393939;
698 }
699 .flatpickr-time .numInputWrapper span.arrowDown:after {
700 border-top-color: #393939;
701 }
702 .flatpickr-time.hasSeconds .numInputWrapper {
703 width: 26%;
704 }
705 .flatpickr-time.time24hr .numInputWrapper {
706 width: 49%;
707 }
708 .flatpickr-time input {
709 background: transparent;
710 -webkit-box-shadow: none;
711 box-shadow: none;
712 border: 0;
713 border-radius: 0;
714 text-align: center;
715 margin: 0;
716 padding: 0;
717 height: inherit;
718 line-height: inherit;
719 color: #393939;
720 font-size: 14px;
721 position: relative;
722 -webkit-box-sizing: border-box;
723 box-sizing: border-box;
724 -webkit-appearance: textfield;
725 -moz-appearance: textfield;
726 appearance: textfield;
727 }
728 .flatpickr-time input.flatpickr-hour {
729 font-weight: bold;
730 }
731 .flatpickr-time input.flatpickr-minute,
732 .flatpickr-time input.flatpickr-second {
733 font-weight: 400;
734 }
735 .flatpickr-time input:focus {
736 outline: 0;
737 border: 0;
738 }
739 .flatpickr-time .flatpickr-time-separator,
740 .flatpickr-time .flatpickr-am-pm {
741 height: inherit;
742 float: left;
743 line-height: inherit;
744 color: #393939;
745 font-weight: bold;
746 width: 2%;
747 -webkit-user-select: none;
748 -moz-user-select: none;
749 -ms-user-select: none;
750 user-select: none;
751 -webkit-align-self: center;
752 -ms-flex-item-align: center;
753 align-self: center;
754 }
755 .flatpickr-time .flatpickr-am-pm {
756 outline: 0;
757 width: 18%;
758 cursor: pointer;
759 text-align: center;
760 font-weight: 400;
761 }
762 .flatpickr-time input:hover,
763 .flatpickr-time .flatpickr-am-pm:hover,
764 .flatpickr-time input:focus,
765 .flatpickr-time .flatpickr-am-pm:focus {
766 background: #eee;
767 }
768 .flatpickr-input[readonly]] {
769 cursor: pointer;
770 }
771 @-webkit-keyframes fpFadeInDown {
772 from {
773 opacity: 0;
774 -webkit-transform: translate3d(0, -20px, 0);
775 transform: translate3d(0, -20px, 0);
776 }
777 to {
778 opacity: 1;
779 -webkit-transform: translate3d(0, 0, 0);
780 transform: translate3d(0, 0, 0);
781 }
782 }
783 @keyframes fpFadeInDown {
784 from {
785 opacity: 0;
786 -webkit-transform: translate3d(0, -20px, 0);
787 transform: translate3d(0, -20px, 0);
788 }
789 to {
790 opacity: 1;
791 -webkit-transform: translate3d(0, 0, 0);
792 transform: translate3d(0, 0, 0);
793 }
794 }
795