#logo 
{
    font-family: Calibri, Arial;
    font-weight:bolder;
    font-size:xx-large;
    color:#585858;
    width:450px;
    text-align:center;
    vertical-align:middle;
    align-content:center;
}

    #logo a {
        text-decoration: none;
        color: #888888;
    }

#main_menu {
    text-align: center;
    vertical-align: middle;
}

ul#menu {
    list-style: none;
    margin: 5px;
    padding: 10px;
    overflow: auto; /* makes sure the container fits the floated list-items below */
    font-family: Calibri, Arial;
    font-weight: bold;
    font-size: larger;
    color: #888888;
}

ul#menu li{
    /* removed the positioning and z-index on the li, we no longer need them */
    margin:3px 5px;
    padding:5px 10px 4px;
    min-width:120px;
    float:left; /* floats list items to the left, creating a horizontal menu */
    cursor:pointer;
}

ul#menu li span {
    position: relative; /* must have position set to anything other than static to use z-index */
    z-index: 5; /* 5 layers above all normal elements */
}

ul#menu li.backLava {
    position:absolute; /* this is automatically added by lavaLamp, if not set, but let's set it for good practice */
    z-index:3; /* 3 levels higher than all normal elements */
    border-bottom:2px solid brown;
}

ul#menu a
{
    text-decoration:none;
    color:#888888;
}

#content_section
{
    border-top:1px solid #a0a0a0;
}