How to change hover effect for the KB Categories widget in Service Portal

[Ankit44]

I want to change the hover effect for the Category widget in the KB View page of the service portal. 

When I try to change the background color for the class ".group-item-default", it changes the whole background. But when I change the hover effect for the same class, it only changes a portion of the entire tab (As shown in image below).

I am adding the following CSS code in the widget instance CSS field:

.group-item-default :hover {
    background-color: #ff0000;
}

Please advise on how to change the color for the entire tab.

Thanks.

[Shruti · Accepted solution]

Hey,

Try this

.group-item-default {
&:hover, &:focus {
background-color: red !important;
}
}

[Ankit44]

That worked, thanks a lot.