/***************************************************************
File Name:	v7wv_dropdown.css
Author:		Tony Bianco
Notes:		-------- THIS IS IMPORTANT ---------
				If ANYONE does something in this file makes sure you
				document what you did at top under development notes.
				This will help anyone who comes to this file see the 
				progress made to it.
				
				-------- DOCUMENT NOTES -------------
				04/07/2005: 
				The file works perfectly in Firefox and in IE.
				The Below are called BOX MODEL HACKS. IE 5 and under cannot read 
				anything below the voice-family: "\"}\"";. This gives
				you the ability to apply any formatting to the element 
				without having to worry about how IE will treat it.
				voice-family: "\"}\"";
				voice-family: inherit;
				
				This is very important to know. You MUST NOT
				exceed more than 14 characters in a link. This
				includes SPACES. If you have 15 characters you 
				WILL bust the design and the links will extend
				past borders or push them making it uneven.
				
				04/12/05:
				I have changed the width from 105 to 155px for all the
				menus. I have noticed a bug in IE. IE will allow only
				ONE element to have the same ID. I will create a new
				document from this one that will use classes instead
				of ID selectors. The new document will be called:
				wv_v7dropdown.css

				06/11/05 mj:
				Adding a style definiton for a named element 
				"#templateBannerOff" to accomodate docs created with
				template form which have the banner turned off (thus, no
				need for table cell background image).
				
				07/07/05 Tony Bianco:
				I have added some style declarations to accomodate for notes. This has made it possible to 
				make it so the last links "About Us" does not slide under the other links. 

				07/08/05 mj:
				changing full-path image links to relative links
				
				09/07/05 js:
				Changing #banner class background color to FF6600 .
				
*****************************************************************/

#nav, #nav ul { /* all lists */
	padding: 0;
	margin: 0;
	list-style: none;
	font-family: "Trebuchet MS", Arial, Tahoma, Verdana;
	font-size: 7pt;
	text-align:left;
	line-height: 1;
}
/* 3rd level drop down */
#nav li ul ul {
	/*margin: -23px 0 0 107px;*/
	margin: -2.5em 0 0 11em;
}

#nav a {
	display: block;
	width: 105px;
	height: 16px;
	background: url("res/v7_topNav_home.gif") 0 0 no-repeat;
	text-decoration: none;
	font-size: 7pt;
}
html>body #nav a {
	width: 105px;
}

#nav a:hover {
	background-position: -105px 0;
}


#nav a.homeActive {
	background: url("res/v7_topNav_home_active.gif") 0 0 no-repeat;
}
#nav a.homeActive:hover {
	background-position: 0 0;
}


/* Ways to Give */
#nav a.waysToGive {
	background: url("res/v7_topNav_waysToGive.gif") 0 0 no-repeat;
}
#nav a.waysToGive:hover {
	background-position: -105px 0;
}
#nav a.waysToGiveActive {
	background: url("res/v7_topNav_waysToGive_active.gif") 0 0 no-repeat;
}
#nav a.waysToGiveActive:hover {
	background-position: 0 0;
}

/* Sponsorship */
#nav a.sponsorship {
	background: url("res/v7_topNav_sponsorship.gif") 0 0 no-repeat;
}
#nav a.sponsorship:hover {
	background-position: -105px 0;
}
#nav a.sponsorshipActive {
	background: url("res/v7_topNav_sponsorship_active.gif") 0 0 no-repeat;
}
#nav a.sponsorshipActive:hover {
	background-position: 0 0;
}

/* Get Involved  */
#nav a.getInvolved {
	background: url("res/v7_topNav_getInvolved.gif") 0 0 no-repeat;
}
#nav a.getInvolved:hover {
	background-position: -105px 0;
}
#nav a.getInvolvedActive {
	background: url("res/v7_topNav_getInvolved_active.gif") 0 0 no-repeat;
}
#nav a.getInvolvedActive:hover {
	background-position: 0 0;
}

/* About Us */
#nav a.aboutUs {
	background: url("res/v7_topNav_aboutUs.gif") 0 0 no-repeat;
}
#nav a.aboutUs:hover {
	background-position: -105px 0;
}
#nav a.aboutUsActive {
	background: url("res/v7_topNav_aboutUs_active.gif") 0 0 no-repeat;
}
#nav a.aboutUsActive:hover {
	background-position: 0 0;
}

/* Learn */
#nav a.learn {
	background: url("res/v7_topNav_learn.gif") 0 0 no-repeat;
}
#nav a.learn:hover {
	background-position: -105px 0;
}
#nav a.learnActive {
	background: url("res/v7_topNav_learn_active.gif") 0 0 no-repeat;
}
#nav a.learnActive:hover {
	background-position: 0 0;
}

/********************************************************************************/

#nav li { /* all list items */
	float: left;
	width: 105px; /* width needed or else Opera goes nuts */
	position: relative; /*position needed for iframe positioning */
}

#nav iframe{
	position: absolute;
	left: 0;top: 0;
	z-index: 0;
	filter: progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=00);
}

/****************************************/
/* second-level lists */
#nav li ul{	
	position: absolute;
	background: #006699;
	width: 105px; /* using left instead of display to hide menus because display: none isn't read by screen readers */
	left: -999em;
	border: 2px solid #000; /* Hack Fixes */
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 105px;
	position: absolute;
}
/* Third level list */
#nav li:hover ul ul, #nav li.sfhover ul ul {
	left: -999em;
}

#nav li ul a {
	background-image: none;
	color: #fff;
	width: 105px;
	border-top: 1px solid #000;
	padding: 5px;
	font-weight: normal;
	voice-family: "\"}\"";
	voice-family: inherit;
	height: 100%;
	padding: 5px;
	width: 105px;
	line-height: 1.25em;
}
html>body #nav li ul a{
	width: 95px;
}

/* widths for Get Involved */
#nav #getInvovledWidth {
	width: 155px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 155px;
}
#nav #getInvovledWidth a {
	width: 155px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 145px;
}

#nav li ul a:hover {
	background-color: #ff6600;
}

/* This takes out the top border of the very first item. */
#nav li ul a.first {
	border-top: none;
	font-weight: normal;
}

/* lists nested under hovered list items */
#nav li:hover ul, #nav li.sfhover ul { 
	left: auto;
}

/* This class is for the empty <li> in between each set of links.
	we place that there so that it gives the little space inbetween 
	links.
*/
#nav li.doNotTouch {
	width: 1px;
	color: #fff;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 1px;
}

#nav li li ul#nowASponsor{
	top: 2.45em;
}


/* IE cannot understand :hover on anything OTHER than the <a> link.
	So we must include the class formating of .sfhover. This gets 
	created dynamically through the wv_dropdown.js javascript file.

aboutUsThirdLevel
*/
#nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul {
	left: auto;
}

#nav li li:hover ul.aboutUsThirdLevel, #nav li li.sfhover ul.aboutUsThirdLevel {
	left: -22.5em;
}

/***********************************************************************/
/* JUST FOR NOW WE ARE ADDING THIS, LATER ON WE WILL DELETE THESE LINE */
#logo{
	width: 191px;
}

#templateLogo {
	width: 191px;
}

#banner{
	background: transparent url('res/v7_header_banner.gif') no-repeat top right;
	background-color: #FF6600;
	padding-left: 80px;
/*	width: 588px;*/
	width: 508px;
}
#templateBanner{
	background: transparent url('res/v7_header_banner.gif') no-repeat top right; 
	padding-left: 80px;
	width: 508px;
}


#templateBannerOff{
	padding-left: 80px;
	width: 508px;
}

#channelLinks {
	margin-left: 248px;
	width: 531px;
	height: 30px;
}
html>body #channelLinks{
	margin-left: 249px;
	width: 529px;
}

#templateChannelLinks {
	margin-left: 58px;
	width: 531px;
	height: 30px;
}
html>body #templateChannelLinks{
	margin-left: 59px;
	width: 529px;
}


#aboutusChannelLinks {
	margin-left: 255px;
}
html>body #aboutusChannelLinks{
	margin-left: 262px;
}

/***********************************************************************/














