JSFiddle - React, Tailwind, and code Playground

HTML

<div class="myDiv">
    <div class="subDiv">hover me</div>
</div>

CSS

.myDiv{
    width: 200px;
    height: 20px;
    border: 5px solid rgba(255,166,9,0.1);
}

.subDiv{
    text-decoration: underline;
    text-align: center;
    cursor: pointer;
}

.subDiv:hover{
    color: #ffa609;
    transition: all 1s;
}

.subDiv:hover.myDiv{
    border: 5px solid rgba(255,166,9,1);    
}