button{
    outline: none;
    cursor: pointer;
    display: block;
    text-align: center;
    border: none;
    background: linear-gradient(-45deg, #EE7752, #E73C7E, #23A6D5, #23D5AB);
    background-size: 400% 400%;
    color: #FFF;
    padding: 1em 2.5em;
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: .3em;
}

button:focus,
button:hover{
    -webkit-animation: Gradient .7s ease 1;
    -moz-animation: Gradient .7s ease 1;
    animation: Gradient .7s ease 1;
    background-position: 100% 50%;
}

@-webkit-keyframes Gradient {
    0% {background-position: 0% 50%}
    100% {background-position: 100% 50%}
}

@-moz-keyframes Gradient {
    0% {background-position: 0% 50%}
    100% {background-position: 100% 50%}
}

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