@charset "UTF-8";
@import url("../fonts/myhealthgroup/index.css");
@import url("../fonts/linefont/font.css");

:root {
  --ui-main-font-family-bold: LINESeedSans_Bd, LINESeedSansTH_Bd;
  --ui-main-font-family-regular: LINESeedSans_Rg, LINESeedSansTH_Rg;
  /* --ui-main-font-family-bold: myHealthFirst-Bold;
  --ui-main-font-family-regular: myHealthFirst-Regular; */

  --ui-primary-text-color: #000000;
  --ui-secondary-text-color: #6d6d6d;
  --ui-text-color-white: #ffffff;
  --ui-bg-content: #ffffff;
  --ui-sub-border: rgba(0, 0, 0, 0.1);
  --ui-text-grey: #58595b;
  --ui-text-blueMHF: #2ac4f0;
  --ui-border-lightblue: #8ed1f1;

  --ui-primary-text-color: #000000;
  --ui-secondary-text-color: #6d6d6d;
  --ui-text-color-white: #ffffff;
  --ui-bg-content: #ffffff;
  --ui-sub-border: rgba(0, 0, 0, 0.1);
  --ui-text-grey: #58595b;
  --ui-text-blueMHF: #2ac4f0;
  --ui-border-lightblue: #8ed1f1;

  --ui-hero-h: 350px;
  --ui-header-h: 90px;
  --ui-header-search-h: 150px;
  --ui-header-search-h-ipx: 159px;

  --ui-red-button-text: #ff0000;
  --ui-grey-button-text: #000000;
  --ui-grey-button-bg: #f1f1f1;
  --ui-grey-button-text-hover: #ffffff;
  --ui-grey-button-bg-hover: #e0e0e0;
  --ui-grey-button-badge-bg: #ffffff;

  --ui-green-button-text: #ffffff;
  --ui-green-button-bg: #00f008;
  --ui-green-button-bg-hover: #00ac06;

  --ui-avatar-bg: #ffffff;
  --ui-avatar-border: #f57070;
  --ui-circle-border: #ffc629;

  --ui-icon-color: #f57070;
  --ui-icon-bg: rgba(255, 255, 255, 1);
  --ui-icon-bg-hover: rgba(0, 0, 0, 0.05);
  --ui-button-mhf: #2ac4f0;

  --calendar-header-text-color: #ffffff;
  --calendar-header-bg-color: #f57070;
  --calendar-primary-color: #000000;
  --calendar-secondary-color: #979797;
  --calendar-third-color: #d8d8d8;
  --calendar-fourth-color: #f8f8f8;
  --calendar-fifth-color: #f0f0f0;
  --calendar-sixth-color: #c8c8c8;
  --calendar-seventh-color: #0071ce;

  --base-grey-bg: #f7f7f7;
}

.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}

.clear {
  clear: both;
}

.red-dot {
  color: var(--ui-red-button-text);
}

.oneline {
  white-space: nowrap;
  overflow: hidden;
  white-space: ellipsis;
}

/* CSS Document */
.font-8 {
  font-size: 8px
}

.font-10 {
  font-size: 10px
}

.font-12 {
  font-size: 12px
}

.font-14 {
  font-size: 14px
}

.font-16 {
  font-size: 16px
}

.font-18 {
  font-size: 18px
}

.font-20 {
  font-size: 20px
}

.font-22 {
  font-size: 22px
}

.font-24 {
  font-size: 24px
}

.font-25 {
  font-size: 25px
}

.font-29 {
  font-size: 29px
}

.font-35 {
  font-size: 35px
}

.font-37 {
  font-size: 37px
}

.font-40 {
  font-size: 40px
}

.font-50 {
  font-size: 50px
}

.font-b {
  font-weight: bold
}

.font-bder {
  font-weight: bolder
}

.font-b200 {
  font-weight: 200
}

.font-b400 {
  font-weight: 400
}

.font-b800 {
  font-weight: 800
}

.font-b1000 {
  font-weight: 1000
}

.font-b2000 {
  font-weight: 2000
}

.font-l {
  font-weight: lighter
}

.square-20px {
  width: 20px;
  height: 20px;
}

.square-30px {
  width: 30px;
  height: 30px;
}

.square-35px {
  width: 35px;
  height: 35px;
}

.square-40px {
  width: 40px;
  height: 40px;
}

.square-45px {
  width: 45px;
  height: 45px;
}

.square-50px {
  width: 50px;
  height: 50px;
}

.square-55px {
  width: 55px;
  height: 55px;
}

.square-60px {
  width: 60px;
  height: 60px;
}

.square-70px {
  width: 70px;
  height: 70px;
}

.square-80px {
  width: 80px;
  height: 80px;
}

.square-90px {
  width: 90px;
  height: 90px;
}

.square-100px {
  width: 100px;
  height: 100px;
}

.font-grey {
  color: rgba(66, 66, 66, 1.00);
}

.f80black {
  color: rgba(0, 0, 0, 0.80);
}

.f60black {
  color: rgba(0, 0, 0, 0.60);
}

.f40black {
  color: rgba(0, 0, 0, 0.40);
}

.f20black {
  color: rgba(0, 0, 0, 0.20);
}

.f10black {
  color: rgba(0, 0, 0, 0.10);
}

.f80white {
  color: rgba(255, 255, 255, 0.80);
}

.f60white {
  color: rgba(255, 255, 255, 0.60);
}

.f40white {
  color: rgba(255, 255, 255, 0.40);
}

.f20white {
  color: rgba(255, 255, 255, 0.20);
}

.f10white {
  color: rgba(255, 255, 255, 0.10);
}

.oneline {
  white-space: nowrap;
  text-overflow: ellipsis;
}

.w-100per {
  width: 100% !important;
}

.w-1per {
  width: 1% !important;
}

.w-4per {
  width: 4% !important;
}

.w-5per {
  width: 5% !important;
}

.w-10per {
  width: 10% !important;
}

.w-15per {
  width: 15% !important;
}

.w-20per {
  width: 20% !important;
}

.w-25per {
  width: 25% !important;
}

.w-30per {
  width: 30% !important;
}

.w-35per {
  width: 35% !important;
}

.w-40per {
  width: 40% !important;
}

.w-45per {
  width: 45% !important;
}

.w-50per {
  width: 50% !important;
}

.w-60per {
  width: 60% !important;
}

.w-75per {
  width: 75% !important;
}

.w-auto {
  width: auto !important;
}

.chatIcon {
  font-size: 18px;
  cursor: pointer;
}

.white {
  color: #FFFFFF
}

.blue {
  color: #3498DB
}

.purple {
  color: #9B59B6
}

.green {
  color: #1ABB9C
}

.aero {
  color: #9CC2CB
}

.red {
  color: #E74C3C
}

.dark {
  color: #34495E
}

.orange {
  color: #F39C12
}

.grey {
  color: #eceff1
}

.yellow {
  color: #ffd600
}

.border-blue {
  border-color: #3498DB !important
}

.border-purple {
  border-color: #9B59B6 !important
}

.border-green {
  border-color: #1ABB9C !important
}

.border-aero {
  border-color: #9CC2CB !important
}

.border-red {
  border-color: #E74C3C !important
}

.border-dark {
  border-color: #34495E !important
}

.bg-white {
  background: #fff !important;
  border: 1px solid #fff !important;
  color: #73879C
}

.bg-yellow {
  background: #ffa000 !important;
  border: 1px solid #ffa000 !important;
  color: #fff
}

.bg-green {
  background: #1ABB9C !important;
  border: 1px solid #1ABB9C !important;
  color: #fff
}

.bg-red {
  background: #E74C3C !important;
  border: 1px solid #E74C3C !important;
  color: #fff
}

.bg-blue {
  background: #3498DB !important;
  border: 1px solid #3498DB !important;
  color: #fff
}

.bg-orange {
  background: #F39C12 !important;
  border: 1px solid #F39C12 !important;
  color: #fff
}

.bg-purple {
  background: #9B59B6 !important;
  border: 1px solid #9B59B6 !important;
  color: #fff
}

.bg-lime {
  background: #aeea00 !important;
  border: 1px solid #aeea00 !important;
  color: #fff
}

.bg-lime-dark {
  background: #a7e000 !important;
  border: 1px solid #a7e000 !important;
  color: #fff
}

.bg-blue-sky {
  background: #50C1CF !important;
  border: 1px solid #50C1CF !important;
  color: #fff
}

.bg-cyan {
  background: #00acc1 !important;
  border: 1px solid #00acc1 !important;
  color: #fff
}

.bg-blue-grey {
  background: #546e7a !important;
  border: 1px solid #546e7a !important;
  color: #fff
}

.bg-deep-orange {
  background: #ff5722 !important;
  border: 1px solid #ff5722 !important;
  color: #fff
}

.bg-brown {
  background: #6d4c41 !important;
  border: 1px solid #6d4c41 !important;
  color: #fff
}

.bg-grey {
  background: #616161 !important;
  border: 1px solid #616161 !important;
  color: #fff
}

.bg-pink {
  background: #e91e63 !important;
  border: 1px solid #e91e63 !important;
  color: #fff
}

.bg-pink200 {
  background: #ff4081 !important;
  border: 1px solid #ff4081 !important;
  color: #fff
}

.bg-greenA700 {
  background: #00c853 !important;
  border: 1px solid #00c853 !important;
  color: #fff
}

.text-right {
  text-align: right;
}

.bob-0 {
  border-bottom-width: 0 !important;
}

.bob-1 {
  border-bottom: solid 1px rgba(138, 138, 138, 0.2)
}

.bob-2 {
  border-bottom: solid 2px rgba(138, 138, 138, 0.2)
}

.bob-3 {
  border-bottom: solid 3px rgba(138, 138, 138, 0.2)
}

.bob-4 {
  border-bottom: solid 4px rgba(138, 138, 138, 0.2)
}

.bol-1 {
  border-left: solid 1px rgba(138, 138, 138, 0.2)
}

.bol-2 {
  border-left: solid 2px rgba(138, 138, 138, 0.2)
}

.bol-3 {
  border-left: solid 3px rgba(138, 138, 138, 0.2)
}

.bol-4 {
  border-left: solid 4px rgba(138, 138, 138, 0.2)
}

.bor-1 {
  border-right: solid 1px rgba(138, 138, 138, 0.2)
}

.bor-2 {
  border-right: solid 2px rgba(138, 138, 138, 0.2)
}

.bor-3 {
  border-right: solid 3px rgba(138, 138, 138, 0.2)
}

.bor-4 {
  border-right: solid 4px rgba(138, 138, 138, 0.2)
}

.fix-width-400 {
  max-width: 400px;
}

.fix-width-600 {
  max-width: 600px;
}

.fix-width-800 {
  max-width: 800px;
}

.fix-width-1000 {
  max-width: 1000px;
}

.fix-width-1200 {
  max-width: 1200px;
}

.fix-width-1400 {
  max-width: 1400px;
}

.p-0 {
  padding: 0px !important;
}

.pt-0 {
  padding-top: 0px !important;
}

.pb-0 {
  padding-bottom: 0px !important;
}

.pl-0 {
  padding-left: 0px !important;
}

.pr-0 {
  padding-right: 0px !important;
}

.p-2 {
  padding: 2px;
}

.pt-2 {
  padding-top: 2px;
}

.pb-2 {
  padding-bottom: 2px;
}

.pl-2 {
  padding-left: 2px;
}

.pr-2 {
  padding-right: 2px;
}

.p-5 {
  padding: 5px;
}

.pt-5 {
  padding-top: 5px;
}

.pb-5 {
  padding-bottom: 5px;
}

.pl-5 {
  padding-left: 5px;
}

.pr-5 {
  padding-right: 5px;
}

.p-10 {
  padding: 10px;
}

.pt-10 {
  padding-top: 10px;
}

.pb-10 {
  padding-bottom: 10px;
}

.pl-10 {
  padding-left: 10px;
}

.pr-10 {
  padding-right: 10px;
}

.p-15 {
  padding: 15px;
}

.pt-15 {
  padding-top: 15px;
}

.pb-15 {
  padding-bottom: 15px;
}

.pl-15 {
  padding-left: 15px;
}

.pr-15 {
  padding-right: 15px;
}

.p-20 {
  padding: 20px;
}

.pt-20 {
  padding-top: 20px;
}

.pb-20 {
  padding-bottom: 20px;
}

.pl-20 {
  padding-left: 20px;
}

.pr-20 {
  padding-right: 20px;
}

.p-25 {
  padding: 25px;
}

.pt-25 {
  padding-top: 25px;
}

.pb-25 {
  padding-bottom: 25px;
}

.pl-25 {
  padding-left: 25px;
}

.pr-25 {
  padding-right: 25px;
}

.p-30 {
  padding: 30px;
}

.pt-30 {
  padding-top: 30px;
}

.pb-30 {
  padding-bottom: 30px;
}

.pl-30 {
  padding-left: 30px;
}

.pr-30 {
  padding-right: 30px;
}

.m-0 {
  margin: 0px !important;
}

.mt-0 {
  margin-top: 0px !important;
}

.mb-0 {
  margin-bottom: 0px !important;
}

.ml-0 {
  margin-left: 0px !important;
}

.mr-0 {
  margin-right: 0px !important;
}

.m-2 {
  margin: 2px;
}

.mt-2 {
  margin-top: 2px;
}

.mb-2 {
  margin-bottom: 2px;
}

.ml-2 {
  margin-left: 2px;
}

.mr-2 {
  margin-right: 2px;
}

.m-5 {
  margin: 2px;
}

.mt-5 {
  margin-top: 5px;
}

.mb-5 {
  margin-bottom: 5px;
}

.ml-5 {
  margin-left: 5px;
}

.mr-5 {
  margin-right: 5px;
}

.m-10 {
  margin: 10px;
}

.mt-10 {
  margin-top: 10px;
}

.mb-10 {
  margin-bottom: 10px;
}

.ml-10 {
  margin-left: 10px;
}

.mr-10 {
  margin-right: 10px;
}

.m-15 {
  margin: 15px;
}

.mt-15 {
  margin-top: 15px;
}

.mb-15 {
  margin-bottom: 15px;
}

.ml-15 {
  margin-left: 15px;
}

.mr-15 {
  margin-right: 15px;
}

.m-20 {
  margin: 20px;
}

.mt-20 {
  margin-top: 20px;
}

.mb-20 {
  margin-bottom: 20px;
}

.ml-20 {
  margin-left: 20px;
}

.mr-20 {
  margin-right: 20px;
}

.m-25 {
  margin: 25px;
}

.mt-25 {
  margin-top: 25px;
}

.mb-25 {
  margin-bottom: 25px;
}

.ml-25 {
  margin-left: 25px;
}

.mr-25 {
  margin-right: 25px;
}

.m-30 {
  margin: 30px;
}

.mt-30 {
  margin-top: 30px;
}

.mb-30 {
  margin-bottom: 30px;
}

.ml-30 {
  margin-left: 30px;
}

.mr-30 {
  margin-right: 30px;
}

.nopadding {
  padding: 0 !important;
  margin: 0 !important;
}