balmet.com

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs

flatpickr.css (21628B)


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