:root {
    /* --color-link: #0D4599; */
    /* --color-link: #2b5db9; */
    --color-blue: #0f59ca;
    --color-red: #E51F40;
    --color-black: #000;
    --color-green-subtle: #9bdc9e;
    --color-pink: #ff74a3;
    --color-purple: purple;
    --color-mediumpurple: mediumpurple;
    --color-darkcyan: darkcyan;
    --color-yellow: #FFCE3F;
    --color-yellow-subtle: #ffce3f7a;
    --color-vipnoibat: #fb2c36;
    --color-vip1: #f6339a;
    --color-vip2: #ff5723;
    --color-vip3: #155dfc;
    --color-tinthuong: #0e4db3;
    --bs-success-rgb: 76, 175, 80;
    --bs-warning-bg-subtle: #fffae8;

    --color-red-50: #fff1f2;
    --color-red-100: #ffe4e6;
    --color-red-200: #ffccd3;
    --color-red-300: #ffa1ad;
    --color-red-400: #ff637e;
    --color-red-500: #ff2056;
    --color-red-600: #ec003f;
    --color-red-700: #c70036;
    --color-red-800: #a50036;
    --color-red-900: #8b0836;

    --color-orange-50: #fff2ec;
    --color-orange-100: #ffdccc;
    --color-orange-200: #ffc2aa;
    --color-orange-300: #ffa180;
    --color-orange-400: #ff8156;
    --color-orange-500: #FF5723;
    --color-orange-600: #e64e20;
    --color-orange-700: #cc441c;
    --color-orange-800: #a43817;
    --color-orange-900: #7c2b12;
    
    --color-green-50: #ECFDF5;
    --color-green-100: #D1FAE5;
    --color-green-200: #A7F3D0;
    --color-green-300: #6EE7B7;
    --color-green-400: #34D399;
    --color-green-500: #10B981;
    --color-green-600: #059669;
    --color-green-700: #047857;
    --color-green-800: #065F46;
    --color-green-900: #064E3B;

    --color-blue-50: #e9f0fe;
    --color-blue-100: #cddffc;
    --color-blue-200: #aecdff;
    --color-blue-300: #88b4fa;
    --color-blue-400: #5e99f3;
    --color-blue-500: #1366de;
    --color-blue-600: #105acc;
    --color-blue-700: #0e4db3;
    --color-blue-800: #0b3f99;
    --color-blue-900: #072f70;

    --color-gray-100: #fbfcfc;
    --color-gray-200: #f6f8f9;
    --color-gray-300: #eff2f3;
    --color-gray-400: #e9edef;
    --color-gray-500: #f3f6f7;
    --color-gray-600: #cdd2d4;
    --color-gray-700: #a8afb2;
    --color-gray-800: #828a8e;
    --color-gray-900: #5b6367;

}
.z-1021 {
  z-index: 1021 !important;
}
.z-1022 {
  z-index: 1022 !important;
}
.d-flex {
  align-items: center;
}
.d__grid__2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
.x-small {
  font-size: 0.775rem;
}
.xx-small {
  font-size: 0.675rem;
}
.overflow-x-auto::-webkit-scrollbar {
  display: none;
}
.text-gray {
  color: var(--color-gray-500) !important;
}
.text-blue {
  color: var(--color-blue-500) !important;
}
.text-blue-300 {
  color: var(--color-blue-300) !important;
}
.text-blue-700 {
  color: var(--color-blue-700) !important;
}
.text-green {
  color: var(--color-green-500) !important;
}
.text-yellow {
  color: var(--color-yellow) !important;
}
.text-orange {
  color: var(--color-orange-500) !important;
}
.text-orange-300 {
  color: var(--color-orange-300) !important;
}
.text-red {
  color: var(--color-red-500) !important;
}
.text-link {
  color: var(--color-blue-600) !important;
}
.text-link-500 {
  color: var(--color-blue-500) !important;
}
.text-link-body {
    color: var(--color-black);
}
.text-vipnoibat {
  color: var(--color-vipnoibat) !important;
}
.text-vip1 {
  color: var(--color-vip1) !important;
}
.text-vip2 {
  color: var(--color-vip2) !important;
}
.text-vip3 {
  color: var(--color-vip3) !important;
}
.text-tinthuong {
  color: var(--color-tinthuong) !important;
}
.bg-vip {
  background-color: #fff9f3;
}
.bg-darkcyan {
  background-color: var(--color-darkcyan) !important;
}
.bg-purple {
  background-color: var(--color-purple) !important;
}
.bg-mediumpurple {
  background-color: var(--color-mediumpurple) !important;
}
.bg-pink {
  background-color: var(--color-pink) !important;
}
.bg-red {
  background-color: var(--color-red-500) !important;
}
.bg-blue {
    background-color: var(--color-blue-500) !important;
}
.bg-blue-dark {
    background-color: var(--color-blue-700) !important;
}
.bg-orange {
  background-color: var(--color-orange-500) !important;
}
.bg-yellow {
  background-color: var(--color-yellow) !important;
}
.bg-yellow-subtle {
  background-color: var(--color-yellow-subtle) !important;
}
.bg-gray {
  background-color: var(--color-gray-500) !important;
}
.bg-green {
  background-color: var(--color-green-500) !important;
}
.bg-green-subtle {
  background-color: var(--color-green-subtle) !important;
}
.bg-momo {
    background-color: #c6005c !important;
}
.btn {
    transition: none;
}
.btn-tag {
    --bs-btn-color: var(--color-blue-500);
    --bs-btn-bg: #fff;
    --bs-btn-border-color: var(--color-blue-500);
    --bs-btn-hover-color: var(--color-orange-500);
    --bs-btn-hover-bg: #fff;
    --bs-btn-hover-border-color: var(--color-orange-500);
    --bs-btn-focus-shadow-rgb: 211, 212, 213;
    --bs-btn-active-color: var(--color-blue-500);
    --bs-btn-active-bg: #fff;
    --bs-btn-active-border-color: #fff;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--color-blue-500);
    --bs-btn-disabled-bg: #fff;
    --bs-btn-disabled-border-color: #fff;
    user-select: initial;
}
.btn-tag:hover .icon.search {
    background: url(../images/bi-search-orange.svg) center no-repeat;
    background-size: contain;
}
.btn-yellow {
    --bs-btn-color: #000;
    --bs-btn-bg: var(--color-yellow);
    --bs-btn-border-color: var(--color-yellow);
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #ffc61f;
    --bs-btn-hover-border-color: #ffc61f;
    --bs-btn-focus-shadow-rgb: 211, 212, 213;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #ffc61f;
    --bs-btn-active-border-color: #ffc61f;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #ffc61f;
    --bs-btn-disabled-border-color: #ffc61f;
}
.btn-blue {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--color-blue-500);
  --bs-btn-border-color: var(--color-blue-500);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-blue-500);
  --bs-btn-hover-border-color: var(--color-blue-500);
  --bs-btn-focus-shadow-rgb: 211, 212, 213;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-blue-500);
  --bs-btn-active-border-color: var(--color-blue-500);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--color-blue-500);
  --bs-btn-disabled-border-color: var(--color-blue-500);
}
.btn-outline-blue {
  --bs-btn-color: var(--color-blue-500);
  --bs-btn-bg: #fff;
  --bs-btn-border-color: var(--color-blue-500);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-blue-500);
  --bs-btn-hover-border-color: var(--color-blue-500);
  --bs-btn-focus-shadow-rgb: 211, 212, 213;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-blue-500);
  --bs-btn-active-border-color: var(--color-blue-500);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--color-blue-500);
  --bs-btn-disabled-border-color: var(--color-blue-500);
}
.btn-red {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--color-red-500);
  --bs-btn-border-color: var(--color-red-500);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-red-600);
  --bs-btn-hover-border-color: var(--color-red-600);
  --bs-btn-focus-shadow-rgb: 211, 212, 213;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-red-600);
  --bs-btn-active-border-color: var(--color-red-600);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--color-red-600);
  --bs-btn-disabled-border-color: var(--color-red-600);
}
.btn-orange {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--color-orange-500);
  --bs-btn-border-color: var(--color-orange-500);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-orange-600);
  --bs-btn-hover-border-color: var(--color-orange-600);
  --bs-btn-focus-shadow-rgb: 211, 212, 213;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-orange-600);
  --bs-btn-active-border-color: var(--color-orange-600);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--color-orange-600);
  --bs-btn-disabled-border-color: var(--color-orange-600);
}
.btn-outline-orange {
    --bs-btn-color: var(--color-orange-500);
    --bs-btn-bg: #fff;
    --bs-btn-border-color: var(--color-orange-500);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--color-orange-500);
    --bs-btn-hover-border-color: var(--color-orange-500);
    --bs-btn-focus-shadow-rgb: 255, 193, 7;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--color-orange-500);
    --bs-btn-active-border-color: var(--color-orange-500);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--color-orange-500);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--color-orange-500);
    --bs-gradient: none;
}
.btn-white {
  --bs-btn-color: #000;
  --bs-btn-bg: #fff;
  --bs-btn-border-color: #fff;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #F8F9FA;
  --bs-btn-hover-border-color: #F8F9FA;
  --bs-btn-focus-shadow-rgb: 211, 212, 213;
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #F8F9FA;
  --bs-btn-active-border-color: #F8F9FA;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #000;
  --bs-btn-disabled-bg: #f1f1f1;
  --bs-btn-disabled-border-color: #f1f1f1;
}
.btn-white-orange {
  --bs-btn-color: #000;
  --bs-btn-bg: #fff;
  --bs-btn-border-color: #fff;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-orange-500);
  --bs-btn-hover-border-color: var(--color-orange-500);
  --bs-btn-focus-shadow-rgb: 211, 212, 213;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-orange-500);
  --bs-btn-active-border-color: var(--color-orange-500);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--color-orange-500);
  --bs-btn-disabled-border-color: var(--color-orange-500);
}
.btn-green {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--color-green-500);
  --bs-btn-border-color: var(--color-green-500);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-green-600);
  --bs-btn-hover-border-color: var(--color-green-600);
  --bs-btn-focus-shadow-rgb: 60, 153, 110;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-green-600);
  --bs-btn-active-border-color: var(--color-green-600);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #198754;
  --bs-btn-disabled-border-color: #198754;
}
.btn-gray {
  --bs-btn-color: var(--bs-body-color);
  --bs-btn-bg: var(--color-gray-600);
  --bs-btn-border-color: var(--color-gray-600);
  --bs-btn-hover-color: var(--bs-body-color);
  --bs-btn-hover-bg: var(--color-gray-700);
  --bs-btn-hover-border-color: var(--color-gray-700);
  --bs-btn-focus-shadow-rgb: 130, 138, 145;
  --bs-btn-active-color: var(--bs-body-color);
  --bs-btn-active-bg: var(--color-gray-700);
  --bs-btn-active-border-color: var(--color-gray-700);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--color-gray-500);
  --bs-btn-disabled-border-color: var(--color-gray-500);
}
.btn-link-outline {
  --bs-btn-color: var(--color-blue-500);
  --bs-btn-bg: #fff;
  --bs-btn-border-color: var(--color-blue-500);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-blue-500);
  --bs-btn-hover-border-color: var(--color-blue-500);
  --bs-btn-focus-shadow-rgb: 130, 138, 145;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-blue-500);
  --bs-btn-active-border-color: var(--color-blue-500);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #e9ecef;
  --bs-btn-disabled-border-color: #e9ecef;
}
.btn-close {
    --bs-btn-close-opacity: 1;
}
.border-dashed {
    border-style: dashed !important;
}
.border-blue {
  border-color: var(--color-blue-500) !important;
}
.border-blue-200 {
  border-color: var(--color-blue-200) !important;
}
.border-blue-700 {
  border-color: var(--color-blue-700) !important;
}
.border-yellow {
  border-color: var(--color-yellow) !important;
}
.border-orange {
  border-color: var(--color-orange-500) !important;
}
.border-red {
  border-color: var(--color-red-500) !important;
}
.border-gray {
  border-color: var(--color-gray-500) !important;
}
.border-7 {
    border-width: 7px !important;
}
.border-10 {
    border-width: 10px !important;
}
.p-15 {
  padding: 0.35rem;
}
.p-25 {
  padding: 0.7rem;
}
.ps-25 {
  padding-left: 0.7rem;
}
.pe-25 {
  padding-right: 0.7rem;
}
.px-25 {
  padding-left: 0.7rem !important;
  padding-right: 0.7rem !important;
}
.pb-15 {
  padding-bottom: 0.35rem !important;
}
.pb-25 {
  padding-bottom: 0.7rem !important;
}
.pb-6 {
  padding-bottom: 6rem !important;
}
.pt-15 {
  padding-top: 0.35rem !important;
}
.pt-25 {
  padding-top: 0.7rem !important;
}
.p-35 {
    padding: 1.25rem !important;
}
.p-45 {
    padding: 2rem !important;
}
.me-15 {
  margin-right: 0.35rem;
}
.m-25 {
  margin: 0.7rem;
}
.ms-25 {
  margin-left: 0.7rem;
}
.ms-n05rem {
    margin-left: -0.5rem;
}
.me-25 {
  margin-right: 0.7rem;
}
.mb-25 {
  margin-bottom: 0.7rem !important;
}
.mt-25 {
  margin-top: 0.7rem;
}
.mt-n1 {
    margin-top: -0.25rem !important;
}
.mb-n1 {
    margin-bottom: -0.25rem !important;
}
.mt-6 {
    margin-top: 6rem;
}
.fs-1-05 {
  font-size: 1.05rem;
}
.fs-1-07 {
  font-size: 1.07rem;
}
.fs-5-5 {
  font-size: 1.1rem;
}
.fs-7 {
  font-size: 0.95rem !important;
}
.fs-8 {
  font-size: 0.9rem !important;
}
.fs-9 {
  font-size: 0.85rem !important;
}
.fs-10 {
  font-size: 0.8rem !important;
}
.fs-11 {
  font-size: 0.75rem !important;
}
.fs-12 {
  font-size: 0.7rem !important;
}
.fs-13 {
  font-size: 0.65rem !important;
}
.w-20 {
  width: 20% !important;
}
.w-60 {
  width: 60% !important;
}
.h-60 {
  height: 60% !important;
}
.h-20px {
  height: 20px !important;
}
.h-25px {
  height: 25px !important;
}
.h-28px {
  height: 28px !important;
}
.h-30px {
  height: 30px !important;
}
.h-35px {
  height: 35px !important;
}
.h-40px {
  height: 40px !important;
}
.h-45px {
  height: 45px !important;
}
.h-50px {
  height: 50px !important;
}
.h-55px {
  height: 55px !important;
}
.h-100px {
  height: 100px !important;
}
.h-180px {
  height: 180px !important;
}
.h-200px {
  height: 200px !important;
}
.max-130px {
  max-width: 130px !important;
}
.dropdown-menu {
    --bs-dropdown-zindex: 1020;
}
* {
    outline: 0;
}
html {
  font-size: 12px;
}
body {
  /* background-color: #f1f1f1; */
  font-family: var(--bs-body-font-family);
  font-size: var(--bs-body-font-size);
  color: var(--bs-body-color);
}
a {
  color: var(--color-blue-600);
  text-underline-position: under;
  text-decoration: none;
}
a:hover,
a:focus {
  /* text-decoration: underline; */
}
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.5;
}
ul,
li,
ol {
  list-style: none;
  padding: 0;
  margin: 0;
}
img {
  max-width: 100%;
  max-height: 100%;
  height: auto;
  object-fit: cover;
}
figure {
  margin: 0;
  border-radius: 0.4rem;
  background-color: #f1f1f1;
  position: relative;
}
figure img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  max-width: 100%;
  border-radius: 0.4rem;
}
.hide,
.hidden {
  display: none !important;
}
.icon {
  width: 16px;
  height: 16px;
  display: inline-block;
}
.size-5 {
  width: 5px !important;
  height: 5px !important;
}
.size-6 {
  width: 6px !important;
  height: 6px !important;
}
.size-7 {
  width: 7px !important;
  height: 7px !important;
}
.size-9 {
  width: 9px !important;
  height: 9px !important;
}
.size-10 {
  width: 10px !important;
  height: 10px !important;
}
.size-12 {
  width: 12px !important;
  height: 12px !important;
}
.size-14 {
  width: 14px !important;
  height: 14px !important;
}
.size-18 {
  width: 18px !important;
  height: 18px !important;
}
.size-20 {
  width: 20px !important;
  height: 20px !important;
}
.size-22 {
  width: 22px !important;
  height: 22px !important;
}
.size-23 {
  width: 23px !important;
  height: 23px !important;
}
.size-25 {
  width: 25px !important;
  height: 25px !important;
}
.size-30 {
  width: 30px !important;
  height: 30px !important;
}
.size-33 {
  width: 33px !important;
  height: 33px !important;
}
.size-35 {
  width: 35px !important;
  height: 35px !important;
}
.size-40 {
  width: 40px !important;
  height: 40px !important;
}
.size-50 {
  width: 50px !important;
  height: 50px !important;
}
.size-50-60 {
  width: 50px !important;
  height: 60px !important;
}
.size-55-30 {
    width: 55px !important;
    height: 30px !important;
}
.size-60 {
  width: 60px !important;
  height: 60px !important;
}
.size-70 {
  width: 70px !important;
  height: 70px !important;
}
.size-80 {
  width: 80px !important;
  height: 80px !important;
}
.size-80-70 {
    width: 80px !important;
    height: 70px !important;
}
.size-90 {
  width: 90px !important;
  height: 90px !important;
}
.size-90-60 {
  width: 90px !important;
  height: 60px !important;
}
.size-90-70 {
  width: 90px !important;
  height: 70px !important;
}
.size-90-80 {
  width: 90px !important;
  height: 80px !important;
}
.size-100 {
    width: 100px !important;
    height: 100px !important;
}
.size-100-80 {
  width: 100px !important;
  height: 80px !important;
}
.size-110-90 {
  width: 110px !important;
  height: 90px !important;
}
.size-120 {
    width: 120px !important;
    height: 120px !important;
}
.size-120-100 {
  width: 120px !important;
  height: 100px !important;
}
.size-150-100 {
  width: 150px !important;
  height: 100px !important;
}
.size-150-140 {
  width: 150px !important;
  height: 140px !important;
}
.size-240-150 {
  width: 240px !important;
  height: 150px !important;
}
.size-170 {
  width: 170px !important;
  height: 170px !important;
}
.size-180 {
  width: 180px !important;
  height: 180px !important;
}
.size-200 {
  width: 200px !important;
  height: 200px !important;
}
.icon.chat-text.white {
  background: url(../images/bi-chat-text-white.svg) center no-repeat;
  background-size: contain;
}
.icon.wallet {
  background: url(../images/bi-wallet.svg) center no-repeat;
  background-size: contain;
}
.icon.wallet2 {
  background: url(../images/bi-wallet2.svg) center no-repeat;
  background-size: contain;
}
.icon.check2-all {
  background: url(../images/bi-check2-all.svg) center no-repeat;
  background-size: contain;
}
.icon.check2-all.white {
  background: url(../images/bi-check2-all-white.svg) center no-repeat;
  background-size: contain;
}
.icon.shield-check {
  background: url(../images/bi-shield-check.svg) center no-repeat;
  background-size: contain;
}
.icon.star-fill {
  background: url(../images/bi-star-fill.svg) center no-repeat;
  background-size: 90%;
}
.icon.star-fill.yellow {
  background: url(../images/bi-star-fill-yellow.svg) center no-repeat;
  background-size: 90%;
}
.icon.search {
  background: url(../images/bi-search.svg) center no-repeat;
  background-size: contain;
}
.icon.search.blue {
  background: url(../images/bi-search-blue.svg) center no-repeat;
  background-size: contain;
}
.icon.send {
  background: url(../images/bi-send.svg) center no-repeat;
  background-size: contain;
}
.icon.send.white {
  background: url(../images/bi-send-white.svg) center no-repeat;
  background-size: contain;
}
.icon.newspaper {
  background: url(../images/bi-newspaper.svg) center no-repeat;
  background-size: contain;
}
.icon.people {
  background: url(../images/bi-people.svg) center no-repeat;
  background-size: contain;
}
.icon.building {
  background: url(../images/bi-building.svg) center no-repeat;
  background-size: contain;
}
.icon.buildings {
  background: url(../images/bi-buildings.svg) center no-repeat;
  background-size: contain;
}
.icon.shop-window {
  background: url(../images/bi-shop-window.svg) center no-repeat;
  background-size: contain;
}
.icon.house-door {
  background: url(../images/bi-house-door.svg) center no-repeat;
  background-size: contain;
}
.icon.houses {
  background: url(../images/bi-houses.svg) center no-repeat;
  background-size: contain;
}
.icon.lock {
  background: url(../images/bi-lock.svg) center no-repeat;
  background-size: contain;
}
.icon.shield-lock {
  background: url(../images/bi-shield-lock.svg) center no-repeat;
  background-size: contain;
}
.icon.crop {
  background: url(../images/bi-crop.svg) center no-repeat;
  background-size: contain;
}
.icon.crop.orange {
  background: url(../images/bi-crop-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.tag {
  background: url(../images/bi-tag.svg) center no-repeat;
  background-size: contain;
}
.icon.tag.orange {
  background: url(../images/bi-tag-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.tags {
  background: url(../images/bi-tags.svg) center no-repeat;
  background-size: contain;
}
.icon.clock-history {
  background: url(../images/bi-clock-history.svg) center no-repeat;
  background-size: contain;
}
.icon.calendar4-week {
  background: url(../images/bi-calendar4-week.svg) center no-repeat;
  background-size: contain;
}
.icon.caret-down-fill {
  background: url(../images/bi-caret-down-fill.svg) center no-repeat;
  background-size: contain;
}
.icon.caret-down-fill.orange {
  background: url(../images/bi-caret-down-fill-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.caret-down-fill.blue {
  background: url(../images/bi-caret-down-fill-blue.svg) center no-repeat;
  background-size: contain;
}
.icon.caret-down-fill.right {
  transform: rotate(-90deg);
}
.icon.filter {
  background: url(../images/bi-filter.svg) center no-repeat;
  background-size: contain;
}
.icon.filter.white {
  background: url(../images/bi-filter-white.svg) center no-repeat;
  background-size: contain;
}
.icon.funnel {
  background: url(../images/bi-funnel.svg) center no-repeat;
  background-size: contain;
}
.icon.funnel.white {
  background: url(../images/bi-funnel-white.svg) center no-repeat;
  background-size: contain;
}
.icon.info-circle {
  background: url(../images/bi-info-circle.svg) center no-repeat;
  background-size: contain;
}
.icon.floppy {
  background: url(../images/bi-floppy.svg) center no-repeat;
  background-size: contain;
}
.icon.floppy.white {
  background: url(../images/bi-floppy-white.svg) center no-repeat;
  background-size: contain;
}
.icon.arrow-left {
  background: url(../images/bi-arrow.svg) center no-repeat;
  background-size: contain;
  transform: rotate(90deg);
}
.icon.arrow-left.orange {
  background: url(../images/bi-arrow-orange.svg) center no-repeat;
  background-size: contain;
  transform: rotate(90deg);
}
.icon.arrow-left.red {
  background: url(../images/bi-arrow-orange.svg) center no-repeat;
  background-size: contain;
  transform: rotate(90deg);
}
.icon.arrow-left-long {
  background: url(../images/bi-arrow-left-long.svg) center no-repeat;
  background-size: contain;
}
.icon.arrow-left-long.white {
  background: url(../images/bi-arrow-left-long-white.svg) center no-repeat;
  background-size: contain;
}
.icon.arrow-left-long.orange {
  background: url(../images/bi-arrow-left-long-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.arrow-left-long.blue {
  background: url(../images/bi-arrow-left-long-blue.svg) center no-repeat;
  background-size: contain;
}
.icon.arrow-right-long {
  background: url(../images/bi-arrow-left-long.svg) center no-repeat;
  background-size: contain;
  transform: rotate(180deg);
}
.icon.arrow-right-long.white {
  background: url(../images/bi-arrow-left-long-white.svg) center no-repeat;
  background-size: contain;
  transform: rotate(180deg);
}
.icon.arrow-right-long.orange {
  background: url(../images/bi-arrow-left-long-orange.svg) center no-repeat;
  background-size: contain;
  transform: rotate(180deg);
}
.icon.arrow-right-long.blue {
    background: url(../images/bi-arrow-left-long-blue.svg) center no-repeat;
    background-size: contain;
    transform: rotate(180deg);
}
.icon.arrow-right {
  background: url(../images/bi-arrow.svg) center no-repeat;
  background-size: contain;
  transform: rotate(-90deg);
}
.icon.arrow-right.white {
  background: url(../images/bi-arrow-white.svg) center no-repeat;
  background-size: contain;
  transform: rotate(-90deg);
}
.icon.arrow-right.blue {
  background: url(../images/bi-arrow-blue.svg) center no-repeat;
  background-size: contain;
  transform: rotate(-90deg);
}
.icon.arrow-right.orange {
  background: url(../images/bi-arrow-orange.svg) center no-repeat;
  background-size: contain;
  transform: rotate(-90deg);
}
.icon.arrow-right.red {
  background: url(../images/bi-arrow-red.svg) center no-repeat;
  background-size: contain;
  transform: rotate(-90deg);
}
.icon.arrow-up.orange {
  background: url(../images/bi-arrow-orange.svg) center no-repeat;
  background-size: contain;
  transform: rotate(180deg);
}
.icon.arrow-up.red {
  background: url(../images/bi-arrow-red.svg) center no-repeat;
  background-size: contain;
  transform: rotate(180deg);
}
.icon.arrow-down {
    background: url(../images/bi-arrow.svg) center no-repeat;
    background-size: contain;
    transition: 0.3s;
}
.icon.arrow-down.orange {
    background: url(../images/bi-arrow-orange.svg) center no-repeat;
    background-size: contain;
}
.icon.arrow-down.red {
    background: url(../images/bi-arrow-red.svg) center no-repeat;
    background-size: contain;
}
[data-bs-toggle="collapse"][aria-expanded="true"] .arrow-down {
    transform: rotate(-180deg);
}
.icon.window-plus {
  background: url(../images/bi-window-plus.svg) center no-repeat;
  background-size: contain;
}
.icon.box-arrow-right {
  background: url(../images/bi-box-arrow-right.svg) center no-repeat;
  background-size: contain;
}
.icon.login {
  background: url(../images/bi-login.svg) center no-repeat;
  background-size: contain;
}
.icon.register {
  background: url(../images/bi-register.svg) center no-repeat;
  background-size: contain;
}
.icon.close {
  background: url(../images/bi-x.svg) center no-repeat;
  background-size: contain;
}
.icon.close.white {
  background: url(../images/bi-x-white.svg) center no-repeat;
  background-size: contain;
}
.icon.close.red {
  background: url(../images/bi-x-red.svg) center no-repeat;
  background-size: contain;
}
.icon.check2 {
  background: url(../images/bi-check2.svg) center no-repeat;
  background-size: contain;
}
.icon.check2.white {
  background: url(../images/bi-check2-white.svg) center no-repeat;
  background-size: contain;
}
.icon.plus-square-fill {
  background: url(../images/bi-plus-square-fill.svg) center no-repeat;
  background-size: contain;
}
.icon.exclamation-diamond-fill {
  background: url(../images/bi-exclamation-diamond-fill.svg) center no-repeat;
  background-size: contain;
}
.icon.check-circle {
  background: url(../images/bi-check-circle.svg) center no-repeat;
  background-size: contain;
}
.icon.check-circle-fill {
  background: url(../images/bi-check-circle-fill.svg) center no-repeat;
  background-size: contain;
}
.icon.check-circle-fill.orange {
  background: url(../images/bi-check-circle-fill-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.check-circle-fill.green {
  background: url(../images/bi-check-circle-fill-green.svg) center no-repeat;
  background-size: contain;
}
.icon.check-circle-fill.light {
  background: url(../images/bi-check-circle-fill-light.svg) center no-repeat;
  background-size: contain;
}
.icon.eye {
  background: url(../images/bi-eye.svg) center no-repeat;
  background-size: contain;
}
.icon.eye-slash {
  background: url(../images/bi-eye-slash.svg) center no-repeat;
  background-size: contain;
}
.icon.exclamation-triangle {
  background: url(../images/bi-exclamation-triangle.svg) center no-repeat;
  background-size: contain;
}
.icon.exclamation-circle {
  background: url(../images/bi-exclamation-circle.svg) center no-repeat;
  background-size: contain;
}
.icon.exclamation-circle.red {
  background: url(../images/bi-exclamation-circle-red.svg) center no-repeat;
  background-size: contain;
}
.icon.exclamation-circle.white {
  background: url(../images/bi-exclamation-circle-white.svg) center no-repeat;
  background-size: contain;
}
.icon.exclamation-circle-fill {
  background: url(../images/bi-exclamation-circle-fill.svg) center no-repeat;
  background-size: contain;
}
.icon.exclamation-circle-fill.orange {
  background: url(../images/bi-exclamation-circle-fill-orange.svg) center
    no-repeat;
  background-size: contain;
}
.icon.exclamation-circle-fill.red {
  background: url(../images/bi-exclamation-circle-fill-red.svg) center no-repeat;
  background-size: contain;
}
.icon.down-up {
  background: url(../images/bi-arrow-down-up.svg) center no-repeat;
  background-size: contain;
}
.icon.posting {
  background: url(../images/bi-posting.svg) center no-repeat;
  background-size: contain;
}
.icon.posting.white {
  background: url(../images/bi-posting-white.svg) center no-repeat;
  background-size: contain;
}
.icon.person {
  background: url(../images/bi-person.svg) center no-repeat;
  background-size: contain;
}
.icon.folder {
  background: url(../images/bi-folder.svg) center no-repeat;
  background-size: contain;
}
.icon.folder.white {
  background: url(../images/bi-folder-white.svg) center no-repeat;
  background-size: contain;
}
.icon.homepage {
  background: url(../images/bi-house.svg) center no-repeat;
  background-size: contain;
}
.icon.homepage.orange {
  background: url(../images/bi-house-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.homepage.white {
  background: url(../images/bi-house-white.svg) center no-repeat;
  background-size: contain;
}
.icon.flag {
  background: url(../images/bi-flag.svg) center no-repeat;
  background-size: contain;
}
.icon.share {
  background: url(../images/bi-share.svg) center no-repeat;
  background-size: contain;
}
.icon.camera {
  background: url(../images/bi-camera.svg) center no-repeat;
  background-size: contain;
}
.icon.camera.white {
  background: url(../images/bi-camera-white.svg) center no-repeat;
  background-size: contain;
}
.icon.camera-fill {
  background: url(../images/bi-camera-fill.svg) center no-repeat;
  background-size: contain;
}
.icon.camera-fill.white {
  background: url(../images/bi-camera-fill-white.svg) center no-repeat;
  background-size: contain;
}
.icon.camera-video {
  background: url(../images/bi-camera-video.svg) center no-repeat;
  background-size: contain;
}
.icon.camera-video.white {
  background: url(../images/bi-camera-video-white.svg) center no-repeat;
  background-size: contain;
}
.icon.map {
  background: url(../images/bi-map.svg) center no-repeat;
  background-size: contain;
}
.icon.map.blue {
  background: url(../images/bi-map-blue.svg) center no-repeat;
  background-size: contain;
}
.icon.dkbct {
  background: url(../images/bo-cong-thuong.png) center no-repeat;
  background-size: contain;
  width: 130px;
  height: 50px;
}
.icon.cash {
  background: url(../images/bi-cash.svg) center no-repeat;
  background-size: contain;
}
.icon.internet-banking {
  background: url(../images/bi-internet-banking.svg) center no-repeat;
  background-size: contain;
}
.icon.qrcode {
  background: url(../images/i-qrcode.svg) center no-repeat;
  background-size: contain;
}
.icon.chuyenkhoan {
  background: url(../images/i-chuyenkhoan.png) center no-repeat;
  background-size: contain;
}
.icon.zalopay {
  background: url(../images/zalopay-new.png) center no-repeat;
  background-size: contain;
}
.icon.momo {
  background: url(../images/bi-momo.svg) center no-repeat;
  background-size: contain;
  background-color: #a50064;
}
.icon.shopeepay {
  background: url(../images/shopeepay.svg) center no-repeat;
  background-size: contain;
}
.icon.shopeepay.white {
  background: url(../images/shopeepay-white.svg) center no-repeat;
  background-size: contain;
  background-color: #ee4d2d;
}
.icon.jcb {
  background: url(../images/bi-jcb.svg) center no-repeat;
  background-size: contain;
}
.icon.mastercard {
  background: url(../images/bi-mastercard.svg) center no-repeat;
  background-size: contain;
}
.icon.visa {
  background: url(../images/bi-visa.svg) center no-repeat;
  background-size: contain;
}
.icon.twitter {
  background: url(../images/bi-twitter.svg) center no-repeat;
  background-size: contain;
}
.icon.tiktok {
    background: #000 url(../images/i-tiktok.svg) center no-repeat;
    background-size: contain;
}
.icon.youtube {
  background: url(../images/bi-youtube.svg) center no-repeat;
  background-size: contain;
}
.icon.facebook {
  background: url(../images/bi-facebook.svg) center no-repeat;
  background-size: contain;
}
.icon.grid-1x2 {
  background: url(../images/bi-grid-1x2.svg) center no-repeat;
  background-size: contain;
}
.icon.list {
  background: url(../images/bi-list.svg) center no-repeat;
  background-size: contain;
}
.icon.list.orange {
  background: url(../images/bi-list-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.list.white {
  background: url(../images/bi-list-white.svg) center no-repeat;
  background-size: contain;
}
.icon.zalo {
  background: url(../images/bi-zalo.svg) center no-repeat;
  background-size: contain;
}
.icon.question {
  background: url(../images/bi-question-circle.svg) center no-repeat;
  background-size: contain;
}
.icon.chat-dots {
  background: url(../images/bi-chat-dots.svg) center no-repeat;
  background-size: contain;
}
.icon.chat-dots.orange {
  background: url(../images/bi-chat-dots-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.chat-dots.red {
  background: url(../images/bi-chat-dots-red.svg) center no-repeat;
  background-size: contain;
}
.icon.question.orange {
  background: url(../images/bi-question-circle-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.headset {
  background: url(../images/bi-headset.svg) center no-repeat;
  background-size: contain;
}
.icon.headset.white {
  background: url(../images/bi-headset-white.svg) center no-repeat;
  background-size: contain;
}
.icon.headset.orange {
  background: url(../images/bi-headset-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.heart {
  background: url(../images/bi-heart.svg) center no-repeat;
  background-size: contain;
}
.icon.heart.fill {
  background: url(../images/bi-heart-fill.svg) center no-repeat;
  background-size: contain;
}
.icon.heart.white {
  background: url(../images/bi-heart-white.svg) center no-repeat;
  background-size: contain;
}
.icon.telephone {
  background: url(../images/bi-telephone.svg) center no-repeat;
  background-size: contain;
}
.icon.telephone-fill {
  background: url(../images/bi-telephone-fill.svg) center no-repeat;
  background-size: contain;
}
.icon.telephone-fill.white {
  background: url(../images/bi-telephone-fill-white.svg) center no-repeat;
  background-size: contain;
}
.icon.geo-alt {
  background: url(../images/location-pin.svg) center no-repeat;
  background-size: contain;
}
.icon.geo-alt.orange {
  background: url(../images/location-pin-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.geo-alt.red {
  background: url(../images/location-pin-red.svg) center no-repeat;
  background-size: contain;
}
.icon.image {
  background: url(../images/bi-image.svg) center no-repeat;
  background-size: contain;
}
.icon.image.white {
  background: url(../images/bi-image-white.svg) center no-repeat;
  background-size: contain;
}
.icon.play.white {
  background: url(../images/bi-play-fill-white.svg) center no-repeat;
  background-size: contain;
}
.icon.play.orange {
  background: url(../images/bi-play-fill-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.trash {
  background: url(../images/bi-trash.svg) center no-repeat;
  background-size: contain;
}
.icon.trash.red {
  background: url(../images/bi-trash-red.svg) center no-repeat;
  background-size: contain;
}
.icon.copy {
  background: url(../images/bi-copy.svg) center no-repeat;
  background-size: contain;
}
.icon.copy.white {
  background: url(../images/bi-copy-white.svg) center no-repeat;
  background-size: contain;
}
.icon.arrow-right-circle {
  background: url(../images/bi-arrow-right-circle.svg) center no-repeat;
  background-size: contain;
}
.icon.arrow-right-circle.orange {
  background: url(../images/bi-arrow-right-circle-orange.svg) center no-repeat;
  background-size: contain;
}
.icon.arrow-right-circle.orange {
  background: url(../images/bi-arrow-right-circle-orange.svg) center no-repeat;
  background-size: contain;
}
.cursor-pointer {
  cursor: pointer;
}
.rounded-10px {
    border-radius: 10px !important;
}
.rounded-12px {
    border-radius: 12px !important;
}
.link {
  color: var(--color-blue-500);
  text-decoration: underline;
  text-underline-position: under;
}
.link:hover {
  color: var(--color-orange-500) !important;
}
.text-decoration-underline {
  text-underline-position: under;
}
.hover-underline:hover {
    text-underline-position: under;
    text-decoration: underline !important;
}
#pt123__logo {
  display: block;
  width: 187px;
  height: 30px;
  background: url(../images/logo-phongtro.svg) center no-repeat;
  background-size: contain;
  text-indent: -9999999px;
  opacity: 1;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
#pt123__logo.white {
  background: url(../images/logo-phongtro-white.svg) center no-repeat;
  background-size: contain;
}
.pt123__nav {
  height: 42px;
  z-index: 1021;
}
.filter__bar {
  height: 45px;
  display: flex;
  align-items: center;
  padding: 0 1rem 0;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.filter__bar .btn__search {
  background-color: #f3f6f7;
  border-radius: var(--bs-border-radius-pill);
  text-align: left;
  padding-right: 1rem;
  padding-left: 1rem;
  width: 100%;
  height: 35px;
  display: flex;
  align-items: center;
  cursor: text;
}
.filter__bar .btn__funnel {
  border-radius: var(--bs-border-radius-pill);
  width: 90px;
  height: 35px;
  display: flex;
  align-items: center;
  background-color: #fff;
  border: 1px solid #ddd;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  margin-left: 5px;
}
.filter__bar .btn__funnel:hover {
    border-color: #aaa;
}
/* body.transition-menu .filter__bar {
  margin-left: 50px;
  margin-right: 50px;
  margin-top: -47px;
  height: 47px;
  padding-left: 0;
  padding-right: 0;
  display: flex;
  align-items: center;
}
body.transition-menu .filter__suggest {
  display: none;
} */
.breadcrumb {
  display: flex;
  flex-wrap: nowrap;
  white-space: nowrap;
  overflow: auto;
  margin-bottom: 0.5rem;
  padding-bottom: 2px;
}
.breadcrumb::-webkit-scrollbar {
  display: none;
}
.breadcrumb .breadcrumb-item {
  display: flex;
}
.top__location {
  display: flex;
  overflow-x: auto;
  padding: 0.5rem 1rem;
}
.top__location::-webkit-scrollbar {
  display: none;
}
.top__location a {
  display: flex;
  align-items: center;
  margin-right: 1rem;
  white-space: nowrap;
  background: #fff;
  padding: 0.5rem 0.7rem;
  border-radius: 1rem;
  text-decoration: none;
  color: var(--color-black);
  box-shadow: var(--bs-box-shadow-sm);
}
.top__location .icon {
  width: 40px;
  height: 40px;
  display: block;
  background: url(../images/location_hcm.jpg) center no-repeat;
  background-size: cover;
  border-radius: 50%;
  margin-right: 0.5rem;
}
.top__location .icon.city-2 {
  background: url(../images/location_hn.jpg) center no-repeat;
  background-size: cover;
}
.top__location .icon.city-4 {
  background: url(../images/location_dn.jpg) center no-repeat;
  background-size: cover;
}
.lh-13 {
    line-height: 1.3;
}
.lh-14 {
    line-height: 1.4;
}
.line-clamp-1 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  white-space: normal;
}
.line-clamp-2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  white-space: normal;
}
.line-clamp-3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  white-space: normal;
}
.post-item-grid {
  width: 200px;
}
.post__thumb {
  width: 120px;
  height: 120px;
  position: relative;
  flex-shrink: 0;
}
.post__thumb.grid {
  width: 100%;
  height: 120px;
}
.post__thumb.x-small {
  width: 80px;
  height: 80px;
}
.post__thumb.small {
  width: 110px;
  height: 110px;
}
.post__thumb__vipnoibat {
  width: 100%;
  height: 250px;
}
.post__thumb__vipnoibat img {
  border-radius: 0;
  float: left;
}
.post__thumb__vipnoibat .img__1 {
  width: 50%;
  height: 60%;
  border-right: 3px solid #fff;
  border-bottom: 3px solid #fff;
  border-top-left-radius: 0.4rem;
}
.post__thumb__vipnoibat .img__2 {
  width: 50%;
  height: 60%;
  border-bottom: 3px solid #fff;
  border-top-right-radius: 0.4rem;
}
.post__thumb__vipnoibat .img__3 {
  width: 33.3333%;
  height: 40%;
  border-right: 3px solid #fff;
  border-bottom-left-radius: 0.4rem;
}
.post__thumb__vipnoibat .img__4 {
  width: 33.3333%;
  height: 40%;
  border-right: 3px solid #fff;
}
.post__thumb__vipnoibat .img__5 {
  width: 33.3333%;
  height: 40%;
  border-bottom-right-radius: 0.4rem;
}
.post__thumb__vip1 {
  width: 100%;
  height: 200px;
}
.post__thumb__vip1 img {
  border-radius: 0;
  float: left;
}
.post__thumb__vip1 .img__1 {
  width: 50%;
  height: 100%;
  border-right: 3px solid #fff;
  border-top-left-radius: 0.4rem;
  border-bottom-left-radius: 0.4rem;
}
.post__thumb__vip1 .img__2 {
  width: 50%;
  height: 50%;
  border-bottom: 3px solid #fff;
  border-top-right-radius: 0.4rem;
}
.post__thumb__vip1 .img__3 {
  width: 50%;
  height: 50%;
  border-bottom-right-radius: 0.4rem;
}
.post__thumb__vip2,
.post__thumb__vip3 {
    width: 140px;
    height: 130px;
    position: relative;
    flex-shrink: 0;
}
.btn__save .icon {
    opacity: 0.1;
}
.btn__save:hover .icon,
.btn__save.saved .icon {
    background: url(../images/bi-heart-fill-orange.svg) center no-repeat;
    background-size: contain;
    opacity: 1;
}
.btn__save__lg {
    background-color: #f1f1f1;
    color: var(--color-black);
}
.btn__save__lg.saved {
    background-color: #ffe6e2;
    color: var(--color-orange-500);
}
.btn__save__lg.saved .icon.heart {
    background: url(../images/bi-heart-fill-orange.svg) center no-repeat;
    background-size: contain;
}
.image__count {
  position: absolute;
  bottom: 5px;
  left: 5px;
  display: flex;
  align-items: center;
  padding: 0.2rem 0.3rem;
  border-radius: 0.3rem;
  background-color: rgba(0, 0, 0, 0.3);
  color: #fff;
  font-size: 0.8rem;
  line-height: 1;
}
.chothuenhanh-label {
  width: 60px;
  height: 60px;
  pointer-events: none;
  background: url(../images/chothuenhanh-label.png) center no-repeat;
  background-size: contain;
  position: absolute;
  top: -5px;
  left: -5px;
  z-index: 2;
}
.chothuenhanh-label.small {
  width: 50px;
  height: 50px;
  top: -5px;
  left: -4px;
}
.chothuenhanh-label.x-small {
  width: 50px;
  height: 50px;
  top: -5px;
  left: -4px;
}
.chothuenhanh-label.large {
  width: 70px;
  height: 70px;
  top: -6px;
  left: -6px;
}
.chothuenhanh-label-2 {
  width: 80px;
  height: 80px;
  pointer-events: none;
  background: url(../images/label-thuenhanh-2.png) center no-repeat;
  background-size: contain;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}
.chothuenhanh-label-2.small {
  width: 70px;
  height: 70px;
}
.pagination {
  padding: 1.5rem 0;
  margin: 0;
  background-color: var(--color-gray-500);
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.pagination li,
.pagination .page-item {
  list-style-type: none;
  display: inline-block;
  margin-right: 5px;
  margin-bottom: 5px;
}
.pagination li.disabled {
  /* opacity: 0.5; */
  pointer-events: none;
}
.pagination li.page-current {
  font-weight: bold;
  background: none;
}
.pagination li > span,
.pagination li > a,
.pagination .page-item .page-link {
  display: inline-flex;
  min-width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  color: var(--color-black);
  text-decoration: none;
  border-radius: 5px;
  border: 0;
  font-size: 1rem;
  line-height: 1.25;
  box-shadow: var(--bs-box-shadow-sm) !important;
  background-color: #fff;
}
.pagination li.page-current span {
  background: none;
  color: var(--color-black);
  box-shadow: none;
}
.pagination li > a:hover,
.pagination .page-item .page-link:hover {
  background-color: var(--color-orange-100);
}
.pagination li.active > span,
.pagination li.active > a,
.pagination .page-item.active .page-link {
  background-color: var(--color-orange-500);
  border-color: var(--color-orange-500);
  color: #fff;
  font-weight: bold;
  pointer-events: none;
}
.dot {
  width: 3px;
  height: 3px;
  display: inline-block;
  border-radius: 50%;
  background-color: #aaa;
  margin: 0 4px 3px 5px;
}
.star {
  width: 12px;
  height: 12px;
  background: url(../images/bi-star-fill-yellow.svg) left center repeat-x;
  background-size: 12px 12px;
  display: inline-block;
  margin-right: 3px;
}
.star.small {
    width: 10px;
    height: 10px;
    background: url(../images/bi-star-fill-yellow.svg) left center repeat-x;
    background-size: 10px 10px;
}
.star.star-0 {
    display: none;
}
.star.star-5 {
  width: 60px;
  height: 12px;
}
.star.star-5.small {
  width: 50px;
  height: 10px;
}
.star.star-4 {
  width: 48px;
  height: 12px;
}
.star.star-4.small {
  width: 40px;
  height: 10px;
}
.star.star-3 {
  width: 36px;
  height: 12px;
}
.star.star-3.small {
  width: 30px;
  height: 10px;
}
.star.star-2 {
  width: 24px;
  height: 12px;
}
.star.star-2.small {
  width: 20px;
  height: 10px;
}
.list-type-disc,
.list-type-square {
  margin-left: 1rem;
}
.list-type-square > li {
  list-style-type: square;
}
.list-type-disc > li {
  list-style-type: disc;
}
.list-type-square > li::marker,
.list-type-disc > li::marker {
  color: var(--color-orange-200);
}
.list-type-arrow li {
    position: relative;
    padding-left: 12px;
    display: flex;
    align-items: center;
}
.list-type-arrow li::before {
    content: "";
    display: block;
    background: url(../images/bi-arrow-orange.svg) center no-repeat;
    background-size: contain;
    transform: rotate(-90deg);
    width: 14px;
    height: 14px;
    position: absolute;
    top: 0.5rem;
    left: -3px;
}
.list__tags li {
  padding: 0.3rem 0;
}
.list__tags a {
  display: inline-flex;
  padding: 0.4rem 1rem;
  border-radius: 30px;
  background-color: #f5f5f5;
}
.list__tags a::before {
  background: url(../images/bi-search-blue.svg) center no-repeat;
  background-size: contain;
  display: inline-block;
  content: "";
  width: 13px;
  height: 13px;
  margin-right: 0.5rem;
  margin-top: 5px;
}
.list__tags a span {
  flex: 1;
}
.box__readmore.has-readmore {
  position: relative;
}
.box__readmore.has-readmore .content__read {
  max-height: 350px;
  position: relative;
  overflow: hidden;
}
.box__readmore.districts.has-readmore .content__read {
  max-height: 110px;
}
.box__readmore .button__readmore {
  display: none;
}
.box__readmore.has-readmore .button__readmore {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  margin: 0;
  padding: 100px 0 1rem 0;
  background: #020024;
  background: linear-gradient(
    180deg,
    rgba(2, 0, 36, 0) 0,
    rgba(255, 255, 255, 1) 66%
  );
}
.box__readmore.districts.has-readmore .button__readmore {
  background: none;
  position: relative;
  padding: 0;
  text-align: left;
}
.box__text {
    font-size: 1.2rem;
    overflow: hidden;
}
.box__text *:first-child {
  margin-top: 0;
}
.box__text > *:last-child {
  margin-bottom: 0;
}
.box__text table {
  margin-bottom: 1.5rem;
  margin-left: auto;
  margin-right: auto;
}
.box__text table th {
  font-weight: 500;
}
.box__text table th,
.box__text table td {
  border: 1px solid #ddd;
  padding: 7px 10px;
}
.box__text iframe {
  width: 100%;
  margin-bottom: 1.5rem;
}
.box__text p {
  line-height: 1.7;
}
.box__text h1 {
  font-size: 1.5em;
  font-weight: 600;
  line-height: 1.3;
}
.box__text h2 {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  font-size: 1.3em;
  font-weight: 500;
  line-height: 1.4;
}
.box__text h3 {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  font-size: 1.2em;
  font-weight: 500;
  line-height: 1.4;
}
.box__text h4,
.box__text h5,
.box__text h6 {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  font-size: 1.1em;
  font-weight: 400;
}
.box__text a {
  text-decoration: underline;
}
.box__text figure {
  max-width: 100% !important;
  margin: 20px 0;
  background-color: transparent;
}
.box__text figure figcaption {
  font-size: 0.9em;
  padding: 0.3rem;
}
.box__text img {
  margin: 0 auto;
  display: block;
}
.box__text ul {
  margin-bottom: 1.5rem;
  margin-left: 1rem;
}
.box__text ul > li {
  list-style-type: disc;
  padding: 3px 0 10px;
}
.the__post .author__avatar {
  width: 50px;
  height: 50px;
  display: block;
  float: left;
  margin-right: 1rem;
  border-radius: 50%;
}
.post__photos {
  width: 100%;
  height: 250px;
  position: relative;
  color: #fff;
  font-size: 0.9rem;
}
.carousel-indicators [data-bs-target] {
    opacity: 0.2;
}
.carousel-indicators .active {
    opacity: 1;
}
.carousel.photos .carousel-item {
  transition: transform 0.3s ease-in-out;
  height: 100%;
}
.carousel.photos .carousel-item img {
  object-fit: contain;
  margin: 0 auto;
  width: 100%;
  height: 100%;
  display: block;
}
.carousel.photos .carousel-indicators [data-bs-target] {
    width: auto;
    height: auto;
    display: none;
    background-color: transparent;
    background: none;
    border: 0;
    text-indent: initial;
    color: #fff;
    margin: 0;
}
.carousel.photos .carousel-indicators .active {
    display: block;
}
.carousel.photos .carousel-control-next,
.carousel.photos .carousel-control-prev {
  width: 60px;
  height: 60px;
  top: 50%;
  margin-top: -30px;
  opacity: 1;
}
.carousel.photos .carousel-control-next {
  justify-content: flex-end;
  right: 1px;
}
.carousel.photos .carousel-control-prev {
  justify-content: flex-start;
  left: 1px;
}
.carousel.photos .carousel-control-next-icon,
.carousel.photos .carousel-control-prev-icon {
  --bs-bg-opacity: 0.5;
  background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity));
  border-radius: 0;
  width: 40px;
  height: 40px;
  background-size: 70%;
}
.carousel.photos .vjs-big-play-button {
  border-radius: 50% !important;
  background: url(../images/bi-play-fill-white.svg) center no-repeat !important;
  background-size: 45px !important;
  background-color: rgba(43, 51, 63, 0.7) !important;
  width: 60px !important;
  height: 60px !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  margin-left: -30px !important;
  margin-top: -30px !important;
  border: 0 !important;
  transition: none !important;
}
.carousel.photos .vjs-big-play-button .vjs-icon-placeholder {
  display: none !important;
}
.bottom__bar {
  width: 100%;
  height: 50px;
  bottom: 0;
  background: #fff;
  color: #777;
  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: space-between;
}
.bottom__bar .item {
  display: flex;
  width: 100%;
  height: 100%;
  text-align: center;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: relative;
  color: var(--color-black);
  font-size: 0.8rem;
  font-weight: 500;
  text-decoration: none;
  border: 0;
  background: none;
  padding: 0;
}
.bottom__bar .item .icon {
  position: relative;
  margin: 1px auto 1px;
  display: block;
}
.bottom__bar .item > .icon:after {
  content: "";
  display: none;
  width: 20px;
  height: 20px;
  position: absolute;
  background: #0b71cc47;
  border-radius: 50%;
  z-index: 0;
  right: -10px;
  top: -5px;
}
body.home .bottom__bar .item.home > .icon:after {
  display: block;
}
body.get_user_post_save .bottom__bar .item.bookmark > .icon:after {
  display: block;
}
body.quan-ly.tin-dang .bottom__bar .item.manage > .icon:after {
  display: block;
}
.bottom__bar .item .btn-add-post {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 65px;
  height: 65px;
  background-color: var(--color-orange-500);
  color: #fff;
  border-radius: 50%;
  position: absolute;
  bottom: -5px;
  flex-wrap: wrap;
  -webkit-box-shadow: 0 0 0 5px rgba(255, 255, 255, 1);
  -moz-box-shadow: 0 0 0 5px rgba(255, 255, 255, 1);
  box-shadow: 0 0 0 5px rgba(255, 255, 255, 1);
}
.collapse__group .btn__collapse {
  border: 0;
  background-color: transparent;
  color: var(--color-black);
  padding: 0.6rem 0;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
}
.collapse__group .btn__collapse::after {
  display: block;
  content: "";
  width: 20px;
  height: 20px;
  background: url(../images/bi-arrow-orange.svg);
  background-size: contain;
  transform: rotate(180deg);
  transition: 0.3s;
}
.collapse__group .btn__collapse.collapsed::after {
  transform: rotate(270deg);
}
.error {
  color: var(--color-red-600);
  font-size: 0.875rem;
}
.box__payment__menthod .icon {
  width: 45px;
  height: 28px;
  margin-right: 0.5rem;
  border-radius: 5px;
}
/* FILTER TOP */
body.show-filter-popup {
  /* visibility: visible !important;
  opacity: 1 !important;
  overflow: hidden; */
}
.black_overlay {
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.2s;
  background-color: #000;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1032;
}

body.show-filter-popup .black_overlay {
  visibility: visible !important;
  opacity: 0.5 !important;
  overflow: hidden;
}

#filter-top {
  background-color: #dedede;
  padding: 10px;
  border-bottom: 0;
  height: 100%;
}

#filter-top .filter-item {
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  display: inline-flex;
  align-items: center;
  width: 100%;
  height: 40px;
  margin-bottom: 5px;
  padding: 0;
  position: relative;
}

#filter-top .filter-item:before {
  display: block;
  width: 12px;
  height: 12px;
  content: "";
  background: url(../images/location-icon.svg) center no-repeat;
  background-size: contain;
  position: absolute;
  left: 5px;
  pointer-events: none;
}

#filter-top .filter-item.post-estate-type:before {
  background: url(../images/building-icon.svg) center no-repeat;
  background-size: contain;
}

#filter-top .filter-item.post-project:before {
  background: url(../images/building-icon.svg) center no-repeat;
  background-size: contain;
}

#filter-top .filter-item.post-price:before {
  background: url(../images/price-icon.svg) center no-repeat;
  background-size: contain;
}

#filter-top .filter-item.post-acreage:before {
  background: url(../images/acreage-icon.svg) center no-repeat;
  background-size: contain;
}

#filter-top .filter-item.submit:before {
  background: url(../images/magnifying-glass.svg) center no-repeat;
  background-size: contain;
  position: relative;
  width: 16px;
  height: 16px;
  display: inline-block;
}

#filter-top .filter-item:after {
  display: block;
  width: 10px;
  height: 10px;
  content: "";
  background: url(../images/arrow-right.svg) center no-repeat;
  background-size: contain;
  position: absolute;
  right: 5px;
  pointer-events: none;
}

#filter-top .filter-item.active:after,
#filter-top .filter-item.submit:after {
  display: none;
}

#filter-top .filter-item span {
  font-size: 1rem;
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  padding: 0 40px 0 22px;
}
#filter-top .filter-item.active span {
  font-weight: bold;
  color: #007bff;
}
#filter-top .filter-item:last-of-type {
  margin-bottom: 0;
}

#filter-top .filter-item.submit {
  background-color: #ffba00;
  border: 1px solid #ffba00;
  color: #000;
  justify-content: center;
  font-weight: bold;
  height: 40px;
}

#filter-top .filter-item.submit:active {
  background-color: orange;
  border: 1px solid orange;
}

#filter-top .filter-item.submit:focus {
  background-color: #ddd;
  border: 1px solid #ddd;
}

#filter-top .filter-item.submit span {
  width: auto;
  padding: 0 10px;
}
.filter-list-option > li {
  padding: 10px 0 10px 25px;
  border-bottom: 1px solid #eee;
  font-size: 1.1rem;
  position: relative;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
}
.filter-list-option > li:before {
  background: url(../images/bi-checkbox.svg) center no-repeat;
  background-size: contain;
  width: 15px;
  height: 15px;
  position: absolute;
  left: 0;
  margin-top: 4px;
  display: block;
  content: "";
  opacity: 0.45;
}
.filter-list-option > li.selected:before {
  background: url(../images/bi-checkbox-checked-orange.svg) center no-repeat;
  background-size: contain;
  opacity: 1;
}
.filter-list-option > li.has-sub:after,
.filter-list-option.city > li:after,
.filter-list-option.districts > li:after {
  background: url(../images/bi-arrow-orange.svg) center no-repeat;
  background-size: contain;
  transform: rotate(270deg);
  width: 20px;
  height: 20px;
  display: block;
  content: "";
}

.ui-draggable,
.ui-droppable {
  background-position: top;
}
.ui-slider .ui-slider-handle {
  border-radius: 50%;
  width: 2rem;
  height: 2rem;
}
.ui-slider-horizontal .ui-slider-handle {
  top: -0.6em;
  margin-left: -1em;
}
.bds-ranger .custom-list-ranger li {
  padding: 5px 15px;
  background-color: #f1f1f1;
  border-radius: 5px;
  margin: 5px;
  display: inline-block;
  border: 1px solid #f1f1f1;
}
.bds-ranger .custom-list-ranger li.selected {
  border: 1px solid #007aff;
  background-color: #007aff;
  color: #fff;
}
.bds-ranger .vue-slider {
  height: 2px !important;
}
.bds-ranger .vue-slider-process {
  background-color: var(--color-orange-500);
}
.bds-ranger .vue-slider-dot {
  width: 40px !important;
  height: 40px !important;
  padding: 0.5rem;
}
.bds-ranger .vue-slider-dot-handle {
  background-color: var(--color-orange-500);
  box-shadow: none;
}
.bds-ranger .vue-slider-dot-tooltip {
  display: none !important;
}
.bds-ranger .vue-slider .vue-slider-mark .vue-slider-mark-label {
  color: #bbb;
  font-size: 0.85rem;
  margin-top: 15px;
}
.bds-ranger .vue-slider .vue-slider-mark:last-of-type .vue-slider-mark-label {
  left: initial;
  right: 0;
  transform: none;
}
.avatar {
  width: 35px;
  height: 35px;
  border: 1px solid #ddd;
  border-radius: 50%;
  padding: 0.2rem;
}
.btn-copy .text {
  display: none;
}
.btn-copy.active .text-copied {
  display: block;
}
.btn-copy.active .text-copy {
  display: none;
}
.btn-copy .text-copied {
  display: none;
}
.btn-copy.copied .text-copied {
  display: block;
}
.btn-copy.copied .text-copy {
  display: none;
}
body.page_quen_mat_khau .pt123__nav,
body.login .pt123__nav,
body.register .pt123__nav {
  display: none;
}
.forgot_password_step {
  display: none;
}
.forgot_password_step.active {
  display: block;
}
#scroll_Top {
    position: fixed;
    z-index: 1030;
    bottom: 70px;
    right: 10px;
}
body.fix-body #scroll_Top {
  opacity: 1;
  pointer-events: initial;
}
#support_Button {
    position: fixed;
    z-index: 1030;
    bottom: 115px;
    right: 10px;
}
body.hidden__support,
body.hidden__footer {
    padding-bottom: 100px;
}
body.hidden__support .box__support,
body.hidden__footer #footer,
body.hidden__bottom #footer,
body.hidden__bottom .box__support,
body.hidden__bottom__bar .bottom__bar,
body.hidden__bottom .bottom__bar {
  display: none;
}
.sticky-select {
  width: 0px;
  height: 0px;
  border-top: 24px solid var(--color-orange-500);
  border-left: 26px solid transparent;
  margin-top: -6px;
  margin-right: -10px;
  position: absolute;
  top: 6px;
  right: 10px;
}
.nav__scrollspy .nav-link {
    --bs-text-opacity: 1;
    color: rgba(var(--bs-secondary-rgb), var(--bs-text-opacity));
}
.nav__scrollspy .nav-link.active {
    color: var(--color-orange-500);
    border-color: var(--color-orange-500) !important;
}
.zalo-chat-widget{
  bottom: 160px !important;
  right: 5px !important;
}

.dashboard .select2-container--default .select2-selection--single .select2-selection__clear{
  width: 20px;
  margin-right: 20px;
}
.offcanvas {
    --bs-offcanvas-height: 80%;
}
.opacity-07 {
    opacity: .07 !important;
}
@media (min-width: 360px) {
  html {
    font-size: 13px;
  }
}
@media (min-width: 375px) {
  html {
    font-size: 14px;
  }
}
@media (min-width: 768px) {

    #page__main {
        max-width: 600px;
        margin: 0 auto;
    }

}