[CSS] Blinking corners

index.html

<a href="#">buy now</a>

style.css

/**
 * Title: Blinking corners
 * Author: Mattias Ghodsian
 * Donate a cup of coffee: https://www.paypal.me/MattiasG
 * Donate Eth:   0xBBB96204E45D11C9799c6B12E6eE6F0d4A071Ef5
 */
a{
    background:
    linear-gradient(to right, rgba(255, 255, 255, 0.0) 1px, transparent 1px) 0 0,
    linear-gradient(to right, rgba(255, 255, 255, 0.0) 1px, transparent 1px) 0 100%,
    linear-gradient(to left, rgba(255, 255, 255, 0.0) 1px, transparent 1px) 100% 0,
    linear-gradient(to left, rgba(255, 255, 255, 0.0) 1px, transparent 1px) 100% 100%,
    linear-gradient(to bottom, rgba(255, 255, 255, 0.0) 1px, transparent 1px) 0 0,
    linear-gradient(to bottom, rgba(255, 255, 255, 0.0) 1px, transparent 1px) 100% 0,
    linear-gradient(to top, rgba(255, 255, 255, 0.0) 1px, transparent 1px) 0 100%,
    linear-gradient(to top, rgba(255, 255, 255, 0.0) 1px, transparent 1px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 5px 5px;
    padding: 6px 10px;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    -moz-animation: drePulse 3s infinite; 
    -webkit-animation: drePulse 3s infinite; 
    animation: drePulse 3s infinite; 
    transition: all 0.45s;
}

a:hover{
   background: none!important;
    -webkit-animation-play-state: paused!important;
    -moz-animation-play-state: paused!important;
    -o-animation-play-state: paused!important;
    animation-play-state: paused!important;
}

@keyframes drePulse {
    50%, 100% { 
        background:
        linear-gradient(to right, rgba(255, 255, 255, 0) 1px, transparent 1px) 0 0,
        linear-gradient(to right, rgba(255, 255, 255, 0) 1px, transparent 1px) 0 100%,
        linear-gradient(to left, rgba(255, 255, 255, 0) 1px, transparent 1px) 100% 0,
        linear-gradient(to left, rgba(255, 255, 255, 0) 1px, transparent 1px) 100% 100%,
        linear-gradient(to bottom, rgba(255, 255, 255, 0) 1px, transparent 1px) 0 0,
        linear-gradient(to bottom, rgba(255, 255, 255, 0) 1px, transparent 1px) 100% 0,
        linear-gradient(to top, rgba(255, 255, 255, 0) 1px, transparent 1px) 0 100%,
        linear-gradient(to top, rgba(255, 255, 255, 0) 1px, transparent 1px) 100% 100%;
        background-repeat: no-repeat;
        background-size: 5px 5px;
    }
    33%, 75% { 
        background:
        linear-gradient(to right, rgba(255, 255, 255, 1) 1px, transparent 1px) 0 0,
        linear-gradient(to right, rgba(255, 255, 255, 1) 1px, transparent 1px) 0 100%,
        linear-gradient(to left, rgba(255, 255, 255, 1) 1px, transparent 1px) 100% 0,
        linear-gradient(to left, rgba(255, 255, 255, 1) 1px, transparent 1px) 100% 100%,
        linear-gradient(to bottom, rgba(255, 255, 255, 1) 1px, transparent 1px) 0 0,
        linear-gradient(to bottom, rgba(255, 255, 255, 1) 1px, transparent 1px) 100% 0,
        linear-gradient(to top, rgba(255, 255, 255, 1) 1px, transparent 1px) 0 100%,
        linear-gradient(to top, rgba(255, 255, 255, 1) 1px, transparent 1px) 100% 100%;
        background-repeat: no-repeat;
        background-size: 5px 5px;
    }
}

@-webkit-keyframes drePulse {
    50%, 100% { 
        background:
        linear-gradient(to right, rgba(255, 255, 255, 0) 1px, transparent 1px) 0 0,
        linear-gradient(to right, rgba(255, 255, 255, 0) 1px, transparent 1px) 0 100%,
        linear-gradient(to left, rgba(255, 255, 255, 0) 1px, transparent 1px) 100% 0,
        linear-gradient(to left, rgba(255, 255, 255, 0) 1px, transparent 1px) 100% 100%,
        linear-gradient(to bottom, rgba(255, 255, 255, 0) 1px, transparent 1px) 0 0,
        linear-gradient(to bottom, rgba(255, 255, 255, 0) 1px, transparent 1px) 100% 0,
        linear-gradient(to top, rgba(255, 255, 255, 0) 1px, transparent 1px) 0 100%,
        linear-gradient(to top, rgba(255, 255, 255, 0) 1px, transparent 1px) 100% 100%;
        background-repeat: no-repeat;
        background-size: 5px 5px;
    }
    33%, 75% { 
        background:
        linear-gradient(to right, rgba(255, 255, 255, 1) 1px, transparent 1px) 0 0,
        linear-gradient(to right, rgba(255, 255, 255, 1) 1px, transparent 1px) 0 100%,
        linear-gradient(to left, rgba(255, 255, 255, 1) 1px, transparent 1px) 100% 0,
        linear-gradient(to left, rgba(255, 255, 255, 1) 1px, transparent 1px) 100% 100%,
        linear-gradient(to bottom, rgba(255, 255, 255, 1) 1px, transparent 1px) 0 0,
        linear-gradient(to bottom, rgba(255, 255, 255, 1) 1px, transparent 1px) 100% 0,
        linear-gradient(to top, rgba(255, 255, 255, 1) 1px, transparent 1px) 0 100%,
        linear-gradient(to top, rgba(255, 255, 255, 1) 1px, transparent 1px) 100% 100%;
        background-repeat: no-repeat;
        background-size: 5px 5px;
    }
}

Demo: https://jsfiddle.net/nexxoz/snLgvk06/