.img_main{
  width: 11.5vw;
  padding: 0;
  background-color: transparent;
  
}

#s2,#s3,#s4,#s5{
  display: none;
}
.noidung_img{
  width: 11.5vw;
  height: 10vh;
  object-fit: contain;

}
  
.noidung_img:hover {
  opacity: 0.3;
  z-index: 0;
}

.slideshow-container {
  position: relative; 
  margin: auto;
}

.mySlides {
  background-image: url("https://maithulamm.github.io/20nam/img/zoom.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: center;
  background-size: 2vw;
  width: 11.5vw;
}

.prev, .next {
  cursor: pointer;
  position: absolute;    
  top: 35%;
  width: auto;
  padding: .6vh .6vw;
  color: rgb(255, 255, 255);
  font-weight: bold;
  font-size: 1.6vh;
  transition: 0.6s ease;
  border-radius: 3px;
  user-select: none;
}

.next {
  right: .3vw;
}
.prev {
  left: .3vw;
}

.prev:hover, .next:hover {
  background-color: #f5fa1c;
}

.info_prev:hover{
  background-color: #519259;
}
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1s;
  animation-name: fade;
  animation-duration: 1s;
}

@-webkit-keyframes fade {
  from {opacity: .4} to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} to {opacity: 1}
}
/* ... (your existing CSS) ... */
.dott{text-align:center;}
.dot {
  height: 1vh;
  width: 1vh;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
  cursor: pointer;
}
#dot1{
  background-color: #f5fa1c;
}
.active {
  background-color: #f5fa1c;
}

.img_text{
  width: 11vw;
  height: 18vh;
  overflow: auto;
  padding: 0 .1vw .5vh .1vw;
  font-size: 1.5vh;
}
#text_nam{
  text-align: center;
  font-family: 'Signika', sans-serif;
  font-size: 1.6vh;
  top: 0px;
  margin: .5vh .1vw .5vh .1vw;
}
#text_nam1{
  text-align: center;
  font-family: 'Signika', sans-serif;
  font-size: 1.2vh;
  top: 0px;
  margin: .5vh .1vw .5vh .1vw;
}
#text_p{
  text-align: justify; 
  font-family: 'Signika', sans-serif;
  font-size: 100%;
  margin: .5vh .1vw .3vh .2vw;
  text-indent: 1vw;
}

.img_text::-webkit-scrollbar{
  width: .3vw;
  background-color: rgb(206, 206, 206);
}

.img_text::-webkit-scrollbar-track{
  background-color: transparent;
}
.img_text::-webkit-scrollbar-thumb{
  background-image: linear-gradient(-45deg, #f5fa1c, #54a95c);
  border-radius: 50px;
}


/* Áp dụng độ trễ cho icon-text */
.leaflet-popup-content-wrapper {
  transition: opacity 1s ease;
  transition-delay: 0.5s; /* Độ trễ 0.5 giây (hoặc giá trị mong muốn) */
}

@media screen and (max-width: 1000px) {
  
.img_main{
  width: 32vw;
}

.noidung_img{
  width: 32vw;
  height: 10vh;
  object-fit: contain;

}
.mySlides {
  width: 32vw;
}
.img_text{
  width: 32vw;
}

.prev, .next {
  background-color: #f5fa1c;
  padding: .3vh 1.5vw;
}
.img_text::-webkit-scrollbar{
  width: .6vw;
}
}