Removing styling from Contact 7 form button – Themeco Community

Removing styling from Contact 7 form button

Zack G — Thu, 17 Jul 2014 19:25:12 +0000

On the following page – http://vmmed.com/service/en/wellness-5-1-5-4-c-version/- I would like to remove the shadow, on hover and on click styling from the button with the text “I want to request a callback”. How do I do that?

Thanks.

Reply To: Removing styling from Contact 7 form button

Mrinal — Thu, 17 Jul 2014 21:38:56 +0000

Hi Zack,

To do so, add the following CSS codes via Customizer > Custom > CSS:


.wpcf7-form .submit-button input, .wpcf7-form .submit-button input:hover {
    box-shadow: none !important;
}

Hope this helps, Cheers!

Reply To: Removing styling from Contact 7 form button

Zack G — Thu, 17 Jul 2014 21:49:50 +0000

I added the code but the effects remain. Could you take a look at the page to see if I am doing something wrong?

Reply To: Removing styling from Contact 7 form button

Zeshan — Fri, 18 Jul 2014 12:37:23 +0000

Hi Zack,

Upon testing your website, it looks like there is a } bracket is missing from your customizer’s CSS code. That is causing the above provided code not to work. To fix this, simply replace your entire custom CSS code from Customizer > Custom > CSS with following:

.wpcf7-form{
    overflow: hidden;
    margin: 20px;
padding:15px 15px 15px 15px;
    border: 5px solid #f9bbd7;
background-color: #e8e8e8;
}

body h3,
body .h3 {
  font-weight: 300 !important;
}

textarea {
height: 60px;
}

.submit-button input{
background-color: #7DBB50;
color: #fff;
border: 1px solid #fff;
border-radius: 5px;
box-shadow: 10px 10px 5px #888888;}

#x-content-band-8>.x-column:before {
content: "";
display: block;
position: absolute;
top: 0;
left: 50%;
width: 0;
height: 0;
margin-left: -25px;
border-width: 25px;
border-style: solid;
border-color: #dbdbdb transparent transparent;
}
#x-content-band-8>.x-column:after {
content: "";
display: block;
position: absolute;
top: -1px;
left: 50%;
width: 0;
height: 0;
margin-left: -25px;
border-width: 25px;
border-style: solid;
border-color: #fff transparent transparent;
}

.wpcf7-form .submit-button input, .wpcf7-form .submit-button input:hover {
   box-shadow: none !important;
}

It should fix the problem you are facing 🙂

Cheers!