@media only screen and (min-width: 986px) {
  
 

  .gallery-album .album-caption {
    bottom: -100%;
    transition: 0.5s;
  }

  .gallery-album:hover .album-caption {
    bottom: 0;
  }

  .gallery-album img {
    filter: brightness(100%);
    transition: 0.5s;
  }

  .gallery-album:hover img {
    filter: brightness(40%) grayscale(100%);
  }
}

@media only screen and (max-width: 986px) {
  .language-and-color__mode {
    justify-content: center !important;
    margin-top: 0.5rem;
  }

  .header-contacts {
    justify-content: center;
  }

  .section-hero .office-staffs {
    margin-top: 1rem;
  }

  .submenu-side {
    position: static !important;
    /* bottom: 0 !important;
    left: 0 !important;
    z-index: 11111;
    transform: scaleY(0) !important;
    transform-origin: top !important; */
  }

  /* .submenu:hover .submenu-side {
    transform: scaleY(1) !important;
  } */

  .dropdown-toggle.show .submenu-side {
    position: static;
  }

  .section-about .our-facebook-page {
    margin-top: 1.2rem;
    justify-content: center;
  }

  .toggler-container {
    width: 100%;
  }
}

@media only screen and (max-width: 768px) {
  .header-top .header-top-content {
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  .header-top .header-top-content > * {
    width: 100%;
  }

  .section-footer .footer-box {
    text-align: center;
  }

  .section-footer .footer-box .office-detail {
    justify-content: center;
  }

  .section-footer .contact-details {
    margin-bottom: 2rem !important;
  }

  .copyright-content .container {
    flex-direction: column;
    text-align: center;
    justify-content: center;
    align-items: center;
  }



  .karmachari-details {
    margin-top: 1rem;
  }

  .karmachari-section .karmachari-image {
    position: static;
  }

  .karmachari-details .info-box:nth-child(-n + 7) {
    flex-basis: fit-content;
  }

  

.small-member{
  width: calc(5 * 100% / 12)!important;
}



}



