Set hover on the link inside a class - html

Question

I'm trying to set a :hover for a link inside a class. At first I tried
.link{
color: #e62739;
}
I saw past discusssion and try the solution proposed
.opener a.link:hover {
color: #e62739;
}
but it didn't work. Im'not sure to know where is my mistake.
.link{text-decoration:none; color:white;}
.opener a.link:hover {
color: #e62739;
}
.row {
display: flex; /* equal height of the children */
}
.col {
flex: 1; /* additionally, equal width */
padding: 1em;
border: solid;
}
div {font-family:'Varela Round';
}
.opener {
background-color: #07183d;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
border: 1px white solid;
}
.benefits {
background-color: #07183d;
border: none;
color: white;
padding: 15px 32px;
text-decoration: none;
display: inline-block;
font-size: 16px;
width:300px;
}
a {
text-decoration: none;
}
#upbutton {
border: 1px dotted white;
}
<div class="row">
<div class="opener col" style="padding-left: 10px;padding-right: 10px;"><a class="link" href="www.google.com" name="1" onclick=" show('1');" style="color: white;font-size: 14px;">SOCIETES: 400</a>
<div class="benefits" id="b1" style="display: none; color: white; font-size: 14px;">Part SBF 120 : 120<br />
Part Filiales +100M€: 280
<div id="upbutton"><a onclick=" hide('1');">fermer</a></div>
</div>
</div>

Answer 1

The issue is the inline styling you've got on the link: color: white;.
This is taking priority over any styling you're adding in your CSS file. Removing that from the inline styling allows the hover color to work.
If you need the white color by default add it to the stylesheet rather than inline. For example:
.link {
color: white;
}