Html help

i am trying to lengthen a div box when a mouse hovers over it this is my code but it doesn’t work can anyone help me fix it?
    <script>
    function bigbox1(x)
{
   x.style.height="40px";
   x.style.width="300px";
}

function smallbox1(x)
{
   x.style.height="40px";
   x.style.width="200px";
}
    </script>
   
<div onmouseover="bigbox();" onmouseout="smallbox1();" id="box1" style="background-color:#5882FA;height:40px;width:200px">
    <h1 style="color:#A9F5F2">Hello</h1>
</div>

check 'em