/*****************************************************************
 *                                                               *
 *  XCSS Menu Styles                                             *
 *  ----------------                                             *
 *                                                               *
 * This area will include details regarding the required and     *
 * optional styles, how they are used, and in most cases why.    *
 *                                                               *
 *                                                               *
 *                                                               *
 *****************************************************************/

/******************************************************** 
 *                                                      * 
 * Top Horizontal Menu Styles                           * 
 *                                                      * 
 ********************************************************/

/* Container div, mainly used to cascade defaults so that multiple menus 
   can coexist on a single page without having to share a layout and design. */
.hnav .xcsstitle { display:none;}

.hnav {
	position:static;
	width:940px; /* Need this for IE6*/
	height: 44px;
	z-index:200;
}
* html .hnav {display:block;}

/* Setup appearance of links */
.hnav a {
	display: block;
	font-weight: bold;
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
	color: #ffffff;
	text-decoration: none;
	padding: 17px 10px 0px 10px;
	height:100%;
	text-transform:uppercase;
}
/*Fix for IE6 block hover issue*/
* html .hnav a {
	height:auto;
	text-align:center;
}

.hnav a:hover {display: block; color:#e3dfba; text-decoration: none;}

.hnav .activebutton a {
 color: #e3dfba;
}

/* Setup appearance of the top level menu "button", including background images*/
.hnav .button {
	float:left; 
	z-index:0; 

}
.hnav .buttonlast {border-right:0px;}
.hnav .button:hover {}

/* Setup the currently active button to look different. Optional, but nice */
.hnav .activebutton {
	display: block;
	float:left; 
	z-index:0;
}
.hnav .activebutton a {}
/* This is the arrow shown in the top level, where there is a dropdown level of menu */
.hnav a.navarrow {}

/* This is the arrow shown in the dropdown where there is a third level of menu */
.hnav a.subarrow {}

/* Hide the dot on unordered lists */
.hnav ul, .hnav li {padding:0; margin:0; list-style: none;}

.hnav .parent:hover div.dropdown {left: -31px;} /* hover rule for 1st dropdowns */ 

/* hover rule for 2nd level flyouts */
.hnav .dropdown li:hover div { 
	left: 200px; /* this value controls the amount of flyout "overlap" */
	top: -31px; /* this value controls the amount of flyout vertical offset */
}

/******************************************************** 
 * Second Level Dropdown Menu Styles                   * 
 ********************************************************/

/* this parent div does not provide "sticky hovering", but instead fixes a 
strange bug in Op7. When an element serves as a hovered popup "parent" element, 
that element must not also be floated or all heck breaks loose in Opera 7. 
To prevent this, we have floated the top level list items, while nesting 
hoverable parent divs inside that are then hovered to generate the dropdowns. */
.hnav .parent {
	position: relative;
}
.hnav .parent:hover {
	background-image: url(http://www.thenewflyfisherezine.com/CSS/2011/images/bgfix.gif);
	background-repeat:repeat;

} 

/*Over-rides default a properties from Parent*/
.hnav .parent ul a {
	font-size: 10px;
	font-weight: normal;
	padding:5px 10px 5px 10px;
	color: #536a60;
}
.hnav .parent ul a:hover {
	font-size: 10px;
	font-weight: normal;
	padding:5px 10px 5px 10px;
	color: #ffffff;
}
/*Fix for IE6 block hover issue*/
* html .hnav .parent ul a {
	height:100%; /*this makes the link the full button area*/
	width:200px; /*this sets a width on each button*/
	text-align:left;
}
/* Could be different for each of the container navs... hnav, vnav, etc. */
.hnav .dropdown { 
	width: 250px;
	position: absolute;	
	left: -3000px;
	top: auto; /* puts dropdowns directly under top nav */
	text-align: left; /* needed because IE misapplies text centering to boxes */	
	background: url(http://www.thenewflyfisherezine.com/CSS/images/bgfix.gif);
}

/* The margins on the UL's replace the div paddings to create "sticky hovering"
zones, and the margins should "fill" the divs, making the IE BG fix unnecessary.
Unfortunately the BG fix is still needed, although this method does eliminate
possible box model problems */
.hnav .dropdown ul { 
  width: 200px; 
  margin: 0px 30px 30px 30px; /* creates "sticky hovering" zones for dropdowns */
  border: 1px solid #999;
  background-color: #ccc;
} 
.hnav .dropdown li {position: relative;} /* IE5/win bugfix */
.hnav .dropdown li:hover {color:#81bfca; background: url(http://www.thenewflyfisherezine.com/CSS/images/bgfix.gif);} /* hover color effect on dropdown links. This line must have a background value for IE7 */

/* Setup defaults for the second level items (we need one per, so they can be styled differently) */
.hnav .drop4 ul {}

/******************************************************** 
 * Third Level Dropdown Menu Styles                   * 
 ********************************************************/

/* rules for divs inside dropdown */
.hnav .dropdown div {
	width: 200px;
	position: absolute;		
	left: -3000px;
	top: 0;  
	background: url(http://www.thenewflyfisherezine.com/CSS/images/bgfix.gif);
	text-align: left; /* needed because IE misapplies text centering to boxes */
}

/* Background colour for flyouts, and "sticky hovering" zones for flyouts */
.hnav .dropdown div ul {margin: 30px 30px 30px 0;}  
.hnav .dropdown div ul a {} /* Foreground colour for  flyouts */ 
.hnav .dropdown div li:hover {color:#81bfca;} /* hover color effect on flyout links */

/* Setup styles for the third level items... with a cascade to keep it simple */
.hnav .drop4 ul div ul {}


/******************************************************** 
 *                                                      * 
 * Side Vertical Menu Styles - flyouts                  *
 *                                                      * 
 ********************************************************/

/* Container div, mainly used to cascade defaults so that multiple menus 
   can coexist on a single page without having to share a layout and design. */
.vnav .xcsstitle {display:none;}

.vnav {
	position:relative;
 	width: 240px;
}

/* Setup appearance of links */
.vnav a {
	display: block;
	font-family: Verdana, Arial;
	color: #666;
	font-weight:bold;
	text-decoration: none;
	padding:10px;
	height:100%;
	width:220px;
	text-align:left;
}

.vnav a:hover {color:#ffffff; text-decoration:none;}

/* Setup appearance of the top level menu "button", including background images*/
.vnav .button {
	float:left; 
	z-index:0;
	border-bottom:1px solid #666;
}
.vnav .buttonlast {}
.vnav .button:hover {background-color:#000;}

/* Setup the currently active button to look different. Optional, but nice */
.vnav .activebutton {
	display: block;
	float:left; 
	z-index:0;
	background-color:#000;
}
.vnav .activebutton a {color:#ffffff; text-decoration:none;}

/* This is the arrow shown in the top level, where there is a dropdown level of menu */
.vnav a.navarrow {}

/* This is the arrow shown in the dropdown where there is a third level of menu */
.vnav a.subarrow {}

/* Hide the dot on unordered lists */
.vnav ul, .vnav li {padding:0; margin:0; list-style: none;}

.vnav .parent:hover div.dropdown {left:240px; top:0px;} /* hover rule for 1st dropdowns */ 

/* hover rule for 2nd level flyouts */
.vnav .dropdown li:hover div {left:240px; top:0px;}

/******************************************************** 
 * Second Level Dropdown Menu Styles                   * 
 ********************************************************/

/* this parent div does not provide "sticky hovering", but instead fixes a 
strange bug in Op7. When an element serves as a hovered popup "parent" element, 
that element must not also be floated or all heck breaks loose in Opera 7. 
To prevent this, we have floated the top level list items, while nesting 
hoverable parent divs inside that are then hovered to generate the dropdowns. */
.vnav .parent {
	position: relative;
}
.vnav .parent:hover {
	background-image: url(http://www.thenewflyfisherezine.com/CSS/2011/images/bgfix.gif);
	background-repeat:repeat;
} 

/*Over-rides default a properties from Parent*/
.vnav .parent ul a {
	color:#ffffff;
	font-weight: normal;
	padding:3px 5px 3px 15px;
	height:auto;
	text-align:left;
}
/*Fix for IE6 block hover issue*/
* html .vnav .parent ul a {
	height:100%; /*this makes the link the full button area*/
}
.vnav .parent ul a:hover {color:#000;}
/* Could be different for each of the container navs... hnav, vnav, etc. */
.vnav .dropdown { 
	width: 240px;
	position: absolute;	
	left:-3000px;
	top: auto; /* puts dropdowns directly under top nav */
	text-align: left; /* needed because IE misapplies text centering to boxes */	
	background: url(http://www.thenewflyfisherezine.com/CSS/images/bgfix.gif);
	background-color:#333333;
}

/* The margins on the UL's replace the div paddings to create "sticky hovering"
zones, and the margins should "fill" the divs, making the IE BG fix unnecessary.
Unfortunately the BG fix is still needed, although this method does eliminate
possible box model problems */
.vnav .dropdown ul { 
  width: 240px; 
  margin:0px; /* creates "sticky hovering" zones for dropdowns */
} 
.vnav .dropdown li {position: relative; margin:0px; padding:0px; width:240px;} /* IE5/win bugfix */
.vnav .dropdown li:hover {background-color:#666;} /* hover color effect on dropdown links */

/* Setup defaults for the second level items (we need one per, so they can be styled differently) */
.vnav .drop4 ul {}

/******************************************************** 
 * Third Level Dropdown Menu Styles                   * 
 ********************************************************/

/* rules for divs inside dropdown */
.vnav .dropdown div {
	width: 240px;
	position:absolute;		
	left:-3000px;
	background: url(http://www.thenewflyfisherezine.com/CSS/images/bgfix.gif);
	text-align: left; /* needed because IE misapplies text centering to boxes */
	background-color:#333333;
}

/* Background colour for flyouts, and "sticky hovering" zones for flyouts */
.vnav .dropdown div ul {margin:0px;}  
.vnav .dropdown div ul a {color:#fff;} /* Foreground colour for  flyouts */ 
.vnav .dropdown div li:hover {background-color:#666;} /* hover color effect on flyout links */

/* Setup styles for the third level items... with a cascade to keep it simple */
.vnav .drop4 ul div ul {}


/******************************************************** 
 *                                                      * 
 * Side Vertical Menu Styles - with pop-down/flyout     *
 *                                                      * 
 ********************************************************/

/* Container div, mainly used to cascade defaults so that multiple menus 
   can coexist on a single page without having to share a layout and design. */
.vnav2 .xcsstitle {display:none;}

.vnav2 {
	position:relative;
 	width: 240px;
}

/* Setup appearance of links */
.vnav2 a {
	display: block;
	font-family: Verdana, Arial;
	color: #666;
	font-weight:bold;
	text-decoration: none;
	padding:10px;
	height:100%;
	width:220px;
	text-align:left;
}

.vnav2 a:hover {color:#ffffff; text-decoration:none;}

/* Setup appearance of the top level menu "button", including background images*/
.vnav2 .button {
	float:left; 
	z-index:0;
	border-bottom:1px solid #666;
}
.vnav2 .buttonlast {}
.vnav2 .button:hover {background-color:#000;}

/* Setup the currently active button to look different. Optional, but nice */
.vnav2 .activebutton {
	display: block;
	float:left; 
	z-index:0;
	background-color:#000;
}
.vnav2 .activebutton a {color:#ffffff; text-decoration:none;}

.vnav2 .button .dropdown {display:none;}

.vnav2 .activebutton .dropdown{display:block;}

/* This is the arrow shown in the top level, where there is a dropdown level of menu */
.vnav2 a.navarrow {}

/* This is the arrow shown in the dropdown where there is a third level of menu */
.vnav2 a.subarrow {}

/* Hide the dot on unordered lists */
.vnav2 ul, .vnav2 li {padding:0; margin:0; list-style: none;}

.vnav2 .parent div.dropdown {} /* hover rule for 1st dropdowns */ 

/* hover rule for 2nd level flyouts */
.vnav2 .dropdown li:hover div { 
	left: 240px; /* this value controls the amount of flyout "overlap" */
	top: 0px; /* this value controls the amount of flyout vertical offset */
}

/******************************************************** 
 * Second Level Dropdown Menu Styles                   * 
 ********************************************************/

/* this parent div does not provide "sticky hovering", but instead fixes a 
strange bug in Op7. When an element serves as a hovered popup "parent" element, 
that element must not also be floated or all heck breaks loose in Opera 7. 
To prevent this, we have floated the top level list items, while nesting 
hoverable parent divs inside that are then hovered to generate the dropdowns. */
.vnav2 .parent {
	position: relative;
}
.vnav2 .parent:hover {
	background-image: url(http://www.thenewflyfisherezine.com/CSS/2011/images/bgfix.gif);
	background-repeat:repeat;
} 

/*Over-rides default a properties from Parent*/
.vnav2 .parent ul a {
	color:#ffffff;
	font-weight: normal;
	padding:3px 5px 3px 15px;
	height:auto;
	text-align:left;

}
/*Fix for IE6 block hover issue*/
* html .vnav2 .parent ul a {
	height:100%; /*this makes the link the full button area*/
}
.vnav2 .parent ul a:hover {color:#ffffff;}
/* Could be different for each of the container navs... hnav, vnav, etc. */
.vnav2 .dropdown { 
	width: 240px;
	position: relative;	
	top: auto; /* puts dropdowns directly under top nav */
	text-align: left; /* needed because IE misapplies text centering to boxes */	
	background: url(http://www.thenewflyfisherezine.com/CSS/images/bgfix.gif);
}

/* The margins on the UL's replace the div paddings to create "sticky hovering"
zones, and the margins should "fill" the divs, making the IE BG fix unnecessary.
Unfortunately the BG fix is still needed, although this method does eliminate
possible box model problems */
.vnav2 .dropdown ul { 
  width: 240px; 
  margin: 2px 0px 2px 0px; /* creates "sticky hovering" zones for dropdowns */
} 
.vnav2 .dropdown li {position: relative; margin:0px; padding:0px; width:240px;} /* IE5/win bugfix */
.vnav2 .dropdown li:hover {background-color:#666;} /* hover color effect on dropdown links */

/* Setup defaults for the second level items (we need one per, so they can be styled differently) */
.vnav2 .drop4 ul {}

/******************************************************** 
 * Third Level Dropdown Menu Styles                   * 
 ********************************************************/

/* rules for divs inside dropdown */
.vnav2 .dropdown div {
	width: 240px;
	position: absolute;		
	left: -3000px;
	background: url(http://www.thenewflyfisherezine.com/CSS/images/bgfix.gif);
	text-align: left; /* needed because IE misapplies text centering to boxes */
}

/* Background colour for flyouts, and "sticky hovering" zones for flyouts */
.vnav2 .dropdown div ul {margin: 0px 0px 5px 0px; background-color:#666;}  
.vnav2 .dropdown div ul a {color:#fff;} /* Foreground colour for  flyouts */ 
.vnav2 .dropdown div li:hover {background-color:#666;} /* hover color effect on flyout links */

/* Setup styles for the third level items... with a cascade to keep it simple */
.vnav2 .drop4 ul div ul {}


/******************************************************** 
 *                                                      * 
 * Side Vertical Menu Styles - pop-down                 *
 *                                                      * 
 ********************************************************/

/* Container div, mainly used to cascade defaults so that multiple menus 
   can coexist on a single page without having to share a layout and design. */
.vnav3 .xcsstitle {display:none;}

.vnav3 {
	position:relative;
 	width: 240px;
}

/* Setup appearance of links */
.vnav3 a {
	display: block;
	font-family: Verdana, Arial;
	color: #666;
	font-weight:bold;
	text-decoration: none;
	padding:10px;
	height:100%;
	width:220px;
	text-align:left;
}

.vnav3 a:hover {color:#ffffff; text-decoration:none;}

/* Setup appearance of the top level menu "button", including background images*/
.vnav3 .button {
	float:left; 
	z-index:0;
	border-bottom:1px solid #666;
}
.vnav3 .buttonlast {}
.vnav3 .button:hover {background-color:#000;}

/* Setup the currently active button to look different. Optional, but nice */
.vnav3 .activebutton {
	display: block;
	float:left; 
	z-index:0;
	background-color:#000;
}
.vnav3 .activebutton a {color:#ffffff; text-decoration:none;}

.vnav3 .button .dropdown {display:none;}

.vnav3 .activebutton .dropdown{display:block;}

/* This is the arrow shown in the top level, where there is a dropdown level of menu */
.vnav3 a.navarrow {}

/* This is the arrow shown in the dropdown where there is a third level of menu */
.vnav3 a.subarrow {}

/* Hide the dot on unordered lists */
.vnav3 ul, .vnav3 li {padding:0; margin:0; list-style: none;}

.vnav3 .parent div.dropdown {} /* hover rule for 1st dropdowns */ 

/* hover rule for 2nd level flyouts */
.vnav3 .dropdown li:hover div {}

/******************************************************** 
 * Second Level Dropdown Menu Styles                   * 
 ********************************************************/

/* this parent div does not provide "sticky hovering", but instead fixes a 
strange bug in Op7. When an element serves as a hovered popup "parent" element, 
that element must not also be floated or all heck breaks loose in Opera 7. 
To prevent this, we have floated the top level list items, while nesting 
hoverable parent divs inside that are then hovered to generate the dropdowns. */
.vnav3 .parent {
	position: relative;
}
.vnav3 .parent:hover {
	background-image: url(http://www.thenewflyfisherezine.com/CSS/2011/images/bgfix.gif);
	background-repeat:repeat;
} 

/*Over-rides default a properties from Parent*/
.vnav3 .parent ul a {
	color:#ffffff;
	font-weight: normal;
	padding:3px 5px 3px 15px;
	height:auto;
	text-align:left;
}
/*Fix for IE6 block hover issue*/
* html .vnav3 .parent ul a {
	height:100%; /*this makes the link the full button area*/
}
.vnav3 .parent ul a:hover {color:#000;}
/* Could be different for each of the container navs... hnav, vnav, etc. */
.vnav3 .dropdown { 
	width: 240px;
	position: relative;	
	top: auto; /* puts dropdowns directly under top nav */
	text-align: left; /* needed because IE misapplies text centering to boxes */	
	background: url(http://www.thenewflyfisherezine.com/CSS/images/bgfix.gif);
}

/* The margins on the UL's replace the div paddings to create "sticky hovering"
zones, and the margins should "fill" the divs, making the IE BG fix unnecessary.
Unfortunately the BG fix is still needed, although this method does eliminate
possible box model problems */
.vnav3 .dropdown ul { 
  width: 240px; 
  margin: 2px 0px 2px 0px; /* creates "sticky hovering" zones for dropdowns */
} 
.vnav3 .dropdown li {position: relative; margin:0px; padding:0px; width:240px;} /* IE5/win bugfix */
.vnav3 .activebutton .dropdown li {}
.vnav3 .dropdown li:hover {background-color:#666;} /* hover color effect on dropdown links */

/* Setup defaults for the second level items (we need one per, so they can be styled differently) */
.vnav3 .drop4 ul {}

/******************************************************** 
 * Third Level Dropdown Menu Styles                   * 
 ********************************************************/

/* rules for divs inside dropdown */
.vnav3 .dropdown div {
	width: 240px;
	position: relative;		
	background: url(http://www.thenewflyfisherezine.com/CSS/images/bgfix.gif);
	text-align: left; /* needed because IE misapplies text centering to boxes */
}

/* Background colour for flyouts, and "sticky hovering" zones for flyouts */
.vnav3 .dropdown div ul {margin: 0px 0px 5px 0px;}  
.vnav3 .dropdown div ul a {color:#fff; font-size:9px;} /* Foreground colour for  flyouts */ 
.vnav3 .dropdown div li:hover {background-color:#666;} /* hover color effect on flyout links */

/* Setup styles for the third level items... with a cascade to keep it simple */
.vnav3 .drop4 ul div ul {}


/******************************************************** 
 *                                                      * 
 * Misc Styles and IE Fixes                             *
 *                                                      *  
 ********************************************************/

.floatfix {margin-right: -3px;}
/* this fixes the IE 3px bug that is common in this type of float arrangement */ 

/* This is to hide the following from IE/Mac. \*/
* html .button .dropdown li {
height: 1%;
margin-left: -16px;
mar\gin-left: 0;
}
/* */

/* The first rule above fixes "bullet region" problems in IE5.x/win, 
and the 2nd is to make all links fully clickable. */    

/*\*/ /*/
.hnav .dropdown, .hnav .dropdown div {width: 189px;}
.hnav .button .dropdown ul {margin: 0px;}
.hnav .dropdown, .hnav .dropdown div {position: static;}
.hnav .dropdown ul {border: 0;}

.vnav .dropdown, .vnav .dropdown div {width: 189px;}
.vnav .button .dropdown ul {margin: 0px;}
.vnav .dropdown, .vnav .dropdown div {position: static;}
.vnav .dropdown ul {border: 0;}*/