html {
  font-size: 100%;
}
 .navbar-item {
    position: relative;
  }
#main-navbar {
  transition: background-color 0.5s ease, color 0.5s ease;
}

.navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 16px;
  height: 80px;
  background-color: #4a5568;
  color: white;
}
/* Default state for dropdowns (hidden) */
.dropdown-menu {
  display: none;
  position: absolute;
  max-height: 0;
  overflow: hidden;
  transition: max-height 5s ease-out;
}

/* State when dropdown is visible */
.dropdown-menu.show {
  display: block;
  max-height: 500px;
}

/* Rotate the chevron-down icon when the dropdown is open */
.has-dropdown.open i {
  transform: rotate(180deg);
  transition: transform 0.3s ease-out;
}

@font-face {
  font-family: "Abygaer";
  src: url("./../fonts/Abygaer-owPdB.ttf") format("truetype");
}
@font-face {
  font-family: "Authenia";
  src: url("./../fonts/Authenia.otf") format("truetype");
}
@font-face {
  font-family: "Tan-Mon-Cheri";
  src: url("./../fonts/tan-mon-cheri.ttf") format("truetype");
}
@font-face {
  font-family: "Blinka-Serif";
  src: url("./../fonts/Blinka\ 400.ttf") format("truetype");
}

.font-abygaer {
  font-family: "Abygaer", sans-serif;
}
.font-authenia {
  font-family: "Authenia", sans-serif;
}

.font-tan-mon-cheri {
  font-family: "Tan-Mon-Cheri", sans-serif;
}

.font-blinka-serif {
  font-family: "Blinka-Serif", sans-serif;
}
 
.scroll-container {
  overflow: hidden;
  white-space: nowrap;
  display: flex;
  width: 100%;
}

.scroll-content {
  display: flex;
  gap: 1rem;
  animation: scroll-loop 10s linear infinite;
}

/* True Infinite Loop*/
@keyframes scroll-loop {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(calc(-100% - 1rem));
  }
}

/* Pause animation on hover */
.scroll-container:hover .scroll-content {
  animation-play-state: paused;
} 
.swiper-button-next,.swiper-button-prev { 
    background: #0000006b;
    padding:50px 25px;
    border-radius: 10px;
    color: #FFF!important;
}

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    transition: opacity 0.5s ease;
}
  
#preloader.fade-out {
    opacity: 0;
}
  
.preloader-logo {
    width: 200px;
    height: auto;
    animation: pulse 1.5s infinite ease-in-out;
}
  
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

/* Hide preloader on mobile devices (typically less than 768px) */
@media only screen and (max-width: 767px) {
    #preloader {
        display: none !important;
    }
}