#cursor-wrap {
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 9999;
}

#custom-cursor {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #F5BF00;
  transform: translate(-50%, -50%) scale(1);
  transform-origin: center center;
  transition: transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

#custom-cursor.opened {
  transform: translate(-50%, -50%) scale(0);
}

#custom-cursor.closed {
  background: #F5BF00;
  transform: translate(-50%, -50%) scale(1);
}

#cursor-icon {
  position: absolute;
  width: 20px;
  height: 20px;
  top: 0;
  left: 0;
  transform: translate(-50%, -50%) scale(0);
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

#cursor-wrap.opened #cursor-icon {
  transform: translate(-50%, -50%) scale(1);
}

#cursor-wrap.closed #cursor-icon {
  transform: translate(-50%, -50%) scale(0);
}
