Change Password Protected page button colours


I’d like to change the Change Password Protected page button colours. I would like to change it from the original yellow to #ee7825 and the hover to #86afb1.

Is there some additional CSS I can add to do this quickly and easily?


Hi there,
Thanks for writing in.
Relating to your query here, could you kindly provide us with a direct link to the page so that we can have a look into this.
I look forward to your reply.
Best Regards.

Here it is

Do you see it?

Thank you for getting back to me :wink:

Hey there

Here is the both codes, for hover and for normall:

.markup-format .post-password-form input[type=“submit”]:hover {
color: #86afb1;

.markup-format .post-password-form input[type=“submit”] {
background: #ee7825;

Good morning,

I added the CSS but it’s still the same…yellow with orange lettering and orange hover…

Any ideas?


I just noticed that the code didn’t change the button colour but the password box border colours…

Hello there,

I hope you are doing well today.

Please try using this CSS code:

.markup-format .post-password-form input[type="submit"] {
    background-color: #ee7825 !important;
    color: white !important;

.markup-format .post-password-form input[type=”submit”]:hover {
color: #86afb1 !important;

Best Regards,