/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */
/* MAIN NAVIGATION INCLUDING FLYOUT HANDLING */
/* =+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+==+=+=+= */

#navMain, #navMain ul { width: 813px; list-style: none; line-height: 14px; padding: 0; margin: 0px 0px 0px 0px; z-index: 500; position: relative;}
#navMain a { display: block; color: #FFFFFF; text-decoration: none; padding: 4px 15px 4px 10px; font-size:8px; font-weight: normal;}
#navMain a.daddy { background: url(../images/rightarrow2.gif) 140px 6px no-repeat; }
#navMain a.sel { background-color: #75A885; }
#navMain li { list-style: none; float: left; padding: 0; border-right: 1px solid #999999; font-size:9px;}
#navMain li ul { position: absolute; left: -2000px; height: auto; width: 175px; w\idth: 150px; margin: 0 0 0 -1px; border: solid #999999; border-width: 0 1px 1px 1px; background-color: #BAD3C2;}
#navMain li li { width: 150px; border: solid #999999; border-width: 1px 0 0 0; }
#navMain li ul a { width: 150px; w\idth: 125px;  font-size:11px; font-weight: normal;}
#navMain li ul ul { margin: -24px 0 0 150px; }
#navMain li:hover ul ul, #navMain li:hover ul ul ul, #navMain li.sfhover ul ul, #navMain li.sfhover ul ul ul { left: -2000px; }
#navMain li:hover ul, #navMain li li:hover ul, #navMain li li li:hover ul, #navMain li.sfhover ul, #navMain li li.sfhover ul, #navMain li li li.sfhover ul { left: auto; }
#navMain li:hover, #navMain li.sfhover { background: #75A885; }

/* 
Now this is really weird!!
If you put 'background-color' in the line above, instead of 'background' only it stops working properly in IE7!
In that case menus do not disappear on rollout, if there is a focus on the form-field.
*/

#navMain li.separator { background-color: #7c6240; padding: 4px 5px 3px 5px; color:#FFFFFF;}