Problema na borda do Contact Form 7 do Wordpress

Esse assunto é mais técnico, direcionado aos usuários da ferramenta Wordpress.

Quando preciso instalar um formulário de contato em um site ou blog, de imediato já me vem à cabeça o Contact Form 7. Simples, rápido… uma moleza. Mas dependendo do tema que está usando em seu Wordpress, o formulário fica todo branco, sem borda e ninguém enxerga o tal formulário:

e agora depois de alterado:

Então como sempre perco um tempão para resolver este problema e vi que é uma dificuldade de muitas pessoas, resolvi postar aqui, para já ficar registrada a resolução.

1 – Instale e ative o Contact Form normalmente.
2 – Acesse a página de configuração ( wp-admin/admin.php?page=wpcf7 ) e onde estão os campos do formulário (nome, email, etc), na última linha onde tem
<p>[submit "Enviar"]</p>
altere para
<p>[submit class:form7submit "Enviar"]</p>
e clique em Salvar no final da página.
3 – Acesse o editor de plugins, selecione o plugin Contact Form 7 e procure o arquivo styles.css ( wp-admin/plugin-editor.php?file=contact-form-7/styles.css&plugin=contact-form-7/wp-contact-form-7.php ) e insira o código abaixo no início de tudo

.wpcf7-form p{
font-family:Verdana;
font-size:small;
text-align:left;

}
.wpcf7-form p input, .wpcf7-form p textarea{

font-size:larger;
background-color:#FFF8DC;
color:#000055;
border-left-color:#4283B9;
border-top-color :#4283B9;
border-bottom-color:#bbbbff;
border-right-color:#bbbbff;
padding:2px;
}

.form7submit {
display: block;
width: 307px;
}