@layer demo {
  .gradient-glowing-text {
    display: grid;
    
    > * {
      grid-area: 1 / 1;
    }
    
    > h1 {
      --space:;
      background: linear-gradient(to right var(--space), oklch(90% .3 230), oklch(70% .3 340));
      -webkit-background-clip: text;
      color: transparent;
      
      @supports (background: linear-gradient(in oklab, #000, #fff)) {
        --space: in oklch;
      }
      
      @media (prefers-reduced-motion: no-preference) {
        animation: rotate-gradient 5s linear infinite;
      }
      
      &[aria-hidden] {
        filter: blur(clamp(30px, 4vw, 60px)) saturate(2);
      }
    }
  }
}

@keyframes rotate-gradient {
  0%, 100% {
    background: linear-gradient(to right in oklch, oklch(90% .3 230), oklch(70% .3 340));
    -webkit-background-clip: text;
    color: transparent;
  }
  25% {
    background: linear-gradient(to right in oklch, oklch(87% .4 142), oklch(100% .4 95));
    -webkit-background-clip: text;
    color: transparent;
  }
  50% {
    background: linear-gradient(to right in oklab, oklch(95% .25 160), oklch(75% .5 260));
    -webkit-background-clip: text;
    color: transparent;
  }
  75% {
    background: linear-gradient(to right in oklab, oklch(95% .4 95), oklch(55% .45 350));
    -webkit-background-clip: text;
    color: transparent;
  }
}



/*Neon Text*/
#Neon1 {
  color:#FFF;
  text-decoration: none;
  transition: all 0.5s;
   animation: neon1 1.5s ease-in-out infinite alternate;
}

#Neon2{
  color:#FFF;
  text-decoration: none;
  transition: all 0.5s;
   animation: neon3 1.5s ease-in-out infinite alternate;
}

#Neon3{
  color:#FFF;
  text-decoration: none;
  transition: all 0.5s;
   animation: neon2 1.5s ease-in-out infinite alternate;
}

#Neon4{
  color:#FFF;
  text-decoration: none;
  transition: all 0.5s;
   animation: neon4 1.5s ease-in-out infinite alternate;
}

#Neon5{
  color:#FFF;
  text-decoration: none;
  transition: all 0.5s;
   animation: neon5 1.5s ease-in-out infinite alternate;
}

#Neon6{
  color:#FFF;
  text-decoration: none;
  transition: all 0.5s;
   animation: neon6 1.5s ease-in-out infinite alternate;
}

/*glow*/
@keyframes neon20 {
  from {
    text-shadow: 0 0 10px rgba(255,255,255,.8),
                 0 0 20px rgba(255,255,255,.8),
                 0 0 30px rgba(255,255,255,.8);
  }
  to {
    text-shadow: 0 0 2px rgba(255,255,255,.8),
                 0 0 8px rgba(255,255,255,.8),
                 0 0 10px rgba(55,255,255,.8);
  }
}

@keyframes neon1 {
  from {
    text-shadow: 0 0 0 #fff, 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #FF1177;
  }
  to {
    text-shadow: 0 0 0 #fff, 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #FF1177;
  }
}



@keyframes neon2 {
  from {
    text-shadow: 0 0 0 #fff,0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #228DFF;
  }
  to {
    text-shadow: 0 0 0 #fff,0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #228DFF;
  }
}

@keyframes neon3 {
  from {
    text-shadow: 0 0 0 #fff,0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #FFDD1B;
  }
  to {
    text-shadow: 0 0 0 #fff,0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #FFDD1B;
  }
}

@keyframes neon4 {
  from {
    text-shadow: 0 0 0 #fff,0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #B6FF00, 0 0 70px #B6FF00, 0 0 80px #B6FF00, 0 0 100px #B6FF00, 0 0 150px #B6FF00;
  }
  to {
    text-shadow: 0 0 0 #fff,0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #B6FF00, 0 0 35px #B6FF00, 0 0 40px #B6FF00, 0 0 50px #B6FF00, 0 0 75px #B6FF00;
  }
}

@keyframes neon5 {
  from {
    text-shadow: 0 0 0 #fff,0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #FF9900, 0 0 70px #FF9900, 0 0 80px #FF9900, 0 0 100px #FF9900, 0 0 150px #FF9900;
  }
  to {
    text-shadow: 0 0 0 #fff,0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #FF9900, 0 0 35px #FF9900, 0 0 40px #FF9900, 0 0 50px #FF9900, 0 0 75px #FF9900;
  }
}

@keyframes neon6 {
  from {
    text-shadow: 0 0 0 #fff,0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ff00de, 0 0 70px #ff00de, 0 0 80px #ff00de, 0 0 100px #ff00de, 0 0 150px #ff00de;
  }
  to {
    text-shadow: 0 0 0 #fff,0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ff00de, 0 0 35px #ff00de, 0 0 40px #ff00de, 0 0 50px #ff00de, 0 0 75px #ff00de;
  }
}
/*REEEEEEEEEEESPONSIVE*/


#Footer li a span:hover{
  color:Orange;
  text-decoration: none;  
}
