html {
    filter: grayscale(100%);
    -o-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -webkit-filter: grayscale(90%);
    filter: gray;
}

/**
 * 1. carousel bs5
 */
#carousel_home .carousel-caption-detail {
  right: 3% !important;
  bottom: 10.25rem;
}

#carousel_home .carousel-caption {
  z-index: 3;
}

#carousel_home.carousel .carousel-indicators button {
  width: 10px;
  height: 10px;
  border-radius: 100%;
}

#carousel_home .transparent-dark-bg {
  display: none;
  position: fixed;
  height: 100%;
  width: 100%;
  background-color: rgb(0 0 0 / 50%);
  z-index: 2;
}

#carousel_home .carousel-caption a {
  padding-right: 10px;
  padding-bottom: 10px;
  display: inline-block;
  text-decoration: none;
  color: white;
  transition: transform 0.3s ease-in-out;
}

#carousel_home .carousel-caption a:hover {
  transform: scale(1.1);
}

#carousel_home .carousel-caption a > svg {
  font-size: 8px;
}

.overflow-control {
  max-height: 180px;
  overflow-x: hidden !important;
}

@media screen and (max-height: 375px) {
  #carousel_home .carousel-caption-detail {
    bottom: 4.25rem;
  }
  .overflow-control {
    max-height: 70px;
  }
}

/**
 * Navbar 
 */
nav.navbar a.navbar-brand img {
  width: 50px;
}
.text-th-brand{
  color: #074220;
  font-family: "CmPrasanmit", sans-serif !important;
   font-size: 32px;
   font-weight: bold;
}

.text-en-brand {
  color: #074220;
  font-weight: 500;
  /* font-family: "AboutFontTH", sans-serif !important; */
}

.collapse ul.navbar-nav li.nav-item a {
  color: #074220;
  transition: transform 0.3s ease-in-out;
}
.collapse ul.navbar-nav li.nav-item a:hover {
  background-color: #2c5a4a30;
  transform: scale(1.1);
  border-radius: 5%;
}

nav ul.navbar-nav li.nav-item {
  padding-left: 1rem;
  padding-right: 1rem;
}

/**
 * 3. Scrollbar
 */

.overflow-control::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  border-radius: 10px;
  background: rgba(255, 255, 255);
}

.overflow-control::-webkit-scrollbar {
  width: 5px;
  background-color: none;
}

.overflow-control::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #fff;
  background-image: -webkit-gradient(
    linear,
    40% 0%,
    75% 84%,
    from(#3b505f),
    to(#ffffff),
    color-stop(0.6, #79a1bf)
  );
}

.color-main {
  color: #074220 !important;
}
.content {
  text-align: justify;
  text-justify: inter-word;
}

#carousel_home .carousel-caption > h1.display-3,
.carousel-caption-detail h5.display-1 {
  display: inline-block;
}

/* .navbar-brand p {
  text-indent: 50px;
} */

.copyright {
  /* font-family: "HomeFontEN", sans-serif; */
}

#changeLanguageModal h5,
#changeLanguageModal button,
#changeLanguageModal li
{
  font-family: "AboutFontTH", sans-serif;
}

.h-control-menu-home
{
	font-family: "HomeFontEN", sans-serif !important;
	transform: scaleY(0.9) !important;
}


.submenu-contact {
  border: 1px #f8f9fa solid;
  width: 100%;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 5%;
  border-bottom-left-radius: 5%;
  background: #f8f9fa;
  padding: 0 7px 0 7px;
  margin-left: -7px;
}

.submenu-contact li a {
  min-height: 52px;
  padding-top: 10px;
}

.for-large {
  display: block;
}
.for-small {
  display: none;
}

@media (max-width: 1199.98px) {
  .for-large {
    display: none;
  }
  .for-small {
    display: block;
  }
  .for-small ul {
    border: none;
  }
}
