@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap');
html,body{margin:0; padding:0; width:100%; min-height:100%;font-family: 'Open Sans', sans-serif;}

.widget-box{max-width:600px; width:95%; display:block; margin:0px auto 0px; font-size:15px; position:relative; border:1px solid #ddd;border-radius:5px 5px 0 0;}
.widget-header{position:relative;background:rgba(0,0,0,0.12); color:#333;border-radius:5px 5px 0 0; padding:20px;}
.widget-header:after{content:''; position:absolute; left:0; top:0; width:100%; height:100%;background:url(../imgs/appheader-bg.png);background-size:cover; background-position:center center;background-repeat:no-repeat;opacity: .2;}
.widget-header h1{font-size:25px; font-weight:400; margin:0; display:inline-block;}
.widget-header span{display:inline-block; cursor:pointer;position:relative;}
.widget-header span.lftarrow{position:relative; z-index:1; margin-right:15px; top:2px; display:none; font-size:32px; line-height:30px;}
.widget-header span.lftarrow img{position:relative; z-index:1; height:22px;}
.widget-body{display:block; padding:15px; position:relative; min-height:200px;padding-bottom:50px;}
.label-heading{font-size:18px; font-weight:600; display:block; margin-bottom:15px;}
#widget-loader{position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(255,255,255,0.5); z-index:11}
#widget-loader img{width:43px;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);}

.clear{clear:both; line-height:0; font-size:0;}
.select-location{display:block; position:relative; padding:12px; border-bottom:1px solid #ddd;cursor:pointer; transition:0.5s all;}
.select-location:hover{background:#dbebdb;}
.select-location i{position:absolute; right:10px; top:15px; color:#666;}
.location-active{background:#dbebdb;}

#widget-service{display:none;}
.appocontntg{display:block;padding-bottom:15px;}
.catecntnerhead{display:block;position:relative;padding:12px;border-bottom:2px solid #fff;background:rgba(0,0,0,.1);cursor:pointer;font-weight:600;color:#333;text-transform:uppercase;}
.appocontntg .catecntnerhead span{position: absolute;right:8px;top:12px;font-size:20px;width:25px;text-align:center;border-radius:50%;}
.appocontntg .catecntnerhead span i{transition: .3s all;}
.appoactve i{transform: rotate(180deg);}
.appocontntg-sub .catecntnerhead-sub{display:block;position:relative;padding:10px 0;cursor:pointer;font-weight:600;color:#333;text-transform: uppercase;
    padding-left: 21px; border-bottom:1px solid #ddd;}
.appocontntg-sub:first-child .catecntnerhead-sub{border-top:none;}
.subicon{position:absolute;left:0;top:10px;width:16px;font-size:20px;text-align:center;}
.catecntnerhead-sub.appoactve i{transform: rotate(90deg);transition: .3s all;}
.catecntnerdata-sub{display:block;padding-left: 21px;}
.othermarginf{margin-top:15px;}

.service-checkcontainer{position:relative;padding-left:30px; cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none; display:block; margin-bottom:15px; }
.service-checkcontainer input{position:absolute;opacity:0;cursor:pointer;padding:5px 10px;width:100%;height:38px;line-height:25px; left:0;}
.service-checkmark{position:absolute;top:0;left:0;height:18px;width:18px;background-color:#f4f4f4;border-radius:3px;border:2px solid #ccc}
.service-checkcontainer:hover input ~ .service-checkmark {background-color: #ccc;}
.service-checkcontainer input:checked ~ .service-checkmark {background-color: #2196F3;border:2px solid #2196F3;}
.service-checkmark:after {content: "";position: absolute;display: none;}
.service-checkcontainer input:checked ~ .service-checkmark:after {display: block;}
.service-checkcontainer .service-checkmark:after{left:5px;top:2px;width:5px;height:10px;border:solid #fff;border-width:0 3px 3px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}
.service-checkcontainer i.fa-chevron-right{position:absolute;right:15px;top:5px;color:#666;}

.appocontntg-sub .subcatservcsg{margin-bottom:15px;margin-top:5px;}
.appocontntg .service-checkcontainer{margin-top:15px;}


.inner-staff .service-checkcontainer{margin-bottom:10px;}





h3.service-title{margin:0px 0 10px;}
.servicename{font-weight:600; color:#333;}
.service-time{font-size:14px;}
.service-time i{opacity:0.5}
.service-price,.service-time{display:inline-block;}
.service-price{margin-right:15px;}
.service-duration{margin-top:10px;}
.service-duration i{margin-right:0px;}
.paymntlnk{position:relative;display: block;margin-bottom:15px;padding-left: 23px;}
.paymntlnk i{position: absolute;left: 0;top: 4px;font-size: 12px;}
.paymntlnk span{display: block;clear: both;margin-bottom: 1px;}

#widget-datetime{display:none;}
.service-details{display:block;border-bottom:1px solid #ddd;margin-bottom: 15px;padding-bottom: 15px;background: #FFF;position: relative;}
.serviceimg{display:block;width:90px;height:90px;overflow:hidden;border-radius:5px;margin-bottom:20px;}
.serviceimg img{width:90px;height:90px;}
.service-description{display:block;margin-bottom:10px;}
.service-duration span{display: inline-block;font-size: 14px;margin:0 25px 5px 0; padding:0;}

.service-address{display:block; position:relative; padding-left:20px;margin-bottom:15px;}
.service-address i{position:absolute;left:0;top:4px;}
.operclick{display:block;cursor:pointer;position:relative;padding-left:20px;margin: 0;}
.operclick i.fa-clock-o{position:absolute;left:0;top:3px;}
.weekday{width:120px;display:inline-block;vertical-align:top;}
.week-time{display:inline-block;vertical-align:top;}
.operclick a i{width:20px;height:20px;background:#ddd;text-align:center;border-radius:50%;color:#000;font-size:18px;line-height:20px}
.hourscontainer{}
.hors-frontent{display:block;position:relative;padding-left:20px;margin:5px 0;}
.hors-frontent i.fa-clock-o{position:absolute;left:0;top:3px;}
.strt-time, .end-time{background: #f3f3f3;padding:0 5px;border-radius: 3px;display:inline-block;}
.strt-time{margin-right: 5px;}
.calender-box{display:block; margin:20px 0 10px;}
.wfield-box{display:block; margin-bottom:15px;}
.wfield-box label{display:block; margin-bottom:10px; font-weight:bold;}
.wfiled-control{width:100%; border:1px solid #ddd; padding:10px 0; text-indent:10px;}
.widget-button{display:inline-block; border:none; padding:10px 20px; background:#2196F3; color:#FFF; font-weight:400; border-radius:25px; font-size:16px; cursor:pointer;}
.widget-button:hover{background:#333;}
.widget-button:focus{outline:none;}
#ft_msg{color:red;}
#widget-yourdetails{display:none;}
.wstaff-area{display: block;padding: 10px;background: #dbebdb;margin-bottom: 10px;}
.inner-staff{width:27.5%;display:inline-block;vertical-align:top;background:#fff;margin:5px;padding:9px 10px 0; font-size:14px;}
.staff-heading{font-size:16px; font-weight:600; display:block; margin-bottom:10px;}

#widgetpaypal{display:none;}
.paypal-logo{font-family:Verdana,Tahoma;font-weight:700;font-size:16px}
.paypal-logo i:first-child{color:#253b80}
.paypal-logo i:last-child{color:#179bd7}
.paypal-button{padding:10px 20px;border:1px solid #f93;border-radius:25px;background-image:linear-gradient(#fff0a8,#f9b421);margin:15px 0;display:block;min-width:138px;position:relative;cursor:pointer}
.paypal-button:focus{outline:none}
.paypal-button-title{font-size:14px;color:#505050;font-weight:600;vertical-align:baseline;text-shadow:0 1px 0 rgba(255,255,255,0.6);margin-right:5px}
.paypal-button .paypal-logo{display:inline-block;text-shadow:0 1px 0 rgba(255,255,255,0.6);font-size:16px}
.payplcart{margin-bottom:0;}
.payplcart i{top:2px;font-size:16px;}
.currency_sign{display:block;margin-top:5px;}
.currency_sign i{position: relative;font-size: 14px;top: 1px;}

#tomzof{position: relative; margin-top:15px;}
#tomzof:after{content: "\f0ac";font-family: FontAwesome;position: absolute;left: 0;top: 0;height:100%;width: 40px;background: #ddd;text-align: center;line-height: 40px;    font-size: 18px;color:#333;}
#tomzof select{width: 100%;padding: 0 10px;height: 38px;padding-left: 45px;border: 1px solid #e1e1e1;}
#tomzof select:focus{outline:none;}

.calender-heading{display:block; text-align:center; padding:1px 0; background:rgba(0,0,0,0.12);}
.calender-heading h3{text-transform:uppercase;}
table.calendar{ width:100%; border:1px solid rgba(38, 84, 124 ,0.07); border-top:none;border-collapse: collapse;}
td.calendar-day-head { background:rgba(0,0,0,0.12); font-weight:bold; text-align:center; width:120px; padding:5px 5px 10px;}

tr.calendar-row	{  }
td.calendar-day	{position:relative;} * html div.calendar-day {}
td.calendar-day:hover	{  }
td.calendar-day-np	{} * html div.calendar-day-np { }
div.day-number{ padding:0px; color:#666; font-weight:bold; text-align:center; }
/* shared */
td.calendar-day, td.calendar-day-np {padding:0;border:1px solid rgba(38, 84, 124 ,0.09);}
td.calendar-day.activetd:before{border-style: solid;border-color: rgba(0,0,0,0.05) transparent transparent transparent;z-index: 999;width: 0;
    height: 0;
    border-style: solid;
    position: absolute;
    content: "";
    margin: auto;
    right: 0;
    left: 0;    border-width: 16px 16px 0 16px;
    bottom: -16px;}
td.calendar-day.activetd:after{z-index: 99999;width: 0;height: 0;border-style: solid;position: absolute;content: "";margin: auto; right: 0; left: 0;border-width: 15px 15px 0 15px;
    bottom: -15px;border-color: #ffffff transparent transparent transparent !important;    box-sizing: border-box!important;}


#calender-container .container-date{display:block; text-align:center; cursor:pointer;}
.container-date .wday, .container-date .dday, .container-date .mday{line-height: 26px;font-size: 16px;font-weight: 400;color: #333; transition:0.5s all; }
.container-date .wday, .container-date .mday{text-transform:uppercase; font-size:14px;}
#calender-container .container-date .dday{width:42px;height:42px;vertical-align: middle;display: inline-block;margin: auto;border-radius: 100%;font-size:16px;line-height: 43px;
    color: #222; margin:5px 0; border-radius:50%; background:#dafdda;}
.container-date:hover .dday{background:#6dc36d !important; color:#FFF !important;} 	
.container-date .crntdt{border:2px solid #6dc36d;}
#calender-container .container-dates{display:block; text-align:center; /*background:#eceff5;*/}
.container-dates .wday, .container-dates .ddays, .container-dates .mday{line-height: 26px;font-size: 16px;font-weight: 400;color: #9e9d9d; }
.container-dates .wday, .container-dates .mday{text-transform:uppercase; font-size:14px;}
#calender-container .container-dates .ddays{width:42px;height:42px;vertical-align: middle;display: inline-block;margin: auto;border-radius: 100%;font-size:16px;line-height: 43px;
    color: #777; margin:5px 0;}
.container-date .actived{background:#6dc36d !important; color:#FFF !important; border-radius:50%;}
#calender-container .owl-nav{position:absolute; top:0%; width:100%; left:0;}
#calender-container .owl-nav .owl-prev{position:absolute;top:0;left:30px; font-size:38px; line-height:18px;}
#calender-container .owl-nav .owl-next{position:absolute;top:0;right:30px; font-size:38px;line-height:18px;}
#calender-container .owl-nav [class*='owl-']{background:none;color: #9e9d9d; opacity:0.8}
#calender-container .owl-nav [class*='owl-']:hover{background:none; color:#333;opacity:1}
#calender-container .owl-nav [class*='owl-']:focus{outline:none;}
#calender-container .owl-nav .disabled{opacity:0.3}

.timeloading{display:block; text-align:center; padding:45px; background:#e4f0e4;}
.timeloading img{width:40px !important; height:40px; display:block; margin:auto;}
.timeselect-area{display:block;background:#e4f0e4;padding: 25px 15px 15px;text-align: center;}
.timeselect-area h2{display:block;font-size:20px;font-weight:400;color:#333; margin-top:0;}
.timeselect{display: inline-block;vertical-align: top;text-align: center;padding: 8px 0px;width:17.7%;margin: 0 5.7px 10px;vertical-align: top;background: #FFF;color: #666;
    cursor: pointer;font-weight: 400;}
.timeselect.active{background:#6dc36d;color:#fff;}

.powerdbyz{float:right;background:rgba(0,0,0,.1);color:#333;padding:5px 10px 5px 30px;margin-top:15px;font-size:12px;position:absolute;bottom:0;right: 0;overflow: hidden;}	
.powerdbyz:before{content: '';position: absolute;top: -1px;left: 0;border-top: 30px solid #fff;border-left: 30px solid transparent;width: 0;transform: rotate(270deg);}
.powerdbyz span{position: relative;z-index: 1;}

#locsrt .service-address{border-bottom:1px solid #ddd; padding-bottom:15px; margin-bottom:15px;}
#locsrt .service-address i{top:3px;}
.cindrmrqstmsg{display:block; padding:15px;}

/*--------------------------------------------
				for widget
----------------------------------------------*/	
span.refreshicon{display:none;}			
.chtwidgtapp .widget-header{padding:15px 20px;}
.chtwidgtapp{width:99.3%;background:#FFF;}
.chtwidgtapp .widget-header h1{font-size:22px;}
.chtwidgtapp .widget-header span.refreshicon{display:inline-block; float:right; cursor:pointer; z-index:9999; margin-right:40px; margin-top:4px;}
.chtwidgtapp .widget-header span.refreshicon img{width:24px; height:24px;-webkit-filter: invert(100%);filter: invert(100%);}
.chtwidgtapp .zvcloseidd{color:#000; font-size:23px;}



@media (max-width:500px){
	.timeselect{width:90px;}
	.inner-staff{width:130px; font-size:14px;}
	.widget-header span.lftarrow{top:0px;}
	.calender-box{margin:10px 0 10px;}
	.powerdbyz{float:none; text-align:center; width:100%;}
	.powerdbyz:before{display:none;}
}
@media (max-width:400px){
	.chtwidgtapp .widget-header{display:flex;display: flex;}
	.chtwidgtapp .widget-header span.refreshicon{margin-right:0px; margin-left:auto;}
	#calender-container .container-date .dday{width:32px; height:32px; line-height:32px;}
	#calender-container .container-dates .ddays{width:32px; height:32px;line-height:32px;}
	.calender-box{margin:10px 0 10px;}
	.widget-body{padding-bottom: 40px;}
}


