Contact Form 7 Styles for basic CSS styling of the form. Form is responsive and has nice rounded corners. For labels and placeholders you need to edit the form in CF7 https://imwz.io/contact-form-7-css-boilerplate/

cf7.css

/*
** Contact Form 7 basics
**
**/

/* Form width  and border */

.wpcf7 {
  text-align: left;
  width: 90%;
  padding: 20px 25px !important;
  background-color: rgba(255, 255, 255, 0.2);
  background-position: center;
  background-size: cover;
}

/* Input Field widths */

.wpcf7-text,
.wpcf7-textarea {
  width: 100%;
  border: 1px solid #e4e4e4;
  border-radius: 4px;
  color: #777;
}

.wpcf7-text {
  height: 50px;
  padding-left: 10px;
}

/* Input Field borders */

/* Input Field Text color */

.wpcf7-text:focus,
.wpcf7-textarea:focus {
  border-color: #8f8f8f;
}

/* Label Font */

.wpcf7-form p {
  font-size: 16px;
  font-family: "Roboto", sans-serif;
  color: #000;
}

/* Submit button Font */

.wpcf7-submit {
  width: 85%;
  font-size: 15px !important;
  background-color: #1d2731 !important;
  border: 2px solid #fff !important;
  color: #fff !important;
  font-weight: bold !important;
  padding: 20px;
}

/* Submit button Hover */

.wpcf7-submit:hover {
  border-color: transparent !important;
  background-color: rgba(0, 0, 0, 0.2) !important;
  color: #000 !important;
}

/* Response messages - Error & Success */

.wpcf7-response-output {
  margin-bottom: 30px !important;
}

Hi @jasperf,

I have added in
.wpcf7-text:focus, .wpcf7-textarea:focus {
border-color: #8F8F8F !important;
}

and the first styling option that is the same but does not include the !important option. Unfortunately my textarea boxes are still showing a blurred blue color when the area is clicked. I have changed the color to be #FF7A33.

Do you know why this may be happenning?

Please add a screenshot.

donde se coloca este css?

hi, may you like to add this kind too
.wpcf7 input[aria-invalid=true] {border: red 1.5px solid;}

Just updated the form to use indention 2 spaces and consolidated duplicate selectors. Also added value sizes or column amount for all fields and the text area

<label> Your Name (required)
    [text* your-name size:100] </label>

<label> Your Email (required)
    [email* your-email size:100] </label>

<label> Subject
    [text your-subject size:100] </label>

<label> Your Message
    [textarea your-message 100x10] </label>

[submit "Send"]