Template:Aspietrainanimation.css

/* train animation */ .train{

 animation: trainaimation 4s linear;

} @keyframes trainaimation {

 0% {
   visibility:visible;
   transform: translate(0, 0);
 }
 100% {
   transform: translate(556%, 0);
 }

}

.texttraineffect {

 display:inline-flex;

}

.texttraineffect span {

 word-break: break-all;
 height: 1.2em;
 overflow: hidden;
 animation:t 4s linear;

} .texttraineffect span:before {

 content:" ";
 display:inline-block;

} /* The text will have an illusion of appearing as it passes the train using a width effect. */ @keyframes t {

 0%,15% {
   width:0%
 }
 75% {
   width:100%
 }

}

/*This changes the autism text to be animated in the colors of colorjak. you know since le heccing autism I chose this in a very spefic way as the colors are the exact colors found on colorjak to the exact hex number but also added new ones

• /

.colorjaktext{

  animation: colors 3s steps(1) infinite;

} @keyframes colors {

 0% {
   color: #1E90FF; /* Bright blue */
   text-shadow: 0 0 5px #339FFF, 0 0 10px #339FFF, 0 0 15px #1E90FF;
 }
 14.28% {
   color: #00FFFF; /* Aqua */
   text-shadow: 0 0 5px #00DDDD, 0 0 10px #00DDDD, 0 0 15px #00FFFF;
 }
 28.56% {
   color: #FF4500; /* Bright red */
   text-shadow: 0 0 5px #FF6347, 0 0 10px #FF6347, 0 0 15px #FF4500;
 }
 42.84% {
   color: #32CD32; /* Bright lime green */
   text-shadow: 0 0 5px #4DF24D, 0 0 10px #4DF24D, 0 0 15px #32CD32;
 }
 57.12% {
   color: #FF69B4; /* Bright pink */
   text-shadow: 0 0 5px #FF85C0, 0 0 10px #FF85C0, 0 0 15px #FF69B4;
 }
 71.40% {
   color: #8A2BE2; /* Electric Purple (replaces black) */
   text-shadow: 0 0 5px #A855FF, 0 0 10px #A855FF, 0 0 15px #8A2BE2;
 }
 85.68% {
   color: #DA70D6; /* Bright magenta */
   text-shadow: 0 0 5px #EE82EE, 0 0 10px #EE82EE, 0 0 15px #DA70D6;
 }
 100% {
   color: #1E90FF; /* Back to Bright blue */
   text-shadow: 0 0 5px #339FFF, 0 0 10px #339FFF, 0 0 15px #1E90FF;
 }

}