/*Body*/
/*$border-color-dark: #1E2027;*/
/*Navbar*/
/*Sidebar*/
/*$sidebar-bg: #191919;
$sidebar-sub-bg: #2b2a2a;
$sidebar-sub-menu-bg: #323232;
$sidebar-color: rgba(255,255,255,.70);
$sidebar-color-hover: rgb(255,255,255);*/
/*Sidebar*/
/*Footer*/
.py-8 {
  padding-bottom: 4.5rem !important;
  padding-top: 4.5rem !important;
}

@media (min-width: 576px) {
  .py-sm-8 {
    padding-bottom: 4.5rem !important;
    padding-top: 4.5rem !important;
  }
}
@media (min-width: 768px) {
  .py-md-8 {
    padding-bottom: 4.5rem !important;
    padding-top: 4.5rem !important;
  }
}
@media (min-width: 992px) {
  .py-lg-8 {
    padding-bottom: 4.5rem !important;
    padding-top: 4.5rem !important;
  }
}
@media (min-width: 1200px) {
  .py-xl-8 {
    padding-bottom: 4.5rem !important;
    padding-top: 4.5rem !important;
  }
}
@media (min-width: 1400px) {
  .py-xxl-8 {
    padding-bottom: 4.5rem !important;
    padding-top: 4.5rem !important;
  }
}
.bsb-btn-xl {
  --bs-btn-padding-y: 0.625rem;
  --bs-btn-padding-x: 1.25rem;
  --bs-btn-font-size: calc(1.26rem + 0.12vw);
  --bs-btn-border-radius: var(--bs-border-radius-lg) ;
}

@media (min-width: 1200px) {
  .bsb-btn-xl {
    --bs-btn-font-size: 1.35rem ;
  }
}
.bsb-btn-2xl {
  --bs-btn-padding-y: 0.75rem;
  --bs-btn-padding-x: 1.5rem;
  --bs-btn-font-size: calc(1.27rem + 0.24vw);
  --bs-btn-border-radius: var(--bs-border-radius-lg) ;
}

@media (min-width: 1200px) {
  .bsb-btn-2xl {
    --bs-btn-font-size: 1.45rem ;
  }
}
.bsb-btn-3xl {
  --bs-btn-padding-y: 0.875rem;
  --bs-btn-padding-x: 1.75rem;
  --bs-btn-font-size: calc(1.28rem + 0.36vw);
  --bs-btn-border-radius: var(--bs-border-radius-lg) ;
}

@media (min-width: 1200px) {
  .bsb-btn-3xl {
    --bs-btn-font-size: 1.55rem ;
  }
}
.bsb-btn-4xl {
  --bs-btn-padding-y: 1rem;
  --bs-btn-padding-x: 2rem;
  --bs-btn-font-size: calc(1.29rem + 0.48vw);
  --bs-btn-border-radius: var(--bs-border-radius-lg) ;
}

@media (min-width: 1200px) {
  .bsb-btn-4xl {
    --bs-btn-font-size: 1.65rem ;
  }
}
.bsb-btn-5xl {
  --bs-btn-padding-y: 1.125rem;
  --bs-btn-padding-x: 2.25rem;
  --bs-btn-font-size: calc(1.3rem + 0.6vw);
  --bs-btn-border-radius: var(--bs-border-radius-lg) ;
}

@media (min-width: 1200px) {
  .bsb-btn-5xl {
    --bs-btn-font-size: 1.75rem ;
  }
}
.bsb-btn-circle {
  align-items: center;
  backface-visibility: hidden;
  border-radius: 50% !important;
  display: inline-flex;
  height: 2.5rem;
  justify-content: center;
  line-height: 1;
  padding: 0;
  width: 2.5rem;
}

.bsb-btn-circle.bsb-btn-circle-sm {
  height: 2rem;
  width: 2rem;
}

.bsb-btn-circle.bsb-btn-circle-lg {
  height: 3rem;
  width: 3rem;
}

.bsb-btn-circle.bsb-btn-circle-xl {
  height: 3.5rem;
  width: 3.5rem;
}

.bsb-btn-circle.bsb-btn-circle-2xl {
  height: 4rem;
  width: 4rem;
}

.bsb-btn-circle.bsb-btn-circle-3xl {
  height: 4.5rem;
  width: 4.5rem;
}

.bsb-btn-circle.bsb-btn-circle-4xl {
  height: 5rem;
  width: 5rem;
}

.bsb-btn-circle.bsb-btn-circle-5xl {
  height: 5.5rem;
  width: 5.5rem;
}

.bsb-btn-circle.bsb-btn-circle-6xl {
  height: 6rem;
  width: 6rem;
}

.bsb-btn-circle.bsb-btn-circle-7xl {
  height: 6.5rem;
  width: 6.5rem;
}

.bsb-btn-circle.bsb-btn-circle-8xl {
  height: 7rem;
  width: 7rem;
}

.bsb-btn-circle.bsb-btn-circle-9xl {
  height: 7.5rem;
  width: 7.5rem;
}

.bsb-btn-circle.bsb-btn-circle-10xl {
  height: 8rem;
  width: 8rem;
}

.img-icon-large {
  position: fixed;
  z-index: -1;
}

.logon-body {
  background: #000046;
}

.screen__background {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  -webkit-clip-path: inset(0 0 0 0);
  clip-path: inset(0 0 0 0);
}

#togglePassword {
  position: relative;
  top: -42px;
  float: right;
}

#togglePasswordIcon {
  color: rgba(var(--bs-body-color-rgb), 0.65);
}

.fixed-background {
  position: fixed;
  bottom: 0;
  right: 0;
  /*height: calc(100vh - 20px);*/
  /*width: auto*/
  /*width: 100%;*/
  /*height: 100%;*/
  /*z-index: -1;*/ /* Place it behind other content */
  /*object-fit: cover;*/ /* Similar to background-size: cover */
}

.text-with-border::before,
.text-with-border::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  /* --- HERE IS THE KEY: A thin background-color line --- */
  height: 2px; /* The thickness of your "border" line */
  background-color: #007bff; /* The color of your "border" line */
  /* --- End Key --- */
  transform: scaleX(0); /* Start hidden for animation potential */
  transition: transform 0.3s ease-out;
}