/*  X-Small devices (portrait phones, less than 576px)
    No media query for `xs` since this is the default in Bootstrap  */

/* Slim Scrollbar */
::-webkit-scrollbar {width: 6px;height: 6px; background-color: transparent;}
::-webkit-scrollbar-thumb {background-color: #c1c1c1}
::-webkit-scrollbar-thumb:hover {background-color: #a8a8a8}

.fadeR:not(.show){opacity:0;pointer-events:none}.fadeR{transition:opacity .2s}
a{color: var(--bs-dark);transition: color .2s ease;text-decoration: none;}
a:hover{color: var(--bs-primary);}
.fw-extrabold{font-weight: 800;}
.fw-black{font-weight: 900;}
.text-justify{text-align: justify;}
.text-shadow{text-shadow: 1px 1px 5px black;}
.smaller{font-size: 0.75rem;}
.form-label.required:after{content:"*";color:red;margin-left: 4px;}
.btn.btn-primary{background-color:var(--bs-primary);border-color:var(--bs-primary);}
.btn.btn-ghost{background-color:transparent;border-color:transparent;}
.modal-backdrop{--bs-backdrop-opacity: .8;}
@keyframes slideIn{0%{transform:translateY(1rem);opacity:0}100%{transform:translateY(0);opacity:1}0%{transform:translateY(1rem);opacity:0}}

:root{
  --bs-body-font-family: 'Poppins', system-ui, sans-serif;

  --bs-primary: #003286;
  --bs-primary-rgb: 0,50,134;

  --tirtauli-navbar-bgcolor: #fff;
  --tirtauli-navbar-bgcolor-rgb: 255,255,255;
  --tirtauli-navbar-bgcolor-opacity: 0;
  --tirtauli-navbar-text-shadow: 0;

  --tirtauli-navbar-scroll-bgcolor: #fff;
  --tirtauli-navbar-scroll-bgcolor-rgb: 255,255,255;
  --tirtauli-navbar-scroll-bgcolor-opacity: .98;
  --tirtauli-navbar-scroll-text-shadow: 1px 2px 1px rgba(0,0,0,.5);

  --tirtauli-navbar-animation: .3s;

  --tirtauli-navbar-color: rgba(var(--bs-dark-rgb), 1);
  --tirtauli-navbar-hover-color: rgba(var(--bs-dark-rgb), 0.7);
  --tirtauli-navbar-active-color: rgba(var(--bs-dark-rgb), 1);
}


#header{
  --bs-navbar-color: var(--tirtauli-navbar-color);
  --bs-navbar-hover-color: var(--tirtauli-navbar-hover-color);
  --bs-navbar-active-color: var(--tirtauli-navbar-active-color);

  --bs-navbar-toggler-padding-y: 0.5rem;
  --bs-navbar-toggler-padding-x: 0.5rem;
  --bs-navbar-toggler-font-size: 1.5rem;
  --bs-navbar-toggler-border-color: rgba(var(--bs-emphasis-color-rgb), 0.15);
  --bs-navbar-toggler-border-radius: 0;

  position: fixed;
  top: 0;
  padding: 20px 0;
  width: 100%;
  z-index: 1020;
  background-color: rgba(var(--tirtauli-navbar-bgcolor-rgb), var(--tirtauli-navbar-bgcolor-opacity));
  transition: padding var(--tirtauli-navbar-animation) ease, background-color var(--tirtauli-navbar-animation) ease;
  box-shadow: 0;
}

#header .navbar-brand{
  transition: color .3s ease;
}

#header.scrolled .navbar-brand{
  --bs-navbar-brand-color: rgba(0,0,0, .8)!important;
}

#header .navbar-brand img{
  filter: drop-shadow(1px 2px 1px rgba(0,0,0,1));
  transition: filter .3s ease;
}

#header.scrolled .navbar-brand img{
  filter: drop-shadow(1px 2px 1px rgba(0,0,0,.4));
}

#header.scrolled{
  --tirtauli-navbar-color: rgba(var(--bs-dark-rgb), .7);
  --tirtauli-navbar-hover-color: rgba(var(--bs-dark-rgb),1);
  --tirtauli-navbar-active-color: rgba(var(--bs-dark-rgb),1);
  padding: 15px 0;
  background-color: rgba(var(--tirtauli-navbar-scroll-bgcolor-rgb), var(--tirtauli-navbar-scroll-bgcolor-opacity));
  box-shadow: 0 1px 4px rgba(44,64,90,.1);
}

#header:has(.navbar-toggler:not(.collapsed)) .navbar-brand{
  --bs-navbar-brand-color: rgba(var(--bs-dark-rgb), 1);
}

#header:has(.navbar-toggler:not(.collapsed)){
  --tirtauli-navbar-bgcolor-opacity: 1;
  --tirtauli-navbar-scroll-bgcolor-opacity: 1;
  --tirtauli-navbar-scroll-text-shadow: 0;
  --tirtauli-navbar-color: rgba(var(--bs-dark-rgb), .7);
  --tirtauli-navbar-hover-color: rgba(var(--bs-dark-rgb),1);
  --tirtauli-navbar-active-color: rgba(var(--bs-dark-rgb),1);
}

#header .navbar-brand{
  --bs-navbar-brand-margin-end: 0;
  --bs-navbar-brand-color: var(--tirtauli-navbar-color)!important;
  --bs-navbar-brand-font-size: .875rem;

  --bs-navbar-brand-padding-y: 0;
  --bs-navbar-brand-padding-x: 0;

  display: flex;
  align-items: center;
  gap: .4rem;
  font-weight: 600;
  line-height: 1.25rem;
  transition: color .3s ease;
}

#header .navbar-nav{
  --bs-nav-link-color: var(--tirtauli-navbar-color);
  --bs-nav-link-font-weight: 500;
}

#header .nav-link{
  font-size: .9rem;
}

#header.scrolled .nav-link{

}

#header .dropdown-menu{
  --bs-dropdown-font-size: .78rem;
  --bs-dropdown-border-radius: 3px;
  --bs-dropdown-padding-y: 0;
  --bs-dropdown-link-active-bg: var(--bs-primary-alt);
  --bs-dropdown-link-active-color: var(--bs-dark);
  --bs-dropdown-link-hover-color: var(--bs-primary);
  --bs-dropdown-link-hover-bg: rgba(var(--bs-primary-alt-rgb), .5);
  --bs-dropdown-bg: var(--bs-white);
  --bs-dropdown-item-padding-x: 15px;
  --bs-dropdown-item-padding-y: 9px;
  animation-name: slideIn;
  -webkit-animation-name: slideIn;
}

#header .dropdown-menu a.dropdown-item{
  font-weight: 500;
  transition: color .2s ease;
}

@media (min-width: 992px) {
  #header .dropdown-menu {
    animation-duration: 0.3s;
    animation-fill-mode: both;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-fill-mode: both;
  }
  #header .navbar-nav .nav-item.dropdown:hover .dropdown-menu {
    display: block;
  }
}

#header .dropdown-toggle::after{
  content: "\ea4e";
  font-family: remixicon!important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  border: unset;
  vertical-align: unset;
  margin-left: .3rem;
  transition: transform .2s ease;
}

#header .dropdown-toggle.show::after{
  transform: rotate(180deg);
}

#header .navbar-toggler{
  fill: var(--bs-light);
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {}