﻿.menu-item-wrapper             { position: relative; width: auto; margin-right: 0; padding: 3px 9px 4px 9px; border: 1px solid #FFF; border-bottom: none;  z-index: 900; }
    
.menu-item-wrapper.floated     { float: left; width: auto; min-width: inherit; text-align: center; }   
.menu-item-wrapper.show        { z-index: 1000; background: #FFF; border-right-color: #555; border-left-color: #999; border-top-color: #999; } 
.menu-item-wrapper.show .popup { z-index: 1000; }

.menu-item-wrapper.brighten      { background: #EEE; border-color: #EEE; }    
.menu-item-wrapper.brighten.show { background: #FFF; border-right-color: #555; border-left-color: #999; border-top-color: #999; } 
.menu-item-wrapper.darken        { background: #FFF; border-color: #FFF; }  
.menu-item-wrapper.darken.show   { background: #EEE; border-right-color: #555; border-left-color: #999; border-top-color: #999; }

.menu-item-wrapper .icon      { background: transparent url(../media/arrow-expander.png) 0 top no-repeat; display: inline-block; vertical-align: middle; width: 11px; height: 15px; padding-bottom: 1px; margin: 0 7px 2px 7px; font-size: 1px; line-height: 1px; color: transparent; }
.menu-item-wrapper.show .icon { background-position: 0 bottom !important; }

.menu-item-wrapper.force-always-expanded .icon { display: none; }

.menu-item-wrapper .popup         { position: absolute; display: none; min-width: 200px;  white-space: nowrap; top: 100%; left: -10%; padding: 10px; }

.menu-item-wrapper.floated .popup { text-align: left; }

.menu-item-wrapper.force-always-expanded .popup { position: relative; top: 0; left: 0; padding-left: 0; padding-right: 0; min-width: inherit; }

.menu-item-wrapper.show .popup          { background: #FFF; border: 1px solid #555; border-top: 1px solid #999; border-left: 1px solid #999; }
.menu-item-wrapper.brighten.show .popup { background: #FFF; border: 1px solid #555; border-top: 1px solid #999; border-left: 1px solid #999; }
.menu-item-wrapper.darken.show .popup   { background: #EEE; border: 1px solid #555; border-top: 1px solid #999; border-left: 1px solid #999; }

.menu-item-wrapper .popup .item { padding: 0; clear: none; }

.menu-item-wrapper .trigger       { display: block; position: relative; color: #0072c6; }
.menu-item-wrapper .trigger:hover { cursor: pointer; }
.menu-item-wrapper.show .trigger  { color: #0072c6; font-family: Segoe UI Semibold,Segoe UI,Tahoma,Arial,Verdana,sans-serif;  }

.menu-item-wrapper a { display: inline-block; padding: 5px 0; }   

.menu-item-wrapper .mask      { display: none; position: absolute; top: 100%; left: 0; width: 100%; height: 1px; font-size: 1px; line-height: 1px; z-index: 1100; }
.menu-item-wrapper.show .mask { display: block; }
    
.menu-item-wrapper.show .mask          { background: #FFF; border-top: 1px solid #FFF; }
.menu-item-wrapper.brighten.show .mask { background: #FFF; border-top: 1px solid #FFF; }   
.menu-item-wrapper.darken.show .mask   { background: #EEE; border-top: 1px solid #EEE; }

/* ************************************************************ */

#header #main-nav .menu-item-wrapper { margin-right: 20px; font-size: 120%;}
#header #main-nav .menu-item-wrapper.last { margin-right: 0; }
#header #main-nav .menu-item-wrapper .icon { display: none; }
#header #main-nav .menu-item-wrapper a:hover { color:#005FA5;}


