body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-height: 100vh;
  background: radial-gradient(ellipse at bottom, #0d1d31 0%, #0d0d13 100%);
  overflow: hidden;
}

.stars {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 120%;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.star {
  --star-color: var(--primary-color);
  --star-tail-length: 6em;
  --star-tail-height: 2px;
  --star-width: calc(var(--star-tail-length) / 6);
  --fall-duration: 9s;
  --tail-fade-duration: var(--fall-duration);
  position: absolute;
  top: var(--top-offset);
  left: 0;
  width: var(--star-tail-length);
  height: var(--star-tail-height);
  color: var(--star-color);
  background: linear-gradient(45deg, currentColor, transparent);
  border-radius: 50%;
  -webkit-filter: drop-shadow(0 0 6px currentColor);
          filter: drop-shadow(0 0 6px currentColor);
  -webkit-transform: translate3d(104em, 0, 0);
          transform: translate3d(104em, 0, 0);
  -webkit-animation: fall var(--fall-duration) var(--fall-delay) linear infinite, tail-fade var(--tail-fade-duration) var(--fall-delay) ease-out infinite;
          animation: fall var(--fall-duration) var(--fall-delay) linear infinite, tail-fade var(--tail-fade-duration) var(--fall-delay) ease-out infinite;
}

@media screen and (max-width: 750px) {
  .star {
    -webkit-animation: fall var(--fall-duration) var(--fall-delay) linear infinite;
            animation: fall var(--fall-duration) var(--fall-delay) linear infinite;
  }
}

.star:nth-child(1) {
  --star-tail-length: 5.46em;
  --top-offset: 77.78vh;
  --fall-duration: 11.816s;
  --fall-delay: 1.484s;
  color: #a1aff9;
}

.star:nth-child(2) {
  --star-tail-length: 5.67em;
  --top-offset: 12.21vh;
  --fall-duration: 6.51s;
  --fall-delay: 3.593s;
  color: #a1aff9;
}

.star:nth-child(3) {
  --star-tail-length: 5.36em;
  --top-offset: 37.14vh;
  --fall-duration: 6.516s;
  --fall-delay: 5.975s;
  color: #a1aff9;
}

.star:nth-child(4) {
  --star-tail-length: 6.33em;
  --top-offset: 14.79vh;
  --fall-duration: 10.383s;
  --fall-delay: 1.117s;
  color: #a1aff9;
}

.star:nth-child(5) {
  --star-tail-length: 6.35em;
  --top-offset: 87.19vh;
  --fall-duration: 8.891s;
  --fall-delay: 4.464s;
  color: #a1aff9;
}

.star:nth-child(6) {
  --star-tail-length: 5.55em;
  --top-offset: 50.9vh;
  --fall-duration: 8.102s;
  --fall-delay: 3.45s;
  color: #a1aff9;
}

.star:nth-child(7) {
  --star-tail-length: 5.42em;
  --top-offset: 92.42vh;
  --fall-duration: 8.783s;
  --fall-delay: 2.875s;
  color: #a1aff9;
}

.star:nth-child(8) {
  --star-tail-length: 6.19em;
  --top-offset: 67.59vh;
  --fall-duration: 7.537s;
  --fall-delay: 8.418s;
  color: #a1aff9;
}

.star:nth-child(9) {
  --star-tail-length: 5.19em;
  --top-offset: 57.81vh;
  --fall-duration: 10.143s;
  --fall-delay: 2.468s;
  color: #a1aff9;
}

.star:nth-child(10) {
  --star-tail-length: 5.77em;
  --top-offset: 13.2vh;
  --fall-duration: 8.61s;
  --fall-delay: 5.699s;
  color: #a1aff9;
}

.star:nth-child(11) {
  --star-tail-length: 6.06em;
  --top-offset: 2.64vh;
  --fall-duration: 9.52s;
  --fall-delay: 7.194s;
  color: #a1aff9;
}

.star:nth-child(12) {
  --star-tail-length: 6.95em;
  --top-offset: 81.35vh;
  --fall-duration: 8.83s;
  --fall-delay: 8.779s;
  color: #a1aff9;
}

.star:nth-child(13) {
  --star-tail-length: 5.44em;
  --top-offset: 46.19vh;
  --fall-duration: 9.83s;
  --fall-delay: 4.396s;
  color: #a1aff9;
}

.star:nth-child(14) {
  --star-tail-length: 5.23em;
  --top-offset: 36.9vh;
  --fall-duration: 10.103s;
  --fall-delay: 6.639s;
  color: #a1aff9;
}

.star:nth-child(15) {
  --star-tail-length: 5.27em;
  --top-offset: 39.79vh;
  --fall-duration: 8.111s;
  --fall-delay: 3.308s;
  color: #a1aff9;
}

.star:nth-child(16) {
  --star-tail-length: 7.09em;
  --top-offset: 21.92vh;
  --fall-duration: 8.947s;
  --fall-delay: 8.659s;
  color: #a1aff9;
}

.star:nth-child(17) {
  --star-tail-length: 7.23em;
  --top-offset: 75.95vh;
  --fall-duration: 6.387s;
  --fall-delay: 2.975s;
  color: #a1aff9;
}

.star:nth-child(18) {
  --star-tail-length: 7.15em;
  --top-offset: 80.63vh;
  --fall-duration: 9.017s;
  --fall-delay: 3.248s;
  color: #a1aff9;
}

.star:nth-child(19) {
  --star-tail-length: 5.57em;
  --top-offset: 17.88vh;
  --fall-duration: 10.79s;
  --fall-delay: 9.604s;
  color: #a1aff9;
}

.star:nth-child(20) {
  --star-tail-length: 5.65em;
  --top-offset: 48.8vh;
  --fall-duration: 7.665s;
  --fall-delay: 6.153s;
  color: #a1aff9;
}

.star:nth-child(21) {
  --star-tail-length: 6.88em;
  --top-offset: 17.99vh;
  --fall-duration: 8.453s;
  --fall-delay: 6.083s;
  color: #a1aff9;
}

.star:nth-child(22) {
  --star-tail-length: 6.02em;
  --top-offset: 82.86vh;
  --fall-duration: 7.008s;
  --fall-delay: 9.027s;
  color: #a1aff9;
}

.star:nth-child(23) {
  --star-tail-length: 7.27em;
  --top-offset: 20.6vh;
  --fall-duration: 10.899s;
  --fall-delay: 1.152s;
  color: #a1aff9;
}

.star:nth-child(24) {
  --star-tail-length: 5.42em;
  --top-offset: 19.02vh;
  --fall-duration: 7.205s;
  --fall-delay: 1.447s;
  color: #a1aff9;
}

.star:nth-child(25) {
  --star-tail-length: 5.81em;
  --top-offset: 0.76vh;
  --fall-duration: 8.03s;
  --fall-delay: 6.51s;
  color: #a1aff9;
}

.star:nth-child(26) {
  --star-tail-length: 6.56em;
  --top-offset: 3.29vh;
  --fall-duration: 11.12s;
  --fall-delay: 5.173s;
  color: #a1aff9;
}

.star:nth-child(27) {
  --star-tail-length: 5.27em;
  --top-offset: 48.96vh;
  --fall-duration: 11.416s;
  --fall-delay: 6.996s;
  color: #a1aff9;
}

.star:nth-child(28) {
  --star-tail-length: 6.14em;
  --top-offset: 10.52vh;
  --fall-duration: 7.022s;
  --fall-delay: 7.83s;
  color: #a1aff9;
}

.star:nth-child(29) {
  --star-tail-length: 6.06em;
  --top-offset: 33vh;
  --fall-duration: 6.618s;
  --fall-delay: 2.792s;
  color: #a1aff9;
}

.star:nth-child(30) {
  --star-tail-length: 7.39em;
  --top-offset: 58.81vh;
  --fall-duration: 6.328s;
  --fall-delay: 9.625s;
  color: #a1aff9;
}

.star:nth-child(31) {
  --star-tail-length: 7.28em;
  --top-offset: 37.3vh;
  --fall-duration: 7.585s;
  --fall-delay: 2.886s;
  color: #a1aff9;
}

.star:nth-child(32) {
  --star-tail-length: 7.1em;
  --top-offset: 32.38vh;
  --fall-duration: 11.483s;
  --fall-delay: 5.6s;
  color: #a1aff9;
}

.star:nth-child(33) {
  --star-tail-length: 5.55em;
  --top-offset: 54.93vh;
  --fall-duration: 7.284s;
  --fall-delay: 0.462s;
  color: #a1aff9;
}

.star:nth-child(34) {
  --star-tail-length: 7.15em;
  --top-offset: 59.17vh;
  --fall-duration: 7.078s;
  --fall-delay: 4.569s;
  color: #a1aff9;
}

.star:nth-child(35) {
  --star-tail-length: 7.26em;
  --top-offset: 64.75vh;
  --fall-duration: 9.58s;
  --fall-delay: 9.66s;
  color: #a1aff9;
}

.star:nth-child(36) {
  --star-tail-length: 5.24em;
  --top-offset: 34.73vh;
  --fall-duration: 8.381s;
  --fall-delay: 7.97s;
  color: #a1aff9;
}

.star:nth-child(37) {
  --star-tail-length: 5.46em;
  --top-offset: 26.27vh;
  --fall-duration: 7.428s;
  --fall-delay: 9.579s;
  color: #a1aff9;
}

.star:nth-child(38) {
  --star-tail-length: 5.12em;
  --top-offset: 42.26vh;
  --fall-duration: 8.826s;
  --fall-delay: 4.602s;
  color: #a1aff9;
}

.star:nth-child(39) {
  --star-tail-length: 6.41em;
  --top-offset: 89.65vh;
  --fall-duration: 7.603s;
  --fall-delay: 6.45s;
  color: #a1aff9;
}

.star:nth-child(40) {
  --star-tail-length: 6.37em;
  --top-offset: 97.71vh;
  --fall-duration: 10.884s;
  --fall-delay: 8.53s;
  color: #a1aff9;
}

.star:nth-child(41) {
  --star-tail-length: 5.98em;
  --top-offset: 76.49vh;
  --fall-duration: 6.546s;
  --fall-delay: 0.514s;
  color: #a1aff9;
}

.star:nth-child(42) {
  --star-tail-length: 5.31em;
  --top-offset: 97.71vh;
  --fall-duration: 11.783s;
  --fall-delay: 9.811s;
  color: #a1aff9;
}

.star:nth-child(43) {
  --star-tail-length: 5.26em;
  --top-offset: 46.04vh;
  --fall-duration: 7.807s;
  --fall-delay: 0.781s;
  color: #a1aff9;
}

.star:nth-child(44) {
  --star-tail-length: 6.09em;
  --top-offset: 78.33vh;
  --fall-duration: 6.158s;
  --fall-delay: 0.235s;
  color: #a1aff9;
}

.star:nth-child(45) {
  --star-tail-length: 6.39em;
  --top-offset: 80.26vh;
  --fall-duration: 6.739s;
  --fall-delay: 4.402s;
  color: #a1aff9;
}

.star:nth-child(46) {
  --star-tail-length: 6.75em;
  --top-offset: 0.4vh;
  --fall-duration: 7.866s;
  --fall-delay: 4.506s;
  color: #a1aff9;
}

.star:nth-child(47) {
  --star-tail-length: 5.83em;
  --top-offset: 72.7vh;
  --fall-duration: 9.888s;
  --fall-delay: 2.413s;
  color: #a1aff9;
}

.star:nth-child(48) {
  --star-tail-length: 7.07em;
  --top-offset: 55.05vh;
  --fall-duration: 8.123s;
  --fall-delay: 3.582s;
  color: #a1aff9;
}

.star:nth-child(49) {
  --star-tail-length: 7.4em;
  --top-offset: 4.33vh;
  --fall-duration: 11.804s;
  --fall-delay: 4.768s;
  color: #a1aff9;
}

.star:nth-child(50) {
  --star-tail-length: 5.98em;
  --top-offset: 3.64vh;
  --fall-duration: 6.416s;
  --fall-delay: 2.299s;
  color: #a1aff9;
}

.star::before, .star::after {
  color: #a1aff9;
  position: absolute;
  content: '';
  top: 0;
  left: calc(var(--star-width) / -2);
  width: var(--star-width);
  height: 100%;
  background: linear-gradient(45deg, transparent, currentColor, transparent);
  border-radius: inherit;
  -webkit-animation: blink 2s linear infinite;
          animation: blink 2s linear infinite;
}

.star::before {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.star::after {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

@-webkit-keyframes fall {
  to {
    -webkit-transform: translate3d(-30em, 0, 0);
            transform: translate3d(-30em, 0, 0);
    color: #a1aff9;
  }
}

@keyframes fall {
  to {
    -webkit-transform: translate3d(-30em, 0, 0);
            transform: translate3d(-30em, 0, 0);
    color: #a1aff9;
  }
}

@-webkit-keyframes tail-fade {
  0%, 50% {
    width: var(--star-tail-length);
    opacity: 1;
    color: #a1aff9;
  }
  70%, 80% {
    width: 0;
    opacity: 0.4;
    color: #a1aff9;
  }
  100% {
    width: 0;
    opacity: 0;
    color: #a1aff9;
  }
}

@keyframes tail-fade {
  0%, 50% {
    width: var(--star-tail-length);
    opacity: 1;
    color: #a1aff9;
  }
  70%, 80% {
    width: 0;
    opacity: 0.4;
    color: #a1aff9;
  }
  100% {
    width: 0;
    opacity: 0;
    color: #a1aff9;
  }
}

@-webkit-keyframes blink {
  50% {
    opacity: 0.6;
    color: #a1aff9;
  }
}

@keyframes blink {
  50% {
    opacity: 0.6;
    color: #a1aff9;
  }
}
.context-menu {
  position: fixed;
  text-align: center;
  background: lightgray;
  border: 1px solid black;
}

.context-menu ul{
  padding: 0px;
  margin: 0px;
  min-width: 150px;
  list-style: none;
}

.context-menu ul li{
  padding-bottom: 7px;
  padding-top: 7px;
  border: 1px solid black;
  text-align: center;
}

.context-menu ul li a {
  text-decoration: none;
  color: black;
  list-style: none;
}

.context-menu ul li:hover {
  background: darkgray;
}