/*** Fullsize ***/

/** Main Menu **/
/* general */
#mainMenu { position:relative; z-index:100; float:right; clear:both; margin-top:-45px; }
.mainMenu, .mainMenu ul { margin:0; padding:0; list-style: none; }
.mainMenu { line-height:1.0; }
.mainMenu li { position:relative; }
.mainMenu li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ }
.mainMenu a { display:block; position:relative; text-decoration:none; color:#000; text-transform:uppercase; font-size:12px !important; }

/* top level */
.mainMenu>li { z-index:1; float:left; margin-left:11px; }
.mainMenu>li:hover, ul.mainMenu>li.sfHover { z-index:2; }
.mainMenu>li>a.current, .mainMenu>li>a:hover { color:#55ace1; }

/* sublevels */
.mainMenu ul { position:absolute; display:none; width:15em; /* left offset of submenus need to match (see below) */ }
.mainMenu ul li { padding: 0 1em; background-color:#55ace1; }
.mainMenu ul a { border-top: 2px groove #fff; padding: 1em 0; color:#fff; }
.mainMenu ul li:first-child>a { border-top:none; }
.mainMenu ul a.current, .mainMenu ul a:hover { color:#eaeaea; }

/* dropdowns */
.mainMenu>li>ul { left:50%; top:1em; margin-left:-7.5em; padding-top:15px; background: url('graphics/design_2014/submenu_top.png') no-repeat top center; /* match top ul list item height */ }
.mainMenu>li:hover>ul, .mainMenu>li.sfHover>ul { display:block; }

/* flyouts */
.mainMenu ul li>ul { top:0; left:15em; /* match ul width */ }
ul.mainMenu>li.leftFlyout li>ul { left:-15em; /* match -ul width */ }
.mainMenu ul li:hover>ul, .mainMenu ul li.sfHover>ul { display:block; }


/** Submenu **/
ul.submenu { list-style:none; margin: 1em 0; padding:0; }
ul.submenu ul { display:none; }
ul.submenu li { display:inline-block; margin: 0 5px; padding:5px; line-height:1.5; font-weight:bold; font-size:125%; }
ul.submenu li.menuItemHighlight { border: 1px solid #55ace1; }
ul.submenu a { text-decoration:none; }


/*** Mobile and Tablet Menus ***/
@media (max-width:999px) {
    /** Main Menu **/
    /* General */
    #mainMenu { display:none; float:none; clear:both; margin: 0 0 20px; }
    ul.mainMenu { list-style:none; margin:0; padding:0; font-size:18px; }
    ul.mainMenu li { float:none; position:static; margin:0; padding:0; }
    ul.mainMenu a { display:block; padding:10px 15px; text-decoration:none; }
    ul.mainMenu a.current { background-color:#eaeaea; }
    ul.mainMenu ul { width:auto; border: 0 none; background-color:transparent; }
    
    /* Top level */
    ul.mainMenu>li { width:100% !important; }
    ul.mainMenu>li>a { border-bottom:1px solid #ccc; }
    ul.mainMenu>li:hover>ul { display:none; }
    
    /* Sublevels */
    ul.mainMenu ul { display:none; position:static; margin:0; padding:0; }
    ul.mainMenu li:hover>ul { display:none; }
    ul.mainMenu ul a { padding-left:25px; }
    ul.mainMenu ul ul a { padding-left:35px; }
    ul.mainMenu ul ul ul a { padding-left:45px; }
    ul.mainMenu ul ul ul ul a { padding-left:55px; }
}