.btn-circle-gradient{position:relative;display:inline-block;color:white;width:100px;height:100px;}
.btn-circle-gradient .card__overlay{position:absolute;border-radius:100%;z-index:2;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-direction:normal;animation-direction:normal;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}
.btn-circle-gradient .card__overlay.card__overlay--1{-webkit-animation-name:stretch-one;animation-name:stretch-one;-webkit-animation-delay:.2s;animation-delay:.2s;top:calc(25%);left:calc(25%);width:50px;height:50px;opacity:.6;-webkit-transform:scale(.8);transform:scale(.8);}
.btn-circle-gradient .card__overlay.card__overlay--2{-webkit-animation-name:stretch-two;animation-name:stretch-two;-webkit-animation-delay:.1s;animation-delay:.1s;top:calc(12.5%);left:calc(12.5%);width:75px;height:75px;opacity:.4;-webkit-transform:scale(.5);transform:scale(.5);}
.btn-circle-gradient .card__overlay.card__overlay--3{-webkit-animation-name:stretch-three;animation-name:stretch-three;top:0;left:0;width:100px;height:100px;opacity:.2;-webkit-transform:scale(.4);transform:scale(.4);}
.btn-circle-gradient i[class^="icon-"].circle{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);z-index:99;font-size:1.3em;}
.btn-circle-gradient:hover .card__overlay{-webkit-animation:0;animation:0;}
.btn-circle-gradient:hover i[class^="icon-"]{color:white;}
.btn-circle-gradient:hover i[class^="icon-"]:before{-webkit-animation-name:move-arrow;animation-name:move-arrow;-webkit-animation-duration:.4s;animation-duration:.4s;-webkit-animation-direction:alternate;animation-direction:alternate;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
.btn-circle-gradient .card__overlay{background-color:#3272a8;}
@-webkit-keyframes move-arrow{0%{margin-top:0;}
100%{margin-top:5px;}
}
@keyframes move-arrow{0%{margin-top:0;}
100%{margin-top:5px;}
}
@-webkit-keyframes stretch-one{0%{opacity:.6;-webkit-transform:scale(.8);transform:scale(.8);}
100%{opacity:0;-webkit-transform:scale(1.4);transform:scale(1.4);}
}
@keyframes stretch-one{0%{opacity:.6;-webkit-transform:scale(.8);transform:scale(.8);}
100%{opacity:0;-webkit-transform:scale(1.4);transform:scale(1.4);}
}
@-webkit-keyframes stretch-two{0%{opacity:.4;-webkit-transform:scale(.5);transform:scale(.5);}
100%{opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
}
@keyframes stretch-two{0%{opacity:.4;-webkit-transform:scale(.5);transform:scale(.5);}
100%{opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
}
@-webkit-keyframes stretch-three{0%{opacity:.2;-webkit-transform:scale(.4);transform:scale(.4);}
100%{opacity:0;-webkit-transform:scale(1.1);transform:scale(1.1);}
}
@keyframes stretch-three{0%{opacity:.2;-webkit-transform:scale(.4);transform:scale(.4);}
100%{opacity:0;-webkit-transform:scale(1.1);transform:scale(1.1);}
}