body {
  margin:0;
  padding:0;
  background:#FFF;
}

.btn {
 border-radius: 3px;
 letter-spacing: 1px;
 outline: none;
 padding: 12px 20px;
 margin-bottom: 6px;
 overflow: hidden;
 position: relative;
 text-transform: uppercase;
 width:150px;
 height:40px;
 text-align:center;
 line-height:15px;
 color:#FFF;
 font-size:12px;
 font-weight: 700;
 font-family:sans-serif;
 text-transform:uppercase;
 text-decoration:none;
 box-sizing:border-box;
 background: linear-gradient(90deg, #03a9f4, #f441a5, #ffeb3b, #03a9f4);
 background-size:400%;

}

.btn:before {
  content:'';
  position:absolute;
  top:-5px;
  bottom:-5px;
  left:-5px;
  right:-5px;
  z-index:-100;
  background: linear-gradient(90deg, #03a9f4, #f441a5, #ffeb3b, #03a9f4);
  background-size:400%;
  border-radius:40px;
  opacity:0;
  transition:0.5s; 
}

.btn:hover:before {
  opacity:1;
  filter:blur(20px);
  animation: animate 8s linear infinite;
}

.btn:hover {
  animation: animate 8s linear infinite;
}

.tp-caption:before {
  content:'';
  position:absolute;
  top:-5px;
  bottom:-5px;
  left:-5px;
  right:-5px;
  z-index:-100;
  background: linear-gradient(90deg, #03a9f4, #f441a5, #ffeb3b, #03a9f4);
  background-size:400%;
  border-radius:40px;
  opacity:0;
  transition:0.5s; 
}

.tp-caption:hover:before {
  opacity:1;
  filter:blur(20px);
  animation: animate 8s linear infinite;
}

.tp-caption:hover {
  animation: animate 8s linear infinite;
}

@keyframes animate
{
  0% {
    background-position: 0%;
  }
  100% {
    background-position: 400%;
  }
}