.page-loading {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: all .4s .2s ease-in-out;
    transition: all .4s .2s ease-in-out;
    background-color: #fff;
    opacity: 0;
    visibility: hidden;
    z-index: 9999;
  }
  .dark-mode .page-loading {
    background-color: #121519;
  }
  .page-loading.active {
    opacity: 1;
    visibility: visible;
  }
  .page-loading-inner {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    text-align: center;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out;
    opacity: 0;
  }
  .page-loading.active > .page-loading-inner {
    opacity: 1;
  }
  .page-loading-inner > span {
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    font-weight: normal;
    color: #6f788b;
  }
  .dark-mode .page-loading-inner > span {
    color: #fff;
    opacity: .6;
  }
  .page-spinner {
    display: inline-block;
    width: 2.75rem;
    height: 2.75rem;
    margin-bottom: .75rem;
    vertical-align: text-bottom;
    background-color: #d7dde2; 
    border-radius: 50%;
    opacity: 0;
    -webkit-animation: spinner .75s linear infinite;
    animation: spinner .75s linear infinite;
  }
  .dark-mode .page-spinner {
    background-color: rgba(255,255,255,.25);
  }
  @-webkit-keyframes spinner {
    0% {
      -webkit-transform: scale(0);
      transform: scale(0);
    }
    50% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  @keyframes spinner {
    0% {
      -webkit-transform: scale(0);
      transform: scale(0);
    }
    50% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }

.ptr{
    cursor: pointer;
}

.i{
    font-style: italic;
}



.lh-0{
  line-height: 0;
}

.lh-01{
  line-height: 0.2em;
}

.bw {
  color: var(--ar-light);
}

.button:active,
.button.is-checked {
  background-color: var(--bs-gray-300);
}

.nl-2 {
  color: var(--bs-nav-link2);
}

.fc .fc-multimonth {
  border: none !important;
  display: flex;
  flex-wrap: wrap;
  overflow: hidden auto;
}

.bg-mode{
  background-color: var(--bs-mode);
}

.navbar-brand {
    padding-top: 15px;
    padding-bottom: 0px;

}

.img_asp_64 {
  object-fit: cover;
  aspect-ratio: 6/4;
}

.img_asp_11 {
  object-fit: cover;
  aspect-ratio: 1/1;
}

.img_asp_46 {
  object-fit: cover;
  aspect-ratio: 4/6;
}

.of{
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.radius-left-1rem{
  border-top-left-radius: 1rem;
  border-bottom-left-radius: 1rem;
}

/*==========================================================*/

.bg-opacity-20 {
  --bs-bg-opacity: 0.2;
}

.bg-opacity-30 {
  --bs-bg-opacity: 0.3;
}

.bg-opacity-40 {
  --bs-bg-opacity: 0.4;
}

.w-30{
  width: 31%;
}


/*//////////////////////////////////////////////////////////*/

a.decoration-none{
  text-decoration: none;
}


/*///////////////////////////////////////////////////////////*/

#back-top {
  display: none; /* Hidden by default */
  width: 50px;
  height: 50px;
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #1DA3F7;
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 50%; /* Rounded corners */
  font-size: 18px; /* Increase font size */
}

#back-top:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}

a.badge:hover{
  border: 1px solid #1DA3F7;
  transition: all;
}

.badge{
  border: 1px solid #00000000;
}

@media (min-width: 1400px) {
  .container-xxl,
  .container-xl,
  .container-lg,
  .container-md,
  .container-sm,
  .container {
      max-width: 75%;
  }
}

.text-sm{
  font-size: 0.7em;
}