/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Apr 08 2021 | 07:24:58 */
/* LATEPOINTS */


/* ACCOUNT */



.customer-bookings-tiles .customer-booking-buttons .latepoint-btn i+span {
    margin-left: 4px;
    font-size: 0.8rem!important;
}
.customer-bookings-tiles .customer-booking-info .booking-info-label {
    flex: 0 1 94px!important;
}
.os-social-login-options {
    display: block!important;
    justify-content: space-between;
    text-align: center!important;
}
.latepoint-w .latepoint-booking-form-element.latepoint-color-black .latepoint-btn.latepoint-btn-primary.latepoint-btn-link {
    background-color: transparent!important;
    color: var( --maincolor )!important;
}
.latepoint-btn.latepoint-btn-primary.latepoint-btn-link.os-loading:after, .latepoint-btn.latepoint-btn-primary.latepoint-btn-link.os-loading:hover:after, .latepoint-btn.latepoint-btn-primary.latepoint-btn-link.os-loading:focus:after {
    border-bottom: 2px solid var( --secondarycolor )!important;
    border-left: 2px solid var( --secondarycolor )!important;
    border-top: 2px solid var( --secondarycolor )!important;
}


.latepoint-message.latepoint-message-info {
      color: #FFFFFF!important;
    background-color: var( --secondarycolor )!important;
}
.latepoint-message.latepoint-message-error {
    background: #F79065!important;
    color: #fff!important;
    border: none!important;
    border-radius: 0px!important;
}
.latepoint-login-form-w .os-social-login-options .os-social-login-option, .os-social-login-option.os-social-login-facebook {
    border-color: #000!important;
    color: #000!important;
}
.latepoint-login-form-w .os-social-login-options {
    display: block!important;
}
.latepoint-login-form-w .os-social-login-options .os-social-login-option:hover, .os-social-login-option.os-social-login-facebook:hover {
    border-color: var( --maincolor )!important;
    color: var( --maincolor )!important;
}

.latepoint-book-button.os-loading, .latepoint-book-button.os-loading:hover  {
    color: transparent!important;
}
.latepoint-w .os-form-group {
    text-align: right;
}
.customer-bookings-tiles .customer-booking-info .booking-info-label, .latepoint-w .latepoint-section-heading-w .heading-extra {
 color: #7D8F8C!important;
}
.customer-dashboard-tabs a {
    color: #7D8F8C!important;
  font-size:1.1rem;
}

.customer-dashboard-tabs a.active {
    color: var( --maincolor )!important;
}
.customer-dashboard-tabs a:after {
    background-color: var( --maincolor )!important;
}

.customer-bookings-tiles .customer-booking-info .booking-info-value.status-approved, .customer-bookings-tiles .customer-booking-info .booking-info-value.status-pending, .customer-bookings-tiles .customer-booking-info .booking-info-value.status-cancelled {
    padding: 2px 10px!important;
    border-radius: 30px!important;
}
.latepoint-tabs-w {
    border-radius: 4px;
    padding: 4px 0px 24px 0px!important;
}
.latepoint-w .latepoint-section-heading-w {
    padding: 14px 0px;
}
.latepoint-tab-content.active {
    padding: 0px 0px;
}
.customer-dashboard-tabs {
    border-radius: 0px;
}
.customer-bookings-tiles {
    padding: 14px 0px!important;
}
.latepoint-w a:first-child {
    float: right;
}
.customer-bookings-tiles h6.customer-booking-service-name, .latepoint-btn.latepoint-btn-primary.latepoint-btn-link span, .latepoint-btn.latepoint-btn-primary.latepoint-btn-link i {
    color: var( --maincolor )!important;
}
.latepoint-btn.latepoint-btn-primary.latepoint-btn-link span {
    border-bottom: 1px solid var( --maincolor )!important;
}

.latepoint-btn.latepoint-btn-primary.latepoint-btn-link:hover span, .latepoint-btn.latepoint-btn-primary.latepoint-btn-link:hover i, .latepoint-btn.latepoint-btn-primary.latepoint-btn-link:focus span, .latepoint-btn.latepoint-btn-primary.latepoint-btn-link:focus i {
    color: var( --secondarycolor ) !important;
}

@media (max-width: 600px) {
.latepoint-w .customer-dashboard-tabs a {
    text-align: left!important;
}
.latepoint-w .customer-dashboard-tabs a:after {
    bottom: 3px!important;
    top: auto!important;
    height: 3px!important;
  width:auto!important;
}
  .latepoint-tabs-w {
    margin-left: -24px;
    margin-right: -24px;
}
  .latepoint-w .os-col-6 {
    flex: 0 0 100%;
}
}

.latepoint-w h1, .latepoint-w h2, .latepoint-w h3, .latepoint-w h4, .latepoint-w h5, .latepoint-w h6 {
  font-family: inter!important;
  font-size: 1rem;
    font-weight: 500;
}

.customer-dashboard-tabs a {
  font-size: 1rem!important;
}

/* FORMS */

.latepoint-w .latepoint-booking-form-element .step-services-w .os-service-durations .os-item .os-duration-price {
    color: var( --secondarycolor )!important;
  right: 50%;
    transform: translateX(50%);
}


.latepoint-w .os-form-group.os-form-select-group .os-form-control:focus, .latepoint-w .os-form-group.os-form-select-group input.os-form-control:focus, .latepoint-w .os-form-group.os-form-textfield-group .os-form-control:focus, .latepoint-w .os-form-group.os-form-textfield-group input.os-form-control:focus {
    background-color: rgba(125, 143, 140, 0.05)!important;
    border-color: #7D8F8C!important;
}

::placeholder {color:#000!important;opacity:0.8;}
.latepoint-w .os-form-group.os-form-textfield-group label {color: var( --secondarycolor )!important;}


/* BUTTONS */

.latepoint-btn.latepoint-btn-primary.latepoint-btn-link:hover  {
  color: var( --secondarycolor )!important;
}
.latepoint-login-form-w .os-social-or, .latepoint-btn.latepoint-btn-primary.latepoint-btn-link {
    color: #555!important; 
}

.latepoint-book-button, .latepoint-btn, a.latepoint-btn.latepoint-btn-primary.latepoint-next-btn, .latepoint-book-button:focus, .latepoint-book-button:hover  {
    color: #FFFFFF;
    background-color: var( --maincolor );
    padding: 14px 24px 14px 24px;
     font-family: "Inter", Sans-serif!important;
    letter-spacing:0px;
    font-weight: bold;
  border-radius: 30px!Important;
    border-color: transparent!important;
}
.latepoint-book-button {font-size: 1.2rem;}
.latepoint-btn {font-size: 1rem;}

.latepoint-book-button:focus, .latepoint-book-button:hover {
    color: #FFFFFF;
    background-color: var( --maincolor );
}


/* TEXT */

.latepoint-admin, .latepoint-w, .latepoint-lightbox-w button, .latepoint-lightbox-w input, .latepoint-lightbox-w select, .latepoint-lightbox-w textarea {
   font-family: "Inter", Sans-serif!important;
    font-weight: 400;
}
.latepoint-questions a {
    font-weight: normal;
    color: var( --maincolor )!IMPORTANT;
    text-decoration: none!important;
    border-bottom: 1px solid var( --secondarycolor );
    padding-bottom: 4px;
}
.latepoint-w .latepoint-booking-form-element.latepoint-color-black .latepoint-side-panel .latepoint-step-desc-w, .latepoint-w .latepoint-booking-form-element.latepoint-color-black .latepoint-side-panel .latepoint-questions {
  color: #555!important;
  text-align:left!important;
}
.latepoint-w .latepoint-booking-form-element.latepoint-color-black .latepoint-side-panel {background-color: #f5f5f5;}
.latepoint-w .latepoint-booking-form-element .latepoint-summary-w h3.summary-header {font-family: "Inter", Sans-serif!important;}
.os-heading-text {font-size:120%;}

.latepoint-login-form-w h4 {
    font-weight: bold;
    text-transform: capitalize;
    color: var( --maincolor );
    margin-bottom: 24px!important;
}
/* SIDE PANEL */
.latepoint-w .latepoint-booking-form-element.latepoint-color-black .latepoint-side-panel {background-color: #F5F5F5;}
.latepoint-w .latepoint-booking-form-element .latepoint-side-panel {border-right: 1px solid rgba(0,0,0,0)!important; }

/* GENERAL */
.latepoint-lightbox-w {background-color: rgba(250,241,235,0.1)!important;}
.latepoint-w .latepoint-booking-form-element h1 { color:var( --maincolor )!important; }
.latepoint-w .latepoint-booking-form-element h2, .latepoint-w .latepoint-booking-form-element h3, .latepoint-w .latepoint-booking-form-element h4, .latepoint-w .latepoint-booking-form-element h5 { font-family: "Inter"!important; }
.latepoint-w .latepoint-booking-form-element .latepoint-side-panel .latepoint-questions h5:before {background-color: var( --maincolor )!important;}
.latepoint-w .latepoint-booking-form-element .latepoint-side-panel .latepoint-progress ul li.active a {color: var( --maincolor )!important; }
.latepoint-w .latepoint-booking-form-element .latepoint-side-panel .latepoint-progress ul li a:before { background-color: var( --maincolor )!important; }
.latepoint-w .latepoint-booking-form-element .latepoint-form-w .latepoint-heading-w .latepoint-lightbox-close {color: var( --maincolor )!important; }
.latepoint-btn.latepoint-btn-primary { color: var( --maincolor )!important;background:#fff; }
.latepoint-w .latepoint-booking-form-element.latepoint-color-black .latepoint-btn.latepoint-btn-primary {background-color: var( --maincolor )!important;color:#fff!important;}
.latepoint-w .latepoint-booking-form-element .step-locations-w ul.os-locations li a:hover { border-color: var( --maincolor )!important; background-color: #fcecfd!important; }
.latepoint-w .latepoint-booking-form-element .step-locations-w ul.os-locations li.selected a { border-color: var( --maincolor )!important; background-color: #fcecfd!important; }

.latepoint-w .latepoint-booking-form-element .step-services-w ul.os-services li a:hover { border-color: var( --maincolor )!important; background-color: #fcecfd!important; }
.latepoint-w .latepoint-booking-form-element .step-services-w ul.os-services li.selected a { border-color: var( --maincolor )!important; background-color: #fcecfd!important; }

.latepoint-w .latepoint-booking-form-element ul.os-agents li.selected a { box-shadow: 0px 0px 0px 2px var( --maincolor ), 0 10px 32px 0 #fcecfd!important; background-color: #fcecfd!important; }
.latepoint-w .latepoint-booking-form-element ul.os-agents li a:hover { box-shadow: 0px 0px 0px 2px var( --maincolor ), 0 10px 32px 0 #fcecfd!important; background-color: #fcecfd!important; }
.latepoint-w .latepoint-booking-form-element ul.os-agents li.selected a .agent-name { color: var( --maincolor )!important; }

.os-monthly-calendar-days .os-day.selected .os-day-box { background-color: var( --maincolor )!important; }
.latepoint-w .latepoint-booking-form-element ul.os-agents li a:hover .agent-name { color: var( --maincolor )!important; }
.dp-timeslot.selected .dp-label {background-color: var( --maincolor )!important; }
.dp-timeslot.selected {background-color: var( --maincolor )!important; }
.os-weekdays .weekday { color: #c185d8; }
.latepoint-booking-form-element .os-step-tabs .os-step-tab:before { background-color: var( --maincolor )!important; }

.dp-timebox.selected {
    background-color: var( --maincolor )!IMPORTANT;
    color: var( --maincolortext )!important;
    border-color: var( --maincolor )!IMPORTANT;
}
.dp-timebox.selected:after {
 background-color: var( --maincolor )!IMPORTANT;
}

body.latepoint-lightbox-active .latepoint-lightbox-w {
    backdrop-filter: blur(200px);
}
.latepoint-lightbox-w .latepoint-lightbox-i .latepoint-booking-form-element, .latepoint-login-form-w {
    box-shadow: 0px 10px 20px -10px rgba(0,0,0,0.1)!important;
}
.customer-bookings-tiles .customer-booking {
    box-shadow: 0px 10px 20px -10px rgba(0,0,0,0.05)!important;
  border:1px solid rgba(0,0,0,0.1)!important;
    border-radius: 4px!important;
}
.latepoint-w .latepoint-booking-form-element .latepoint-side-panel .latepoint-step-desc-w .latepoint-step-desc .latepoint-desc-title {
    margin-bottom: 14px!important;
}
.latepoint-login-form-w {
  border-radius: 4px!important;
}
.latepoint-w .latepoint-booking-form-element .latepoint-form-w .latepoint-heading-w .latepoint-lightbox-close i {
    font-size: 18px!important;
}

.step-locations-w .os-item-img-w {
    display: none!important;
}

.latepoint-w .latepoint-booking-form-element .os-items .os-item-details-btn span {
    border-bottom-color: var( --maincolor );
}

.latepoint-w .latepoint-booking-form-element .os-items .os-item-details-btn {
color: var( --maincolor );
 }