.title-gray {
   font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    font-weight: normal !important;
    color: #999;
    display: block;
}
.title-value{
   font-family: "Roboto Medium", Roboto, Arial !important;
    font-size: 18px;
    line-height: 28px;
    font-weight: normal !important;
    color: #2C2C2C;
    margin-top: 4px;
    display: block;
}
.section-title {
   padding-top: 20px;
   font-family: "Lexend Medium", Roboto, Arial !important;
   font-size: 18px;
   line-height: 28px;
   font-weight: normal !important;
   letter-spacing: -.2px;
   color: #2C2C2C;
   display: block;
   padding-bottom: 10px;
}
/* Bengin section product*/
.product-section {
   background-color: #FAFAFA;
}
.product-section a {
   text-decoration: none !important;
}
.product-section a:hover {
   color: #999;
}
.product-section > * .product-title * .title {
   font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 24px;
    line-height: 32px;
    font-weight: normal !important;
    letter-spacing: -.2px;
    color: #2C2C2C;
    display: block;
    margin-bottom: 24px;
}
.product-section > * .product-title * span {
   text-align:center; 
   vertical-align: middle;
   display: table-cell;  
   float: right;
   margin-top: 20px;
}
.product-section > * .product  {
   border-radius: 4px;
   background: white;
   box-shadow: 0px 4px 6px 0px rgba(44, 44, 44, 0.04);
   box-sizing: content-box;
   background: #fff;
   
}
.product-section > * .product > .card-image {
   border-top-left-radius: 4px;
   border-top-right-radius: 4px;
   background-color: #cccccc;
    min-height: 130px;
    width: 100%;
    background-repeat: no-repeat, repeat;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.product-section > * .product > .card-image * span {
   float: left;
    margin: 2px 0px 2px 4px;
    /* color: #fff; */
    font-family: "Roboto Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #fff;
}
.product-section > * .product > .card-image * i {
   float: left;
   margin-left: 4px;
   color: #fff;
}
.product-section > * .product > .card-image .image-count {
   float: right;
   position: absolute;
   right: 20px;
   z-index: 2;
   padding-top: 100px;
}

.product-section > * .product > .product-title {
   height: 40px;
   text-align: left;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   display: -webkit-box;
   overflow: hidden;
   margin-top: 10px;
   margin-left: 10px;
   margin-right: 10px;
}
.product-section > * .product > .product-price {
   font-family: "Roboto Medium", Roboto, Arial !important;
   font-size: 16px;
   line-height: 26px;
   font-weight: normal !important;
   color: #E03C31;
   line-height: 26px;
   font-weight: 600 !important;
   margin-left: 10px;
}
.product-section > * .product > .card-location {
   margin-top: 4px;
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #505050;
    text-align: left;
    margin-left: 10px;
    padding-bottom: 15px;
}

.product-section > * .product > .product-title span{
   font-family: "Lexend Medium", Roboto, Arial !important;
   font-size: 14px;
   line-height: 20px;
   font-weight: normal !important;
   letter-spacing: -.2px;
   color: #2C2C2C;
}
.product-section > * .product * .card-image > img {
   border-top-left-radius: 4px;
   border-top-right-radius: 4px;
}
/* end section product*/
.card-title{
   font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    letter-spacing: -.2px;
    color: #2C2C2C;
}
.home-section1 {
   margin-top: 40px;
}
.home-title {
   font-family: "Lexend Medium", Roboto, Arial !important;
        font-size: 24px;
        line-height: 32px;
        font-weight: normal !important;
        letter-spacing: -0.2px;
        margin-bottom: 8px;
        padding-top: 10px;
        text-decoration: none!important;
}
.home-title-image{
   border-radius: 4px;
}
.w100 {
   width:100%
}
.home-blog{
   text-decoration: none!important;
   display: flex;
       flex-direction: row;
       align-items: center;
       font-family: "Roboto Regular", Roboto, Arial !important;
       font-size: 16px;
       line-height: 26px;
       font-weight: normal !important;
       color: #2C2C2C;
       overflow: hidden;
       text-overflow: ellipsis;
       display: -webkit-box;
       -webkit-line-clamp: 2;
       -webkit-box-orient: vertical;
       padding-top: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid #F2F2F2;
}
.home-blog:hover {
   color: #999;
}
.lable {
   font-family: "Lexend Medium", Roboto, Arial !important;
   font-size: 24px;
   line-height: 32px;
   font-weight: normal !important;
   letter-spacing: -.2px;
   color: #2C2C2C;
   display: block;
   border-bottom: 1px solid #F2F2F2;
   padding-bottom: 10px;
   
}
.xem-them {
   float: right;
   margin-top: 8px;
}

.detail-product-right {
   border: 1px solid #F2F2F2;
        border-radius: 8px;
        padding: 15px;
        margin-bottom: 16px;
    }
.btn-left {
   margin-top: 15px;
   color: #2C2C2C;
   background: #FAFAFA;
   border: solid 1px #ccc;
   color: #2C2C2C;
   background: #fff;
   border: solid 1px #ccc;
   font-family: "Lexend Medium", Roboto, Arial !important;
   font-size: 14px;
   line-height: 20px;
   font-weight: normal !important;
   letter-spacing: -.2px;
   padding: 13px 15px;
   border-radius: 8px;
   display: flex;
   justify-content: center;
   align-items: center;
}
.btn-left span {
   font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    letter-spacing: -.2px;

}
.phone {
   color: #fff;
   background: #1DBABF;
   border: 1px solid #1DBABF;
}
.bds-noibat {
   border: 1px solid #F2F2F2;
   border-radius: 8px;
   padding: 15px;
   margin-bottom: 16px;
   margin-bottom: 16px;
   background-color: #F2F2F2;
}

.city-card {
   position: relative;
   overflow: hidden;
   border-radius: 4px;
   transition: transform 0.3s ease-in-out;
}

.city-card img {
   width: 100%;
   height: 200px;
   object-fit: cover;
   border-radius: 4px;
}

.city-card .img-big {
   width: 100%;
   height: 420px;
   object-fit: cover;
   border-radius: 4px;
}

.overlay {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); /* Lớp phủ mờ dần từ dưới lên trên */
   padding: 10px;
   display: flex;
   flex-direction: column;
   align-items: flex-start; /* Canh lề trái */
   justify-content: flex-start; /* Đẩy nội dung lên trên */
   border-radius: 4px;
}

.city-info {
   display: flex;
   flex-direction: column;
   gap: 10px; /* Khoảng cách giữa tên thành phố và số tin đăng */
}

.city-name {
   font-family: "Lexend Medium", Roboto, Arial !important;
   font-size: 20px;
   color: #fff;
   margin: 10px 5px;
}

.post-count {
   font-size: 15px;
   color: #f1f1f1;
   margin: 5px;
}
.a_label{
   font-family: "Lexend Medium", Roboto, Arial !important;
   font-size: 24px;
   line-height: 32px;
   font-weight: normal !important;
   letter-spacing: -.2px;
   color: #2C2C2C;
   display: block;
   margin-bottom: 24px;
}

.feature-item {
   display: flex;
   align-items: center;
   padding: 10px 0;
   border-bottom: 1px solid #eee;
}
.feature-item:last-child {
   border-bottom: none;
}
.feature-item i {
   margin-right: 10px;
}

/* .feature-item span, .feature-item strong {
   font-size: 16px;
} */

.pagination {
   display: flex;
   justify-content: center; 
   flex-wrap: wrap;
   padding: 0;
   margin-bottom: 20px;
}
.pagination li {
   display: inline-block;
}
.pagination li a,
.pagination li span {
   display: inline-block;
   padding: 8px 12px;
   text-decoration: none;
   color: black;
   border: 1px solid #dee2e6; 
}
.pagination li.active span {
   background-color: black;
   color: #fff;
}
.pagination li.disabled span {
   color: #6c757d;
}
a:hover, a:active, a:focus {
   text-decoration: none !important;
}

.re__home-header-menu li a:hover, .re__home-header-menu li a:active {
  text-decoration: none;
}

.home-blog {
  display: block;
  word-wrap: break-word;
  word-break: break-word;
}
.re__home-project a:hover {
  text-decoration: none;
}
.re__home-project a:active {
  text-decoration: none;
}
.hidden {
  display: none;
}
.product-section > * .product:hover {
  box-shadow: 0px 6px 12px 0px rgba(44, 44, 44, 0.1);
}

.sub__in{
  display: block !important;
}
.sub__out{
  display: none !important;
}

.re__full-menu .re__drop-menu .re__left-menu img{
   width: 100px !important;
}
.re__full-menu.re__fix .re__drop-menu .re__left-menu img{
   height: 40px !important;
}
.re__full-menu, .re__bg-header{
   height: 70px;
   padding: 0;
}
.re__prj-tag-info{
   padding-bottom: 0 !important;
}

@media (min-width: 1129px) {
   .re__home-header-menu .lv0:hover > .re__dropdown-no-art--sm {
      display: block !important;
  }
  .re__dropdown-no-art--sm re__dropdown-navigative-menu{
   margin-top: 5px !important;
  }
}

@media (max-width: 1128px) {
  .re__header .re__home-header-menu {
      height: calc(100vh) !important;
  }
  .re__header .re__nav img {
      margin-bottom: 15px !important;
      width: 70px !important;
  }
  .re__drop-menu{
   padding-left: 0 !important;
   padding-right: 0 !important;
  }
  .re__dropdown-no-art--sm re__dropdown-navigative-menu{
   margin-top: 0 !important;
  }
  .re__control-menu{
   min-height: 96px !important;
  }
}

@media (max-width: 768px) {
   .city-card .img-big {
      height: 200px !important;
  }
  .city-card img {
      height: 120px !important;
   }
   .a_label {
      font-size: 20px !important;
   }
   .city-info {
      display: flex;
      flex-direction: column;
      gap: 5px; /* Khoảng cách giữa tên thành phố và số tin đăng */
  }
   .city-name {
      font-size: 18px;
      color: #fff;
      margin: 0;
  }

  .post-count {
      font-size: 14px;
      color: #f1f1f1;
      margin: 0;
  }
   /* #desktop-div {
      display: none;
   }

   .re__homemain {
      display: block;
   }

   .re__home__place-block{
      display: none;
   } */
 }

 @media (min-width: 769px) {
   /* #desktop-div {
      display: block;
   }

   .re__homemain {
      display: none;
   }

   .re__home__place-block{
      display: block;
   } */
}
@media (max-width: 1199px) {
   .phu{
      display: none;
   }
}
@media (min-width: 1200px) {
   .bg-image{
      height: 400px;
   }
}
@media (max-width: 991.20px) {
   .re__hotline{
      margin-top: 10px !important;
   }

   .re__col--footer-mail{
      margin-top: 20px !important;
   }

   #logo_footer{
      max-width: 50% !important;
   }
}