Blinking Button

Hello,
I have a button defined as follows:

{view: “button”, id:“Reports”, label: “Reports”, type:“icon”, icon:“fa fa-print”, badge:0, width:120}

The user can generate reports using a background process and when done I want the button to flash to indicate the report can be viewed. I have the following code to do that:

webix.html.addCss($$(“Reports”).getNode(),“Blinking_Button”);

The Blinking button css is as follows:

.Blinking_Button{
-webkit-animation: blinking 1s infinite;
}
@-webkit-keyframes blinking {
0% {
background-color: transparent;
box-shadow: 0 0 3px transparent;
}
50% {
background-color: red;
box-shadow: 0 0 10px 3px red;
}
100% {
background-color: transparent;
box-shadow: 0 0 3px transparent;
}
}

This makes the outside and shadow of the button blink. I would really like to have the inside background color blink instead. What do I need to change in the css to make that happen?

Thank you.

@Pieter
check this

Thank you for that.
Is there a way to keep the button border and label visible and just have the ‘internal’ color blink?