@keyframes bounce {
    0%, 100% {
        transform: translateY(-50%);
    }
    50% {
        transform: translateY(-60%);
    }
}

.bounce {
    animation: bounce .5s infinite;
}

.gradient-text {
    font-size: 60px;
    font-weight: bold;
    background: linear-gradient(270deg, #ff6b6b, #f7b733, #96deda, #ff6b6b);
    background-size: 400%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: gradient-animation 5s ease infinite;
}

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

.gradient-button {
    padding: 10px 20px;
    font-size: 24px;
    font-weight: bold;
    border: none;
    border-radius: 7px;
    cursor: pointer;
    background: linear-gradient(270deg, #ff6b6b, #f7b733, #96deda, #ff6b6b);
    background-size: 200%;
    color: white; /* Text color */
    animation: gradient-animation 5s ease infinite;
    transition: transform 0.2s;
}

.gradient-button:hover {
    transform: scale(1.05); /* Slightly enlarge button on hover */
}

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

.toadguitar {
    position: absolute;
    top: 10%; /* Start near the top */
    right: -200px; /* Start off the screen on the right */
    font-size: 50px; /* Size of the element */
    z-index: 9999; /* High z-index to stay on top */
    animation: diagonal-move 10s linear, spin 2s linear infinite;
}

/* Keyframes for diagonal movement from top-right to bottom-left */
@keyframes diagonal-move {
    0% {
        right: -100px; /* Start off-screen on the right */
        top: 30%; /* Initial vertical position */
    }
    100% {
        right: 100vw; /* Move all the way to the left, off-screen */
        top: 10%; /* Move diagonally downwards */
    }
}

/* Animation for spinning */
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}