/** Optional CSS for use with Mega dropdown**/

/** List entry spacers **/
div.menu {
    padding-top:10px;
    padding-bottom:30px;
}
/**  ----  1st Level Navigation  ----  **/
div.menu > ul {
    padding-left:0px;
}
div.menu > ul > li {
    float:left;
    padding: 0px 5px 0px 5px;
    font-weight:bold;
    margin:1px 1px 0px 1px; /** instead of border **/
}
/**  ----  2nd Level Navigation  ----  **/
div.menu ul > li > div > ul {
    max-width: 600px;
    padding-left:10px;
    padding-right:10px;
}
div.menu > ul > li > div { 
    /** Blue transparent Background**/
    background-color:rgba(207, 220, 236, 0.6);
    margin-left:-6px;
    border: 1px solid rgba(24, 106, 175, 0.6);
    border-top:none;
    /** hiding the part - hover actions below **/
    position:absolute;
    left:-10000; 
    visibility:hidden;
}
div.menu > ul > li > div > ul { 
    /** White Background**/
    display:inline-block;
    background-color:white;
    border-radius: 2px; 
    margin:10px;
}
div.menu ul > li > div > ul > li {
    position:relative;
    float:none;
    clear:both;
    padding: 5px 0px 5px 0px;
}
/** ---- 3rd Level Navigation ---- **/
div.menu ul > li > div > ul > li > div > ul > li{
    float:left;
    clear:none;
    padding: 0px 5px 0px 5px;
    font-weight:normal;
}

/** Hover TopLevel Navigation entry**/
div.menu > ul > li:hover{
    background-color:rgba(207, 220, 236, 0.6);
    margin:0;
    border: 1px solid rgba(24, 106, 175, 0.6);
    border-bottom:none;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
}
div.menu > ul > li:hover > div{
    left:auto;
    visibility:visible;
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    border-top-right-radius: 2px;    
}

/**  Content Layout **/

div#content {
    clear:both;
}