/**
 * Datepicker
 */

#ui-datepicker-div{
    z-index:99 !important;
}

.ui-datepicker-year
{
    border:none;
    border-radius:6px;
    -webkit-border-radius:6px;
    -moz-border-radius:6px;
}

.ui-widget-header .ui-icon, .ui-state-hover .ui-icon
{
    background-image:none;
    font-family:'Ionicons';
    line-height:40px;
    color:#59d2db;

}

.ui-widget-header a.ui-datepicker-next, .ui-widget-header a.ui-datepicker-prev
{
    text-align:center;
    color:#002954;
}
.ui-widget-header a.ui-datepicker-next span, .ui-widget-header a.ui-datepicker-prev span
{
    display:block;
}

.ui-widget-header a.ui-datepicker-next-hover, .ui-widget-header a.ui-datepicker-prev-hover
{
    color:#002954;
}

.ui-datepicker-next:before, .ui-datepicker-next.ui-state-hover:before
{
    font-family:'Ionicons';
    content: "\f125";
}

.ui-datepicker-prev:before, .ui-datepicker-prev.ui-state-hover:before
{
    font-family:'Ionicons';
    content: "\f124";
}



#ui-datepicker-div
{
    width:100%;
    max-width:500px;

    margin:1px 0 15px 0;
    padding:0;
    color:#000;
    background-color:#fff;
    border-radius:0;
    -webkit-border-radius:0;
    -moz-border-radius:0;
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    font-weight:normal;
    text-align:center;
    overflow:hidden;
    z-index:99999 !important;
}

@media screen and (max-width: 992px){

    #ui-datepicker-div
    {
        max-width:calc(100% - 60px);
    }

}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default
{
    font-weight:normal;
}


.ui-datepicker-header
{
    display:flex;
    width:100%;
    margin:0;
    padding:0;
    height:60px;
    justify-content: space-between;
    align-content: center;
    border:none;
    border-radius:0;
    -webkit-border-radius:0;
    -moz-border-radius:0;
    background-color:#fff;
    border-bottom:#ebebeb solid 1px;
    color:#002954;
    background-image:none;
    font-weight:bold;
}

.ui-datepicker-calendar
{
    background-color:#f8f8f8;
}

.ui-datepicker-next, .ui-datepicker-prev
{
    postion:relative;
    float:left;
    display:block;
    width:60px;
    height:60px;
    background-position:center center;
    text-align:center;
    text-decoration: none !important;
    font-size:2rem;
}

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next
{
    display:flex;
    position: unset !important;
    align-items: center;
    justify-content: center;
}

.ui-datepicker .ui-datepicker-prev {
    order: 1;
}
.ui-datepicker .ui-datepicker-title {
    order: 2;
    margin:0 !important;
    flex-grow: 1;
}
.ui-datepicker .ui-datepicker-next {
    order: 3;
}


.ui-widget-header .ui-state-hover
{
    background-image:none;
    background-color:transparent;
    border:none;
}

.ui-state-hover
{
    cursor:pointer;
}

.ui-datepicker-next .ui-icon, .ui-datepicker-prev .ui-icon
{
    margin:7px;
}


.ui-datepicker-next
{
    float:right;
}

.ui-datepicker-unselectable {
    background-color: #e2e7ea;
}

.ui-datepicker-title
{
    flex-grow:1;
    font-size:1.5rem;
}

select.ui-datepicker-month, select.ui-datepicker-year {
    background-color:#f8f8f8;
    border:#ccc solid 1px;
    border-radius:0px;
    padding:4px 18px;
    margin-right:3px;
}


.ui-datepicker-calendar
{
    position:relative;
    display:inline-block;
    width:100%;
    margin:0;
    padding:30px 0;
}

.ui-datepicker-calendar thead, .ui-datepicker-calendar tbody
{
    position:relative;
    display:inline-block;
    width:100%;
}

.ui-datepicker-calendar thead tr, .ui-datepicker-calendar tbody tr
{
    position:relative;
    display:inline-block;
    width:100%;
    padding:0;
}

.ui-datepicker-calendar thead tr th, .ui-datepicker-calendar tbody tr td
{
    position:relative;
    display:inline-block !important;
    width:12.5%;
    height:40px;
    margin:0;
    padding:0;
    color:#3c3c3b;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default
{
    background-image:none;
    background-color:#fff;
    color:#3c3c3b;
}

.ui-datepicker-calendar thead tr th span
{
    display:inline-block;
    width:100%;
    height:40px;
    line-height:40px;
    background-color:#B7E2F8;
    color:#3c3c3b;
    text-decoration:none;
    text-align:center;
    margin:0;
    padding:0;
}

.ui-datepicker-calendar tbody tr td a, .ui-datepicker-calendar tbody tr td.ui-state-disabled span
{
    display:inline-block;
    width:100%;
    height:40px;
    line-height:40px;
    border:#ccc solid 1px;
    border-top:none;
    background-color:#fff;
    color:#3c3c3b;
    text-decoration:none;
    text-align:center;
    margin:0;
    padding:0;
}

.ui-datepicker-calendar tbody tr td.ui-state-disabled span
{
    background-color: transparent;
    border:none;
}

.ui-widget a.ui-state-default
{
    border:none;
}

.ui-datepicker-calendar tbody tr td.ui-datepicker-today a
{
    background-color:#f8f3dd;
    border-color:#f8f3dd;
}

.ui-datepicker-calendar tbody tr td.ui-datepicker-current-day a
{
    background-color:#dcf0fa;
    border-color:#dcf0fa;
    color:#002954;
}

.ui-datepicker-calendar tbody tr td a.ui-state-hover
{
    background-color:#fcf9da;
    border-color:#fcf9da;
    color:#002954;
}