/* 	the following controls the sidebar "highlighting" effect when you're on a page.
		use the same class in the <div id="bodycopy"> and the <a> in the columnA.htm include */
		
.c01 .c01,
.c02 .c02,
.c03 .c03,
.c04 .c04,
.c05 .c05,
.c06 .c06,
.c07 .c07,
.c08 .c08,
.c09 .c09,
.c10 .c10,
.c11 .c11,
.c12 .c12,
.c13 .c13,
.c14 .c14,
.c15 .c15,
.c16 .c16,
.c17 .c17,
.c18 .c18,
.c19 .c19,
.c20 .c20,
.c21 .c21,
.c22 .c22,
.c23 .c23,
.c24 .c24,
.c25 .c25,
.c26 .c26,
.c27 .c27,
.c28 .c28,
.c29 .c29,
.c30 .c30,
.c31 .c31,

.d01 .d01,
.d02 .d02,
.d03 .d03,
.d04 .d04,
.d05 .d05,
.d06 .d06,
.d07 .d07,
.d08 .d08,
.d09 .d09,
.d10 .d10,
.d11 .d11,
.d12 .d12,
.d13 .d13,
.d14 .d14,
.d15 .d15,
.d16 .d16,
.d17 .d17,
.d18 .d18,
.d19 .d19,
.d20 .d20,
.d21 .d21,
.d22 .d22,
.d23 .d23,
.d24 .d24,
.d25 .d25,
.d26 .d26,
.d27 .d27,
.d28 .d28,
.d29 .d29,
.d30 .d30,
.d31 .d31,
.d32 .d32,
.d33 .d33,
.d34 .d34,
.d35 .d35,
.d36 .d36,
.d37 .d37,
.d38 .d38,
.d39 .d39,
.d40 .d40,
.d41 .d41,
.d42 .d42,
.d43 .d43,
.d44 .d44,
.d45 .d45,
.d46 .d46,
.d47 .d47,
.d48 .d48,
.d49 .d49,
.d50 .d50,

.n01 .n01,
.n02 .n02,
.n03 .n03,
.n04 .n04,
.n05 .n05,
.n06 .n06,
.n07 .n07,
.n08 .n08,
.n09 .n09,
.n10 .n10,
.n11 .n11,
.n12 .n12,
.n13 .n13,
.n14 .n14,
.n15 .n15  { 											background-color: #DDDDDD; } 




#columnA a { 											font-size: 1.1em; }


#mainColumn h1 { 										font-size: 2em;
															color: #606060;
															font-weight: bold;
															margin: 1.6em 0 12px 0;}

#mainColumn h1.secondH1 {							margin-top: 3em; }

#mainColumn td,
#mainColumn th,		
#mainColumn p {										font-size: 1.2em;
															line-height: 1.6em;
															color: #272727;
															margin-bottom: 12px; }

#mainColumn h2 { 										font-size: 1.6em;
															color: #606060;
															font-weight: bold;
															margin: 2em 0 12px 0;}

#mainColumn h1 + h2 {								margin-top: 1em; }

#mainColumn h2 + h3 {								margin-top: .4em; }

#mainColumn .bioPhoto + h2 {						margin-top: 1em; }

#mainColumn h3 { 										font-size: 1.4em;
															line-height: 1.4em;
															color: #606060;
															font-weight: bold;
															margin: 2em 0 1em 0;}

#mainColumn h4 { 										font-size: 1.2em;
															line-height: 1.4em;
															color: #606060;
															font-weight: bold;
															margin: 2em 0 12px 0;}



.h4Wrapper h4 {						margin-bottom: 0px!important; }


#mainColumn h5 { 										font-size: 1em;
															line-height: 1.2em;
															color: #606060;
															font-weight: bold;
															margin: 1.8em 0 .4em 0;}





















#columnB p { 											padding: 3px 20px 3px 20px; 
															font-size: 1.2em; 
															line-height: 1.4em; }

.dataTable {											border-collapse: collapse;
															border-spacing: none;
															margin: 10px 0 20px 0;
															border-bottom: 1px solid #AAAAAA;
															width: 100%; }

.dataTable caption {	 								font-size: 14px;
															line-height: 21px;
															color: #606060;
															font-weight: bold;
															margin-top: 20px;
															text-align: center; }

.dataTable td, .dataTable th {      			padding: 5px;
															text-align: left; }
															
.dataTable th {										font-weight: bold;
															vertical-align: bottom!important;}

.dataTable td {     									border-top: 1px solid #AAAAAA;
															vertical-align: top;}

.dataTable .oddRow {									background-color: #F0F0F0; }


.dataTable p {											font-size: 1em!important; }

.prevNextLinks {										margin-top: 6em; 
															text-align: right;}

.prevNextLinks a {									font-weight: normal!important; }

.prevNextLinks div {									margin-bottom: 2em; }

.prevnextBar {											padding: 0 10px;}




p.disclaimer {											font-size: 10px!important;
															line-height: 12px!important;
															margin-top: 4em; }

.insetBox {												width: 280px;
															margin: 20px 0 20px 20px;
															float: right;
															padding: 10px 10px 10px 10px;
															background-color: #F0F0F0;
															border: 1px solid #E0E0E0;
															-moz-border-radius: 9px;
															-webkit-border-radius: 9px;
															-khtml-border-radius: 9px;
															border-radius: 9px;
															overflow: hidden;
															clear: right!important; }
														
									
.insetBox h4 {											font-size: 14px;
															background-color: #606060;
															color: #FFF!important;
															font-weight: bold;
															margin: -10px -10px 5px -10px!important;
															padding: 5px 10px 5px 10px; }

.backtotop {											font-size: 10px;
															text-align: right;}
.backtotop a {											font-weight: normal!important; }


.section {												margin-top: 4em;
															padding-top: 1em;
															border-top: 1px solid #E0E0E0; }

.centerNote {											text-align: center;
															padding-top: 2em; }

.announcement {										margin: 2em 0;
															font-size: 18px!important;
															font-weight: bold; }

.underline { 											text-decoration:underline; }



h2.sublink {											font-size: 1.6em!important;
															margin: 2em 0 .2em 0!important; }

h3.sublink {											font-size: 1.4em!important;
															margin: 1.6em 0 .2em 0!important; }
															

.figure div img {										padding-bottom: .4em!important; }

.caption {												text-align: center; 
															margin: 1em 0 0 0;
															line-height: 1.4em;}


.newsArticles { list-style-type: none!important;
                                                padding: 0px!important;
                                                font-size: 1em!important;}

.newsArticles a,
.newsArticles strong{       font-size: 1.4em!important;}
.newsArticles li {			margin-bottom: 1em!important; }

/* page-specific styles */






/* show/hide right-hand column links in "Research Funding" section */


/* branch-specific styles begin here */

#viewSporesLinks {									margin: 5em 0 1em 0; }


#faqShortcuts p {										color: #999; 
															letter-spacing: .3em; }

#faqTerms dt {											font-size: 1.2em;
															line-height: 1.6em;
															color: #272727;
															font-weight: bold;
															margin: 2em 0 0 0; }
															
#ARRAinset {											float: right;
															margin: 0 0 20px 20px; }		
															
.flashContainer {										margin: 4em 0 0 0;
															width: 760px;
															text-align: center;}
															

.stateListLink {										text-align: right;
															margin: 4em 0 0 0; }


.organListLink{										text-align: right;
															margin: 1em 0 3em 0!important; }


h4.normalSpace {										margin-bottom: 0!important; }

.abstractBioPhoto {									margin: 0 15px 15px 0;
															float: left; }

.utsouthwesternInset {								margin: 2em auto 1em auto;  }

.i1 {														width: 175px; text-align: center; }
.i2 {														width: 370px;}
.i3 {														width: 555px;}
.i4 {														width: 740px;}
															
															
															
															

.utsouthwesternInset div {							margin: 0 5px 0 5px;
															float: left;
															width: 175px;
															text-align: center; }

.utsouthwesternInset div .photoCaption {		font-size: 1em!important; }

.utsouthwesternInset + h2 {						margin-top: 0px!important; }

/* The selector for the main SPOREs "Accordion" container. */
.sporesWrapper {		margin: 2em 0 4em 0;
							overflow: hidden;
							outline: none; }

/* This is the selector for the AccordionPanel container which houses the
 * panel tab and a panel content area. It doesn't render visually, but we
 * make sure that it has zero margin and padding.
*/
.sporesPanel {
	margin: 0px;
	padding: 0px;
}

/* This is the selector for the AccordionPanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open a specific panel.
 *
 * The name of the class ("AccordionPanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel tab container.
 *
 * NOTE:
 * This rule uses -moz-user-select and -khtml-user-select properties to prevent the
 * user from selecting the text in the AccordionPanelTab. These are proprietary browser
 * properties that only work in Mozilla based browsers (like FireFox) and KHTML based
 * browsers (like Safari), so they will not pass W3C validation. If you want your documents to
 * validate, and don't care if the user can select the text within an AccordionPanelTab,
 * you can safely remove those properties without affecting the functionality of the widget.
 */
.sporeType {		font-size: 1.2em;
						margin: 0 0 0 0;
						color: #FFF; 
						background-color: #1c5e86;
						padding: 10px 10px;
						cursor: pointer;
						border-left: 1px solid #1c5e86;
						border-right: 1px solid #1c5e86;
						border-bottom: 1px solid #377194;
						-moz-user-select: none;
						-khtml-user-select: none;
						font-weight: bold; }
									
									
.AccordionPanelTab {
	background-color: #CCCCCC;
	border-top: solid 1px black;
	border-bottom: solid 1px gray;
	margin: 0px;
	padding: 2px;
	cursor: pointer;
	-moz-user-select: none;
	-khtml-user-select: none;
}

/* This is the selector for a Panel's Content area. It's important to note that
 * you should never put any padding on the panel's content area if you plan to
 * use the Accordions panel animations. Placing a non-zero padding on the content
 * area can cause the accordion to abruptly grow in height while the panels animate.
 *
 * Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
 * Content container.
 *
 * The name of the class ("AccordionPanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel content container.
 */
.AccordionPanelContent {
	overflow: auto;
	margin: 0px;
	padding: 0px;
	background-color: #F0F0F0;
	border: 1px solid #CCC;
	border-top: 0px none;
}

.AccordionPanelContent p {	margin: 10px 10px 1em 10px; }
/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "AccordionPanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the Accordion.
 */
.AccordionPanelOpen .AccordionPanelTab {
	background-color: #EEEEEE;
}

/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.
 */
.AccordionPanelTabHover {
	color: #FFF;
	background-color: #377194;
}
.AccordionPanelOpen .AccordionPanelTabHover {
	color: #dae5ed;
	background-color: #466d87;	
}

/* This is an example of how to change the appearance of all the panel tabs when the
 * Accordion has focus. The "AccordionFocused" class is programatically added and removed
 * whenever the Accordion gains or loses keyboard focus.
 */
.AccordionFocused .AccordionPanelTab {
	background-color: #3399FF;
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open when the Accordion has focus.
 */
.AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
	background-color: #33CCFF;
}




/* styles for SPORE ADVANCES accordion effect */

.sporeAdvancesPanel {														margin: 0px;
																					padding: 0px; }


#sporeAdvancesList .sporeAdvancesTab {									font-size: 1.6em; 
																					font-weight: bold; 
																					color: #666;
																					margin: 0 0 .4em 0;
																					padding: .4em 0 0 0;
																					border-top: 1px solid #DDDDDD;}
																					
#sporeAdvancesList .AccordionPanelTabHover {							color: #272727;
																					text-decoration: underline;	
																					background-color: #FFF;
																					cursor: pointer; }

#sporeAdvancesTabFirst {													border-top: none!important; }
#sporeAdvancesList .saMinus {												display: none; }
#sporeAdvancesList .AccordionPanelOpen .saMinus { 					display: inline; }
#sporeAdvancesList .AccordionPanelOpen .saPlus {					display: none; }


.sporeAdvancesContent {														margin: 0!important;
																					padding: 1em 0 0 0!important;}

.sporeAdvancesContent h2 {													font-size: 1.6em!important; }
.sporeAdvancesContent h2:first-child {									margin: 0!important; }

.sporeAdvancesContent h3 {													margin: .6em 0 0 0!important;
																					font-size: 1.4em!important;}
.sporeAdvancesContent h3 + h3 {											margin: .2em 0 0 0!important;		}																			
.sporeAdvancesContent p + h3 {											margin: 2em 0 0 0!important; }

.sporeAdvancesContent h4 {													margin: .8em 0 .8em 0!important;
																					font-size: 1.2em!important;
																					color: #000!important; }




.stateShape {																	height: 250px;
																					float: left;
																					margin: 0 20px 100px 0; }
																					
																					
.totalSpores {																	font-size: 1.2em;
																					color: #666;
																					margin: 2em 0 0 0;}
																					
.SPOREcount {																	white-space: nowrap; }					


.flashContainer {																width: 100%; }


.SPORESbyLocationBig {														width: 760px;
																					height: 596px;
																					max-width: 100%;
																					max-height: 100%;}
																					
																					
.insetRight {											float: right; 
															margin: 0 0 15px 15px;}

.insetLeft {											float: left; 
															margin: 0 15px 15px 0;}									
															
															
.bodyImageContainer {										width: 100%;  }
.bodyImageContainer img {									max-width: 100%;}




img[usemap], map area {								outline: none; }		/* don't show a border when you click on an image map hotspot */



#bodyPartsContainer {	margin: 3em 0 0 0;														}

#bodyPartsImage img {	max-width: 100%;								}
															

#sblContainer {										position: relative; 
															width: 100%; }

#sblText {												position: absolute;
															z-index: 2;
															width: 100%;}

#sblImage {												width: 100%;
															}

#sblText img {											max-width: 100%; }
#sblImage img {										max-width: 100%;}


.upperCase {											text-transform: uppercase; }


.sporeInvestigators {								width: 100%;
															clear: both!important;
															overflow: hidden;}
															
.sporePhoto {											float: left;
															width: 150px;
															margin: 0 30px 0 0; }
															
.sporeName {											font-size: 1.2em;
															margin: 5px 0 0 0;
															text-align: center; }
															
															
															
															

.sporePIHeader {										margin-top: 2em!important; }






#distributionTable {										border-collapse: collapse;
																border-spacing: none;
																margin: 10px 0 20px 0;
																border-bottom: 1px solid #AAAAAA;
																width: inherit;
																width: 100%;}

#distributionTable caption {	 						font-size: 16px;
																line-height: 21px;
																color: #18539c;
																font-weight: bold;
																margin-top: 20px;
																text-align: center; }

#distributionTable td, #distributionTable th {	padding: 5px;
																font-size: 14px;
																text-align: center;}
															
#distributionTable th {									font-weight: bold;
																vertical-align: bottom!important;}

#distributionTable td {     							border-top: 1px solid #AAAAAA;
																vertical-align: top; }

#distributionTable td:first-child { 				text-align: left; }
#distributionTable th:first-child { 				text-align: left; }

#distributionTable .oddRow {							background-color: #F0F0F0; }