How do I make an specific div for the "a" tag?

How do I make separate div's for the a tag:

a:link,a:visited {  
     float:left;
     font-weight: bold; 
     color: #db233d; 
     background-color: white; 
     border: 2px #db233d solid; 
     border-radius: 10px;  
     width: 140px; 
     text-align: center; 
     padding: 4px; 
     margin-bottom: 0px; 
     text-decoration: none; 
} 

a:hover,a:active {  
     background-color:#db233d;  
     color: white; 
     border: #db233d solid;  
} 

I don't want the hover effect over the logo part. How do I change that so I only see that over the Buy, Eat and Play part

<div class="logo"> 
   <a href="index.html"><img src="media/logo.gif" alt="logo THE WALL" style="width:225px; height=52px;"></a>
 </div> 
 <div class="koptekst">
    <h1> UTRECHT THEWALL </h1> 
 </div> 
 <div class="menu"> 
   <nav> 

   <ul> 
    <li><a href="BUY.html">BUY</a></li> 
    <li><a href="EAT.html">EAT</a></li> 
    <li><a href="PLAY.html">PLAY</a></li> 
   </ul> 
  </nav>    
 </div>