.banner-container {
    position: relative;
    display: inline-block;
    width: 100%;
  }

  .banner-container img {
    width: 100%;
    height: auto;
    display: block;
  }

  .content-image {
    position: absolute;
    top: 10%;
    left: 3%;
    color: white;
    /* text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); */
  }

  .content-image h2 {
    font-size: 2rem;
    font-weight: bold;
    color: yellowgreen;
  }

  .content-image h3 {
    font-size: 1.5rem;
    font-weight: 400;
  }

  .btn-custom {
      background-color: #046836; /* Màu xanh lá cây như trong ảnh */
      color: white;
  }
  .btn-custom:hover {
      background-color: #0e3823; /* Màu xanh lá cây đậm hơn khi hover */
  }
  .section-title {
      color: #046836; /* Màu xanh lá cây cho tiêu đề */
      font-weight: bold;
      margin-bottom: 20px;
  }
  .section-description {
      margin-bottom: 20px;

  }
  .btn{

        background-color: #046836; /* Màu xanh lá cây cho nút */
        color: white;
  }
    .btn:hover {
        background-color: #36a86f; /* Màu xanh lá cây đậm hơn khi hover */
    }

  .banner-container h3{
    font-size: 1.5rem;
    font-weight: 400;
    color: #8b8b8b;
  }
  .content-image h2 {
    font-size: 2vw; /* Chữ to lên khi ảnh lớn */
    font-weight: bold;
}

.content-image h3 {
    font-size: 1.5vw; /* Chữ nhỏ hơn */
}

@media (max-width: 768px) { 
    .content-image h2 {
        font-size: 3vw; /* Khi màn hình nhỏ, chữ lớn hơn */
    }
    .content-image h3 {
        font-size: 0.5vw;
        display: none; 
    }
}

  
  @media (max-width: 768px) {
    .content-image {
      padding: 10px;
      top:0;
      left: -2px;
      margin: 5px;
    }
    .content-image h2, .content-image h3 {
      font-size: 1.2rem;
    }
    .content-image button {
      font-size: 0.9rem;
    }
    .banner-container img {
      border-radius: 15px; /* Bo góc cho hình ảnh trên giao diện mobile */
    }
    .hidden-mobile-responsive{
      display: none;
    }
    footer iframe{
      width: 100%;
      height: auto;
    }
  }

  .footer-color-text{
    color: #046836;;
  }
  a {
    text-decoration: none !important;
  }
  
.content-banner-image{
  padding-top: 65px;
}
@keyframes shake {
  0%, 95% { transform: translate(0, 0); } /* Giữ nguyên trong 95% thời gian */
  97% { transform: translate(-3px, 3px); }
  99% { transform: translate(3px, -3px); }
  100% { transform: translate(0, 0); }
}

#floating-icons {
  position: fixed;
  bottom: 20px;
  right: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#floating-icons a img {
  animation: shake 2s infinite; 
}

#floating-icons a:nth-child(1) img {
  animation-delay: 0s; 
}

#floating-icons a:nth-child(2) img {
  animation-delay: 2s; 
}

.navbar-nav li a:hover{
  color: #8b8b8b;
}

.no-style {
  text-decoration: none; /* Bỏ gạch chân */
  color: inherit; /* Giữ nguyên màu chữ theo thẻ cha */
  background: none; /* Xóa nền */
  border: none; /* Xóa viền nếu có */
  padding: 0;
  margin: 0;
  outline: none;
}
.banner-container img {
  width: 100%; /* Chiều rộng đầy đủ */
  height: auto; /* Chiều cao tự động theo tỷ lệ */
  aspect-ratio: 16/9; /* Giữ tỷ lệ 16:9 hoặc tuỳ chỉnh */
}
