i try many route for change this color but doesnt work enter image description here i just want to change color of this two field from gray to white.
.cf7b-section{
}
.cf7b-group-text-709{
border:1px solid blue;
}
.cf7b-group-text-709:hover{
background-color:blue;
}
.cf7b-group-text-887{
border:1px solid blue;
}
.cf7b-group-text-887:hover{
background-color:blue;
}
.cf7b-group-text-682{
border:1px solid blue;
}
.cf7b-group-text-682:hover{
background-color:blue;
}
.cf7b-group-text-535{
border:1px solid blue;
}
.cf7b-group-text-535:hover{
background-color:blue;
}
.cf7b-group-text-962{
border:1px solid blue;
}
.cf7b-group-text-962:hover{
background-color:blue;
}
.cf7b-group-text-437{
border:1px solid blue;
}
.cf7b-group-text-437:hover{
background-color:blue;
}
.cf7b-group-text-943{
border:1px solid blue;
}
.cf7b-group-text-943:hover{
background-color:blue;
}
.cf7b-group-text-588{
border:1px solid blue;
}
.cf7b-group-text-588:hover{
background-color:blue;
}
.cf7b-group-tel-421{
border:1px solid blue;
}
.cf7b-group-tel-421:hover{
background-color:blue;
}
.cf7b-group-email-608{
border:1px solid blue;
}
.cf7b-group-email-608:hover{
background-color:blue;
}
.cf7b-group-text-574{
border:1px solid blue;
}
.cf7b-group-text-574:hover{
background-color:blue;
}
.cf7b-group-text-582{
border:1px solid blue;
}
.cf7b-group-text-582:hover{
background-color:blue;
}
.cf7b-group-textarea-299{
border:1px solid blue;
}
.cf7b-group-textarea-299:hover{
background-color:blue;
}
.wpcf7-form-control{
background-color: transparent;
font-weight: bold;
color:white;
border:1px solid transparent;
}
.wpcf7-form-control:hover{
background-color:transparent;
}
and thats my html enter image description here
i know the code it doesnt so look good but i need a transitory solution thx for your precious help
That's the html code
<div class="cf7b-content">
<div class="cf7b-page cf7b-active" data-page="1">
<div class="cf7b-section">
<div class="cf7b-col">
<div class="cf7b-row">
<p><span class="cf7b-label-checkbox-140"></span>
</p>
<div class="cf7b-group-checkbox-140">
<p><span class="wpcf7-form-control-wrap" data-name="checkbox-140"><span class="wpcf7-form-control wpcf7-checkbox wpcf7-exclusive-checkbox"><span class="wpcf7-list-item first"><label><input type="checkbox" name="checkbox-140" value="Herr"><span class="wpcf7-list-item-label">Herr</span></label></span><span class="wpcf7-list-item last"><label><input type="checkbox" name="checkbox-140" value="Frau"><span class="wpcf7-list-item-label">Frau</span></label></span></span></span>
</p>
</div>
</div>
</div>
<div class="cf7b-col">
<div class="cf7b-row">
<p><span class="cf7b-label-text-709"></span>
</p>
<div class="cf7b-group-text-709">
<p><span class="wpcf7-form-control-wrap" data-name="text-709"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" placeholder="Name" value="" type="text" name="text-709"></span>
</p>
</div>
</div>
<div class="cf7b-row">
<p><span class="cf7b-label-text-887"></span>
</p>
<div class="cf7b-group-text-887">
<p><span class="wpcf7-form-control-wrap" data-name="text-887"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" placeholder="Vorname" value="" type="text" name="text-887"></span>
</p>
</div>
</div>
</div>
<div class="cf7b-col">
<div class="cf7b-row">
<p><span class="cf7b-label-text-682"></span>
</p>
<div class="cf7b-group-text-682">
<p><span class="wpcf7-form-control-wrap" data-name="text-682"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" placeholder="Name natürlicher / juristischer Person" value="" type="text" name="text-682"></span>
</p>
</div>
</div>
</div>
<div class="cf7b-col">
<div class="cf7b-row">
<p><span class="cf7b-label-text-535"></span>
</p>
<div class="cf7b-group-text-535">
<p><span class="wpcf7-form-control-wrap" data-name="text-535"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" placeholder="Strasse" value="" type="text" name="text-535"></span>
</p>
</div>
</div>
<div class="cf7b-row">
<p><span class="cf7b-label-text-962"></span>
</p>
<div class="cf7b-group-text-962">
<p><span class="wpcf7-form-control-wrap" data-name="text-962"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" placeholder="Nummer" value="" type="text" name="text-962"></span>
</p>
</div>
</div>
</div>
<div class="cf7b-col">
<div class="cf7b-row">
<p><span class="cf7b-label-text-437"></span>
</p>
<div class="cf7b-group-text-437">
<p><span class="wpcf7-form-control-wrap" data-name="text-437"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" placeholder="Postleitzahl" value="" type="text" name="text-437"></span>
</p>
</div>
</div>
<div class="cf7b-row">
<p><span class="cf7b-label-text-943"></span>
</p>
<div class="cf7b-group-text-943">
<p><span class="wpcf7-form-control-wrap" data-name="text-943"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" placeholder="Stadt" value="" type="text" name="text-943"></span>
</p>
</div>
</div>
</div>
<div class="cf7b-col">
<div class="cf7b-row">
<p><span class="cf7b-label-text-588"></span>
</p>
<div class="cf7b-group-text-588">
<p><span class="wpcf7-form-control-wrap" data-name="text-588"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" placeholder="Land" value="" type="text" name="text-588"></span>
</p>
</div>
</div>
</div>
<div class="cf7b-col">
<div class="cf7b-row">
<p><span class="cf7b-label-tel-421"></span>
</p>
<div class="cf7b-group-tel-421">
<p><span class="wpcf7-form-control-wrap" data-name="tel-421"><input size="40" class="wpcf7-form-control wpcf7-text wpcf7-tel wpcf7-validates-as-tel" aria-invalid="false" placeholder="Telefonnummer" value="" type="tel" name="tel-421"></span>
</p>
</div>
</div>
<div class="cf7b-row">
<p><span class="cf7b-label-email-608"></span>
</p>
<div class="cf7b-group-email-608">
<p><span class="wpcf7-form-control-wrap" data-name="email-608"><input size="40" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-email" aria-invalid="false" placeholder="E-Mail Adresse" value="" type="email" name="email-608"></span>
</p>
</div>
</div>
</div>
<div class="cf7b-col">
<div class="cf7b-row">
<p><span class="cf7b-label-text-574"></span>
</p>
<div class="cf7b-group-text-574">
<p><span class="wpcf7-form-control-wrap" data-name="text-574"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" placeholder="Themen / Fachgebiet" value="" type="text" name="text-574"></span>
</p>
</div>
</div>
</div>
<div class="cf7b-col">
<div class="cf7b-row">
<p><span class="cf7b-label-text-582"></span>
</p>
<div class="cf7b-group-text-582">
<p><span class="wpcf7-form-control-wrap" data-name="text-582"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" placeholder="Betreff" value="" type="text" name="text-582"></span>
</p>
</div>
</div>
</div>
<div class="cf7b-col">
<div class="cf7b-row">
<p><span class="cf7b-label-textarea-299"></span>
</p>
<div class="cf7b-group-textarea-299">
<p><span class="wpcf7-form-control-wrap" data-name="textarea-299"><textarea cols="40" rows="10" class="wpcf7-form-control wpcf7-textarea" aria-invalid="false" placeholder="Nachricht" name="textarea-299"></textarea></span>
</p>
</div>
</div>
</div>
<div class="cf7b-col">
<div class="cf7b-row">
<p><span class="cf7b-label-cf7b-random-name-1"></span>
</p>
<div class="cf7b-group-cf7b-random-name-1">
<p><input class="wpcf7-form-control has-spinner wpcf7-submit" type="submit" value="Senden"><span class="wpcf7-spinner"></span>
</p>
</div>
</div>
</div>
</div>
</div>
`
i just try a lot of different solution i think i overwrite some rules or something with an other div class
