@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap');
body{
    font-family: 'Poppins', sans-serif !important;
}
.input-box-gender {
  padding: 0 20px !important;
}
.input-box-gender .custom-radio {
  display: inline-block;
  padding: 12px 20px !important;
}
.input-box-gender label.custom-radio-wrapper {
  margin-bottom: 11px !important;
}
.input-box-gender label.custom-label-radio {
    background: #dbe5ff;
    border-radius: 5px;
    padding-left: 40px !important;
    padding-right: 20px !important;
    cursor: pointer;
}
input#gender_female, input#gender_male {
  transform: translateX(30px);
}

form.contact-form{
    font-size: 15px;
}
.input-box-2 {
    padding: 30px;
    margin-bottom: 20px;
    background: #ffffff63;
    border-radius: 10px;
    box-shadow: 0 0 15px 1px #99999930;
}
.input-box-2 .custom-radio {
    padding: 0px 20px;
}
.input-box-2 label.custom-radio-wrapper {
    margin-bottom: 20px;
}
.input-box-2 label.custom-label-radio {
    padding: 10px;
}
.covid_test_agreement{
    display: inline;
}
.input-box-2 input[type=text], 
.input-box-2 input[type=email], 
.input-box-2 input[type=tel], 
.input-box-2 input[type=time], 
.input-box-2 input[type=password], 
.input-box-2 input[type=number], 
.input-box-2 input[type=date] 
{
    font-size: 15px;
    padding: 20px 25px;
    width: 100%;
    color: #333;
    background-color: #FFF;
    border-radius: 4px;
    border: 2px solid #e4e0e0;
    transition: border-color;
    font-family: 'Poppins';
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 1px;
}
table.minimalistBlack {
    border: 1px solid #555;
    width: 100%;
    text-align: left;
    border-collapse: collapse;
    padding: 10px;
  }
  table.minimalistBlack td, table.minimalistBlack th {
    border:1px solid #c0c0c0;
    padding: 20px;
  }
 
  table.minimalistBlack thead {
    background: #CFCFCF;
    background: -moz-linear-gradient(top, #dbdbdb 0%, #d3d3d3 66%, #CFCFCF 100%);
    background: -webkit-linear-gradient(top, #dbdbdb 0%, #d3d3d3 66%, #CFCFCF 100%);
    background: linear-gradient(to bottom, #dbdbdb 0%, #d3d3d3 66%, #CFCFCF 100%);
    border-bottom: 3px solid #000000;
  }
  table.minimalistBlack thead th {
    font-size: 15px;
    font-weight: bold;
    color: #000000;
    text-align: left;
  }
  table.minimalistBlack tfoot {
    font-size: 14px;
    font-weight: bold;
    color: #000000;
    border-top: 3px solid #000000;
  }
  table.minimalistBlack tfoot td {
    font-size: 14px;
  }
  label.label-table {
    padding-bottom: 20px;
}
.input-box.is-invalid.is-dirty input {
    border: 2px solid #ff6060;
}
tr.is-invalid.is-dirty {
    background-color: #f8bcbc;
}
.input-box-2.is-invalid.is-dirty {
    background: #f8bcbc;;
}
.custom-hide-form{
  display: none;
}

.tip-note{
  font-size: 14px;
}
header.hdr-transparent.hdr-position-absolute {
  background: rgb(255 255 255 / 76%);
}
.slider-appointment {
  display: none;
}
.id-choice label {
  padding: 5px 10px;
}
.id-choice {
  margin-bottom: 20px;
}
label[for=passport_no],
label[for=ic_no] {
  padding-bottom: 10px;
}
.clear-field-icon {
  text-align: right;
  text-decoration: underline;
  cursor: pointer;
  display: inline-block;
}
.clear-field-wrapper{
  text-align: right;
}

.mc-bold {
  font-weight: 600;
}
.input-box-2 .custom-radio {
  padding: 0px 20px;
  position: relative;
}
.custom-radio--booking label.custom-label-radio {
  font-size: 9px;
  width: 55%;
  line-height: 10px;
}
span.branch_name {
  font-weight: 600;
  display: block;
  font-size: 18px;
}
#panel-form .custom-radio span.branch_name {
  line-height: 21px;
  font-weight: 400;
}
.custom-radio--booking {
    background: #f2f5fc;
    border-radius: 5px;

    cursor: pointer;
    margin-bottom: 10px;
    transition: all 0.3s ease-in-out;
    padding: 0 10px 15px 40px !important;
}
.custom-radio--booking:hover{
  background: #27a79a;
  color: #fff;
}
button#contact-submit,
button#booking-submit {
  font-family: 'Poppins';
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 1px;
  background: #dc3545;
  color: #fff;
  padding: 20px 60px 20px 60px;
  border-color: #fff;
  border-radius: 35px;
  box-shadow: 0px 0px 10px 2px #656161;
  /* border: none; */
}
body.booking-body {
  font-family: 'Poppins', sans-serif !important;
  height: auto;
  background-repeat: repeat-y;
  background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);
  background-size: cover;
  background-attachment: fixed;
}
/* div#contact-form.booking-form {
  background: #ffc107;
} */

.layer-ttl--booking h3 {
  position: relative;
  font-size: 32px;
  font-weight: 600;
  color: #015259;
  line-height: 1;
  display: inline-block;
  margin: 0;
  padding: 12px 25px 15px 25px;
  background: #ebfcfd36;
  border-bottom: 2px solid #02A7B6;
  border-radius: 4px;
  font-family: 'Poppins';
}
form#booking-form label {
  font-weight: 500;
  margin: 0;
  font-family: 'Poppins';
  letter-spacing: 1px;
}

@media(max-width:600px) {
  .input-box-gender label.custom-radio-wrapper {
    display: block;
    padding-top: 20px;
  }
  .input-box-gender .custom-radio {
    width: 100% !important;
  }
  .input-box-gender label.custom-label-radio {
    width: calc(100% - 25px);
  }
  .input-box-2 .custom-radio {
    border: 1px solid #ccc;
    margin-bottom: 15px;
  }
  .input-box-2 .custom-radio input[type="radio"] {
    position: absolute;
    top: 50%;
    transform: translate(-8px , -50%);
  }
  .input-box-2.input-box-gender .custom-radio input[type="radio"] {
    position: static;
    top: auto;
    transform: translateX(30px);
  }
.input-box-2 label.custom-label-radio {
  padding-left: 15px !important;
}

}

.appo-item {
  display: block;
  background-color: #eff3f7;
  margin: 8px 0;
  padding: 4px 10px;
  border-radius: 15px;
  box-shadow: 5px 5px 10px 0px #cbcbcb75;
  border: 1px solid #b7b5c18f;
  cursor: pointer;
  text-align: center;
}
.appo-item span {
  display: inline-block;
  margin: 3px 0;
  font-size: 12px;
  font-weight: 600;
}
span.appo-item__total {
  color: #25ab0d;
}
span.appo-item__doctor {
  color: #6666eb;
}
span.appo-item__type {
  color: #fd395d;
}
.appo-item__details {
  margin: 0px 0;
  border: 1px solid #c3cecf;
  padding: 10px;
  box-shadow: 0 0 10px 3px #eee;
  border-radius: 0px;
  transition: all 0.3s ease-in-out;
}
.appo-item__details:hover {
  background-color: #e5f7f9;
  transform: scale(1.05);
}
span.appo-item__details-value {
  font-weight: 600;

}
.company-dashboard .user-menu ul li a {
  font-size: 12px;
}
.form-required {
  color: red;
}
table.dataTable{clear:both;margin-top:6px !important;margin-bottom:6px !important;max-width:none !important;border-collapse:separate !important;border-spacing:0}table.dataTable td,table.dataTable th{-webkit-box-sizing:content-box;box-sizing:content-box}table.dataTable td.dataTables_empty,table.dataTable th.dataTables_empty{text-align:center}table.dataTable.nowrap th,table.dataTable.nowrap td{white-space:nowrap}div.dataTables_wrapper div.dataTables_length label{font-weight:normal;text-align:left;white-space:nowrap}div.dataTables_wrapper div.dataTables_length select{width:auto;display:inline-block}div.dataTables_wrapper div.dataTables_filter{/*text-align:center;*/}div.dataTables_wrapper div.dataTables_filter label{font-weight:normal;white-space:nowrap;text-align:left}div.dataTables_wrapper div.dataTables_filter input{margin-left:0.5em;display:inline-block;width:auto}div.dataTables_wrapper div.dataTables_info{padding-top:0.85em;white-space:nowrap}div.dataTables_wrapper div.dataTables_paginate{margin:0;white-space:nowrap;text-align:right}div.dataTables_wrapper div.dataTables_paginate ul.pagination{margin:2px 0;white-space:nowrap;justify-content:flex-end}div.dataTables_wrapper div.dataTables_processing{position:absolute;top:50%;left:50%;width:200px;margin-left:-100px;margin-top:-26px;text-align:center;padding:1em 0}table.dataTable thead>tr>th.sorting_asc,table.dataTable thead>tr>th.sorting_desc,table.dataTable thead>tr>th.sorting,table.dataTable thead>tr>td.sorting_asc,table.dataTable thead>tr>td.sorting_desc,table.dataTable thead>tr>td.sorting{padding-right:30px}table.dataTable thead>tr>th:active,table.dataTable thead>tr>td:active{outline:none}table.dataTable thead .sorting,table.dataTable thead .sorting_asc,table.dataTable thead .sorting_desc,table.dataTable thead .sorting_asc_disabled,table.dataTable thead .sorting_desc_disabled{cursor:pointer;position:relative}table.dataTable thead .sorting:before,table.dataTable thead .sorting:after,table.dataTable thead .sorting_asc:before,table.dataTable thead .sorting_asc:after,table.dataTable thead .sorting_desc:before,table.dataTable thead .sorting_desc:after,table.dataTable thead .sorting_asc_disabled:before,table.dataTable thead .sorting_asc_disabled:after,table.dataTable thead .sorting_desc_disabled:before,table.dataTable thead .sorting_desc_disabled:after{position:absolute;bottom:0.9em;display:block;opacity:0.3}table.dataTable thead .sorting:before,table.dataTable thead .sorting_asc:before,table.dataTable thead .sorting_desc:before,table.dataTable thead .sorting_asc_disabled:before,table.dataTable thead .sorting_desc_disabled:before{right:1em;content:"\2191"}table.dataTable thead .sorting:after,table.dataTable thead .sorting_asc:after,table.dataTable thead .sorting_desc:after,table.dataTable thead .sorting_asc_disabled:after,table.dataTable thead .sorting_desc_disabled:after{right:0.5em;content:"\2193"}table.dataTable thead .sorting_asc:before,table.dataTable thead .sorting_desc:after{opacity:1}table.dataTable thead .sorting_asc_disabled:before,table.dataTable thead .sorting_desc_disabled:after{opacity:0}div.dataTables_scrollHead table.dataTable{margin-bottom:0 !important}div.dataTables_scrollBody table{border-top:none;margin-top:0 !important;margin-bottom:0 !important}div.dataTables_scrollBody table thead .sorting:before,div.dataTables_scrollBody table thead .sorting_asc:before,div.dataTables_scrollBody table thead .sorting_desc:before,div.dataTables_scrollBody table thead .sorting:after,div.dataTables_scrollBody table thead .sorting_asc:after,div.dataTables_scrollBody table thead .sorting_desc:after{display:none}div.dataTables_scrollBody table tbody tr:first-child th,div.dataTables_scrollBody table tbody tr:first-child td{border-top:none}div.dataTables_scrollFoot>.dataTables_scrollFootInner{box-sizing:content-box}div.dataTables_scrollFoot>.dataTables_scrollFootInner>table{margin-top:0 !important;border-top:none}@media screen and (max-width: 767px){div.dataTables_wrapper div.dataTables_length,div.dataTables_wrapper div.dataTables_filter,div.dataTables_wrapper div.dataTables_info,div.dataTables_wrapper div.dataTables_paginate{text-align:center}}table.dataTable.table-sm>thead>tr>th{padding-right:20px}table.dataTable.table-sm .sorting:before,table.dataTable.table-sm .sorting_asc:before,table.dataTable.table-sm .sorting_desc:before{top:5px;right:0.85em}table.dataTable.table-sm .sorting:after,table.dataTable.table-sm .sorting_asc:after,table.dataTable.table-sm .sorting_desc:after{top:5px}table.table-bordered.dataTable th,table.table-bordered.dataTable td{border-left-width:0}table.table-bordered.dataTable th:last-child,table.table-bordered.dataTable th:last-child,table.table-bordered.dataTable td:last-child,table.table-bordered.dataTable td:last-child{border-right-width:0}table.table-bordered.dataTable tbody th,table.table-bordered.dataTable tbody td{border-bottom-width:0}div.dataTables_scrollHead table.table-bordered{border-bottom-width:0}div.table-responsive>div.dataTables_wrapper>div.row{margin:0}div.table-responsive>div.dataTables_wrapper>div.row>div[class^="col-"]:first-child{padding-left:0}div.table-responsive>div.dataTables_wrapper>div.row>div[class^="col-"]:last-child{padding-right:0}

/*
====================================

            Step Forms

====================================
*/

    /*form styles*/
    #panel-form {
      text-align: center;
      position: relative;
      margin-top: 20px;
  }

  #panel-form fieldset .form-card {
      /*stacking fieldsets above each other*/
      position: relative;
  }

  #panel-form fieldset {
      width: 100%;
      margin: 0;
      /*stacking fieldsets above each other*/
      position: relative;
  }

  /*Hide all except first fieldset*/
  #panel-form fieldset:not(:first-of-type) {
      display: none;
  }

  #panel-form fieldset .form-card {
      text-align: left;
  }


  /*Dropdown List Exp Date*/
  select.list-dt {
      border: none;
      outline: 0;
      border-bottom: 1px solid #ccc;
      padding: 2px 5px 3px 5px;
      margin: 2px;
  }

  select.list-dt:focus {
      border-bottom: 2px solid skyblue;
  }

  /*The background card*/
  .card {
      z-index: 0;
      border: none;
      position: relative;
  }

  /*FieldSet headings*/
  .fs-title {
      font-size: 25px;
      color: #2C3E50;
      margin-bottom: 10px;
      font-weight: bold;
      text-align: left;
  }

  /*progressbar*/
  #progressbar {
      margin-bottom: 30px;
      overflow: hidden;
      color: rgb(71, 71, 71);
  }

  #progressbar .active {
      color: #000000;
  }

  #progressbar li {
      list-style-type: none;
      font-size: 12px;
      width: 11%;
      float: left;
      position: relative;
      text-align: center;
  }

  /*Icons in the ProgressBar*/
  #progressbar li {
    font-family: 'Poppins', sans-serif;
  }
  #progressbar #step_1:before {
      content: "1";
  }
  #progressbar #step_2:before {
      content: "2";
  }
  #progressbar #step_3:before {
      content: "3";
  }
  #progressbar #step_4:before {
      content: "4";
  }
  #progressbar #step_5:before {
      content: "5";
  }
  #progressbar #step_6:before {
      content: "6";
  }
  #progressbar #step_7:before {
      content: "7";
  }
  #progressbar #step_8:before {
      content: "8";
  }
  #progressbar #step_9:before {
      content: "9";
  }
  #progressbar #step_10:before {
      content: "10";
  }



  /*ProgressBar before any progress*/
  #progressbar li:before {
      width: 50px;
      height: 50px;
      line-height: 45px;
      display: block;
      font-size: 21px;
      color: #ffffff;
      background: rgb(71, 71, 71);
      border-radius: 50%;
      margin: 0 auto 10px auto;
      padding: 2px;
      text-align: center;
      font-weight: 600;
  }

  /*ProgressBar connectors*/
  #progressbar li:after {
      content: '';
      width: 100%;
      height: 2px;
      background: rgb(71, 71, 71);
      position: absolute;
      left: 0;
      top: 25px;
      z-index: -1;
  }

  /*Color number of the step and the connector before it*/
  #progressbar li.active:before,
  #progressbar li.active:after {
      background: rgb(16, 204, 41);
  }

  /*Imaged Radio Buttons*/
  .radio-group {
      position: relative;
      margin-bottom: 25px;
  }

  .radio {
      display: inline-block;
      width: 204;
      height: 104;
      border-radius: 0;
      background: lightblue;
      box-shadow: 0 2px 2px 2px rgba(0, 0, 0, 0.2);
      box-sizing: border-box;
      cursor: pointer;
      margin: 8px 2px;
  }

  .radio:hover {
      box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.3);
  }

  .radio.selected {
      box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.1);
  }

  /*Fit image in bootstrap div*/
  .fit-image {
      width: 100%;
      object-fit: cover;
  }

.booking-form--panel .clear-field-wrapper {
    position: absolute;
    right: 31px;
}
.booking-form--panel .input-box-2 {
    position: relative;
}
.booking-form--panel .input-box-2 input[type=text], 
.booking-form--panel .input-box-2 input[type=email], 
.booking-form--panel .input-box-2 input[type=tel], 
.booking-form--panel .input-box-2 input[type=time], 
.booking-form--panel .input-box-2 input[type=password], 
.booking-form--panel .input-box-2 input[type=number], 
.booking-form--panel .input-box-2 input[type=date] 
{
    font-size: 15px;
    padding: 10px 15px;
}
.booking-form--panel .input-box-2 {
  padding: 10px 20px 30px 20px;
}
form#panel-form label {
  font-weight: 500;
  margin: 0;
  font-family: 'Poppins';
  letter-spacing: 1px;
  padding-bottom: 9px;
}
.booking-form--panel .action-button.btn ,
.booking-form--panel .action-button-previous {
  font-family: 'Poppins';
  font-size: 17px;
  letter-spacing: 1px;
  font-weight: 600;
  border-radius: 35px;
  padding: 15px 40px;
}
.booking-form--panel .action-button-previous {
  margin-right: 20px;
}
.booking-form--panel .action-button.btn {
  background-color: #7c03f3;
  border-color: #7c03f3;
}
.input-group-wrapper {
  margin: 20px 0;
}
.custom-checkbox--panel {
  background: #f2f5fc;
  border-radius: 5px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
  padding: 30px 10px 20px 60px !important;
}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
  background: #ce32c2 !important;
  border-color: #ce32c2 !important;
}
.custom-checkbox--panel.custom-checkbox .custom-control-label {
  padding-left: 18px;
}
.custom-radio .custom-control-label {
  color: #000;
  padding-left: 8px !important;
  font-weight: 400 !important;
  margin-bottom: 10px !important;
  margin-top: 10px !important;
}