Need help, please!

Tell us what’s happening:
Instructions:
“It looks like a variable is being used to set the background color of the .red-box class. Let’s improve our browser compatibility by adding another background declaration right before the existing declaration and set its value to red.”

All the hints tell me that what is already done and I can’t get this one passed! I don’t understand what is wrong.

Your code so far


<style>

.header{
background color: red;
color:red;
}
:root {
  --red-color: red;

}
.red-box {
  background:red;
  background: var(--red-color, red);
  height: 200px;
  width:200px;
}
</style>
<div class="red-box"></div>


Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36.

Challenge: Improve Compatibility with Browser Fallbacks

Link to the challenge:

Hi there !

You should remove red from your second declaration of background. Just keep it simple, as it’s given by the challenge :

background: var(--red-color);

Thank you so much for your help!!