/* Navbar Styles */
.navbar {
   background: rgba(255, 255, 255, 0.80);
 
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 10;
}


.navbar-brand {
    margin:0!important;
    padding:0!important;
}

.nav-link {
    color: var(--natural-Txt);
    font-size:var(--font-size-lg);
    font-weight: 400 !important;
    position: relative;
    display: inline-flex;
    align-items: center;
    margin: 0 1rem;
}

.navbar-nav{
    padding-right:0;
}

.navbar-expand-lg .navbar-nav .nav-link {
    padding: 0 0 6px 0 !important;
    line-height: 1.2;
}

.nav-link:hover {
    color: var(--primary-500);
}

.nav-link.active{
  color: var(--primary-500)!important;
  font-weight: 500 !important;
}

.nav-link.active::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: var(--primary-500);
}

/* Language Switcher Button */
.language-switcher {
    color: var(--natural-Txt);
    font-size: var(--font-size-lg);
    cursor: pointer;
    border:none;
    background: unset;
}

/* Transparent header when placed over hero */
.transparent-header{
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    z-index: 1050;
}

/* enforce transparency for the nav container and collapse area */
nav.navbar.transparent-header,
nav.navbar.transparent-header .container,
nav.navbar.transparent-header .navbar-collapse{
    background: transparent !important;
}

/* white links over hero */
nav.navbar.transparent-header .nav-link{
    color: #fff !important;
}

nav.navbar.transparent-header .language-switcher{
    color: #fff !important;
}

/* remove any bottom border or separator */
nav.navbar.transparent-header { border-bottom: none !important; }
