html {
  scroll-behavior: smooth;
  scroll-padding: 110px;
}

.vision-custom,
.mission-custom {
  margin: 30px auto;
  border: 2px solid rgb(83, 42, 5);
  border-radius: 10px;
  width: 90%;
  background: rgb(238, 221, 182) !important;
  padding: 2rem;
  height: auto;
}

.custom-img {
  display: block;
  width: 300px;
  height: 300px;
  object-fit: cover;
}

.custom-coe,
.custom-po {
  margin: 30px auto;
  border: 2px solid rgb(83, 42, 5);
  border-radius: 10px;
  width: 90%;
  background: rgb(238, 221, 182) !important;
  padding: 2rem;
}

.custom-courses {
  background-color: rgba(236, 236, 236, 0.5);
  width: 100%;
  padding: 2rem;
}

.main-programs li a {
  color: rgb(83, 42, 5) !important;
  font-weight: 600;
  font-size: 1.2rem;
}

.images img {
  border-radius: 10px;
  transition: transform 0.3s ease;
}

.images img:hover {
  transform: scale(1.05);
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.animate-scroll {
  display: flex;
  gap: 3rem;
  min-width: max-content;
  animation: scroll 5s linear infinite;
}