Corregir bug en una div

[patilanz]

Hola he creado dos funciones para cambiar 2 estilos en una div que contiene algunos campos de texto.Las funciones se disparan al onmouseover y onmouseout pero el problema esta que cuando se va a los campos tambien se disparan o por lo menos se produce cambio...
El codigo javascript es este:

Código Javascript:

function m_infor(){
    var b=20;
    clearInterval(window.a);
    window.r=setInterval(function(){
        
        if(b!=10){
            document.getElementById('infor').style.borderRadius=b+'px';
            b--;
            
            
        }else{
            clearInterval(r);
        }
    },20);}
function mo_infor(){
    clearInterval(window.r);
    var b=10;
        window.a=setInterval(function(){
        if(b!=20){
            document.getElementById('infor').style.borderRadius=b+'px';
            b++;
            
        }else{
            clearInterval(window.a);
        }
    },20);  
    
}
 

La div:

Código HTML:

<div id="infor" align="center" onmouseover="m_infor();" onmouseout="mo_infor();">
  <p style="font-size:20px; font-weight:bold; text-decoration:underline; color:#F00;">Introdusca sus datos</p>
  <p align="left">Titulo:
    <label for="title"></label>
    <input type="text" name="title" id="title" />
</p>
  <p align="left">Texto pequeno:
    <label for="t_p"></label>
  <textarea name="t_p" rows="4" id="t_p"></textarea>
  </p>
  <p align="left">Texto con imagen:
    <textarea name="t_g" rows="4" id="t_g"></textarea>
  </p>
</div>
 

Tambien me pasa con opacity y otros

Como se soluciona gracias :)