How to remove red background color on submit button Contact 7 Form

2020-09-03 10-59-10.801

This is CSS I am using

div.wpcf7 {
background-color: #42486b ;
padding:20px;
}
.wpcf7 input[type=“text”],
.wpcf7 input[type=“email”],
.wpcf7 textarea {
background:#14B7C0
color:#14B7C0;
font-family:lora, sans-serif;
font-style:italic;
}
.wpcf7 input[type=“submit”],
.wpcf7 input[type=“button”] {
background-color:#92cbdf;
width:100%;
text-align:center;
text-transform:uppercase;
}

/* Submit Button CF7 CSS Styles */

.wpcf7 input[type=submit] {
padding:15px 45px;
background:#14B7C0;
color:#FFFFFF;
font-size:24px;
font-weight:bold;
border:0 none;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}
/* Label Text Contact Form 7 CSS Styles */

.wpcf7 label {
padding: 0 0 10px 0;
font-size: 20px;
color:white;
}
.x-text {
color: black;
}

I also want to change the background on box under the submit which shows errors for example One or more fields have an error. Please check and try again.

Hello George,

Thanks for writing to us

To remove red Background-color of the contact form 7 submit button and to change the background colour of an error response you can add these custom CSS code under X/Pro--->Theme option --->CSS

.wpcf7 input[type=submit] {
box-shadow:none;
}
.wpcf7-response-output{
background-color:#000;}

You can change background-color:#000; value as per your design.

The purpose of providing the custom CSS to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.

Hope it helps you.
Thanks

Thanks Again For your help and this worked

Hello George,

Glad to know that you are able to help you.

Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.