changing color of contact form field labels

Shapely
1

hi there
i am having a lot of fun customizing the lovely shapely theme. one little thing i have not been able to figure out is changing the colour of the widget contact form field labels. after inspecting the code i managed to change the headline with the following code in additional CSS, but haven’t been able to change the rest of the field labels:

/* contact form header colour */
#shapely_home_contact-5 .contact-section .text-center h1{
color:#2a3e81;}

can you advise?
thanks

2

Hello there,

I hope you are doing well today.

We can help you with the CSS code but we would need to have the website link to assist with this.
Could you please provide a link to your website so that I can inspect it?

Best Regards,
Support

3

sure - it’s http://7pirouettes.com/

4

hi again
i managed to figure it out by reading matt hodge’s post from May 2017 about modifying forms.
Hope it’s OK to post his code again here. I just took out his modifications for width and display and replaced my color codes:

/contact form/
.messbox label {
width: 95%;
color:#fff;
margin: auto!important;
}
.wpcf7-form p {
display: inline-block;
width: 33%;
margin: auto!important;
}
input.wpcf7-form-control.wpcf7-submit {
width: 120px;
margin: auto!important;
}
div#text-3 {
margin-left:25%;
}
div.wpcf7-validation-errors {
background: #ffe2e2;
border: 1px solid #ff0000;
color: #C10000;
}
span .wpcf7-not-valid {
border: 2px solid #ff0000;
}
span.wpcf7-not-valid-tip {
display: none;
}
.wpcf7-mail-sent-ng {
background: #fff2e2;
border: 1px solid #ffbc8a;
color: #e17731;
}
.wpcf7-mail-sent-ok {
background: #e8ffe2;
border: 1px solid #6fdf51;
color: #1ea524;
}
div.wpcf7-mail-sent-ok:before,div.wpcf7-validation-errors:before {
font: 26px/30px dashicons;
margin-right: 16px;
vertical-align: middle;
}
div.wpcf7-mail-sent-ok:before {
content: “\f147”;
}
div.wpcf7-validation-errors:before {
content: “\f158”;
}

5

Hey there,

Great implementation and your website look good.

Let us know if there’s anything else we can assist you with.

Regards, Sup

6

thank-you - it’s really getting there. :slight_smile:

7

heyt here

Is there anything else? or can we mark this ticket as resolved?

8

i am still having trouble changing the colour of the site identity title on the top left of the home page. any suggestions? thnx

9

hey there

Please add this CSS in appearance - customize - additional CSS


.site-title {
color: #e9b9a5;
}

Thanks!
Colorlib Support Team

10

success! thanks again

11

Hello there,

I am glad the solution worked for you.
Please feel free to contact us again in the future regarding any other issues.

Best Regards,
Support