Message text and icon is white on a white background

I set up a form and for some reason the messages show up with a border but the text and icon is white. I would like to change the text to black and have the icon the same color as the borders.

I’ve added this CSS, which I found on the contact form 7 website, to my site but it works on the borders only.

/Contact Form 7 - Response Messages/
.wpcf7 form .wpcf7-response-output {
margin: 2em 0.5em 1em;
padding: 0.2em 1em;
border: 2px solid #00a0d2 !important; /* Blue */
color: #000000 !important;
}

.wpcf7 form.init .wpcf7-response-output {
display: none;
color: #000000 !important;
}

.wpcf7 form.sent .wpcf7-response-output {
border-color: #46b450 !important!; /* Green */
color: #000000 !important;
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
border-color: #dc3232 !important; /* Red */
color: #000000 !important;
}

.wpcf7 form.spam .wpcf7-response-output {
border-color: #f56e28; /* Orange */
color: #000000 !important;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
border-color: #ffb900; /* Yellow */
color: #000000 !important;
}

The page I need help with: [log in to see the link]