@-webkit-keyframes neave-anim {
to {
background-position:0 400%;
}
}
@-moz-keyframes neave-anim {
to {
background-position:0 400%;
}
}
@keyframes neave-anim {
to {
background-position:0 400%;
}
}
.neave { position: absolute; left: 15px; top: 15px; width: 40px; height: 40px; margin: 0; padding: 0; border-radius: 50%; border: 2px solid #fff; will-change: opacity; opacity: 0.3; -webkit-transition: opacity 0.3s ease-out; -moz-transition: opacity 0.3s ease-out; transition: opacity 0.3s ease-out; z-index: 100; }
.neave a { display: block; width: 100%; height: 100%; color: #fff; outline: none; background-image: url(../images/neave-icon.svg); background-size: 100% 100%; border-radius: 50%; }
.neave a span { display: none; }
.neave:hover { opacity: 1; background-color: #9fc; background-image: -webkit-linear-gradient(top, #9fc 0%, #9cf 25%, #f9c 50%, #fc9 75%, #9fc 100%); background-image: -moz-linear-gradient(top, #9fc 0%, #9cf 25%, #f9c 50%, #fc9 75%, #9fc 100%); background-image: linear-gradient(to bottom, #9fc 0%, #9cf 25%, #f9c 50%, #fc9 75%, #9fc 100%); background-size: 100% 400%; -webkit-animation: neave-anim 8s infinite linear; -moz-animation: neave-anim 8s infinite linear; animation: neave-anim 8s infinite linear; }
.neave:active { margin-top: 1px; }
.neave:active a { box-shadow: inset 0 2px 16px rgba(0,0,0,0.3); }

@media (-webkit-min-device-pixel-ratio: 1.3), (min-resolution: 1.3dppx) {
.neave { border-width: 1px; }
}