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

[tourbrandus]

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:

How it regularly looks: 

[stearis · Accepted solution]

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;
}

[stearis · Accepted solution]

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;
}

[tourbrandus]

Thank you for your response. 

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

Is that something that cannot be removed?

[stearis · Accepted solution]

Yup, you will have to unset the button color:

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

[tourbrandus]

Awesome it worked! thank you so much.