body {
  font-family: Roboto, sans-serif;
  position: relative;
  margin: 0;
}

body { 
  cursor: url('./cursor.cur'), auto;
}

html, body {
  position: relative;
  display: block;
  width: 100vw;
  height: 100vh;
  background-color: #abb3fc; /* Set text color to white for better visibility on random backgrounds */
}

.carousel {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 100;
  height: 50%;
  transform-style: preserve-3d;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  perspective: 500px;
  cursor: -webkit-grab;
  cursor: grab;
}

.carousel-image {
  position: relative;
  display: block;
  margin: auto;
  width: 200px;
  height: 200px;

  background-blend-mode: screen, difference, normal;
  cursor: col-resize;
}

.carousel-image input {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50%;
}

.star {
  display: block;
  position: absolute;
  background-color: #ccc;
  width: 3px;
  height: 3px;
  background-color: rgba(255, 255, 255, 0.6);
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.star span {
  animation: star-pulse 5s forwards alternate infinite ease-in-out;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  -moz-box-shadow: 0 0 25px 3px rgba(255, 255, 255, 0.2);
  -webkit-box-shadow: 0 0 25px 3px rgba(255, 255, 255, 0.2);
  box-shadow: 0 0 25px 3px rgba(255, 255, 255, 0.2);
}

.star:nth-child(1) {
  top: 11%;
  left: 77%;
  -moz-transform: scale(0.95);
  -ms-transform: scale(0.95);
  -webkit-transform: scale(0.95);
  transform: scale(0.95);
}

.star:nth-child(1) span {
  animation: star-pulse 1s forwards alternate infinite ease-in-out;
}

.star:nth-child(2) {
  top: 15%;
  left: 45%;
  -moz-transform: scale(0.54);
  -ms-transform: scale(0.54);
  -webkit-transform: scale(0.54);
  transform: scale(0.54);
}

.star:nth-child(2) span {
  animation: star-pulse 5s forwards alternate infinite ease-in-out;
}

.star:nth-child(3) {
  top: 94%;
  left: 12%;
  -moz-transform: scale(0.53);
  -ms-transform: scale(0.53);
  -webkit-transform: scale(0.53);
  transform: scale(0.53);
}

.star:nth-child(3) span {
  animation: star-pulse 5s forwards alternate infinite ease-in-out;
}

.star:nth-child(4) {
  top: 24%;
  left: 73%;
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
}

.star:nth-child(4) span {
  animation: star-pulse 6s forwards alternate infinite ease-in-out;
}
.star:nth-child(5) {
  top: 40%;
  left: 74%;
  -moz-transform: scale(1.03);
  -ms-transform: scale(1.03);
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}
.star:nth-child(5) span {
  animation: star-pulse 3s forwards alternate infinite ease-in-out;
}
.star:nth-child(6) {
  top: 49%;
  left: 23%;
  -moz-transform: scale(1.24);
  -ms-transform: scale(1.24);
  -webkit-transform: scale(1.24);
  transform: scale(1.24);
}
.star:nth-child(6) span {
  animation: star-pulse 5s forwards alternate infinite ease-in-out;
}
.star:nth-child(7) {
  top: 8%;
  left: 64%;
  -moz-transform: scale(0.88);
  -ms-transform: scale(0.88);
  -webkit-transform: scale(0.88);
  transform: scale(0.88);
}
.star:nth-child(7) span {
  animation: star-pulse 3s forwards alternate infinite ease-in-out;
}
.star:nth-child(8) {
  top: 30%;
  left: 23%;
  -moz-transform: scale(0.85);
  -ms-transform: scale(0.85);
  -webkit-transform: scale(0.85);
  transform: scale(0.85);
}
.star:nth-child(8) span {
  animation: star-pulse 6s forwards alternate infinite ease-in-out;
}
.star:nth-child(9) {
  top: 60%;
  left: 17%;
  -moz-transform: scale(0.57);
  -ms-transform: scale(0.57);
  -webkit-transform: scale(0.57);
  transform: scale(0.57);
}
.star:nth-child(9) span {
  animation: star-pulse 5s forwards alternate infinite ease-in-out;
}
.star:nth-child(10) {
  top: 28%;
  left: 8%;
  -moz-transform: scale(0.59);
  -ms-transform: scale(0.59);
  -webkit-transform: scale(0.59);
  transform: scale(0.59);
}
.star:nth-child(10) span {
  animation: star-pulse 4s forwards alternate infinite ease-in-out;
}
.star:nth-child(11) {
  top: 63%;
  left: 24%;
  -moz-transform: scale(0.95);
  -ms-transform: scale(0.95);
  -webkit-transform: scale(0.95);
  transform: scale(0.95);
}
.star:nth-child(11) span {
  animation: star-pulse 3s forwards alternate infinite ease-in-out;
}
.star:nth-child(12) {
  top: 32%;
  left: 89%;
  -moz-transform: scale(0.62);
  -ms-transform: scale(0.62);
  -webkit-transform: scale(0.62);
  transform: scale(0.62);
}
.star:nth-child(12) span {
  animation: star-pulse 1s forwards alternate infinite ease-in-out;
}
.star:nth-child(13) {
  top: 14%;
  left: 50%;
  -moz-transform: scale(1.25);
  -ms-transform: scale(1.25);
  -webkit-transform: scale(1.25);
  transform: scale(1.25);
}
.star:nth-child(13) span {
  animation: star-pulse 4s forwards alternate infinite ease-in-out;
}
.star:nth-child(14) {
  top: 88%;
  left: 89%;
  -moz-transform: scale(0.53);
  -ms-transform: scale(0.53);
  -webkit-transform: scale(0.53);
  transform: scale(0.53);
}
.star:nth-child(14) span {
  animation: star-pulse 3s forwards alternate infinite ease-in-out;
}
.star:nth-child(15) {
  top: 79%;
  left: 43%;
  -moz-transform: scale(0.98);
  -ms-transform: scale(0.98);
  -webkit-transform: scale(0.98);
  transform: scale(0.98);
}
.star:nth-child(15) span {
  animation: star-pulse 4s forwards alternate infinite ease-in-out;
}
.star:nth-child(16) {
  top: 51%;
  left: 60%;
  -moz-transform: scale(0.72);
  -ms-transform: scale(0.72);
  -webkit-transform: scale(0.72);
  transform: scale(0.72);
}
.star:nth-child(16) span {
  animation: star-pulse 5s forwards alternate infinite ease-in-out;
}
.star:nth-child(17) {
  top: 41%;
  left: 15%;
  -moz-transform: scale(0.87);
  -ms-transform: scale(0.87);
  -webkit-transform: scale(0.87);
  transform: scale(0.87);
}
.star:nth-child(17) span {
  animation: star-pulse 6s forwards alternate infinite ease-in-out;
}
.star:nth-child(18) {
  top: 22%;
  left: 46%;
  -moz-transform: scale(1.11);
  -ms-transform: scale(1.11);
  -webkit-transform: scale(1.11);
  transform: scale(1.11);
}
.star:nth-child(18) span {
  animation: star-pulse 1s forwards alternate infinite ease-in-out;
}
.star:nth-child(19) {
  top: 89%;
  left: 57%;
  -moz-transform: scale(1.14);
  -ms-transform: scale(1.14);
  -webkit-transform: scale(1.14);
  transform: scale(1.14);
}
.star:nth-child(19) span {
  animation: star-pulse 3s forwards alternate infinite ease-in-out;
}
.star:nth-child(20) {
  top: 24%;
  left: 49%;
  -moz-transform: scale(0.7);
  -ms-transform: scale(0.7);
  -webkit-transform: scale(0.7);
  transform: scale(0.7);
}
.star:nth-child(20) span {
  animation: star-pulse 3s forwards alternate infinite ease-in-out;
}
.star:nth-child(21) {
  top: 5%;
  left: 72%;
  -moz-transform: scale(1.16);
  -ms-transform: scale(1.16);
  -webkit-transform: scale(1.16);
  transform: scale(1.16);
}
.star:nth-child(21) span {
  animation: star-pulse 2s forwards alternate infinite ease-in-out;
}
.star:nth-child(22) {
  top: 48%;
  left: 92%;
  -moz-transform: scale(1.14);
  -ms-transform: scale(1.14);
  -webkit-transform: scale(1.14);
  transform: scale(1.14);
}
.star:nth-child(22) span {
  animation: star-pulse 1s forwards alternate infinite ease-in-out;
}
.star:nth-child(23) {
  top: 69%;
  left: 84%;
  -moz-transform: scale(0.61);
  -ms-transform: scale(0.61);
  -webkit-transform: scale(0.61);
  transform: scale(0.61);
}
.star:nth-child(23) span {
  animation: star-pulse 6s forwards alternate infinite ease-in-out;
}
.star:nth-child(24) {
  top: 93%;
  left: 27%;
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}
.star:nth-child(24) span {
  animation: star-pulse 2s forwards alternate infinite ease-in-out;
}
.star:nth-child(25) {
  top: 90%;
  left: 50%;
  -moz-transform: scale(1.17);
  -ms-transform: scale(1.17);
  -webkit-transform: scale(1.17);
  transform: scale(1.17);
}
.star:nth-child(25) span {
  animation: star-pulse 3s forwards alternate infinite ease-in-out;
}
.star:nth-child(26) {
  top: 64%;
  left: 83%;
  -moz-transform: scale(1.25);
  -ms-transform: scale(1.25);
  -webkit-transform: scale(1.25);
  transform: scale(1.25);
}
.star:nth-child(26) span {
  animation: star-pulse 2s forwards alternate infinite ease-in-out;
}
.star:nth-child(27) {
  top: 81%;
  left: 82%;
  -moz-transform: scale(0.85);
  -ms-transform: scale(0.85);
  -webkit-transform: scale(0.85);
  transform: scale(0.85);
}
.star:nth-child(27) span {
  animation: star-pulse 2s forwards alternate infinite ease-in-out;
}
.star:nth-child(28) {
  top: 13%;
  left: 30%;
  -moz-transform: scale(0.51);
  -ms-transform: scale(0.51);
  -webkit-transform: scale(0.51);
  transform: scale(0.51);
}
.star:nth-child(28) span {
  animation: star-pulse 4s forwards alternate infinite ease-in-out;
}
.star:nth-child(29) {
  top: 20%;
  left: 11%;
  -moz-transform: scale(0.54);
  -ms-transform: scale(0.54);
  -webkit-transform: scale(0.54);
  transform: scale(0.54);
}
.star:nth-child(29) span {
  animation: star-pulse 6s forwards alternate infinite ease-in-out;
}
.star:nth-child(30) {
  top: 58%;
  left: 37%;
  -moz-transform: scale(0.57);
  -ms-transform: scale(0.57);
  -webkit-transform: scale(0.57);
  transform: scale(0.57);
}
.star:nth-child(30) span {
  animation: star-pulse 4s forwards alternate infinite ease-in-out;
}
.star:nth-child(31) {
  top: 55%;
  left: 32%;
  -moz-transform: scale(0.67);
  -ms-transform: scale(0.67);
  -webkit-transform: scale(0.67);
  transform: scale(0.67);
}
.star:nth-child(31) span {
  animation: star-pulse 3s forwards alternate infinite ease-in-out;
}
.star:nth-child(32) {
  top: 6%;
  left: 5%;
  -moz-transform: scale(1.07);
  -ms-transform: scale(1.07);
  -webkit-transform: scale(1.07);
  transform: scale(1.07);
}
.star:nth-child(32) span {
  animation: star-pulse 5s forwards alternate infinite ease-in-out;
}
.star:nth-child(33) {
  top: 29%;
  left: 82%;
  -moz-transform: scale(0.87);
  -ms-transform: scale(0.87);
  -webkit-transform: scale(0.87);
  transform: scale(0.87);
}
.star:nth-child(33) span {
  animation: star-pulse 6s forwards alternate infinite ease-in-out;
}
.star:nth-child(34) {
  top: 38%;
  left: 18%;
  -moz-transform: scale(1.24);
  -ms-transform: scale(1.24);
  -webkit-transform: scale(1.24);
  transform: scale(1.24);
}
.star:nth-child(34) span {
  animation: star-pulse 5s forwards alternate infinite ease-in-out;
}
.star:nth-child(35) {
  top: 31%;
  left: 78%;
  -moz-transform: scale(1.12);
  -ms-transform: scale(1.12);
  -webkit-transform: scale(1.12);
  transform: scale(1.12);
}
.star:nth-child(35) span {
  animation: star-pulse 5s forwards alternate infinite ease-in-out;
}
.star:nth-child(36) {
  top: 44%;
  left: 29%;
  -moz-transform: scale(0.69);
  -ms-transform: scale(0.69);
  -webkit-transform: scale(0.69);
  transform: scale(0.69);
}
.star:nth-child(36) span {
  animation: star-pulse 2s forwards alternate infinite ease-in-out;
}
.star:nth-child(37) {
  top: 37%;
  left: 30%;
  -moz-transform: scale(0.84);
  -ms-transform: scale(0.84);
  -webkit-transform: scale(0.84);
  transform: scale(0.84);
}
.star:nth-child(37) span {
  animation: star-pulse 1s forwards alternate infinite ease-in-out;
}
.star:nth-child(38) {
  top: 54%;
  left: 2%;
  -moz-transform: scale(0.91);
  -ms-transform: scale(0.91);
  -webkit-transform: scale(0.91);
  transform: scale(0.91);
}
.star:nth-child(38) span {
  animation: star-pulse 1s forwards alternate infinite ease-in-out;
}
.star:nth-child(39) {
  top: 84%;
  left: 39%;
  -moz-transform: scale(1.08);
  -ms-transform: scale(1.08);
  -webkit-transform: scale(1.08);
  transform: scale(1.08);
}
.star:nth-child(39) span {
  animation: star-pulse 4s forwards alternate infinite ease-in-out;
}
.star:nth-child(40) {
  top: 77%;
  left: 90%;
  -moz-transform: scale(0.68);
  -ms-transform: scale(0.68);
  -webkit-transform: scale(0.68);
  transform: scale(0.68);
}
.star:nth-child(40) span {
  animation: star-pulse 1s forwards alternate infinite ease-in-out;
}
.star:nth-child(41) {
  top: 54%;
  left: 74%;
  -moz-transform: scale(0.89);
  -ms-transform: scale(0.89);
  -webkit-transform: scale(0.89);
  transform: scale(0.89);
}
.star:nth-child(41) span {
  animation: star-pulse 1s forwards alternate infinite ease-in-out;
}
.star:nth-child(42) {
  top: 43%;
  left: 84%;
  -moz-transform: scale(0.93);
  -ms-transform: scale(0.93);
  -webkit-transform: scale(0.93);
  transform: scale(0.93);
}
.star:nth-child(42) span {
  animation: star-pulse 3s forwards alternate infinite ease-in-out;
}
.star:nth-child(43) {
  top: 24%;
  left: 44%;
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
.star:nth-child(43) span {
  animation: star-pulse 6s forwards alternate infinite ease-in-out;
}
.star:nth-child(44) {
  top: 62%;
  left: 33%;
  -moz-transform: scale(0.66);
  -ms-transform: scale(0.66);
  -webkit-transform: scale(0.66);
  transform: scale(0.66);
}
.star:nth-child(44) span {
  animation: star-pulse 4s forwards alternate infinite ease-in-out;
}
.star:nth-child(45) {
  top: 76%;
  left: 72%;
  -moz-transform: scale(1.08);
  -ms-transform: scale(1.08);
  -webkit-transform: scale(1.08);
  transform: scale(1.08);
}
.star:nth-child(45) span {
  animation: star-pulse 6s forwards alternate infinite ease-in-out;
}
.star:nth-child(46) {
  top: 32%;
  left: 73%;
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
}
.star:nth-child(46) span {
  animation: star-pulse 3s forwards alternate infinite ease-in-out;
}
.star:nth-child(47) {
  top: 75%;
  left: 70%;
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
.star:nth-child(47) span {
  animation: star-pulse 1s forwards alternate infinite ease-in-out;
}
.star:nth-child(48) {
  top: 4%;
  left: 22%;
  -moz-transform: scale(0.67);
  -ms-transform: scale(0.67);
  -webkit-transform: scale(0.67);
  transform: scale(0.67);
}
.star:nth-child(48) span {
  animation: star-pulse 5s forwards alternate infinite ease-in-out;
}
.star:nth-child(49) {
  top: 99%;
  left: 72%;
  -moz-transform: scale(1.12);
  -ms-transform: scale(1.12);
  -webkit-transform: scale(1.12);
  transform: scale(1.12);
}
.star:nth-child(49) span {
  animation: star-pulse 4s forwards alternate infinite ease-in-out;
}
.star:nth-child(50) {
  top: 5%;
  left: 37%;
  -moz-transform: scale(0.83);
  -ms-transform: scale(0.83);
  -webkit-transform: scale(0.83);
  transform: scale(0.83);
}
.star:nth-child(50) span {
  animation: star-pulse 2s forwards alternate infinite ease-in-out;
}
.star:nth-child(51) {
  top: 68%;
  left: 88%;
  -moz-transform: scale(0.58);
  -ms-transform: scale(0.58);
  -webkit-transform: scale(0.58);
  transform: scale(0.58);
}
.star:nth-child(51) span {
  animation: star-pulse 2s forwards alternate infinite ease-in-out;
}
.star:nth-child(52) {
  top: 85%;
  left: 67%;
  -moz-transform: scale(0.55);
  -ms-transform: scale(0.55);
  -webkit-transform: scale(0.55);
  transform: scale(0.55);
}
.star:nth-child(52) span {
  animation: star-pulse 1s forwards alternate infinite ease-in-out;
}
.star:nth-child(53) {
  top: 39%;
  left: 5%;
  -moz-transform: scale(1.13);
  -ms-transform: scale(1.13);
  -webkit-transform: scale(1.13);
  transform: scale(1.13);
}
.star:nth-child(53) span {
  animation: star-pulse 4s forwards alternate infinite ease-in-out;
}
.star:nth-child(54) {
  top: 48%;
  left: 69%;
  -moz-transform: scale(1.02);
  -ms-transform: scale(1.02);
  -webkit-transform: scale(1.02);
  transform: scale(1.02);
}
.star:nth-child(54) span {
  animation: star-pulse 3s forwards alternate infinite ease-in-out;
}
.star:nth-child(55) {
  top: 59%;
  left: 27%;
  -moz-transform: scale(0.68);
  -ms-transform: scale(0.68);
  -webkit-transform: scale(0.68);
  transform: scale(0.68);
}
.star:nth-child(55) span {
  animation: star-pulse 2s forwards alternate infinite ease-in-out;
}
.star:nth-child(56) {
  top: 61%;
  left: 99%;
  -moz-transform: scale(0.77);
  -ms-transform: scale(0.77);
  -webkit-transform: scale(0.77);
  transform: scale(0.77);
}
.star:nth-child(56) span {
  animation: star-pulse 2s forwards alternate infinite ease-in-out;
}
.star:nth-child(57) {
  top: 52%;
  left: 58%;
  -moz-transform: scale(0.84);
  -ms-transform: scale(0.84);
  -webkit-transform: scale(0.84);
  transform: scale(0.84);
}
.star:nth-child(57) span {
  animation: star-pulse 4s forwards alternate infinite ease-in-out;
}
.star:nth-child(58) {
  top: 43%;
  left: 38%;
  -moz-transform: scale(0.62);
  -ms-transform: scale(0.62);
  -webkit-transform: scale(0.62);
  transform: scale(0.62);
}
.star:nth-child(58) span {
  animation: star-pulse 5s forwards alternate infinite ease-in-out;
}
.star:nth-child(59) {
  top: 79%;
  left: 19%;
  -moz-transform: scale(0.85);
  -ms-transform: scale(0.85);
  -webkit-transform: scale(0.85);
  transform: scale(0.85);
}
.star:nth-child(59) span {
  animation: star-pulse 1s forwards alternate infinite ease-in-out;
}
.star:nth-child(60) {
  top: 21%;
  left: 76%;
  -moz-transform: scale(1.22);
  -ms-transform: scale(1.22);
  -webkit-transform: scale(1.22);
  transform: scale(1.22);
}
.star:nth-child(60) span {
  animation: star-pulse 6s forwards alternate infinite ease-in-out;
}

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
*:after, *:before {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.stars-container {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  width: 100%;
  background-color: transparent;
  background-image: 
  conic-gradient(#fff, #000, #fff, #000, #fff, #000, #fff, #000), 
  conic-gradient(#fff, #000, #fff, #000, #fff, #000, #fff, #000), 
  radial-gradient(circle at 40% 5%, #2ad0ca, #e1f664, #feb0fe, #abb3fc, #5df7a4, #58c4f6);
  background-blend-mode: screen, difference, normal;
}

@keyframes star-pulse {
  0% {
    opacity: 0.2;
  }
  100% {
    opacity: 0.7;
  }
}

.gradient1 {
  width: 500px;
  height: 500px;
  background-image: linear-gradient(15deg, rgba(32, 2, 133, 0.2),rgba(241, 62, 151, 0.2)),linear-gradient(90deg, rgb(246, 112, 73) 0%,rgb(230, 71, 141) 11%,rgb(206, 9, 242) 48%,rgb(254, 132, 39) 50%,rgb(238, 91, 107) 61%,rgb(214, 30, 208) 88%,rgb(222, 50, 174) 100%);
}

.blur-effect {
  filter: blur(4px); /* Adjust the pixel value to increase or decrease the blur */
}