@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap');

*{
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
}
html{
    display: flex;
    text-align: center;
    justify-content: center;
    margin-top: 240px;
    background-color: rgb(156, 156, 156);

}
.welcome h1{
    font-size: 80px;
    color: rgba(255, 255, 255, 0.808);
    padding-bottom:5px ;
    filter: drop-shadow(7px 0px 6px #000);
}
p{
    font-size: 20px;
    color: rgb(68, 67, 67);
}
button{
    border: none;
    color: #fff;
    margin-top: 20px;
    width: 9em;
    height: 3em;
    line-height: 2em;
    text-align: center;
    background: linear-gradient(90deg,#03a9f4,#f441a5,#ffab3d,#03a9f4);
    background-size: 300%;
    border-radius: 30px;
    cursor: pointer;
    z-index: 1;
}
button:hover{
    animation: animation 5s linear infinite;
    border: none;
}
@keyframes animation{
    0%{background-position: 0%;}
    100%{background-position: 400%;}
}
button::before{
    content: "";
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    z-index: -1;
    background: linear-gradient(90deg,#03a9f4,#f441a5,#ffab3d,#03a9f4);
    background-size: 400%;
    border-radius: 35px;
    transition: 1s;
}
button:hover::before{
    filter: blur(20px);
}