﻿/*BELIEVE THIS IS BEING PHASED OUT, SHOULD BE USING NEW CODE STRUCTURE AND NAV-SB1.CSS, CONTACT JFOX WITH INQUIRIES*/

/*flyout-StuNichols.css adjusted for SwRI needs*/
/*select working comments removed 111511 - refer to warehouse for prior comments*/

/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssmenus.co.uk
Copyright (c) 2009- Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
#flyout,/*#flyout to be phased out and #flyout-01 to replace it in all cases*//*062512*/
#flyout-01,/*#flyout-01 to eventually replace #flyout in all cases*//*062512*/
#flyout-02,
#flyout-03,
#flyout-04 {
	float:left; 
	padding:0; 
	list-style:none; 
	position:relative; 
	width:220px;
	margin-bottom: 25px;/*this adds space between .SIDEBAR1-NAV1 and .UNIT or .SIDEBAR1-PIC below it*/
	}
#flyout ul,
#flyout-01 ul,
#flyout-02 ul,
#flyout-03 ul,
#flyout-04 ul {
	padding:0; 
	margin:0; 
	list-style:none; 
	width:220px;/*UL width = padding-right + padding-left + LI A width*//*see #flyout li a*/
	height:auto; 
	background: url('../../test/jfox/cssmenus/flyout_one/trans.gif'); /*graphic may be unused*/
	position:absolute; 
	left:-9999px; 
	top:0;
	z-index:20;/*jkf*//*z-index works on all browsers but IE to bring dropdown above other elements including IRD button and videos icon*/
	/*may be unnecessary at this time*/
	/*may need to troubleshoot for IE, see below*/
	}
#flyout table,
#flyout-01 table,
#flyout-02 table,
#flyout-03 table,
#flyout-04 table {
	border-collapse:collapse; 
	width:0; 
	height:0; 
	margin:-1px -10px;
	/*tried adding z-index:20;*//*z-index fixes above only for SwRI Pubs (which is not position: relative;)*/
	/*does not yet fix IRD button and videos icon (video icon is position: relative;) */
	/*may need to troubleshoot for IE*/
	}
/*-----------------------------------------------*/
#flyout li,
#flyout-01 li,
#flyout-02 li,
#flyout-03 li,
#flyout-04 li {
	float:left; 
	/*removed Stu's margin-bottom:1px; to closed up the extra space between the background color and the separator rule*/
	/*could have added border-bottom-color: #0071bc; border-bottom-style: dotted; border-bottom-width: 1px; to achieve the horizontal dotted rule between the buttons*/
	/*instead chose to add a class to individual li's to enable a variety of styles*/
	}
#flyout li a,
#flyout-01 li a,
#flyout-02 li a,
#flyout-03 li a,
#flyout-04 li a {
	display:block;
	float:left; 
	width:218px;/*adjust width by -2 to adjust for padding since actual width is width plus padding*/
	height:20px; 
	background:#fff; 
	line-height:20px; 
	font-family:arial, helvetica, sans-serif;
	font-size:11px; 
	text-decoration:none; 
	/*tried text-indent:2px; but lines that wrapped did not indent*/
	padding-left:2px;/*enables indent of second (and third) line when wrap therefore also need to adjust width by -2*/
	/*Begin adjustment for fly span*//*011712*/
	width:203px;
	padding-right:15px;
	/*End adjustment for fly span*/
	/*Begin new adjustment for fly span*//*012612*//*come back to this*/
	/*width:216px;
	padding-right:2px;*/
	/*Begin new adjustment for fly span*/
	}	
/*Begin addressing WRAP issue for first set of buttons*//*see also wrap styles below*/
#flyout li a.wrap,
#flyout-01 li a.wrap,
#flyout-02 li a.wrap,
#flyout-03 li a.wrap,
#flyout-04 li a.wrap {
	height: 33px;
	line-height: 15px;
	/*using padding-top: 1px; removed horizontal rules on second level flyout*/
}
/*End addressing WRAP issue for first set of buttons*/
#flyout li a.fly,
#flyout-01 li a.fly,
#flyout-02 li a.fly,
#flyout-03 li a.fly,
#flyout-04 li a.fly {/*COLOR BK OF MAIN BUTTONS - no result*/
	background:#fff url('/images/2011/arrow-rt-yellow.gif') no-repeat right center;
} /*white arrow not visible since background is white, may not need arrows*/
	/*graphic was originally url('../../test/jfox/cssmenus/flyout_one/right-arrow.gif')*/
/*-----------------------------------------------*/

#flyout li:hover,
#flyout-01 li:hover,
#flyout-02 li:hover,
#flyout-03 li:hover,
#flyout-04 li:hover {
	position:relative;
	}
#flyout li a:hover,
#flyout-01 li a:hover,
#flyout-02 li a:hover,
#flyout-03 li a:hover,
#flyout-04 li a:hover {
	position:relative; 
	background-color:#e60; /*question purpose*/
	color:#fff;
	}/*appears to be cancelled out by next style*/
#flyout li:hover > a,
#flyout-01 li:hover > a,
#flyout-02 li:hover > a,
#flyout-03 li:hover > a,
#flyout-04 li:hover > a {/*BK COLOR OF MAIN BUTTON AND COLOR OF TEXT WHEN HOVERED OVER*/
	background-color:#e3e3e3; 
	color:#000000;
	}
/*-----------------------------------------------*/
#flyout ul li a,
#flyout-01 ul li a,
#flyout-02 ul li a,
#flyout-03 ul li a,
#flyout-04 ul li a {/*BK COLOR OF FIRST LEVEL FLYOUT*/
	background:#cfcfcf;
	}
#flyout ul li a.fly,
#flyout-01 ul li a.fly,
#flyout-02 ul li a.fly,
#flyout-03 ul li a.fly,
#flyout-04 ul li a.fly {/*BK COLOR OF FIRST LEVEL FLYOUT WITH SECOND LEVEL FLYOUT*/
	background:#cfcfcf url('/images/2011/arrow-rt-white.gif') no-repeat right center;
}/*originally url('../../test/jfox/cssmenus/flyout_one/right-arrow.gif')*/
/*-----------------------------------------------*/
#flyout ul ul li a,
#flyout-01 ul ul li a,
#flyout-02 ul ul li a,
#flyout-03 ul ul li a,
#flyout-04 ul ul li a {/*BK COLOR OF SECOND LEVEL FLYOUT*/
	background:#e3e3e3;
	}
#flyout ul ul li a.fly,
#flyout-01 ul ul li a.fly,
#flyout-02 ul ul li a.fly,
#flyout-03 ul ul li a.fly,
#flyout-04 ul ul li a.fly {/*BK COLOR OF SECOND LEVEL FLYOUT WITH THIRD LEVEL FLYOUT*/
	background:#e3e3e3 url('/images/2011/arrow-rt-white.gif') no-repeat right center;/*was ../../test/jfox/cssmenus/flyout_one/right-arrow.gif*/
	}
#flyout ul ul ul li a,
#flyout-01 ul ul ul li a,
#flyout-02 ul ul ul li a,
#flyout-03 ul ul ul li a,
#flyout-04 ul ul ul li a {
	background:#f1f1f1;
	}
/*-----------------------------------------------*/
#flyout li a.current,
#flyout ul li a.current,
#flyout ul ul li a.current,
#flyout ul ul ul li a.current,
#flyout-01 li a.current,
#flyout-01 ul li a.current,
#flyout-01 ul ul li a.current,
#flyout-01 ul ul ul li a.current,
#flyout-02 li a.current,
#flyout-02 ul li a.current,
#flyout-02 ul ul li a.current,
#flyout-02 ul ul ul li a.current,
#flyout-03 li a.current,
#flyout-03 ul li a.current,
#flyout-03 ul ul li a.current,
#flyout-03 ul ul ul li a.current,
#flyout-04 li a.current,
#flyout-04 ul li a.current,
#flyout-04 ul ul li a.current,
#flyout-04 ul ul ul li a.current {/*NOT USING THIS OPTION AT THIS TIME *//*REMOVED CLASS FROM CODING*/
	background-color:#c40; 
	color:#fff;
	}
/*-----------------------------------------------*/
#flyout :hover ul,
#flyout :hover ul :hover ul,
#flyout :hover ul :hover ul :hover ul,
#flyout-01 :hover ul,
#flyout-01 :hover ul :hover ul,
#flyout-01 :hover ul :hover ul :hover ul,
#flyout-02 :hover ul,
#flyout-02 :hover ul :hover ul,
#flyout-02 :hover ul :hover ul :hover ul,
#flyout-03 :hover ul,
#flyout-03 :hover ul :hover ul,
#flyout-03 :hover ul :hover ul :hover ul,
#flyout-04 :hover ul,
#flyout-04 :hover ul :hover ul,
#flyout-04 :hover ul :hover ul :hover ul {/*LOCATION OF THE FLYOUT*//*IF FLYOUT LEFT IS DESIRED, USE NEGATIVE NUMBER*/
	left:210px;/*Stu's was left:120px; which was originally 10px less than width of #flyout*/
	}
/*-----------------------------------------------*/
#flyout :hover ul ul,
#flyout :hover ul :hover ul ul,
#flyout-01 :hover ul ul,
#flyout-01 :hover ul :hover ul ul,
#flyout-02 :hover ul ul,
#flyout-02 :hover ul :hover ul ul,
#flyout-03 :hover ul ul,
#flyout-03 :hover ul :hover ul ul,
#flyout-04 :hover ul ul,
#flyout-04 :hover ul :hover ul ul {
	left:-9999px;
	}
/*-----------------------------------------------*/	
#flyout ul li:hover > a,
#flyout-01 ul li:hover > a,
#flyout-02 ul li:hover > a,
#flyout-03 ul li:hover > a,
#flyout-04 ul li:hover > a {/*BK COLOR AND TEXT COLOR OF FIRST LEVEL FLYOUTS WHEN HOVERED OVER*/
	background-color:#ffd064; 
	color:#000000;
	}
#flyout ul ul li:hover > a,
#flyout-01 ul ul li:hover > a,
#flyout-02 ul ul li:hover > a,
#flyout-03 ul ul li:hover > a,
#flyout-04 ul ul li:hover > a {/*BK COLOR AND TEXT COLOR OF REMAINING LEVEL FLYOUTS WHEN HOVERED OVER*/
	background-color:#ffd064; 
	color:#000000;
	}
/*-----------------------------------------------*/
.wrap { /*jkf*//*may choose to create one for two lines of text and one for three lines of text *//*UNABLE TO GET HOVER COLOR TO MATCH, MAY NEED TO TS*/
	/*line-height: 80%;NOT WORKING! not making a difference yet line-height: 10pt; also tried line-height: 110%;*/
	height: 23pt; /*height from top to bottom rule*//*NOTE - if this is disabled, but other rules below for wrap remain, button drops depth only when hovered over*/
	line-height:15px; /*#flyout li a is line-height:20px; attempting to close up leading*/
}
/*-----------------------------------------------*/	
#flyout ul li:hover > a.wrap,
#flyout-01 ul li:hover > a.wrap,
#flyout-02 ul li:hover > a.wrap,
#flyout-03 ul li:hover > a.wrap,
#flyout-04 ul li:hover > a.wrap { /*jkf*//*BK COLOR AND TEXT COLOR OF FIRST LEVEL FLYOUTS WITH .wrap WHEN HOVERED OVER*/
	height: 23pt; /*height from top to bottom rule*/
	line-height:15px; /*#flyout li a is line-height:20px; attempting to close up leading*/
	}
#flyout ul ul li:hover > a.wrap,
#flyout-01 ul ul li:hover > a.wrap,
#flyout-02 ul ul li:hover > a.wrap,
#flyout-03 ul ul li:hover > a.wrap,
#flyout-04 ul ul li:hover > a.wrap {/*jkf*//*BK COLOR AND TEXT COLOR OF REMAINING LEVEL FLYOUTS WITH .wrap WHEN HOVERED OVER*/
	height: 23pt; /*height from top to bottom rule*/
	line-height:15px; /*#flyout li a is line-height:20px; attempting to close up leading*/
	}
/*-----------------------------------------------*/
#flyout ul li a.wrap,
#flyout-01 ul li a.wrap,
#flyout-02 ul li a.wrap,
#flyout-03 ul li a.wrap,
#flyout-04 ul li a.wrap { /*jkf*//*BK COLOR OF FIRST LEVEL FLYOUT*/
	height: 23pt; /*height from top to bottom rule*/
	line-height:15px; /*#flyout li a is line-height:20px; attempting to close up leading*/
	}
/* --------------------------------------------------------------- */
/* DOTTED AND SOLID RULES BETWEEN BUTTONS - JKF
/* --------------------------------------------------------------- */
.navsep-dot { /*horizontal dotted rule between each sidebar1 main button*/
	border-bottom-color: #0065cd;/*082412 plan to test, was border-bottom-color: #0071bc;*//*tried #0000ff; default link blue*//*#0065cd; is same as swri and mission stmt*/
	border-bottom-style: dotted;
	border-bottom-width: 1px;
}
.navsep-solid {/*horizontal white rule between each sidebar1 flyout button*/
	border-bottom-color: #ffffff;
	border-bottom-style: solid;
	border-bottom-width: 1px;
}
/*making next style more specific since other .LAST CLASSES exist within site*/
#flyout .last,
#flyout-01 .last,
#flyout-02 .last,
#flyout-03 .last,
#flyout-04 .last {/*horizontal white rule after last sidebar1 flyout button*//*same as .NAVSEP-SOLID which provides option to differ in the future*/
	border-bottom-color: #ffffff;
	border-bottom-style: solid;
	border-bottom-width: 1px;
}
/*Derrived from Begin addressing WRAP issue for first set of buttons*//*three lines of text*/
#flyout li a.wrap2,
#flyout-01 li a.wrap2,
#flyout-02 li a.wrap2,
#flyout-03 li a.wrap2,
#flyout-04 li a.wrap2 {/*created for D08HOME.HTM*/
	height: 46px; /*height from top to bottom rule*/
	line-height: 15px;
	/*using padding-top: 1px; removed horizontal rules on second level flyout*/
}
/* --------------------------------------------------------------- */
/* #SIDEBAR1-NAV STYLES - JKF
/* --------------------------------------------------------------- */
/*--------------------------------*/
/*Begin 070612 relocated #SIDEBAR1-NAV styles from #SIDEBAR.CSS*/

#sidebar1-nav1,/*070612 retain during phase out period*/
#sidebar1-nav-01,
#sidebar1-nav-02,
#sidebar1-nav-03,
#sidebar1-nav-04 {/*010612 could have been one class except too many pages built with ID*/
	/*added for sake of BEIJINGHOME-FLYOUT-JQUERY.HTM, may or may not need*/
	/*try here to fix z-index if fifth image added to center graphic on default*/
	position:relative;/*need in order for z-index to work*/
	z-index: 20;/*061312 was z-index: 10;*//*061312 ts issue with nav-caption*/
	/*space between .SIDEBAR1-NAV-01 and element below it achieved via #FLYOUT style*/
	}
#sidebar1 ul ul {/*distance between link and flyout*/
	padding-left: 10px;
	}
#sidebar1-nav1 a,/*070612 retain during phase out period*/ 
#sidebar1-nav1 a:hover,/*070612 retain during phase out period*/
#sidebar1-nav-01 a, 
#sidebar1-nav-01 a:hover,
#sidebar1-nav-02 a,
#sidebar1-nav-02 a:hover,
#sidebar1-nav-03 a,
#sidebar1-nav-03 a:hover,
#sidebar1-nav-04 a,
#sidebar1-nav-04 a:hover { 
	color: #000; 
	}
/*So far have not added additional IDs below*/	
/*Begin styles used in HR SIDEBAR1.ASP*//*Could be applicable to other pages if needed*/
#sidebar1-nav1 h2,/*need to retain during phase out period*/
#sidebar1-nav-01 h2 {
	border-bottom: 1px dotted #004de6;
	margin-bottom: 0px;
}
#sidebar1-nav1 h2 a,/*070612 need to retain during phase out period*/
#sidebar1-nav-01 h2 a {/*this keeps H2 red even when a link*//*see also beijing pubs-papers.htm page #MAINCONTENT H2*/
	color: #c1272d;	
}
#sidebar1-nav1 h2 a:hover,/*070612 need to retain during phase out period*/
#sidebar1-nav-01 h2 a:hover {
	color: #004de6;	
}
/*End styles used in HR SIDEBAR1.ASP*/
/*End 070612 relocated #SIDEBAR1-NAV styles from #SIDEBAR.CSS*/

