Change button hover colours and delete border

[sirensiren]

Hi! I am having trouble with the button design:

I want all my buttons to be this colour: #BB7C49, and the text to be this: #FFFCF3

and on hover I want the opposite, thus, the buttons to be this colour: #FFFCF3 and the text to be this: #BB7C49

What do I need to add to the code to resolve this? I am using the Dawn theme. Thanks for any help!

[KetanKumar]

@sirensiren 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

[PageFly-Victor]

Hi @Sirensiren

This is PageFly - Advanced Page Builder. I would love to give you some recommendations

-Go to Online Store->Theme->Edit code

-Asset-> base.css  paste the below code at the bottom of the file.

.button{

background:#BB7C49 !important;

    color:#FFFCF3 !important

    }

.button:hover{

background:#FFFCF3 !important;

    color: #BB7C49 !important

}

Best Regards;

PageFly

[sirensiren]

Hi! Thank you so much for your help! It kinda solved the problem, but a weird border appeared on both buttons of my homepage, the one on hover and the other not. I am attaching a video. Any idea why this is happening?

[PageFly-Victor]

you can add more

.button:before,.button:after{display:none !important}

[frey2]

Hello! Is there a way to keep the border but set to a custom colour?