a {
    text-decoration: none;
}

/* Cho phép menu tràn ra khỏi cha */
#topnav, #topnav * {
  overflow: visible !important;
}

#topnav li ul li:hover {
    
}

#topnav li ul.submenu li.has-sub > ul.submenu-3 {
    display: none;              /* ẩn mặc định */
    position: absolute;         /* nổi trên mọi content */
    top: 100%;                  /* ngay dưới li cha */
    left: 0;                    /* căn trái li cha */
    width: auto;                /* rộng tự động theo nội dung */
    min-width: 180px;           /* tối thiểu */
    background: #FFD966;        /* nền submenu-3 */
    box-shadow: 0 4px 15px rgba(0,0,0,0.25);
    padding: 0;
    margin: 0;
    list-style: none;
    z-index: 9999999;           /* nổi trên mọi content */
    white-space: nowrap;         /* nội dung không xuống dòng */
}

/* Hiển thị khi hover li cha */
#topnav li ul.submenu li.has-sub:hover > ul.submenu-3 {
    display: block;
}

/* Li trong submenu-3 */
#topnav li ul.submenu li ul.submenu-3 li {
    display: block;
}

/* Link trong li */
#topnav li ul.submenu li ul.submenu-3 li a {
    display: block;
    padding: 10px 15px;
    color: #000;
    text-decoration: none;
}

/* Hover link */
#topnav li ul.submenu li ul.submenu-3 li a:hover {
    background-color: #199F9C;
    color: #fff;
}

/* Li cha phải relative để submenu-3 căn đúng */
#topnav li ul.submenu li.has-sub {
    position: relative;
}

/* Submenu cấp 3 */
#topnav li ul.submenu li ul.submenu-3 {
  display: none;               /* ẩn mặc định */
  position: static;          /* nổi trên content khác */
  top: 100%;                   /* ngay dưới li cha */
  left: 0;                     /* căn trái li cha */
  min-width: 200px;            /* rộng submenu-3 */
  background: #FFD966;         /* nền submenu-3 */
  box-shadow: 0 4px 15px rgba(0,0,0,0.25);
  padding: 0;
  margin: 0;
  list-style: none;
  z-index: 9999999;            /* nổi trên mọi content */
  height: auto !important;                /* chiều cao tự động theo nội dung */
}

/* Hover cấp 2 => hiển thị submenu-3 */
#topnav li ul.submenu li.has-sub:hover > ul.submenu-3 {
  display: block;
}

#topnav li ul.submenu li.has-sub ul.submenu-3 {  

  z-index: 9999999;
}


/* Li trong submenu-3 xếp dọc, nằm gọn trong ul */
#topnav li ul.submenu li ul.submenu-3 li {
  display: block;
  width: 100%;
  position: relative;          /* giữ li nằm trong ul */
  margin: 0;
  padding: 0;
  background-color:#E1E5ED !important ;
}

/* Link trong submenu-3 */
#topnav li ul.submenu li ul.submenu-3 li a {
  display: block;
  width: 100%;
  padding: 0px 15px;
  color: #000;
  text-decoration: none;
}

/* Hover link */
#topnav li ul.submenu li ul.submenu-3 li a:hover {
  background-color: #199F9C;
  color: #fff;
}

/* Container cha không cắt submenu */
.header, .topbar, .container {
  overflow: visible !important;
  z-index: auto !important;
}

/* Nav luôn nổi trên content */
nav, #topnav {
  position: relative;
  /*z-index: 9999999 !important;*/
}

 /* Khung chính */
    .info-box {    
      margin: 0 auto;
      border-radius: 4px;
      overflow: hidden;
      background: #fff;
      border: 1px solid #ddd;
      box-shadow: 0 0 3px rgba(0,0,0,0.1);
    }

    /* Tiêu đề */
    .info-header {
      background: #007ad9;
      color: #fff;
      font-weight: bold;
      text-align: center;
      padding: 8px 0;
      text-transform: uppercase;
      font-size: 15px;
    }

    /* Bố cục nhóm */
    .info-content {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      padding: 10px;
      flex-wrap: wrap;
    }

    .info-group {
      flex: 1;
      display: flex;
      justify-content: space-between;
      padding: 10px;
      border-radius: 4px;
      gap: 10px;
    }

    /* Nền nhóm */
    .yellow { background: #fff3cd; }
    .green { background: #e8f5e9; }

    /* Nút */
    .btn {
      flex: 1;
      text-align: center;
      color: #fff;
      font-weight: bold;      
      text-transform: uppercase;
      border-radius: 4px;
      padding: 15px 5px;
      text-decoration: none;
      line-height: 2;
      font-size: 13px;
      box-shadow: 0 2px 4px rgba(0,0,0,0.1);
      transition: all 0.2s ease;
    }

    /* Màu nút */
    .btn.red { background: #d50000; }
    .btn.blue { background: #1565c0; }
    .btn.sky { background: #29b6f6; }
    .btn.pink { background: #f06292; }
    .btn.orange { background: #ef6c00; }
    .btn.brown { background: #6d4c41; }

    /* Hiệu ứng hover */
    .btn:hover {
      opacity: 0.9;
      transform: translateY(-2px);
    }

    /* Responsive */
    @media (max-width: 768px) {
      .info-content { flex-direction: column; }
      .info-group { flex-direction: column; }
    }

    /* Áp dụng riêng cho phần tabDetails */
.tabDetails {
  width: 550px;
  height: 350px;
  position: relative;
  overflow: hidden;
  float: left; /* canh trái */
  margin-right: 20px; /* khoảng cách với phần bên phải */
  background: #f9f9f9;
  border: 1px solid #ddd;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Ảnh trong tabDetails hiển thị đúng tỉ lệ */
.tabDetails img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain; /* không méo, vừa khung */
  display: block;
  margin: auto;
}

/* Phần thông tin chữ trong mỗi tab */
.tabDetails .info {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  text-align: center;
  padding: 10px;
  font-size: 15px;
  line-height: 1.4;
  box-sizing: border-box;
}

.tabDetails .info a {
  color: #fff;
  text-decoration: none;
}

.tabDetails .info a:hover {
  text-decoration: underline;
}

.chaychu{
  padding-top:10px;
  color: #d50000;
}

a{
  text-decoration: none;
}