change behavior of mouse hover

I'm using iq-button-toggle and I would like to switch off the mouse hover function. The appearance of the button should not change. No matter if the status of the button is ON or OFF. I use this lines in a custom css file:

.iq-button-toggle.inverted:not(.locked)
.iq-button:focus,
.iq-button-toggle.inverted:not(.locked)
.iq-button:hover,
.iq-button-toggle:not(.locked)
.iq-button:focus,
.iq-button-toggle:not(.locked)
.iq-button:hover{border-color:rgba(60,60,60,.7);background-color:inherit;color:inherit}

This works when the button is OFF. But when the button is ON and the mouse is over it, the color changes. How can I modify the css file to get the correct behavior even when the state is ON?

.iq-button-toggle.TogBut_Off.iq-variant-01 .iq-button {
background-color: gray;
}
/* [Variant 01] - Toggle Button Label */
.iq-button-toggle.TogBut_Off.iq-variant-01 .iq-toggle-label {
color: blue;
}