Style form submit button

You should be able to make changes at https://www.chrisjauslin.ca/?custom-css as you have started with the following css:

.wpcf7-form input[type="submit"] {
    background-color: #9DA91B;
}

Background colour change is not showing due to following css in https://www.chrisjauslin.ca/wp-content/themes/responsive/style.css

a.button, input[type="reset"], input[type="button"], input[type="submit"] {
    background-color: #F9F9F9;
    background-image: -moz-linear-gradient(center top , #F9F9F9, #F1F1F1);
}

You will need to overwrite this and all other relevant css items in https://www.chrisjauslin.ca/wp-content/themes/responsive/style.css

Use Firebug or Chrome Dev Tools to see what is going on.

Thanks for your reply,

Take a look at this code:

[ Moderator Note: Please post code or markup snippets between backticks or use the code button. ]

<div class="call-to-action"><a href="https://www.chrisjauslin.ca/apply/">START TODAY</a></div>

What this does is that it styles the button on my page: https://www.chrisjauslin.ca/the_easiest_mortgage/ ;to look as the class of my call-to-action button; which class apparently is called:”blue button”

In the CSS editor I have managed to change the colour of the responsive theme “blue button”. The colour is now green actually (this is the way I want it).

So my question is: how do I enter a CSS code to associate the blue button class to the wpcf7 submit button, similar to the way I have done so in the mentioned page.

Thanks a lot in advance,
Chris

On above post the code came short, this is the example:

<div class="call-to-action">
<a class="blue button" href="https://www.chrisjauslin.ca/apply/">START TODAY</a>
</div>

Use Firebug or Chrome Dev Tools to see what is going on.

These tools will allow you to see which class is being used by CF7 in the wpcf7 submit button on any page. Then you can write CSS to target that class.

Alternatively you can give the submit button you want to style the class “blue_button” (not “blue button” with space) in the CF7 Form interface – you can add specific id & class to any CF7 element.

Thanks buzz tone!
Styling the following made the trick!

a.button, input[type="reset"], input[type="button"], input[type="submit"] {
    background-color: #F9F9F9;
    background-image: -moz-linear-gradient(center top , #F9F9F9, #F1F1F1);
}

And that affects all submit buttons residing on my web, which is even better.
I replaced all the #hex codes for my #hex colour codes.