/* ================================================================
This copyright notice must be kept untouched in the stylesheet at 
all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.stunicholls.com/menu/pro_drop_2.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

.preload1 {background: url(mb_button_1.gif);}
.preload2 {background: url(mb_button_1a.gif);}

#nav {padding:0; margin:0; list-style:none; height:38px; background:#fff url(mb_button_0.gif) repeat-x; position:relative; z-index:500; font-family:arial, verdana, sans-serif;}
#nav li.top {display:block; float:left; height:38px;}
#nav li a.top_link {display:block; float:left; height:35px; line-height:33px; color:#eee /*changed from #ccc*/; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 12px; cursor:pointer;background: url(mb_button_0.gif);}
#nav li a.top_link span {float:left; display:block; padding:0 24px 0 12px; height:35px; background: url(mb_button_0.gif) right top no-repeat;}
#nav li a.top_link span.down {float:left; display:block; padding:0 24px 0 12px; height:35px; background: url(mb_button_0a.gif) no-repeat right top;}

#nav li:hover a.top_link {color:#fff; background: url(mb_button_1.gif) no-repeat;}   /* these gifs form the top level menu bar */
#nav li:hover a.top_link span {background:url(mb_button_1.gif) no-repeat right top;}
#nav li:hover a.top_link span.down {background:url(mb_button_1a.gif) no-repeat right top;}

/* Default list styling */

#nav li:hover {position:relative; z-index:200;}

#nav li:hover ul.sub
{left:1px; top:38px;/* how far down the sub list begins */ background: #bbd37e /*color of first level dropdown button backgrounds before hover*/; padding:3px; 
border:1px solid #5c731e; white-space:nowrap; width:150px; /* (was 90) controls width of drop-down buttons, must be combined with next line's width. NOTE: if changed, affects ALL first sub, which messes up galleries */
height:auto; z-index:300;}
#nav li:hover ul.sub li
{display:block; height:20px; position:relative; float:left; width:150px;/* (was 90) in conjunction with previous statement's width, controls how sub-list displays */ font-weight:normal;}
#nav li:hover ul.sub li a
{display:block; font-size:11px; height:18px; width:148px; /*(was 88) when hovering on first sub level, changes the hover-color length*/ line-height:18px; text-indent:5px; color:#000; text-decoration:none;border:1px solid #bbd37e;}

#nav li ul.sub li a.fly
{background:#bbd37e url(arrow.gif) 80px 6px no-repeat;} /* controls where the arrow shows up on a fly button */
#nav li:hover ul.sub li a:hover 
{background:#6a812c; /*color of first level dropdowns and flyouts on hover*/ color:#fff; border-color:#fff;}
#nav li:hover ul.sub li a.fly:hover
{background:#6a812c url(arrow_over.gif) 80px 6px no-repeat; color:#fff;}

/* trying to change size of fly buttons -- actually, to put them back where they were but to leave the sub buttons large enough for birds */
/* creating 'sub2' */

#nav li:hover ul.sub2
{left:1px; top:38px;/* how far down the sub list begins */ background: #bbd37e /*color of first level dropdown button backgrounds before hover*/; padding:3px; 
border:1px solid #5c731e; white-space:nowrap; width:90px; /* (was 90) controls width of drop-down buttons, must be combined with next line's width. */
height:auto; z-index:300;}
#nav li:hover ul.sub2 li
{display:block; height:20px; position:relative; float:left; width:90px;/* (was 90) in conjunction with previous statement's width, controls how sub-list displays */ font-weight:normal;}
#nav li:hover ul.sub2 li a
{display:block; font-size:11px; height:18px; width:88px; /*(was 88) when hovering on first sub level, changes the hover-color length*/ line-height:18px; text-indent:5px; color:#000; text-decoration:none;border:1px solid #bbd37e;}

#nav li ul.sub2 li a.fly
{background:#bbd37e url(arrow.gif) 80px 6px no-repeat;} /* controls where the arrow shows up on a fly button */
#nav li:hover ul.sub2 li a:hover 
{background:#6a812c; /*color of first level dropdowns and flyouts on hover*/ color:#fff; border-color:#fff;}
#nav li:hover ul.sub2 li a.fly:hover
{background:#6a812c url(arrow_over.gif) 80px 6px no-repeat; color:#fff;}

/* END of sub2 modification.  This works to take first level fly buttons back to right size.  Now I need to get the flyouts from them larger. */


/* Now I need to make the flyouts larger. This is same as I did for sub, but one level of list item deeper */

#nav li:hover li:hover ul
{left:90px; top:-4px; background: #bbd37e; padding:3px; border:1px solid #5c731e; white-space:nowrap; width:150px; z-index:400; height:auto;}

#nav li:hover li:hover li
{display:block; height:20px; position:relative; float:left; width:150px; font-weight:normal;}


#nav li:hover li:hover li a
{display:block; font-size:11px; height:18px; width:145px; line-height:18px; text-indent:5px; color:#000; text-decoration:none;border:1px solid #bbd37e;}


/* END of my change for flyouts */


/* original  
#nav li:hover li:hover ul,
#nav li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover li:hover ul
{left:90px; top:-4px; background: #bbd37e; padding:3px; border:1px solid #5c731e; white-space:nowrap; width:90px; z-index:400; height:auto;}
end original*/

/*leaving the rest of these, as they seem to be necessary -- not sure which ones*/
#nav ul, 
#nav li:hover ul ul,
#nav li:hover li:hover ul ul,
#nav li:hover li:hover li:hover ul ul,
#nav li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

#nav li:hover li:hover a.fly,
#nav li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover li:hover a.fly
{background:#6a812c url(arrow_over.gif) 80px 6px no-repeat; color:#fff; border-color:#fff;} 

#nav li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li:hover li a.fly
{background:#bbd37e url(arrow.gif) 80px 6px no-repeat; color:#000; border-color:#bbd37e;} 


/*  Adding #nav3 for special case -- all of the pages that display thumbnails of N.A. bird families.
The idea here is to remove the standard menu so people don't go wander off opening more and more tabs. */


#nav3 {width: 100%;  padding:0; margin:0; list-style:none; height:38px; background:#fff url(mb_button_0.gif) repeat-x; position:relative; z-index:500; font-family:arial, verdana, sans-serif;}
#nav3 li.top {display:block; float:left; height:38px;}
#nav3 li a.top_link {display:block; float:left; height:35px; line-height:33px; color:#ccc; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 12px; cursor:pointer;background: url(mb_button_0.gif);}
#nav3 li a.top_link span {float:left; display:block; padding:0 24px 0 12px; height:35px; background: url(mb_button_0.gif) right top no-repeat;}
#nav3 li a.top_link span.down {float:left; display:block; padding:0 24px 0 12px; height:35px; background: url(mb_button_0a.gif) no-repeat right top;}

#nav3 li:hover a.top_link {color:#fff; background: url(mb_button_1.gif) no-repeat;}   /* these gifs form the top level menu bar */
#nav3 li:hover a.top_link span {background:url(mb_button_1.gif) no-repeat right top;}
#nav3 li:hover a.top_link span.down {background:url(mb_button_1a.gif) no-repeat right top;}

/* Default list styling */

#nav3 li:hover {position:relative; z-index:200;}

#nav3 li:hover ul.sub
{left:100%; /* pushes the fly all the way to the side */ top:0px;/* how far down the sub list begins */ background: #bbd37e /*color of first level dropdown button backgrounds before hover*/; padding:3px;
border:1px solid #5c731e; white-space:nowrap; width:250px; /* (was 90) controls width of drop-down buttons, must be combined with next line's width. NOTE: if changed, affects ALL first sub, which messes up galleries */
height:auto; z-index:300;}
#nav3 li:hover ul.sub li
{display:block; height:20px; position:relative; float:left; width:250px;/* (was 90) in conjunction with previous statement's width, controls how sub-list displays */ font-weight:normal;}
#nav3 li:hover ul.sub li a
{display:block; font-size:11px; height:18px; width:248px; /*(was 88) when hovering on first sub level, changes the hover-color length*/ line-height:18px; text-indent:5px; color:#000; text-decoration:none;border:1px solid #bbd37e;}

#nav3 li ul.sub li a.fly
{background:#bbd37e url(arrow.gif) 80px 6px no-repeat;} /* controls where the arrow shows up on a fly button */
#nav3 li:hover ul.sub li a:hover
{background:#6a812c; /*color of first level dropdowns and flyouts on hover*/ color:#fff; border-color:#fff;}
#nav3 li:hover ul.sub li a.fly:hover
{background:#6a812c url(arrow_over.gif) 80px 6px no-repeat; color:#fff;}

#nav3 li:hover li:hover ul
{left:90px; top:-4px; background: #bbd37e; padding:3px; border:1px solid #5c731e; white-space:nowrap; width:300px; z-index:400; height:auto;}

#nav3 li:hover li:hover li
{display:block; height:20px; position:relative; float:left; width:300px; font-weight:normal;}


#nav3 li:hover li:hover li a
{display:block; font-size:11px; height:18px; width:295px; line-height:18px; text-indent:5px; color:#000; text-decoration:none;border:1px solid #bbd37e;}

#nav3 ul,
#nav3 li:hover ul ul,
#nav3 li:hover li:hover ul ul,
#nav3 li:hover li:hover li:hover ul ul,
#nav3 li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

#nav3 li:hover li:hover a.fly,
#nav3 li:hover li:hover li:hover a.fly,
#nav3 li:hover li:hover li:hover li:hover a.fly,
#nav3 li:hover li:hover li:hover li:hover li:hover a.fly
{background:#6a812c url(arrow_over.gif) 80px 6px no-repeat; color:#fff; border-color:#fff;}

#nav3 li:hover li:hover li a.fly,
#nav3 li:hover li:hover li:hover li a.fly,
#nav3 li:hover li:hover li:hover li:hover li a.fly
{background:#bbd37e url(arrow.gif) 80px 6px no-repeat; color:#000; border-color:#bbd37e;}

