/* Hide default scrollbar for WebKit browsers */
::-webkit-scrollbar {
  width: 0px;
  background: transparent;
}

/* Hide scrollbar for Firefox */
* {
  scrollbar-width: none;
}

/* Hide scrollbar for IE/Edge (older) */
* {
  -ms-overflow-style: none;
}

/* Create the custom bar on the right */
#fancyColorBarCustom {
  position: fixed;
  right: 0;
  top: 0;
  width: 8px;
  height: 100vh;
  z-index: 99999;
  background: linear-gradient(180deg, #ff0077, #ffae00, #00c3ff, #8f00ff);
  background-size: 300%;
  animation: fancyScrollShift 6s linear infinite;
}

@keyframes fancyScrollShift {
  0% {
    background-position: 50% 0%;
  }
  100% {
    background-position: 50% 300%;
  }
}

/* Inject bar using ::before on body */
body::before {
  content: "";
  position: fixed;
  right: 0;
  top: 0;
  width: 8px;
  height: 100vh;
  z-index: 99999;
  background: linear-gradient(180deg, #ff0077, #ffae00, #00c3ff, #8f00ff);
  background-size: 300%;
  animation: fancyScrollShift 6s linear infinite;
}