/**
- Kuning: #FFDD00;
- Biru Gelap: #16375E;
- Biru Cerah: #54BDC8;
*/

body {
    font-family: 'Open Sans', sans-serif !important;
}
.fs-50 { font-size:50px; }
.fs-60 { font-size:60px; }
.bold { font-weight: bold !important; }
.logo-img { width:70px; height: auto; }
.line-separator { border-bottom:3px solid #54bdc8;width:150px; }
.text-white { color: #fff !important; }
.text-grey { color: #666f7b !important; }
.text-teal-blue { color: #54bdc8 !important; }
.text-dark-blue { color: #184267 !important; }
.bg-white { background: #fff !important; }
.bg-light-grey { background: #f9f9fa !important; }
.bg-teal-blue { background: #54bdc8 !important; }
.bg-teal-dark-blue { background: #47a5b5 !important; }
.bg-dark-blue { background: #184267 !important; }
.bg-blur { background: url('../img/bg-blur.jpg'); }
.bg-blur-statistic { background: url('../img/bg-statistic.png'); }
.bg-blur-download { background: url('../img/bg-download.png'); }
.what-say-space { margin-top:150px; }
.talent-space { margin-top:50px; }
.how-work-space { margin-top:50px; }
.package-space { margin-top: 50px; }
.package-head i.fas{color:white;}
.navbar {
    box-shadow:none !important;
   /* background : none !important;*/
}
.page-footer, .top-nav-collapse {
    background-color : #55bfca;
}
.icon-service { width: 150px; }
.navbar.scrolling-navbar {
    padding-top : 5px !important;
    padding-bottom : 5px !important;
}
.label-service { font-size:25px; }
.certified { display: block;margin:5px auto 7px 0;width: 60px; }
.powered { margin-top:20px;display: block;width: 100%; }
.btn{text-transform: none !important;}

@media only screen and (max-width: 576px) {
    .m-statistic{margin-bottom: 0px !important;padding:10px}
    .m-statistic-first{border-bottom: 1px solid white;margin-bottom: 0px !important;}
    .m-statistic-second{border-bottom: 1px solid white;border-left: 1px solid white;}
    .m-statistic-last{border-left: 1px solid white;}
    .bg-klikpoin { margin-top:-29px !important; }
}

@media only screen and (max-width: 768px) {
    .label-service { font-size: 14px;margin-top:12px; }
    .talent-space { margin-top:0px; }
    .how-work-space { margin-top:0px; }
    .what-say-space { margin-top:0px; }
    .package-space { margin-top: 0px; }
    .certified { width: 70px; }
    .powered { width: 100%; }
    .fs-60 { font-size:45px; }
    .space-banner { margin-top:20% !important; }
    .logo-footer { margin:0 auto 15px auto !important; }
    .space-footer { padding-bottom: 15px; }
    .cleaner-img { width:100% !important; }
    .klikpoin-step{padding: 20px 50px 40px 50px;margin-bottom: 0 !important;}
    .m-text-center{text-align: center !important;}
    .m-promo-get{font-size:10px !important; padding-top: 5px !important;padding-bottom: 5px !important;padding-left: auto !important;padding-right: auto !important;}
    .m-static-text-bottom{margin-bottom: 0px;}
    #right-bar{padding-top:20px !important;}
    .itemsbox_btn{
        background-color: white !important;
        border-radius: 50px !important;
        border: 2px solid grey;
        color:grey;
        padding: 0px !important;
        height:30px !important;
        width:30px !important;
        font-size:15px !important;
        vertical-align: center;
        box-shadow: none !important;
        margin: 0 !important;
    }
    .divitemsbox > .input-group {
        width:90% !important;
        margin: 0 auto;
    }
    .social-media-icon{text-align: :center !important;}
    .social-media-title{text-align: center !important;font-size:11px !important;}
    .knc-desc-footer{text-align: center !important;}
    .mobile-space-saving { margin-top:40px; }
    .dropdown-menu{height:200px;overflow-y:auto;}
    .vissionImage{border-radius: 0px !important}
    .missionImage{border-radius: 0px !important}
    .vissionText { padding:20px 30px !important; }
    .missionText { padding:20px 30px !important; }
    .vissionText>.a, .missionText>.a{text-align:center;}
    .vissionText>.b, .missionText>.b{text-align:center;font-size:14px !important;}
    .storyAbout,.talentAbout{text-align: center;}
    .homepage-service{padding: 5px !important;margin-bottom:0 !important;}
    .homepage-service-section{padding:10px !important;}
    .m-footer{padding-left:15px !important;padding-right:15px !important; width:100%}
    .m-homepage-textbanner{font-size:20px !important; margin-top:30%;}
    .klikpoin-img { height: auto !important; }
    .bx-wrapper .bx-prev{left: 10px !important;}
    .bx-wrapper .bx-next{right: 10px !important;}
    .header-title{margin-top:30px;}
    /**package**/
    .switch-field{
        justify-content: center!important;
    }
    .switch-field center{margin:0 auto !important;}
    .switch-month {
        float:none !important;
        content-align:center;
        display: flex;
        overflow: hidden;
        padding-right: 2px !important;
        font-size: 11px !important;
    }
    .switch-month label {
        font-size: 10px !important;
    }
    .cust-box-title,.klikwallet-title,.btn-cust-info{text-align: center !important;}
    .btn-radius{font-size: 17px !important;}
    .wrap-cust-table{margin:0px !important;padding:0 !important;}
    .card-body{padding:10px !important;}
    .m-text-center{text-align: center !important;}
    .m-content-center{justify-content: center !important;}
    .m-btn{font-size:15px !important;}
    .m-topup-wallet-info{background: #FFFFE5;padding:0 !important;}
    .m-topup-wallet-info h6{margin-left: 10px !important;}
    .m-topup-wallet-info ol, .m-topup-wallet-info ol ul{margin-left: -10px !important;}

    /**dashboard customer**/
    .cust-image{height:50px !important;width:50px !important;overflow: hidden;border-radius:50%;margin-top:20px !important;margin-left:20px;}
    .cust-dashboard-title{height: 50px !important;vertical-align: top !important;padding-left: 10px !important;margin-top:20px;font-size:12px;}
    .cust-dashboard-title p{font-size:15px !important;line-height: 50px !important;}
    .cust-box{padding:0 !important;}
    .wrap-button-edit{text-align: left !important; padding-left: 70px;padding-top: 0 !important;height: 50px !important;line-height: 50px !important;margin-bottom: 20px;}
    .cust-box-item-left{padding-left: 10px !important; padding-right: 10px !important; float: none !important;width: 100% !important;}
    .cust-box-item{border-left:none !important;border-right:none !important;}
    .cust-box-item-right{padding-left: 10px !important; padding-right: 10px !important; float: none !important;width: 100% !important;}
    .btn .btn-sm{padding-left: 10px !important;}
    .cust-box-item-center{padding:10px !important}
    .btn-sm{margin-left:0 !important;padding:5px 10px !important }
    .cust-slider{border-right:none !important;padding:30px;}
    .content-space{height: 120px !important;}
    .title-page{margin-bottom: 30px;}
    .klikwallet-title{margin-top:30px;}
    .text-cust-info{text-align: left !important;}
    .icon-cust-info{margin-right: 10px !important;}
    .title-note{font-size: 11px;}
    .topup-box-right{padding:10px !important;}
    .knc-button-sm{width: 70px !important;}
    .phone-title { font-size: 21px !important;font-weight: bold; }
    /**Icon Whatsapp Fix**/
    .m-wa-chat {
        position: fixed;
        bottom: 0px;
        right: 0px;
        z-index: 50000;
        min-height: 30px;
        background-color: #FFF;
        min-width: 100%;
        padding: 10px 0px;
        -webkit-box-shadow: 0 10px 20px 0 rgba(53,64,90,.2);
        box-shadow: 0 10px 20px 0 rgba(53,64,90,.2);
    }
    .m-wa-chat .wa-image-container {
        display: inline-block;
        vertical-align: middle;
        height: 20px;
        margin-right: 8px;
    }
    .m-wa-chat .wa-image-container .wa-image {
        width: 100%;
        height: 100%;
    }
    .m-wa-chat .wa-text, .m-wa-chat .fab {
        display: inline-block;
        vertical-align: middle;
        color: #fff;
        font-size: 13px;
        font-weight: 600;
        line-height: 20px;
    }
    .m-cust-card{padding:0 !important;}
    .vl {
      height: 70px !important;
    }
    .logo-partner-knc { width: 95px !important; }
    .logo-partner-bamms { width: 200px !important;margin-top:6px; }
    .office-table { padding:0 !important;border:3px solid #184267 !important; }
    .logo-klikoffice { width: 200px !important; }
}

.itemsbox_btnss {
    height: 38px;
    margin: 0 !important;
}
.itemsbox {
    width: 57px;
}

.divitemsbox {
    width: 100%;
    margin-bottom: 15px;
    text-align: center;
    color:#000000;
    border: 1px solid #55bfca;
    border-radius: 10px;
    padding-top: 12px;
    padding-bottom: 12px;
    cursor: pointer;
}

.divitemsbox_active {
    width: 100%;
    margin-bottom: 15px;
    text-align: center;
    color:#FFFFFF;
    border: 1px solid #55bfca;
    background-color: #55bfca;
    border-radius: 10px;
    padding-top: 12px;
    padding-bottom: 12px;
    cursor: pointer;
}

.divitemsbox label { margin-bottom:0 !important; }
.divitemsbox_active label { margin-bottom:0 !important; }

.paket_servicenya {
    width: 100%;
    text-align: left;
    /*border: 1px solid #55bfca;*/
    border-radius: 10px;
    /*font-weight: bold;*/
    padding: 10px;
}

.footer-header-menu { margin-bottom: 20px; }
.footer-item { font-size:14px;margin-bottom:14px;  }

/***//***/
div.right-bar {
    position: -webkit-sticky;
    position: sticky;
    top: 120px;
}
.box{
    width:100%;
    border: 0.5px solid #DCDCDD;
    border-radius:5px;
    padding:15px;
    box-shadow:0px 5px 10px #DCDCDD;
    background-color: white;
}
.section-title {
    font-size:17px;
    font-weight:bold;
    color:black
}
#order_submit_confirm_btn {
    border-radius:10px;
    color:white;
    text-transform: none;
    font-weight:bold
}
#distance_km, #durasi_set, #show_base_set, #show_transport_set, #show_discount_set {
    font-weight: bold;
    color:black
}
.detail-right-content {
    color:grey;
}
.form-note {
    color:grey;
    font-size:12px;
    padding-left: 10px;
}
.btn_copy{
    padding:7px 20px;
    background-color:white;
    border:1px solid grey;
    border-radius:15px;
}
.promo-title{
    margin-top:0px;
    font-weight: bold;
    color:black
}
.promo-element{
    vertical-align:top;font-size:13px;padding-top:5px;color:black;
}
.btn-promo-copy{
    font-weight:bold;font-size:15px;
}
.box-element{
    margin-bottom:10px !important;
    position:relative;
}
.promo-icon{
    font-size:33px;margin-right:5px;
}
.btn-primary-knc{
    background-color: #55bfca;
    text-transform: none;
    color:white;
    font-weight:bold;
    border-radius:10px;
}
input, textarea, select{
    background-color: #F6F6F6 !important;
}
.inline-radio{
    display:inline-block; margin-right:20px;
}
input.itemsbox{
    border:0px;
    background-color: white !important;
    text-align: center;
    padding:0px;
    width: 20%;
}
.itemsbox_btn{
    background-color: white !important;
    border-radius: 50px !important;
    border: 2px solid grey;
    color:grey;
    padding: 0px !important;
    height:40px;
    width:40px;
    font-size:25px;
    vertical-align: center;
    box-shadow: none !important;
    margin: 0 !important;
}
button.itemsbox_btn:hover{
    color: #86ABC8 !important;
}
.btn-minus{
    background-color: #B7B7B7;
    color: #B7B7B7;
}
.btn-plus{
    border-color: #86ABC8;
    color: #86ABC8;
}
.divitemsbox > .input-group {
    width:60%;
    margin: 0 auto;
}
.btn-active{
    border-color: #86ABC8 !important;
    color: #86ABC8 !important;
}

.icon-img-header { width: 20px; }
.knc-button { background: #55bfca !important;color:white !important;border-radius: 5px; text-transform: none; }
.space-banner { margin-top:12%; }
.grayscale {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
.voucher-title { font-weight: bold;margin-bottom: 10px; }
.service-type-header { margin-top:-17%; }
.full-width { width: 100%; }
.logo-footer { width: 115px;display:block;margin:0 auto 18px 0; }
.cleaner-img { width:150px; }

.modal-content{
    border-radius:10px !important;
}
.modal-content h4 {
    font-weight: bold;
    color: #55bfca !important;
}
.col-7{
    font-weight: bold;
}
.close{
    color:#55bfca !important;
    margin-top: 10px;
}

.heading-blue{color:#55bfca;font-weight:bold}
.strong{font-weight: bold !important;}
strong{font-weight: bold !important;}
b{font-weight: bold !important;}
.confirm_data .col-md-6, .confirm_data .col-6{font-weight: bold}
.service-strong{font-weight:bold}

.social-media-icon{font-size:45px;}
.social-media-title{font-size:15px;color:black;}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus{background-image: radial-gradient(#31a2b8, #31a2b8, #31a2b8, #FFFFFF 50%) !important;}
.bx-default-pager a {
	width: 20px !important;
	height: 20px !important;
	border-radius: 20px !important;
}
.bx-wrapper .bx-controls-direction a{z-index: 1002 !important;}
.knc-desc-footer{font-size:12px;}
.logo-sosmed-footer { width: 40px;margin-top:-10px; }
.vissionMission > div{padding:0}
.vissionImage{overflow: hidden;border-top-left-radius: 70px}
.vissionText {display: table-cell; vertical-align: middle;padding:0 50px}
.missionText {display: table-cell; vertical-align: middle;padding:0 50px}
.missionImage{overflow: hidden;border-bottom-right-radius: 70px}
.vissionText>.a, .missionText>.a{font-weight:bold;font-size:25px}
.vissionText>.b, .missionText>.b{font-style: italic;font-size:20px;}
.storyAbout{}
.bx-wrapper{border:0px solid #FFF !important;box-shadow:none;}
.bx-default-pager a, .bx-wrapper .bx-pager.bx-default-pager a{background-color:white !important;border:2px solid #31a2b8 !important;}
.slider .card {box-shadow:none; webkit-box-shadow:none}
.img-icon-saving { width: 150px;margin-bottom: 15px; }
.m-cleaner{font-size:12px;}
.m-cleaner .col-7{font-weight:normal;}
.klikpoin-img { height: 300px; }
.image-topbar{margin-top:-3px;width: 18px !important; height: 18px !important;}
.image-topbar-right{width: 15px !important; height: 15px !important;}
.text-topbar{font-size:14px;}
.transparent{opacity: 0.9;}
.nav-item:hover{color:#FFDD00 !important;}
.title-section, .title-section > h3{font-weight:700 !important;}
.title-section, .title-section > h2{font-weight:900 !important; font-size: 1.75rem;}
h3.testi, h3.perbandingan  {font-size: 1.25rem; font-weight:700 !important;}

.home-service-box:hover h4{
    text-align: center;
    position: relative;
    top:20%;
}
.zoom-image {
    height: 100%;
    overflow: hidden !important;
    border-radius: 20px;
}
.zoom-image img, .home-service-box h4 {
  transition: transform .5s ease;
}
.zoom-image:hover img {
  transform: scale(1.5);
}
.bx-wrapper, .bx-viewport{border-radius: 10px !important;border:0 !important;box-shadow: none !important;background: transparent !important;}
.bx-wrapper .bx-next{background: url("../../img/icons/right.png") no-repeat !important;background-size: 70% 70% !important; background-position: center !important;border:2px solid #54bdc8;border-radius:50%;}
.bx-wrapper .bx-prev{background: url("../../img/icons/left.png") no-repeat !important;background-size: 70% 70% !important; background-position: center !important;border:2px solid #54bdc8;border-radius:50%;}
.text-italic{font-style: italic;}
.isActive{color:#FFDD00 !important; background: #54bdc8 !important;}
.navbar-nav a.nav-link:hover, .dropdown-menu a.dropdown-item:hover{color:#FFDD00 !important;background: #54bdc8 !important;}
.klikpoin-space { margin-bottom: 10px; }

.success{color:white;font-weight: bold;background: #00B800;padding:2px 5px 2px 5px;border-radius:5px;}
.danger{color:white;font-weight: bold;background: red;padding:2px 5px 2px 5px;border-radius:5px;}
.primary{color:white;font-weight: bold;background: blue;padding:2px 5px 2px 5px;border-radius:5px;}
.default{color:black;font-weight: bold;background: yellow;padding:2px 5px 2px 5px;border-radius:5px;}

.box{border-radius: 15px;}
.package-name{
    font-size: 15px;
}
.package-price{
    font-size: 25px;
    font-weight: bold;
}
.p-hr{
    margin-top: 15px;
    margin-bottom: 15px;
    width: 80%;
}
.btn-small{
    border-radius:50px;
}
.package-box{
    color:#55bfca;
    border: 1px solid #A0B7A0;
    border-radius: 15px;
    overflow: hidden;
}
.package-deluxe{
    background: #6CCFA1;
    border: 1px solid #6CCFA1;
}
.package-superior{
    border: 1px solid #54bdc8;
    background: #54bdc8;
    position:relative;
}
.package-mansion{
    border: 1px solid #395b82;
    background: #395b82;
}
.package-premansion{
    border: 1px solid #19A419;
    background: #19A419;
}
.text-black{
    color:black;
}
.best-seller{
    color:white;
    background-color: #55bfca;
}

/** package page **/
.switch-field {
    display: flex;
    overflow: hidden;
}
.switch-field input {
    position: absolute !important;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    width: 1px;
    border: 0;
    overflow: hidden;
}
.switch-field label {
    background-color: white;
    /**color: rgba(0, 0, 0, 0.6);**/
    color:#55bfca;
    font-size: 15px;
    line-height: 10px;
    text-align: center;
    padding: 10px 16px;
    margin-right: -1px;
    border: 1px solid #55bfca;
    transition: all 0.1s ease-in-out;
}
.switch-field label:hover {
    cursor: pointer;
}
.switch-field input:checked + label {
    background-color: #55bfca !important;
    color:white;
    box-shadow: none;
}
.switch-field label:first-of-type {
    border-radius: 4px 0 0 4px;
}
.switch-field label:last-of-type {
    border-radius: 0 4px 4px 0;
}
#label-one, #label-ones{border-radius: 20px 0 0 20px !important;}
#label-two, #label-twos{border-radius: 0 20px 20px 0 !important;}
.switch-month {
    display: flex;
    overflow: hidden;
    padding-right: 5px;
}
.switch-month input {
    position: absolute !important;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    width: 1px;
    border: 0;
    overflow: hidden;
}
.switch-month label {
    font-size: 15px;
    line-height: 10px;
    text-align: center;
    padding: 10px 16px;
    margin-right: -1px;
    color:grey;
}
.switch-month label:hover {
    background-color: #e4e4e4;
    color: rgba(0, 0, 0, 0.6);
    font-size: 15px;
    text-align: center;
    padding: 10px 16px;
    margin-right: -1px;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
    transition: all 0.1s ease-in-out;
    cursor: pointer;
}
.switch-month input:checked + label {
    background-color: #55bfca !important;
    box-shadow: none;
    color:white;
}
.switch-month label:first-of-type {
    border-radius: 4px 0 0 4px;
}
.switch-month label:last-of-type {
    border-radius: 0 4px 4px 0;
}
#label-month{border-radius: 20px !important; margin-left:20px;}
.package-head{color:white;padding-top:20px}
.btn-deluxe{border-radius: 15px;background: #6ccfa1; color:white;text-transform: none;font-weight:bold}
.btn-superior{border-radius: 15px;background: #54bdc8; color:white;text-transform: none;font-weight:bold}
.btn-mansion{border-radius: 15px;background: #395b82; color:white;text-transform: none;font-weight:bold}
.btn-premansion{border-radius: 15px;background: #19A419; color:white;text-transform: none;font-weight:bold}
.package-bottom{padding:10px;}
.container-box{padding-left:7px !important;padding-right:7px !important;}
.package-head i {font-size:23px;margin:2px;}
.package-second{display:none;}
.package-default-text{color:#395b82}
/** end package page **/

/**KlikWallet**/
.title-cust-data{color:#184267;font-weight: bold;margin-left:15px;}
.icon-cust-info{font-size:50px;color:white;background:#55bfca;padding:5px;border-radius:40px;height:80px;width:80px;margin-right: 20px;}
.icon-cust-info i{line-height: 75px;}
.text-cust-info h5, .text-cust-info h3{margin-bottom: 0;}
.btn-radius{border-radius:15px !important;}
.btn-cust-info{padding-top: 30px}
.cust-table th{color:#55bfca;font-weight:bold}
/**End KlikWallet**/

.cust-box{padding-top:20px;}
.content-space{height: 150px;}

/**dashboard customer**/
.cust-image{height:100px;width:100px;overflow: hidden;border-radius:50%;}
.cust-image img{height: 100%;}
.cust-dashboard-title{height: 100px;vertical-align: top;padding-left: 20px;}
.cust-dashboard-title p{font-size:25px;line-height: 100px;color:grey}
.knc-button-default{border-radius: 10px;border: 1px solid #55bfca; color: #55bfca !important;box-shadow: none; text-transform: none;padding:10px 20px;}
.wrap-button-edit{height: 100px; line-height: 100px;}
.cust-box-item{border:1px solid #55bfca; border-bottom: 0;}
.cust-box-item-center{padding:30px 20px;}
.cust-box-item-left,.cust-box-item-right{border-top: 1px solid #55bfca; width:95%;padding-top:30px;padding-right:20px;}
.cust-box-item-left{float: right;}
.cust-box-item-right{padding-left: 20px;padding-right:0px}
.cust-box-item-title{margin-top:15px;margin-bottom: 0px;}
.italic{font-style: italic;}
.btn.btn-sm{padding:10px !important;border-radius: 20px !important;font-size: 13px !important;}
.cust-slider-text{margin-top:20px;}
.cust-link-right{color:grey !important;}
.cust-slider{border-left:0.5px solid grey;border-right:0.5px solid grey;padding:30px;}
.title-page{color:#55bfca}
/**end dashboard**/
.title-note{font-style: italic;}
.m-topup-wallet-info{background: #FFFFE5;padding:0;}
.topup-box-left{padding:20px 20px;}
.topup-box-right{padding:20px;}

/**Corner Ribbon**/
.corner-ribbon{
  width: 150px;
  background: #e43;
  position: absolute;
  top: 35px;
  left: -80px;
  text-align: center;
  line-height: 70px;
  letter-spacing: 1px;
  color: #f0f0f0;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
/* Custom styles */
.corner-ribbon.sticky{
  position: fixed;
}
.corner-ribbon.shadow{
  box-shadow: 0 0 3px rgba(0,0,0,.3);
}
/* Different positions */
.corner-ribbon.top-left{
  position:absolute;
  top: -10px;
  left: -50px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
.corner-ribbon.top-right{
  top: 25px;
  right: -50px;
  left: auto;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.corner-ribbon.bottom-left{
  top: auto;
  bottom: 25px;
  left: -50px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.corner-ribbon.bottom-right{
  top: auto;
  right: -50px;
  bottom: 25px;
  left: auto;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
/* Colors */
.corner-ribbon.white{background: #f0f0f0; color: #55bfca;}
.corner-ribbon.black{background: #333;}
.corner-ribbon.grey{background: #999;}
.corner-ribbon.blue{background: #39d;}
.corner-ribbon.green{background: #2c7;}
.corner-ribbon.turquoise{background: #1b9;}
.corner-ribbon.purple{background: #95b;}
.corner-ribbon.red{background: #e43;}
.corner-ribbon.orange{background: #e82;}
.corner-ribbon.yellow{background: #ec0;}
/**end ribbon**/
.knc-button-sm{width: 80px; padding:5px 10px !important;}
.service_package{background-color: white !important;}
.service_package_0 .package-head,.service_package_1 .package-head,.service_package_2 .package-head,.service_package_3 .package-head,.service_package_4 .package-head,.service_package_5 .package-head,.service_package_6 .package-head,.service_package_7 .package-head,.service_package_8 .package-head,.service_package_9 .package-head{color:black;}
.service_package_0 .text-package-name, .service_package_0 .text-package-price{color: #163753 !important;}
.service_package_0 .btn{background: #163753;border-radius: 15px !important;}
.service_package_1 .text-package-name, .service_package_1 .text-package-price{color: #15769B !important;}
.service_package_1 .btn{background: #15769B;border-radius: 15px !important;}
.service_package_2 .text-package-name, .service_package_2 .text-package-price{color: #55BFCA !important;}
.service_package_2 .btn{background: #55BFCA;border-radius: 15px !important;}
.service_package_3 .text-package-name, .service_package_3 .text-package-price{color: #FFA200 !important;}
.service_package_3 .btn{background: #FFA200;border-radius: 15px !important;}
.service_package_4 .text-package-name, .service_package_4 .text-package-price{color: #FF8000 !important;}
.service_package_4 .btn{background: #FF8000;border-radius: 15px !important;}

.icon-text-top{color:grey;}
.icon-text-center{color:#19075B;font-weight: bold;font-size:25px;}
.icon-text-bottom,.detail-bold{color:#19075B;}
.detail-order-text{font-weight: bold;}
.detail-booked, .detail-ref, .detail-branch, .detail-confirm, .detail-total{color:#19075B}
.detail-payment-status, .detail-order-status{color:red}
.detail-payment-method{color:orange;}
.detail-info{font-weight: bold;color:#19075B}

.title-info{font-size: 20px;font-weight: bold;color:#19075B}
.text-info-bold{color:#19075B;font-weight: bold;}
.set-address-default{color:#19075B}
#password{cursor: pointer;}

.wa-chat {
    position: fixed;
    bottom: 55px;
    right: 30px;
    z-index: 500;
    min-height: 50px;
    background-color: #4caf50;
    min-width: 148px;
    padding: 10px 26px;
    border-radius: 25px;
    -webkit-box-shadow: 0 10px 20px 0 rgba(53,64,90,.2);
    box-shadow: 0 10px 20px 0 rgba(53,64,90,.2);
}
.wa-chat .wa-image-container {
    display: inline-block;
    vertical-align: middle;
    width: 30px;
    height: 30px;
    margin-right: 8px;
}
.wa-chat .wa-image-container .wa-image {
    width: 100%;
    height: 100%;
}
.wa-chat .wa-text {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
}

.bg-bronze{ background: #E58B4A !important;}
.bg-silver{ background: #67A0BC !important;}
.bg-gold{ background: #D5A441 !important;}
.bg-saphire{ background: #5F6DD9 !important;}
.bg-diamond{ background: #5385CB !important;}
.bg-packagea{ background: #16375E !important;}
.bg-packageb{ background: #15769B !important;}
.bg-packagec{ background: #55BFCA !important;}
.bg-packaged{ background: #FFA200 !important;}
.bg-packagee{ background: #FF8000 !important;}
.bg-klikpoin { margin-top:-47px;background-image: linear-gradient(to right, #2372e8, #0093f6, #00aff9, #00c9f6, #67e0f3); }

.expire{ background:#B2B2B2 !important;}
.vl {
  border-left: 3px solid #e1e1e1;
  height: 95px;
  position: absolute;
  left: 50%;
  margin-left: -3px;
  top: 0;
}
.logo-partner-knc { width: 120px; }
.logo-partner-bamms { width: 275px; }

#sb_widget .ic-connected {display: none;}
.ic-invite, .ic-members, .ic-leave, .count{display: none;}
.office-table { padding: 20px;
    border: 10px solid #184267;
    border-radius: 10px; }
.office-table table tr td { border: 1px solid #000;font-weight: 600; }
.logo-klikoffice { width: 100%; }