text colour

use a custom css file as described in faq #8, and ensure you css rule have a higher specificity than the default ones loaded by the plugin.

Note: the plugin automatically wraps your cf7 form in a div element with unique id cf7sg-form-<cf7 unique key>. You can can get your unique key from your cf7 table page. So if your form’s unique key is contact-us, then you can use the id to increase the specificity of your rule with,

 div#cf7sg-form-contct-us .cf7-smart-grid.has-grid .field > label em {
color: white;
}

hi,
my theme has an area to add custom CSS, will it not work in there?

sure, if your specificity is high enough… but keep in mind that your theme loads this on every pages, including those which do not have your form.

or i created a css folder in my theme folder or child theme folder.
Then upload a css file with this amended css?

.cf7-smart-grid.has-grid .field > label em {
color: white;
}
.cf7-smart-grid.has-grid .info-tip {
margin-bottom: 5px;
font-size: 100%;
font-style: italic;
color: white !important;

follow my instructions.

i tried that, but still doesn’t seem to work in either a custom css folder or in the theme’s css area…
here is the page

your form’s unique key is ‘untitled-2’.

Create a css sub-folder in your child-theme root folder, and create a file called untitled-2.css within it. Add the following rule in this file,

#cf7sg-form-untitled-2 .field > label em {
    color: white;
}

yessss, thank you. I think i understand it now.

With regards to the GDPR check box (or acceptance), is there a way to move the tick box before the text?

yessss, thank you. I think i understand it now.

great, so leave a review of the plugin.

With regards to the GDPR check box (or acceptance), is there a way to move the tick box before the text?

I think so, but this is a Contact Form 7 issue that you should post on the CF7 support forum.