Changing icon feature hover color

How can the the hover color of the Icon Feature element be changed?

Instead of showing the inverse of the icon on hover, I would simply like to change the color of the icon, the circular border, and short line underneath to another color.

This CSS seems to control the Icon Feature color:

.feature-box i.ic-holder-1 {
    color: #00467e !important;
}
.hb-icon-container, .feature-box i.ic-holder-1 {
    border-color: #00467e;
}

But this CSS alone doesn’t seem to do the trick:

.feature-box:hover i.ic-holder-1 {
    background-color: transparent !important;
    color: #826ea0 !important;
    border-color: #826ea0 !important;
}

Also, how can the Icon Feature be changed so the color changes only when hovering over the icon, not the entire element?

Thanks!