/**
 * Styles for DatePicker
 */

.delivery-date-wrap,
.customer-comment-wrap{
    margin-bottom:10px;
}
#easycheckout-review .customer-comment-wrap textarea{
    width:99%;
}
.delivery-date-wrap .delivery-date-field{
    position:relative;
    cursor:pointer;
    zoom:1;
}
.delivery-date-wrap .delivery-date-field:after{
    content:'';
    display:block;
    clear:both;
}
/*.delivery-date-wrap .delivery-date-field input{
    cursor:pointer;
    float:left;
}*/
/*.delivery-date-wrap img.handler{
    left: -22px;
    margin-right: -100%;
    position: relative;
    top: 2px;
    float:left;
}
.delivery-date-wrap .input-date{
    width:160px;
}*/
.datepickerControl {
    border:                1px solid #CCCCCC;
    background-color:    #FFF;
    padding:            2px;
    -moz-border-radius: 5px 5px 5px 5px;
    -moz-box-shadow: 0 0 15px #666666;
}

.datepickerControl td {
    text-align:            center;
    vertical-align: middle;
    font-family:        sans-serif;
    font-size:            11px;
    line-height: 20px;
    width:                27px;
    height:                20px;

}
.datepickerControl .calendarRow td{
    -moz-border-radius: 3px 3px 3px 3px;

}

.datepickerControl tr.monthLabel td {
    background-color:    #FFFFFF;
    border-width:0 !important;
    font-weight:        bold;
}

.datepickerControl tr.navigation td {
    cursor:                pointer;
    border-width:0 !important;
}

.datepickerControl tr.navigation td:hover {
    text-decoration:    underline;
}

.datepickerControl tr.dayLabel td {
    /*
    border:                1px solid #C0D8EA;
    background-color:    #C0D8EA;
    */
    border-width:0 !important;
    border-bottom:        1px solid #ccc !important;
    color:                #2F2F2F;
}

.datepickerControl td.day, .datepickerControl td.dayothermonth {
    cursor:                pointer;
    background-color:    #FFFFFF;
    border:                0 !important;
    border-left:1px solid #FFF !important;
    border-top:1px solid #FFF !important;

}

.datepickerControl td.dayothermonth {
    color:                #999999;
}

.datepickerControl td.day:hover {
    background-color:    #EBE4C0;
}

.datepickerControl td.weekend {

    color:red;
}

.datepickerControl td.today {
    font-weight:        bold;
}

.datepickerControl td.hour {
    cursor:                pointer;
    background-color:    #FFFFFF;
    border:                1px solid #EEEEEE;
    width:                2em;
}

.datepickerControl td.minute {
    cursor:                pointer;
    background-color:    #FFFFFF;
    border:                1px solid #EEEEEE;
    width:                2em;
}

.datepickerControl td input,
.datepickerControl td button {
    font-size:            11px;
    padding:            0;
    border:                1px solid #999999;
    text-align:            center;
}

.datepickerControl td.ampm {
    cursor:                pointer;
    background-color:    #CCCCCC;
    border:                1px solid #EEEEEE;
    width:                2em;
}

.datepickerControl td.current {
    color:#fff;
    background-color:    #498CE2;
}

.datepickerControl input.current {
    background-color:    #EBC2C0;
}

.datepickerControl td.current:hover {
    background-color:    #EBC2C0;
}
.datepickerControl td.disabled{
    cursor:default;
    background-color: #EFEFEF !important;
    color: #CCCCCC !important;
}
body .year_months_selector select {width: 100%;height: 40px;text-align: center;}
body .year_months_selector {margin-bottom: 20px;}

.delivery-date-wrap{position:relative;}
.margin0{margin:0px !important;}
.padding0{padding:0px !important;}
.border_none{border:0px solid transparent !important; border:none;}
.calendar_container {margin-top: 20px;}
.calendar_container table {border: 1px solid black;}
.calendar_container table td.today{background-color: #9dffff;}
.calendar_container table td.selected, .calendar_container table span.selected{background-color: #00FF00;}
.calendar_container table td, .calendar_container table th {/*font-size: 11px;padding: 05px 10px;*/text-align: center;cursor: pointer;}
.calendar_container .col-3 table td{padding: 05px 05px;}
.calendar_container table td.disabled, .calendar_container table td .hour span.disabled {cursor: not-allowed;background: #ff6969;color: #fff;border-color:#fff;}
.calendar_container table td .hour span .hour_orders_summary{color:#636363;display: none}
.calendar_container table td.old.disabled, .calendar_container table td.next.disabled{background: #ffff00;color: #000;border-color:#fff; }
.calendar_container table th {background-color: #ccb4cd;}
table a{display:block;}
.calendar_container table, .calendar_container td, .calendar_container th{ border: 1px solid #ccc; border-collapse: collapse; }
/*.calendar_container .months_container{display:inline-block; vertical-align: top;}*/
/*.months_hours_time_format {display: inline-block;}*/
.calendar_container table td .hour span {border: 01px solid #ccc;padding: 10px;display: inline-block;position:relative;margin: 5px;}
.calendar_container table td .hour{/*padding:10px;margin: 10px 0px;*/}
.dateTimeLoaderContainer {position: absolute;width: 100%;height: 100%;left:0px;top: 0px;background: rgba(255,255,255,0.7);}
.datetimepicker-hours, .datetimepicker-minutes{position:relative;}
.relative_hours .hour_orders_summary {z-index:20;width: 30px;height: 25px;display: block;position: absolute !important;padding: 0px !important;line-height: 22px;top: -15px;right: -15px;background: #fff;margin: 0px !important;}
.fieldsetSwitch.disabledFieldset{margin: 0px;padding: 0px;border: none;}
.hidden{display:none !important;}
.delivery-date-wrap fieldset{/*border: 1px solid #c0c0c0;margin: 10px 0px;padding: 10px;*/}
.delivery-date-wrap legend{font-size: 20px;}
.delivery-date-description {margin: 20px 0px 10px 0px;font-style: italic;font-size: 12px;}
.datetimepicker-hours > table {margin-top: 20px;width:100%}
.delivery-date-wrap fieldset.fieldsetSwitch{margin-top:0px;}
#delivery_date_handler {position: absolute;right: 8px;top: 17px;transform: translate(0%,-50%);height: 20px;}
.delivery-date-field {position: relative;}
.months_container table.months_table {width: 100%;}
.months_container .months_hours_time_format{width:49%; display: inline-block; vertical-align: top; margin-bottom:10px;}
.months_container .months_hours_time_format.full-width{width:100%;padding: 0px;}
.dateTimeLoader{border:5px solid #f3f3f3;border-radius: 50%;border-top:2px solid #3498db;width:50px;height:50px;position: absolute;top: calc(50% - 25px);left: calc(50% - 25px);
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
}
/* Safari */
@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.clearfix{clear: both;}
.clearfix::after, .clearfix::before{content: '';display: table;clear: both;}
.custom_calendar .months_row{margin-left:-10px;margin-right:-10px;}
.custom_calendar .col-4, .custom_calendar .col-6, .custom_calendar .full-width{padding-left: 10px;padding-right: 10px;box-sizing: border-box;float:left;}
.custom_calendar .col-6{width:50%;}
.custom_calendar .col-4{width:33.33%;}
.calendar_container table td .hour span{position:relative;}
/*.calendar_container table td .hour span::before{position:absolute;top:0px;left:0px;width:100%;height:100%; background: red;background: linear-gradient(to right, white , red);}
.calendar_container table td .hour span::after{position:absolute;top:0px;left:0px;width:100%;height:100%; background:#fff; z-index:10;}*/
.calendar_container table td .hour span.progress_overlay {background: #ff6969; position: absolute;height: 100%;left: 0px;top: 0px;padding: 0px;margin: 0px;border: none;z-index:3;
}
.relative_hours.hour.enabled.selected{background:#fff;}
.calendar_container table td .hour span.label {position: relative;margin: 0px;padding: 0px;border: none;z-index:12;}
.calendar_container table td .hour span.slot_remaining{margin: 0px;padding: 2px;border: none;font-weight: bold;}
#slot_booking_note {text-align: left;font-size: medium;}
.relative_hours.hour.enabled .selected_overlay{position: absolute;width: 100%;height: 100%;background: #00FF00;top: 0px;left: 0px;z-index: 5;margin: 0px;padding: 0px;border: none;}
.no_border{border:none !important;}
body .hide_element{display:none !important;}
.error_select_slot{color:red;}
#deliveryDateInputContainer.dateSelected{position:relative;}
/*#deliveryDateInputContainer.dateSelected input#delivery_date{position: relative;z-index}*/
#deliveryDateInputContainer.dateSelected .inputPlaceHolder {position: absolute;top: 0px;left: 0px;width: 100%;height: 100%;white-space: nowrap;overflow: hidden;font-size: 14px;line-height: 32px;padding: 0px 10px;max-width: 90%;border: none !important;background: transparent;}
#deliveryDateInputContainer.dateSelected #delivery_date {color: transparent;}
#deliveryDateInputContainer .calendarIcon{background-image: url('images/calendar.png');width: 35px;position: absolute;height: 60%;right: 0px;background-size: 62%;background-repeat: no-repeat;background-position: center;z-index: 999;overflow: hidden;border-left: 01px solid #ccc;top: 20%;}
.delivery-date-wrap .delivery-date-field .validation-advice{position: absolute;min-width: 200px;}
.seprator-space{margin-top:30px;}