Untitled

Menu goes out of the screen but page stays unable to scroll
...
<body>
    <div id="container">
        <div class="menu" >
            <ul>
                <li><a href="http://newfutureuniversity.org/">New Future</a></li>
                <li><a href="http://newfutureuniversity.org/learn/degree/">Learn</a>
                <ul class="bottom">
                ...
                </ul>
                </li>
...

body                /* Changes the style for the whole body */
    {
    position:absolute;
    margin:0px;         /* Avoids margin in the whole page */
    padding:0px;
    border:0px;
    background-color: #EEEEEE;  /* Default background color, light grey */
    height:100%;            /* Vertically complete */
    width:100%;
    min-width:400px;
    min-height: 100%;
    color: #333;            /* Letters color */
    }

#container          /* The container has the header, main and footer inside */
    {
    position:relative;
    margin:0px;
    padding:0px;
    min-height: 100%;       /* Avoids the footer to go up */
    height: auto !important;
    height: 100%;
    margin: 0px auto -51px;
    }
.menu
    {
    position: fixed;
    top:0px;
    left:0px;
    opacity:0.3;
    filter:alpha(opacity=30);   /* For IE8 and earlier */
    width:100%;
    min-width:400px;
    border:none;
    border-bottom:1px solid gray;
    margin:0px;
    padding:0px;
    font-size:18px;
    z-index:3;
    }

.menu ul
    {
    background:#DDD;
    height:26px;
    list-style:none;
    margin:0px;
    padding:0px;
    z-index:3;
    }
    .menu li{
        width:24.5%;
        min-width:93px;
        float:left;
        padding:0px;
        margin: 2px 0px 2px 0.5%;
        }
...