* {
    scrollbar-width: thin;
    scrollbar-color: rgb(200 200 200 / 0.5) transparent;
}

*::-webkit-scrollbar {
  width: 17px;
}

*::-webkit-scrollbar {
  width: 7px;
}

*::-webkit-scrollbar-track {
  background: transparent;
}

*::-webkit-scrollbar-thumb {
  background-color: rgb(200 200 200 / 0.2);
  border-radius: 14px;
  transition: background-color 0.5s;
}

::-webkit-scrollbar-thumb:hover {
  background-color: rgb(200 200 200 / 0.5);
  transition: background-color 0.5s;
}

.font-poppins {
  font-family: 'Poppins';
}

.font-celandine {
  font-family: 'Celandine';
}

@keyframes gotodown {
  0% {
    margin-top: 0px;
    margin-bottom: -32px;
  }
  50% {
    margin-top: -10px;
    margin-bottom: -22px;
  }
  100% {
    margin-top: 0px;
    margin-bottom: -32px;
  }
}

header h1 {
  background: rgb(255,223,55);
  background: linear-gradient(180deg, rgb(255, 241, 159) 0%, rgb(255, 206, 36) 80%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  filter: drop-shadow(0 0 8px rgba(201,157,0,0.8)) drop-shadow(0 0 36px rgba(253,217,30, 0.8));
  user-select: none;
}

header a {
  animation: gotodown ease 3s infinite;
}

section span, section#about a {
  background: rgb(255,232,98);
  background: linear-gradient(180deg, rgb(255, 241, 159) 0%, rgb(255, 206, 36) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  font-weight: 500;
}

section h3 {
  background: rgb(255, 241, 166);
  background: linear-gradient(180deg, rgb(255, 251, 225) 0%, rgb(255, 226, 128) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}

section#about a:hover {
  background: rgb(255, 241, 166);
  background: linear-gradient(180deg, rgb(255, 251, 225) 0%, rgb(255, 226, 128) 100%);
  background-clip: text;
  -webkit-background-clip: text;
}

.swiper-pagination-bullet {
  background: rgb(187, 187, 187) !important;
  opacity: 1 !important;
  margin: 3px !important;
}

.swiper-pagination-bullet-active {
  background: rgb(255,232,98) !important;
}