.neon {
    font-weight: 400;
    font-size: clamp(2.0rem, 6vw, 6rem);
    position: relative;
    color: #00ffff;
    text-shadow: 0 0 5px #00ff99, 0 0 15px #00ff99, 0 0 30px #00ff99;
    cursor: default;
    white-space: nowrap;
}

.neonText {
  animation: flicker 1.5s infinite alternate;
  color: #fff;
}

.gradbg {
    background-image: linear-gradient(to bottom, #003, #001);
}

.gradbg2 {
    background-image: linear-gradient(to bottom, #001, #003);
}

.gradbg3 {
    background-image: linear-gradient(to bottom, #005, #003);
}


/* Flickering animation */
@keyframes flicker {
    
  0%, 18%, 22%, 25%, 53%, 57%, 100% {

      text-shadow:
      0 0 4px #fff,
      0 0 11px #fff,
      0 0 19px #fff,
      0 0 40px #0fa,
      0 0 80px #0fa,
      0 0 90px #0fa;
  
  }
  
  20%, 24%, 55% {        
      text-shadow: none;
  }    
}

@import url(https://fonts.googleapis.com/css?family=Orbitron:700);

/* Stars 
------------------------------------- */

#space, .stars {
  overflow: hidden;
  position: absolute;
  top: 0; 
  bottom: 0;
  left: 0;
  right: 0;
  background-color: black;
}

.stars {
  background-image: 
    radial-gradient(2px 2px at 20px 30px, #eee, rgba(0,0,0,0)),
    radial-gradient(2px 2px at 40px 70px, #fff, rgba(0,0,0,0)),
    radial-gradient(2px 2px at 50px 160px, #ddd, rgba(0,0,0,0)),
    radial-gradient(2px 2px at 90px 40px, #fff, rgba(0,0,0,0)),
    radial-gradient(2px 2px at 130px 80px, #fff, rgba(0,0,0,0)),
    radial-gradient(2px 2px at 160px 120px, #ddd, rgba(0,0,0,0));
  background-repeat: repeat;
  background-size: 200px 200px;
  animation: zoom 5s infinite;
  opacity: 0;
}

.stars:nth-child(1) {
  background-position: 50% 50%;
  animation-delay: 0s;
}
.stars:nth-child(2) {
  background-position: 20% 60%;
  animation-delay: 1s;
}
.stars:nth-child(3) {
  background-position: -20% -30%;
  animation-delay: 2s;
}
.stars:nth-child(4) {
  background-position: 40% -80%;
  animation-delay: 3s;
}
.stars:nth-child(5) {
  background-position: -20% 30%;
  animation-delay: 4s;
}

@keyframes zoom {
  0% {
    opacity: 0;
    transform: scale(0.5);
    animation-timing-function: ease-in;
  } 
  85% {
    opacity: 1;
    transform: scale(2.8);
    animation-timing-function: linear;
  }
  100% {
    opacity: 0;
    transform: scale(3.5);
  }
}

.typing-fixed {
  white-space: nowrap;
  overflow: hidden;
  font-family: 'Courier New', monospace;
  font-size: 1em;
  color: #0ff;
  border-right: 0px;
}

.hidden {
  visibility: hidden;
}

.invisible {
  display: none;
}

.typing1_1 {
  width: 15ch;
  animation: typing 2s steps(15), blink .5s step-end infinite alternate;
  border-right: 3px solid;
}

.typing1_2 {
  width: 29ch;
  animation: typing 3s steps(29), blink .5s step-end infinite alternate;
  border-right: 3px solid;
}

.typing1_3 {
  width: 17ch;
  animation: typing 2s steps(17), blink .5s step-end infinite alternate;
  border-right: 3px solid;
}

.typing1_4 {
  width: 31ch;
  animation: typing 3s steps(31), blink .5s step-end infinite alternate;
  border-right: 3px solid;
}

.typing1_5 {
  width: 31ch;
  animation: typing 3s steps(31), blink .5s step-end infinite alternate;
  border-right: 3px solid;
}

.typing2_1 {
  width: 35ch;
  animation: typing 3s steps(35), blink .5s step-end infinite alternate;
  border-right: 3px solid;
}

.typing2_2 {
  width: 36ch;
  animation: typing 3s steps(36), blink .5s step-end infinite alternate;
  border-right: 3px solid;
}

.typing2_3 {
  width: 35ch;
  animation: typing 3s steps(35), blink .5s step-end infinite alternate;
  border-right: 3px solid;
}

.typing2_4 {
  width: 34ch;
  animation: typing 3s steps(34), blink .5s step-end infinite alternate;
  border-right: 3px solid;
}

.typing2_5 {
  width: 32ch;
  animation: typing 3s steps(32), blink .5s step-end infinite alternate;
  border-right: 3px solid;
}


@keyframes typing {
  from {
    width: 0
  }
}
    
@keyframes blink {
  50% {
    border-color: transparent
  }
}

.monitor {
  background-color: black;
  background-image: radial-gradient(
    rgba(0, 150, 0, 0.75), black 120%
  );
  overflow: hidden;
  padding: 2rem;
  color: white;
  font: 1.0rem Inconsolata, monospace;
  text-shadow: 0 0 5px #C8C8C8;
  &::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: repeating-linear-gradient(
      0deg,
      rgba(black, 0.15),
      rgba(black, 0.15) 1px,
      transparent 1px,
      transparent 2px
    );
  }
}

.carousel-dark .carousel-indicators [data-bs-target], .carousel-indicators [data-bs-target] {
  background-color: var(--bs-red);
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  height: 100px;
  width: 100px;
  outline: red;
  background-size: 100%, 100%;
  background-image: none;
}

.carousel-control-next-icon:after
{
  content: '>';
  font-size: 55px;
  color: red;
}

.carousel-control-prev-icon:after {
  content: '<';
  font-size: 55px;
  color: red;
}

.px-my {
  padding-left: 4rem !important;
  padding-right: 4rem !important;
}