@font-face {
    font-family: "zezo-icons";
    src: url(/font/zezo-icons.eot?v=16);
    src: url(/font/zezo-icons.eot?#iefix) format("embedded-opentype"),
    url(/font/zezo-icons.woff?v=16) format("woff"),
    url(/font/zezo-icons.ttf?v=16) format("truetype"),
    url(/font/zezo-icons.svg#zezo-icons) format("svg");
    font-weight: 400;
    font-style: normal
}

[data-icon]:before {
    font-family: "zezo-icons" !important;
    content: attr(data-icon);
    font-style: normal !important;
    font-weight: 400 !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

[class^="zezo-icon-"]:before, [class*=" zezo-icon-"]:before {
    font-family: "zezo-icons" !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.zezo-icon-trash:before {
    content: "\e000";
}

.zezo-icon-ok:before {
    content: "\e001"
}

.zezo-icon-edit:before {
    content: "\e002"
}

.zezo-icon-up:before {
    content: "\e003"
}

.zezo-icon-down:before {
    content: "\e004"
}

.zezo-icon-material-down:before {
    content: "\e006"
}

.zezo-icon-material-right:before {
    content: "\e007"
}

.zezo-icon-material-left:before {
    content: "\e008"
}

.zezo-icon-plus:before {
    content: "\e009"
}

.zezo-icon-minus:before {
    content: "\e00a"
}

.zezo-icon-cancel:before {
    content: "\e00d"
}

.zezo-icon-info:before {
    content: "\e00e"
}

.zezo-icon-save:before {
    content: "\e00c"
}

.zezo-icon-update:before {
    content: "\e00f"
}

.zezo-icon-bck:before {
    content: "\e010"
}

.zezo-icon-print:before {
    content: "\e005"
}

.zezo-icon-book:before {
    content: "\e013"
}

.zezo-icon-text:before {
    content: "\e014"
}
.zezo-icon-home:before {
    content: "\e011";
}
.zezo-icon-back:before {
    content: "\e012";
}
.zezo-icon-users:before {
    content: "\e016";
}
.zezo-icon-settings:before {
    content: "\e015";
}
.zezo-icon-sign-out:before {
    content: "\e017";
}
.zezo-icon-sign-in:before {
    content: "\e018";
}
.zezo-icon-bell:before {
    content: "\e01a";
}
.zezo-icon-search:before {
    content: "\e01d";
}
.zezo-icon-bars:before {
    content: "\e01b";
}
.zezo-icon-contrast:before {
    content: "\e00b";
}
body {
    display: flex;
    min-height: 100vh;
    flex-direction: column
}

main {
    flex: 1 0 auto
}

.horizontal-label {
    font-size: 1.1rem;
    line-height: 2.5rem;
    color: #656464;
    height: 2.5rem
}

.left-align {
    text-align: left
}

i[class^="zezo-icon"] {
    font-size: 18px
}

i.zezo-icon-med {
    font-size: 24px
}

i.zezo-icon-lg {
    font-size: 40px
}

i.zezo-icon-xlg {
    font-size: 60px
}

.picker {font-size: 16px;text-align: left;line-height: 1.2;color: #000;position: absolute;z-index: 10000;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none}
.picker__input {cursor: default}
.picker__input.picker__input--active {border-color: #0089ec}
.picker__holder {width: 100%;overflow-y: auto;-webkit-overflow-scrolling: touch}
.picker__holder, .picker__frame {bottom: 0;left: 0;right: 0;top: 100%}
.picker__holder {position: fixed;transition: background .15s ease-out, top 0.15s;-webkit-backface-visibility: hidden}
.picker__frame {position: absolute;margin: 0 auto;min-width: 256px;width: 300px;max-height: 350px;-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);filter: alpha(opacity=0);-moz-opacity: 0;opacity: 0;transition: all .15s ease-out}
@media (min-height: 28.875em) {
    .picker__frame {overflow: visible;top: auto;bottom: -100%;max-height: 80%}
}
@media (min-height: 40.125em) {
    .picker__frame {margin-bottom: 7.5%}
}
.picker__wrap {display: table;width: 100%;height: 100%}
@media (min-height: 28.875em) {
    .picker__wrap {display: block}
}
.picker__box {background: #fff;display: table-cell;vertical-align: middle}
@media (min-height: 28.875em) {
    .picker__box {display: block;border: 1px solid #777;border-top-color: #898989;border-bottom-width: 0;border-radius: 5px 5px 0 0;box-shadow: 0 12px 36px 16px rgba(0, 0, 0, 0.24)}
}
.picker--opened .picker__holder {top: 0;background: transparent;-ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#1E000000, endColorstr=#1E000000);zoom: 1;background: rgba(0, 0, 0, 0.32);transition: background .15s ease-out}
.picker--opened .picker__frame {top: 0;-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);filter: alpha(opacity=100);-moz-opacity: 1;opacity: 1}
@media (min-height: 35.875em) {
    .picker--opened .picker__frame {top: 10%;bottom: auto}
}
.picker__input.picker__input--active {border-color: #E3F2FD}
.picker__frame {margin: 0 auto;max-width: 325px}
@media (min-height: 38.875em) {
    .picker--opened .picker__frame {top: 10%;bottom: auto}
}
.picker__box {padding: 0 1em}
.picker__header {text-align: center;position: relative;margin-top: .75em}
.picker__month, .picker__year {display: inline-block;margin-left: .25em;margin-right: .25em}
.picker__select--month, .picker__select--year {height: 2em;padding: 0;margin-left: .25em;margin-right: .25em}
.picker__select--month.browser-default {display: inline;background-color: #FFF;width: 40%}
.picker__select--year.browser-default {display: inline;background-color: #FFF;width: 26%}
.picker__select--month:focus, .picker__select--year:focus {border-color: rgba(0, 0, 0, 0.05)}
.picker__nav--prev, .picker__nav--next {position: absolute;padding: .5em 1.25em;width: 1em;height: 1em;box-sizing: content-box;top: -.25em}
.picker__nav--prev {left: -1em;padding-right: 1.25em}
.picker__nav--next {right: -1em;padding-left: 1.25em}
.picker__nav--disabled, .picker__nav--disabled:hover, .picker__nav--disabled:before, .picker__nav--disabled:before:hover {cursor: default;background: none;border-right-color: #f5f5f5;border-left-color: #f5f5f5}
.picker__table {text-align: center;border-collapse: collapse;border-spacing: 0;table-layout: fixed;font-size: 1rem;width: 100%;margin-top: .75em;margin-bottom: .5em}
.picker__table th, .picker__table td {text-align: center}
.picker__table td {margin: 0;padding: 0}
.picker__weekday {width: 14.285714286%;font-size: .75em;padding-bottom: .25em;color: #999;font-weight: 500}
@media (min-height: 33.875em) {
    .picker__weekday {padding-bottom: .5em}
}
.picker__day--today {position: relative;color: #595959;letter-spacing: -.3px;padding: .75rem 0;font-weight: 400;border: 1px solid transparent}
.picker__day--disabled:before {border-top-color: #aaa}
.picker__day--infocus:hover {cursor: pointer;color: #000;font-weight: 500}
.picker__day--outfocus {display: none;padding: .75rem 0;color: #fff}
.picker__day--outfocus:hover {cursor: pointer;color: #ddd;font-weight: 500}
.picker__day--highlighted:hover, .picker--focused .picker__day--highlighted {cursor: pointer}
.picker__day--selected, .picker__day--selected:hover, .picker--focused .picker__day--selected {border-radius: 50%;-webkit-transform: scale(0.75);transform: scale(0.75);background: #0089ec;color: #fff}
.picker__day--disabled, .picker__day--disabled:hover, .picker--focused .picker__day--disabled {background: #f5f5f5;border-color: #f5f5f5;color: #ddd;cursor: default}
.picker__day--highlighted.picker__day--disabled, .picker__day--highlighted.picker__day--disabled:hover {background: #bbb}
.picker__footer {text-align: center;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-align-items: center;-ms-flex-align: center;align-items: center;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between}
.picker__button--today, .picker__button--clear, .picker__button--close {border: 1px solid #fff;background: #fff;font-size: .8em;padding: .66em 0;font-weight: 700;width: 33%;display: inline-block;vertical-align: bottom}
.picker__button--today:hover, .picker__button--clear:hover, .picker__button--close:hover {cursor: pointer;color: #000;background: #b1dcfb;border-bottom-color: #b1dcfb}
.picker__button--today:focus, .picker__button--clear:focus, .picker__button--close:focus {background: #b1dcfb;border-color: rgba(0, 0, 0, 0.05);outline: none}
.picker__button--today:before, .picker__button--clear:before, .picker__button--close:before {position: relative;display: inline-block;height: 0}
.picker__button--today:before, .picker__button--clear:before {content: " ";margin-right: .45em}
.picker__button--today:before {top: -.05em;width: 0;border-top: .66em solid #0059bc;border-left: .66em solid transparent}
.picker__button--clear:before {top: -.25em;width: .66em;border-top: 3px solid #e20}
.picker__button--close:before {content: "\D7";top: -.1em;vertical-align: top;font-size: 1.1em;margin-right: .35em;color: #777}
.picker__button--today[disabled], .picker__button--today[disabled]:hover {background: #f5f5f5;border-color: #f5f5f5;color: #ddd;cursor: default}
.picker__button--today[disabled]:before {border-top-color: #aaa}
.picker__box {border-radius: 2px;overflow: hidden}
.picker__date-display {
    text-align: center;background-color: #26a69a;color: #fff;padding-bottom: 15px;font-weight: 400;
    @apply dark:bg-gray-600;
}
.picker__nav--prev:hover, .picker__nav--next:hover {cursor: pointer;color: #000;background: #a1ded8}
.picker__weekday-display {background-color: #1f897f;padding: 10px;font-weight: 200;letter-spacing: .5px;font-size: 1rem;margin-bottom: 15px}
.picker__month-display {text-transform: uppercase;font-size: 2rem}
.picker__day-display {font-size: 4.5rem;font-weight: 400}
.picker__year-display {font-size: 1.8rem;color: rgba(255, 255, 255, 0.4)}
.picker__box {padding: 0}
.picker__calendar-container {padding: 0 1rem}
.picker__calendar-container thead {border: none}
.picker__table {margin-top: 0;margin-bottom: .5em}
.picker__day--infocus {color: #595959;letter-spacing: -.3px;padding: .75rem 0;font-weight: 400;border: 1px solid transparent}
.picker__day.picker__day--today {color: #26a69a}
.picker__day.picker__day--today.picker__day--selected {color: #fff}
.picker__weekday {font-size: .9rem}
.picker__day--selected, .picker__day--selected:hover, .picker--focused .picker__day--selected {border-radius: 50%;-webkit-transform: scale(0.9);transform: scale(0.9);background-color: #26a69a;color: #fff}
.picker__day--selected.picker__day--outfocus, .picker__day--selected:hover.picker__day--outfocus, .picker--focused .picker__day--selected.picker__day--outfocus {background-color: #a1ded8}
.picker__footer {text-align: right;padding: 5px 10px}
.picker__close, .picker__today {font-size: 1.1rem;padding: 0 1rem;color: #26a69a}
.picker__nav--prev:before, .picker__nav--next:before {content: " ";border-top: .5em solid transparent;border-bottom: .5em solid transparent;border-right: .75em solid #676767;width: 0;height: 0;display: block;margin: 0 auto}
.picker__nav--next:before {border-right: 0;border-left: .75em solid #676767}
button.picker__today:focus, button.picker__clear:focus, button.picker__close:focus {background-color: #a1ded8}
.picker__list {list-style: none;padding: .75em 0 4.2em;margin: 0}
.picker__list-item {border-bottom: 1px solid #ddd;border-top: 1px solid #ddd;margin-bottom: -1px;position: relative;background: #fff;padding: .75em 1.25em}
@media (min-height: 46.75em) {
    .picker__list-item {padding: .5em 1em}
}
.picker__list-item:hover {cursor: pointer;color: #000;background: #b1dcfb;border-color: #0089ec;z-index: 10}
.picker__list-item--highlighted {border-color: #0089ec;z-index: 10}
.picker__list-item--highlighted:hover, .picker--focused .picker__list-item--highlighted {cursor: pointer;color: #000;background: #b1dcfb}
.picker__list-item--selected, .picker__list-item--selected:hover, .picker--focused .picker__list-item--selected {background: #0089ec;color: #fff;z-index: 10}
.picker__list-item--disabled, .picker__list-item--disabled:hover, .picker--focused .picker__list-item--disabled {background: #f5f5f5;border-color: #f5f5f5;color: #ddd;cursor: default;border-color: #ddd;z-index: auto}
.picker--time .picker__button--clear {display: block;width: 80%;margin: 1em auto 0;padding: 1em 1.25em;background: none;border: 0;font-weight: 500;font-size: .67em;text-align: center;text-transform: uppercase;color: #666}
.picker--time .picker__button--clear:hover, .picker--time .picker__button--clear:focus {color: #000;background: #b1dcfb;background: #e20;border-color: #e20;cursor: pointer;color: #fff;outline: none}
.picker--time .picker__button--clear:before {top: -.25em;color: #666;font-size: 1.25em;font-weight: 700}
.picker--time .picker__button--clear:hover:before, .picker--time .picker__button--clear:focus:before {color: #fff}
.picker--time .picker__frame {min-width: 256px;max-width: 320px}
.picker--time .picker__box {font-size: 1em;background: #f2f2f2;padding: 0}
@media (min-height: 40.125em) {
    .picker--time .picker__box {margin-bottom: 5em}
}

.zezodate::selection {
    background-color: rgba(255, 255, 255, 0)
}

.zezodate div::selection, .zezodate span::selection, .zezodate a::selection {
    background-color: rgba(255, 255, 255, 0)
}

.zezodate span {
    border: 1px solid rgba(213, 213, 213, 0);
    display: block;
    float: right;
    text-align: center;
    color: #353535
}

.zezodate input[type=text] {
    float: none;
    width: 53px;
    text-align: left;
    height: 15px !important;
    line-height: 16px !important;
    padding: 0;
    font: inherit;
    left: 39px;
    position: absolute;
    padding-left: 5px;
    top: 4px;
    border: 0;
    border-bottom: 1px solid #b8b8b8;
    color: #6b6b6b
}

.zezodate .m {
    width: 20px;
    height: 20px
}

.zezodate .z_head {
    background-color: #26a69a;
    padding: 15px;
}

.zezodate .z_m_d {
    width: 100%;
    height: 178px;
    float: right;
    padding: 0;
    margin: 0;
    overflow: hidden
}

.zezodate .z_months {
    width: 57px;
    height: 100%;
    border-right: 1px solid #EEE;
    overflow: hidden;
    padding: 1px
}

.zezodate .z_days {
    padding: 10px;
}

.zezodate .z_day_no {
    margin: 0 auto
}

.zezodate .m {
    line-height: 27px
}

.zezodate input[type=number] {
    height: 20px;
    padding: 3px;
    float: none
}

.zezodate .z_ok:hover, .zezodate .z_cancel:hover, .zezodate .z_clear:hover, .zezodate .today_date:hover {
    -ms-filter: "alpha(opacity=80)";
    filter: alpha(opacity=100);
    opacity: 1
}

.zezodate .z_ok {
    top: 3px;
    right: 3px
}

.zezodate .z_cancel {
    top: 2px;
    right: 27px;
}

.zezodate .z_clear {
    bottom: 3px;
    left: 3px
}

.zezodate .previous_year {
    top: 0;
    left: 79px;
}

.zezodate .next_year {
    top: 0;
    left: 69px;
}

.zezodate .weekend {
    color: #B3B3B3
}

.zezodate .today_date {
    padding: 0;
    margin: 0;
    top: 3px;
    left: 3px
}

.top_icon {
    width: 20px;
    height: 20px;
    z-index: 6;
    -ms-filter: "alpha(opacity=70)";
    filter: alpha(opacity=20);
    cursor: pointer;
    position: absolute
}

.top_icon .material-icons {
    font-size: 32px;
}

.zezodate #z_previous {
    right: 10px;
    top: 53px;
}

.zezodate #z_next {
    left: 20px;
    top: 53px;
}

.zezodate #z_previous:hover, .zezodate #z_next:hover {
    -ms-filter: "alpha(opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1
}

.zezodate .z_ok, .zezodate .z_cancel, .zezodate .z_clear, .zezodate .next_year, .zezodate .previous_year, .zezodate .today_date {
    position: absolute;
    z-index: 6;
    -ms-filter: "alpha(opacity=50)";
    filter: alpha(opacity=40);
    opacity: .4;
    cursor: pointer;
    border: 0
}

.zezodate .next_year, .zezodate .previous_year {
    width: 20px;
    height: 20px;
    -webkit-background-size: 15px;
    -moz-background-size: 15px;
    background-size: 15px
}

.zezodate .z_ok, .zezodate .z_cancel, .zezodate .z_clear, .zezodate .today_date {
    font-size: 10px
}

.zezodate .next_year, .zezodate .previous_year {
    -ms-filter: "alpha(opacity=75)";
    filter: alpha(opacity=40);
    opacity: .4
}

.zezodate .next_year:hover, .zezodate .previous_year:hover {
    -ms-filter: "alpha(opacity=100)";
    filter: alpha(opacity=60);
    opacity: .6
}

.zezodate .d:hover, .zezodate .m:hover {
    cursor: pointer;
    border: 1px solid #06676d
}

.zezodate .today {
    color: #26a69a;
}

.zezodate .hidden_day {
    visibility: hidden
}

.zezodate .c_day_name {
    width: 25px;
    margin: 2px 7px;
    font-family: 'Droid Arabic Kufi', serif;
    color: #ccc;
    float: right;
}

.picker__weekday-display {
    font-family: 'droid_kufi', serif;
}

.picker__footer {
    padding: 0 5px 10px 5px;
}

.picker--focused .picker__day--selected, .picker__day--selected, .picker__day--selected:hover {
    line-height: 14px;
}

.picker__day-display {
    font-size: 4rem;
    font-weight: 200;
    padding-top: 10px;
    overflow: hidden;
}

.picker__month-display {
    font-family: 'droid_kufi', serif;
    font-size: 24px;
}

.picker__year-display, .picker__month-display {
    cursor: pointer;
}

.picker__year-display {
    letter-spacing: 4px;
    font-family: sans-serif !important;
    color: rgba(255, 255, 255, 0.7);
}

.zezodate .picker__year-display a:hover {
}

.zezodate .clear_fix {
    clear: both;
    height: 15px
}

.month_slider {
    position: absolute;
    top: 90px;
    left: 10px;
    width: 280px;
    background-color: #fafafa;
    overflow: hidden;
    border-radius: 2px;
    z-index: 8;
    box-shadow: 0 5px 10px 5px rgba(0, 0, 0, 0.14);
}

.choose_m {
    padding: 10px 1px;
    border: 1px solid rgba(204, 204, 204, 0);
    margin: 1px;
    font-family: 'GESSTwoLight-Light', serif;
    color: #595959;
}

.choose_m.today, .choose_y.today {
    color: #26A69A;
}

.choose_m.picker__day--selected, .choose_y.picker__day--selected {
    border-radius: 2px;
    color: #FFF;
}

.zezodate .right_months {
    float: right;
    width: 49%;
    text-align: center;
    background-color: #FFF;
    height: 100%
}

.zezodate .left_months {
    float: left;
    width: 49%;
    text-align: center;
    height: 100%;
    background-color: #FFF
}

.choose_m:hover, .choose_y:hover {
    cursor: pointer;
    color: #047c72;
    border: 1px solid #047c72
}

.year_slider {
    position: absolute;
    top: 200px;
    left: 10px;
    width: 280px;
    background-color: #FFF;
    overflow: hidden;
    -webkit-box-shadow: 0 1px 1px;
    border-radius: 2px;
    z-index: 9;
    padding: 5px 1px;
    box-shadow: 0 5px 10px 5px rgba(0, 0, 0, 0.14);
}

.right_years, .middle_years, .left_years {
    width: 92px;
    text-align: center;
    height: 100%;
    float: right;
}

.choose_y {
    padding: 1px 0;
    margin: 1px 1px;
    border: 1px solid rgba(255, 255, 255, 0);
    letter-spacing: 3px;
    font-family: sans-serif !important;
    color: #595959;
}

.picker__day--disabled.picker__day--selected {
    border-radius: 0;
    background-color: #EF5350;
}

.picker__day--weekend {
    color: #ccc;
}

.picker__year-display img {
    height: 20px;
    width: 20px;
}

.top_icon img {
    width: 20px;
    height: 20px;
}

.picker__day--infocus {
    padding: 0.65rem 0;
}

/*input[zezodate="true"]:read-only{*/
/*    color: #636363;*/
/*    border-bottom: 1px solid #607d8b;*/
/*}*/

/*input[zezodate="true"]:read-only + label{*/
/*    color: #636363;*/
/*}*/

.zezodate i[class^="zezo-icon"] {
    font-size: 34px;
    display: -webkit-inline-box;
    line-height: 6px;
    color:rgba(255, 255, 255, 0.6)
}

.zezodate i[class^="zezo-icon"]:hover {
    color:rgb(255, 255, 255)
}
/*.picker__weekday-display {@apply dark:bg-primary-700}*/
.picker__date-display,.month_slider,.year_slider {@apply dark:bg-gray-700}
.picker__box{@apply dark:bg-gray-600}
.choose_m,.choose_y,.picker__day--infocus,.picker{@apply dark:text-gray-100}
/*.picker--focused .picker__day--selected, .picker__day--selected, .picker__day--selected:hover{@apply dark:bg-primary-600}*/
.picker__weekday,.picker__day--weekend{@apply dark:text-gray-400}
/*.zezodate .d:hover, .zezodate .m:hover{@apply dark:border-primary-400 dark:rounded}*/