* {

font-family: Lucida Sans;
 background-image: linear-gradient(to bottom right, rgb(0, 0, 0), rgb(0, 0, 0));

}

h1 {

color: rgb(2, 238, 255);
text-align: center;
font-size: 70px;
text-shadow: 0 0 20px rgb(0, 255, 234), 0 0 30px rgb(253, 114, 0), 0 0 40px rgb(255, 174, 0), 0 0 50px rgb(72, 255, 16), 0 0 60px rgb(255, 77, 166), 0 0 70px rgb(255, 77, 166), 0 0 80px rgb(255, 77, 166);
}

h2{
    font-size: 38px;
    color:rgb(255, 255, 255)
}



#pet{
    position: fixed;
    z-index:10;
    top: 20px;
    left: 20px;
}

#start{
    position: fixed; 
    background-color: rgb(255, 0, 149);
    color: rgb(0, 0, 0);
    font-size: 16px;
    cursor: pointer;
    top: 50px;
    left: 30px;
}

#stop{
    position: fixed; 
    background-color: rgb(255, 196, 0);
    color: rgb(0, 0, 0);
    font-size: 16px;
    cursor: pointer;
    top: 50px;
    left: 50px;
}

#pause{
    position: fixed; 
    background-color: rgb(0, 247, 255);
    color: rgb(0, 0, 0);
    font-size: 16px;
    cursor: pointer;
    top: 50px;
    left: 70px;
}

.heart{
    position: fixed;
    z-index: 1000;
    font-size: 30px;
    background: none !important;
    animation: fly-up 2s ease-out;  
}

@keyframes fly-up{
    0%{
        transform: translateY(0);
        opacity: 1.0; 
    }
    100% {
    transform: translateY(-200px) rotateZ(45deg);
    opacity: 0.0;
    }
}

p {

font-size: 18px;

color: rgb(255, 255, 255);
}
