.yd-btn-gap-2 {
	gap: 2px;
}



.yd-center-txt {
text-align: center;
}
.rainbow-text {
    font-size: 3rem;
    font-weight: bold;
    background: linear-gradient(
        270deg,
        red,
        orange,
        yellow,
        green,
        cyan,
        blue,
        violet,
        red
    );
    background-size: 1400% 1400%;
    
    /* Clip gradient to text */
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    animation: rainbowShift 8s linear infinite;
}
.yd-title {
font-size: 3rem;
    font-weight: bold;
    background: linear-gradient(
        270deg,
        red,
        orange,
        yellow,
        green,
        cyan,
        blue,
        violet,
        red
    );
    background-size: 1400% 1400%;
    
    /* Clip gradient to text */
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    animation: rainbowShift 8s linear infinite;
}

.pulse-rainbow {
   
		font-size: 3rem; 
	
    font-weight: bold;
    background: linear-gradient(
        270deg,
        red,
        orange,
        yellow,
        green,
        cyan,
        blue,
        violet,
        red
    );
    background-size: 1400% 1400%;

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    animation: rainbowMove 6s linear infinite alternate,
               pulse 2s linear infinite alternate;
							}
							
							
							/*
Source - https://stackoverflow.com/a/54702294
Posted by Austen Holland, modified by community. See post 'Timeline' for change history
Retrieved 2026-04-13, License - CC BY-SA 4.0
*/

#shadowBox {
    background-color: rgb(0, 0, 0);
    /* Fallback color */
    background-color: rgba(0, 0, 0, 0.2);
    /* Black w/opacity/see-through */
    border: 3px solid;
}

.rainbow {
    text-align: center;
 
    font-size: 32px;
    font-family: monospace;
    letter-spacing: 5px;
}
.rainbow_text_animated {
    background: linear-gradient(to right, #6666ff, #0099ff , #00ff00, #ff3399, #6666ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: rainbow_animation 6s ease-in-out infinite;
    background-size: 400% 100%;
}

@keyframes rainbow_animation {
    0%,100% {
        background-position: 0 0;
    }

    50% {
        background-position: 100% 0;
    }
}
							

@keyframes rainbowMove {
    0% { background-position: 0% 50%; }
    100% { background-position: 100% 50%; }
}

/* Pulse effect */
@keyframes pulse {
    0%, 100% {
        transform: scale(1);
    }
    0%, 24% {
        filter: drop-shadow(0 0 5px cyan);
    }
    25%, 49% {

    filter: drop-shadow(0 0 7px orange);
    }
    50%, 74% {
  
        filter: drop-shadow(0 0 9px red);
    
        }
    75%, 85% {

        filter: drop-shadow(0 0 11px yellow);
    }
    86%, 95% {
 
        filter: drop-shadow(0 0 13px blue);
    }
    96%, 100% {
        transform: scale(1.1);
        filter: drop-shadow(0 0 20px green);
    }
}

/* Animation */
@keyframes rainbowShift {
    0% { background-position: 0% 50%; }
    100% { background-position: 100% 50%; }
}