Q:

Is there a way to change the text colour (but only whilst editing) of a textbox using CSS?

When not editing, my text box is dark brown and text colour is white. When editing, the text box has a white background. Trouble is, the text colour stays white,and I need it to change to black, but only whilst editing.
(When the focus leaves the text box, I want the text colour to return to white because the text box's background will return to dark brown)
.wpcf7-form textarea {
    height: 130px;
    min-height: 68px;
    color: black;  /* this doesn't work; color remains black after editing is complete */   
}

A:

You need to use the CSS Pseudo-class :focus

.wpcf7-form textarea {
  /** Default Styling **/
  width: 80%;
  height: 100px;
  color: gray;
  overflow: hidden;
  border: 1px solid lightgray;
  outline: none;
  opacity: .2;
}

.wpcf7-form textarea:focus {
  /** Styling you want while focusing the textarea **/
  color: black;
  opacity: 1;
}
<div class="wpcf7-form">
  <textarea />
</div>

