How can I change the hover effect outline color on my homepage button?

Store Design
, ,
1

Hello,

I have a button on my homepage that when I move my cursor over it there is a white outline.

I want the button to be a black outline all the time so I am wondering if there is a way to alter this.

website: tourbrand.us

password: task1data

When cursor is hovered over:

Screen Shot 2023-05-31 at 10.48.02 AM.png
Screen Shot 2023-05-31 at 10.48.02 AM.png430×196 30.7 KB

How it regularly looks:

Screen Shot 2023-05-31 at 10.48.09 AM.png
Screen Shot 2023-05-31 at 10.48.09 AM.png390×250 38.8 KB

2

Sure, you can add this to your CSS file.
I guess it is the index.css file in your case.

a.button.button--primary:hover {
    border: 2.5px solid black !important;
}
3

Thank you for your response.

There is still a white outline between the black and green.

Is that something that cannot be removed?

4

Yup, you will have to unset the button color:

@media screen and (min-width: 750px)
.banner--desktop-transparent .banner__box {
--color-button: none !important;
}
5

Awesome it worked! thank you so much.