What my client wants is when you hover over the light orange it changes to the dark orange, which is easy, but when you get to the center of the button and hover over the dark orange it turns to the light orange (this is what I am having a hard time with.. Please advise

![enter image description here](https://i.stack.imgur.com/7U9pd.jpg)

```
<a href="#"><div class="buttonblue">
<div class="buttontitle">local businesses</div>
<div class="buttonaction_blue">NEXT</div>
<div class="buttonsmallprint">Leverage online</div>
</div></a>

```

css

```
.buttontitle { 
 font-family: 'BebasNeueRegular', Arial, sans-serif;
 letter-spacing: 0;
 padding:4px 0px 4px 0px;
 font-size:36px; 
 color:#fff;
 text-align:center;
 } 
 .buttonaction_blue:hover
  {
    background-color:#418dc7
  }  
  .buttonaction_blue 
 {
  width:355px; 
  margin:0 auto;
  background-color:#4795d1;
  -webkit-border-radius: 2px; 
  -moz-border-radius: 2px;
  border-radius: 2px;
  font-family: 'Oxygen', sans-serif; 
  font-size:32px; 
  text-align:center;  
  color:#fff;
  padding:10px 0px 10px 0px; 
  }  

```