Despite my efforts, I can't seem to get the button border to match the color of the hover state. I've tried using the focus selector and even the active state, but nothing seems to work. Below is the relevant code snippet from the project, and you can view the entire project here.
.btn-primary {
font-weight: 700;
border-radius: 300px;
padding: 1rem 2rem;
background-color: #F05F44;
border-color: #F05F44;
}
.btn-primary:hover {
background-color: #ee4b08;
border-color: #ee4b08;
border-width: 4px;
}
.btn-primary:focus {
background-color: #ee4b08;
border-color: #ee4b08;
border-width: 4px;
box-shadow: 0 0 0 #ee4b08 ;
}
<button class="btn btn-primary">FIND OUT MORE</button>