Menu Control appears underneath containing DIV

<div class="box">
                    <div class="box_header">
                        <h2>Training Menu</h2>
                        <img class="box_icon" src="images/edutainment.png" />
                    </div><!--end box_header -->
                    <div class="box_body">

                        <asp:Menu ID="mnuTraining" runat="server">

                        </asp:Menu>

                    </div><!--end box_body -->
                    <div class="box_footer"></div><!--end box_body -->
                </div><!--end box -->

#left{
    overflow:visible;
    width:200px;
    float:left;
    min-height:200px;
    margin-right:20px;
}

.box{
    overflow:visible;
    margin-bottom:20px;
}

.box_header{
    position:relative;
    overflow:visible;
    background:url(images/box_header.png) no-repeat;
    height:30px;
    line-height:30px;
}

.box_header h2{
    color:#FFF;
    font-size:14px;
    margin-left:10px;
}

.box_header img.box_icon{
    position:absolute;
    right:5px;
    top:-10px;
}

.box_body{
    min-height:100px;
    background:#f0f0f0;
    padding:5px;
    border-left:1px solid #bfbfbf;
    border-right:1px solid #bfbfbf;
}

.box_body ul{

}

.box_body li{
    display:block;
    border-bottom:1px solid #bfbfbf;
    height:25px;
    line-height:25px;
    margin-bottom:5px;
    font-size:12px;
}

.box_body a:hover{
    color:#666;
    text-decoration:none;
}

.box_footer{
    background:url(images/bottom_curves.png) no-repeat;
    height:14px;
}