.pop-cal{position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 999999;background-color: rgba(0,0,0,0.6);text-align: center}

.pop-cal-title {display: flex;position: relative;justify-content: center;align-items: center;height: 40px;border-bottom: 1px #777 solid;}
.pop-cal-close {position: absolute;left: 5px;width: 40px;height: 40px;transform: rotate(45deg);cursor: pointer;}
.pop-cal-close::before {content: "";position: absolute;left: 0;right: 0;top: 0;bottom: 0;width: 2px;height: 18px;background: black;margin: auto;}
.pop-cal-close::after {content: "";position: absolute;left: 0;right: 0;top: 0;bottom: 0;width: 18px;height: 2px;background: black;margin: auto;}


.qmark-more {display: flex;margin-top: 10px;position: relative;text-align: right;margin-bottom: -10px;cursor: pointer;align-items:center;}
.qmark-more span {display: flex;width: 34px;height: 34px;border: 1px solid #333;justify-content: center;align-items: center;border-radius: 50%;font-size: 20px;background: #fdfda6;margin-left:10px;}
.qmark-more:not(.active) div + div{display:none}
.qmark-more.active span + div{display:none}
.pack-popup .qmark-more span{display: flex;background: #d03769;width: 16px;height: 16px;border-radius: 16px;align-items: center;justify-content: space-around;color: #fff;font-style: normal;font-size: 11px;cursor: pointer}
.pack-popup .arrival-date .datepicker_info{margin-bottom:10px}

.arrival-date .qmark-more{margin-bottom:10px}
.arrival-date .datepicker_info {background: #f8f8f8;border: 1px #ddd solid;border-top: 0;padding: 6px 8px;font-size: 12px;color: #777;text-align: right;display:none;}
.arrival-date .qmark-more.active {margin-bottom:10px}
.arrival-date .qmark-more.active+.datepicker_info {display:block}
.arrival-date .datepicker_info > div {display: flex;min-height: 30px;align-items: center;}
.arrival-date .datepicker_info .no_enter {}
.arrival-date .datepicker_info div > *{}
.arrival-date .datepicker_info div > .icon{width: 18px;height: 18px;margin-left: 6px;}
.arrival-date .datepicker_info div > a{margin: 0 5px;padding: 0 10px;border: 1px #50869e solid;border-radius: 15px;display: flex;height: 30px;box-sizing: border-box;background: white;align-items: center;color: #50869e;white-space: nowrap;}
.arrival-date .datepicker_info .no_online span.icon {background: url(../webimages/phoneIco.png) no-repeat center center;background-size: contain;}
.arrival-date .datepicker_info .hourglass span.icon {background: url(../webimages/hourglass.svg) no-repeat center center;background-size: contain;}

.arrival-date .datepicker_info .no_enter span.icon {background: #f57575;border-radius: 50%;position: relative;}
.arrival-date .datepicker_info .no_enter span.icon::after{content:'';margin:auto;top:0;bottom:0;left:0;right:0;width:10px;height:2px;background:white;display: block;position: absolute;}
.arrival-date .datepicker_info .fire span.icon {background: url(../webimages/hot-sale.png) no-repeat center center;background-size: contain;}


.arrival-date .datepicker_info .price_adding .icon {text-align: center;display: flex;align-items: center;justify-content: center;font-size: 18px;}
.pop-cal-content{position:absolute;max-width:600px;top:50%;left:0;right:0;margin:auto;transform:translateY(-50%);background:white;height: 100%;}
.pop-cal-scroll {padding: 0 10px;overflow: auto;max-height: calc(100% - 41px);padding-bottom: 80px;box-sizing: border-box;}
.pop-cal .ui-datepicker {width: 100%;box-sizing: border-box;margin: auto;padding: 0;border: 0;}
.pop-cal .ui-widget-header {background: white;border: 0;height: 60px;display: flex;align-items: center;justify-content: center;}
.pop-cal .ui-datepicker td {border: 1px #ddd solid;width: calc(100% / 7 );box-sizing: border-box;position:relative;padding:0}
.pop-cal .ui-datepicker td.noenter::before {content: "";position: absolute;right: 4px;top: 4px;background: #db5e5e;width: 14px;height: 14px;background-size: contain;border-radius: 50%;}
.pop-cal .ui-datepicker td.noenter::after {content: "";position: absolute;right: 7px;top: 10px;background: #ffffff;width: 8px;height: 2px;background-size: contain;}
.pop-cal .ui-datepicker td.onlyPhone::before {content: "";position: absolute;right: 4px;top: 4px;background: url(../webimages/hourglass.svg) no-repeat center center;width: 14px;height: 14px;background-size: contain;}

.pop-cal .ui-datepicker td.onFire::before {content: "";position: absolute;right: 0px;top: 1px;background: url(../webimages/hot-sale.png) no-repeat center center;width: 20px;height: 20px;background-size: contain;}
.pop-cal .ui-state-default, .pop-cal .ui-widget-content .pop-cal .ui-state-default, .pop-cal .ui-widget-header .pop-cal .ui-state-default {border: 0;background: white;text-align: center;line-height: 34px;font-size: 12px;}
.pop-cal .ui-state-highlight, .ui-widget-content .ui-state-highlight {box-shadow: 0 0 0 2px #f5b0ca inset;}
.pop-cal .ui-datepicker table {margin: 0;width: calc(100% - 1px);box-sizing: border-box;margin-right: 1px;}
.pop-cal td:not(.ui-datepicker-days-cell-over) .ui-state-active {background: #e31d68;color: white;}
.pop-cal .ui-datepicker .ui-datepicker-prev,.pop-cal  .ui-datepicker .ui-datepicker-next {width: 50px;height: 50px;top: 10px;}
.pop-cal .ui-datepicker .ui-datepicker-prev span,.pop-cal  .ui-datepicker .ui-datepicker-next span {left: 0;top: 0;margin: 0;background: #e31d68;width: 100%;height: 100%;border-radius: 50%;}
.pop-cal .ui-datepicker .ui-datepicker-prev span::after {content: "";top: 0;left: 0;right: 4px;bottom: 0;width: 15px;height: 15px;border-right: 2px solid white;border-top: 2px solid white;display: block;margin: auto;transform: rotate(45deg);position: absolute;}
.pop-cal .ui-datepicker .ui-datepicker-next span::after {content: "";top: 0;left: 4px;right: 0;bottom: 0;width: 15px;height: 15px;border-left: 2px solid white;border-bottom: 2px solid white;display: block;margin: auto;transform: rotate(45deg);position: absolute;}
.pop-cal .ui-datepicker .ui-state-hover {border-color:transparent;background: transparent;}


.pop-cal .explainDP{display:none}



.pop-cal .datepicker_info {background: #f8f8f8;border: 1px #ddd solid;border-top: 0;padding: 6px 8px;font-size: 12px;color: #777;text-align: right;display:none;}
.pop-cal .qmark-more.active {margin-bottom:10px}
.pop-cal .qmark-more.active+.datepicker_info {display:block}
.pop-cal .datepicker_info > div {display: flex;min-height: 30px;align-items: center;}
.pop-cal .datepicker_info .no_enter {}
.pop-cal .datepicker_info div > *{}
.pop-cal .datepicker_info div > .icon{width: 18px;height: 18px;margin-left: 6px;}
.pop-cal .datepicker_info div > a{margin: 0 5px;padding: 0 10px;border: 1px #50869e solid;border-radius: 15px;display: flex;height: 30px;box-sizing: border-box;background: white;align-items: center;color: #50869e;white-space: nowrap;}
.pop-cal .datepicker_info .no_online span.icon {background: url(../webimages/phoneIco.png) no-repeat center center;background-size: contain;}
.pop-cal .datepicker_info .hourglass span.icon {background: url(../webimages/hourglass.svg) no-repeat center center;background-size: contain;}

.pop-cal .datepicker_info .no_enter span.icon {background: #f57575;border-radius: 50%;position: relative;}
.pop-cal .datepicker_info .no_enter span.icon::after{content:'';margin:auto;top:0;bottom:0;left:0;right:0;width:10px;height:2px;background:white;display: block;position: absolute;}
.pop-cal .datepicker_info .fire span.icon {background: url(../webimages/hot-sale.png) no-repeat center center;background-size: contain;}


.pop-cal .hour-select {margin-top: 20px;}
.pop-cal .hours-select-title {text-align: right;font-size: 18px;font-weight: bold;margin-bottom: 10px;}
.pop-cal .hour-select-clients {display: flex;height:44px}
.pop-cal .clients {display: flex;width: 100%;justify-content: space-between;position: relative;}
.pop-cal .clients .info {text-align: right;}
.pop-cal .clients .info .info-text2 {display: table-cell;height: 44px;vertical-align: middle;}

.pop-cal .clients-list {display: flex;padding-left: 20px;position:relative}
.pop-cal .clients-list .pop-client {min-width: 70px;font-size: 12px;margin-left: 5px;border-radius: 10px;border: 1px #ddd solid;background: #f8f8f8;display: flex;flex-direction: column;justify-content: center;line-height: 1.2;width: 200px;cursor: pointer;}
.pop-cal .clients-list .pop-client .pop-client-name{font-weight: bold;}
.pop-cal .clients-list .pop-client .pop-client-info{}
.pop-cal .clients-list .pop-client.valid {border: 1px solid #e31d68;color: #e31d68;}
.pop-cal .clients-list .pop-client.selected {background: #e31d68;color: white;border: 1px solid #e31d68;}



.clients-btn {display: flex;max-width: 150px;font-size: 14px;line-height: 1.2;background: #f8f8f8;height: 44px;align-items: center;box-sizing: border-box;padding: 0 4px;border: 1px #ddd solid;border-radius: 10px;cursor: pointer;text-align: right;}
.clients-btn .mark-multi {width: 20px;height: 20px;margin-left: 8px;background: white;min-width: 20px;border-radius: 50%;border: 1px #CCC solid;position: relative;transform: rotate(45deg);}

.pop-cal-bottom {position: absolute;bottom: 0;left: 0;right: 0;height: 50px;box-shadow: 0 0 5px rgba(0,0,0,0.3);display: flex;align-items: center;background: rgba(255,255,255,0.9);}
.pop-cal-bottom div {display: inline-flex;height: 40px;margin: 0 auto;align-items: center;background: #e31d68;color: white;padding: 0 20px;min-width: 120px;justify-content: center;font-size: 20px;border-radius: 10px;cursor: pointer;}
.o-pop.nodate ~ .pop-cal .pop-cal-bottom{display:none}

.pop-cal .hour-select.multi .clients-list {overflow: auto;max-width: calc(100% - 120px);border-left: 2px #777 solid;}
.pop-cal .hour-select.multi .clients::after {content: "";position: absolute;left: 100px;top: 0;width: 20px;background: linear-gradient(90deg, white, rgba(255,255,255,0));height: 100%;}

.pop-cal .clients-hours-list {font-size: 0;margin-top: 20px;display:none}
.pop-cal .hour-select.active .clients-hours-list {display: block;}
.pop-cal .clients-hours-list div {width: 20%;display: inline-flex;align-items: center;justify-content: center;background: white;border: 1px #ddd solid;font-size: 16px;font-weight: bold;height: 30px;margin: 1%;cursor: pointer;}
.pop-cal .clients-hours-list div.selected {background: #e31d68;color:#FFFFFF;}

.pop-cal .hour-select.active .clients-hours-list > p.search-hours {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex ;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.8);
    z-index: 9;
    font-size: 20px ;
    font-weight: bold;
	color:black;
}

.hour-select.single .clients-btn {display: none;}
.hour-select:not(.active) .clients-btn{display:none}
.hour-select:not(.multi) .clients-btn span:nth-child(3){display:none}
.hour-select.multi .clients-btn span:nth-child(2){display:none}
.hour-select.multi .clients-btn .mark-multi::before {content: "";top: 0;bottom: 0;left: 0;right: 0;margin: auto;width: 2px;height: 12px;background: black;position: absolute;}
.hour-select.multi .clients-btn .mark-multi::after {content: "";top: 0;bottom: 0;left: 0;right: 0;margin: auto;width: 12px;height: 2px;background: black;position: absolute;}
.hour-select.multi .clients-btn {max-width: 86px;}
.hour-select.multi.no-single .clients-btn {display: none;}


.pop-cal .hour-select.single #clients-trts-cnt{display:none}
.pop-cal .hour-select.single .m{display:none}
.pop-cal .hour-select:not(.single) .s{display:none}

.pop-cal .hour-select:not(.active) .clients .info span:nth-child(2) {display:none}
.pop-cal .hour-select.active .clients .info > span:nth-child(1) {display:none}
.pop-cal .hour-select:not(.multi) .clients-list{display:none}

.pop-cal .hour-select.multi .info{display:none}
.pop-cal .hour-select.multi.no-single .clients-list {border: 0;max-width: none;padding: 0;}
.pop-cal .hour-select.multi.no-single .clients::after {display: none;}

.o-pop .hour-select section .inputWrap.half{max-width:98%}
.o-pop .hour-select section  .inputs {display: flex;margin-top:0}
.o-pop .hour-select section  .inputs .clients-btn {height: 50px;display:none}
.o-pop .hour-select section>.title .rather {top: 48px;}

.o-pop .hour-select section.person:not(.open) .l.first {}
.o-pop .hour-select section.person .single-time {background:#f5f5f5;position: absolute;top: 6px;left: 18px;font-size: 16px;display: flex;direction: ltr;height: 30px;border: 1px #ccc solid;padding: 0 10px 0 5px;align-items: center;border-radius: 7px;}
.o-pop .hour-select section>.title .rather label {height: 34px;padding: 2px;}
.o-pop .hour-select.multi section.person .single-time{background:white;border-color:#999}

.o-pop .person.guest .l>.priceall {display: inline-block;}
.o-pop .hour-select section.person:not(.open) .l.first {display: flex;max-width: 120px;justify-content: end;align-items: center;flex-wrap: wrap;height: 34px;top: 36px;}
.o-pop .hour-select section.person:not(.open) .l.first>span {margin-left: 4px;}
.o-pop .hour-select section.person .single-time .sngl-time {width: 66px;text-align: center;}
.o-pop .hour-select section.person:not(.open) .l.first div:last-child {display: none;width: 100%;}

@media(min-width:700px){
	.pop-cal-content {height: auto;max-height:100%;}
}

@media(max-width:1200px){
.o-pop .hour-select section.person .single-time {left: 10px;}
.o-pop .hour-select section>.title .rather {top: 53px;}
}



.o-pop #timer {position: sticky;margin-top: 50px;z-index: 99;top:0}
.o-pop #timer .t-content {display:none;padding: 0 10px;background: #333;color: white;height: 60px;align-items: center;justify-content: center;max-width:680px}
.o-pop #timer .t-content.show{display: flex;}
.o-pop #timer .t-text {max-width: 300px;width: calc(100% - 120px);}
.o-pop #timer .t-counter {display: flex;font-size: 20px;font-weight: bold;direction: ltr;margin-right: 10px;}
.o-pop #timer .t-counter .sec {width: 30px;text-align: center;}


.pack-popup #timernew {position: sticky;z-index: 99;top:0;font-size: 17px;width: 100%;}
.pack-popup #timernew .t-content {display: flex;padding: 0 10px;background: #333;color: white;height: 60px;align-items: center;justify-content: center;}
.pack-popup #timernew .t-content.show{display: flex;}
.pack-popup #timernew .t-text {max-width: 300px;width: calc(100% - 120px);}
.pack-popup #timernew .t-counter {display: flex;font-size: 20px;font-weight: bold;direction: ltr;margin-right: 10px;}
.pack-popup #timernew .t-counter .sec {width: 30px;text-align: center;}