div.datetime-container,
div.datetime-container * {
    box-sizing: border-box;
    font-family: arial, sans-serif
}

.fix-float:after {
    clear: both;
    content: "";
    display: table
}

div.datetime-container {
    background-color: #f4f4f4;
    border-radius: 5px 5px 0 0;
    margin: 5px 0;
    position: relative;
    text-align: center;
    user-select: none
}

div.datetime-container button.date,
div.datetime-container button.time {
    appearance: none;
    -webkit-appearance: none;
    background-color: #f4f4f4;
    border: 0;
    border-radius: 5px 5px 0 0;
    cursor: pointer;
    outline: 0;
    padding: 0;
    text-transform: uppercase;
    width: 100%
}

div.datetime-container button.w-50 {
    float: left;
    width: 50%
}

div.datetime-container button.active {
    background-color: #f68417;
    color: #000
}

div.datetime-container button>span {
    display: inline-block;
    margin: 0 -2px
}

div.datetime-container button span.week-day {
    font-size: 14px;
    text-align: right
}

div.datetime-container button span.hours,
div.datetime-container button span.month-day {
    font-size: 36px;
    text-align: center;
    width: 45px
}

div.datetime-container button span.month-year {
    font-size: 16px;
    text-align: left
}

div.datetime-container span.month-year span {
    font-size: 14px;
    font-weight: 700;
    position: relative;
    top: 2px
}

div.datetime-container button span.minutes {
    font-size: 18px
}

div.picker {
    background-color: #fff;
    border-radius: 0 0 5px 5px;
    box-shadow: 0 1px 10px #555;
    display: none;
    padding: 0 5px 10px;
    position: absolute;
    width:285%;
    z-index: 2
}

div.picker table {
    border-collapse: collapse;
    color: #000;
    margin: 0 auto;
    width: 100%
}

div.picker table a {
    color: #000;
    display: inline-block;
    height: 20px;
    line-height: 20px;
    text-decoration: none;
    width: 20px
}

div.picker table th {
    font-size: 20px;
    font-weight: 400
}

div.picker table th span.month {
    font-weight: 700
}

div.picker table td,
div.picker table th {
    border-bottom: 1px solid #ddd;
    padding: 10px 2px;
    text-align: center;
    vertical-align: middle;
    width: 14.285%
}

div.picker table td.day-label {
    font-size: 14px;
    text-transform: uppercase
}

div.picker table td.selectable {
    cursor: pointer
}

div.picker table td.selectable:hover {
    font-weight: 700
}

div.picker table a.disabled,
div.picker table td.disabled {
    color: #ccc
}

div.picker table td.end-day,
div.picker table td.start-day,
div.picker table td.time-selected {
    background-repeat: no-repeat;
    font-weight: 700
}

div.picker table td.start-day {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='%23FFF' d='m0 14 6-7-6-7'/%3E%3C/svg%3E");
    background-position: 0
}

div.picker table td.end-day {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='%23FFF' d='M14 0 8 7l6 7'/%3E%3C/svg%3E");
    background-position: 100%
}

div.picker table td.start-day.end-day {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='%23FFF' d='m0 14 6-7-6-7'/%3E%3C/svg%3E"), url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='%23FFF' d='M14 0 8 7l6 7'/%3E%3C/svg%3E");
    background-position: 0, 100%
}

div.picker table td.active,
div.picker table td.time-selected {
    background-color: #f68417;
    color: #000
}

div.picker table td.inactive {
    background-color: #0e0970;
    color: #fff
}

div.picker table td.range {
    background-color: #eee
}

div.picker table td select {
    appearance: none;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='15' height='15' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.02 7.409v-3.98L7.752 7.854 2.485 3.43v3.978l5.267 4.426z'/%3E%3C/svg%3E");
    background-position: right .7em top 50%;
    background-repeat: no-repeat;
    background-size: .65em auto;
    border: 0;
    border-radius: 5px 5px 0 0;
    font-size: 18px;
    height: 40px;
    outline: none;
    padding: 0 5px;
    width: 60px
}

div.picker table td select::-ms-expand {
    display: none
}

div.picker button.confirm {
    appearance: none;
    -webkit-appearance: none;
    background-color: #f4f4f4;
    border: 0;
    border-radius: 5px 5px 0 0;
    cursor: pointer;
    height: 40px;
    outline: 0;
    padding: 10px;
    text-transform: uppercase
}