#navbar {
  padding: .5rem;
  background: transparent;
  border-bottom: 1px solid transparent;
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  transition: background-color 0.3s ease, border-color 0.3s ease, backdrop-filter 0.3s ease;
}
#navbar.scrolled {
  background: var(--navbar-background-color);
  border-color: var(--bs-border-color-translucent); 
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.logo {
    width:40px;
    height: 40px;
    object-fit: contain;
}