Styling sign-up form from Mailchimp -> some things don't work

Question

Website: https://bucksfoodpartnership.org/newsletter-sign-up/

At the moment, by Mailchimp's default, the form has this padding: 10px 0 10px 3%

Code for this is

#mc_embed_signup form {display:block; position:relative; text-align:left; padding:10px 0 10px 3%}

But when I add this whole string to my Custom Css, and change 3% to i.e. 0 - nothing happens.

I did manage to overwrite other elements from that form, for example to style the Subscribe button I've added:

#mc_embed_signup input.button {
    font-size: 1.125rem;
    background: #FD9915;
    padding: 10px 15px;
    width: auto;
    text-transform: uppercase;
    transition: 0.2s;
    height: 51px;
    border-radius: 0;
}

And it works. But then trying to center the button doesn't work anymore.

I also want to center the email input form, but neither #mc_embed_signup input nor #mc_embed_signup input.email work... What am I missing there?

Answer 1

You could use the !important property to override the default css