#mainmenu,
#mainmenu ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
    font-family: 'PT Sans', sans-serif;
}
#mainmenu {
    /*float: left;*/
    padding-left: 15px;
}
#mainmenu > li {
    float: left;
    width: 220px;
    margin: 5px;
}
#mainmenu li a {
    display: block;
    /*width: 130px;*/
    text-decoration: none;
    padding: 8px 12px;
}

#mainmenu ul {
    position: absolute;
    /*display: none;*/
    z-index: 999;
    display: block; overflow: hidden;
    opacity: 0; height: 0;
    transition: all 150ms;
    width: 220px;
}
#mainmenu ul li a {
    /*width: 114px;*/
}
#mainmenu li:hover ul {
    display: block;
    opacity: 1; height: auto;
    

}

/* Main menu
------------------------------------------*/
#mainmenu {
    font-size: 1.3em;
}
#mainmenu > li > a {
    text-align: center;
    /*background-color: #77B127;*/
    background-color: #a8c090;
    color: #fff;
    border-radius: 10px; 
    height: 20px;
    text-transform: uppercase;
    text-shadow: 0px 1px 2px #333;
    
    transition: all 150ms;
}

#mainmenu > li:hover > a {
    /*background-color: #497818;*/
    background-color: #83b099;
    color: #fff;
    border-radius: 10px 10px 0px 0px;
}

 
/* Submenu
------------------------------------------*/
#mainmenu ul {
    /*background-color: #497818;*/
    background-color: #83b099;
    color: #fff;
    /*opacity: 0.5;*/
    font-size: 0.8em;
    text-transform: none;
    font-weight: 300;
}


#mainmenu ul li a {
    display: normal;
    padding: 10px 16px;
    color: #fff;
    transition: all 150ms;
}


#mainmenu ul li:hover a {
    background: #327361;
}