/*********************************************************
Stylesheet by RLN Jan 2016
Incorporates more HTML5 features
Stylesheet used for 
		Cafe itself
		Cafe sub-pages based on CafeSub.dwt including...
			experts.html
			markets.html
			fieldcrops.html
			USDA.html
*********************************************************/

/* Next two classes pertain to articles & authors */
/* e.g., for the Harvest Crop Mgmt Web page */
.article dt {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}
	
.article dd { font-family: "Times New Roman", serif; 	
	font-size: 0.8em;
	font-style: italic;
   }

.author { font-family: "Times New Roman", serif; 	
	font-size: 0.9em;
	font-style: italic;
   }

.category { font-family: Arial, sans-serif; 	
	font-size: 10pt; 
	}

.citation {
	margin-left:.25in;
	text-indent:-.25in;
	font-size:90%;}
	
	/* Clears floats */
.clearboth { clear: both; }

/* Dailyspecial defines a maroon-shaded header used in 
   conjunction with a right sidebar container that holds 
	current CNN articles of interest */
.dailyspecial {font-family: Arial, sans-serif; 	
	font-weight: bold;
	text-align: center;
	width:13em;
	background: #990000;
	color: #FFF8DC;
	border-right-color: #FFF8DC;
	border-right-style: outset;
	border-right-width: 2px;
	border-top-color: #FFF8DC;
	border-top-style: outset;
	border-top-width: 2px;
   }

.darkred14pt {
	font-size: 1.4em;
	color: #DC143C;
}

.date { font-family:Verdana,sans-serif;
	font-size: 0.9em;
	color: #990000;
	font-weight: bold;
	}
	
.editorial {font-family:Verdana,sans-serif; 	
	font-size: 0.8em;
	color: #4E6B93;
	font-weight: bold;  
	}

/* These "event" classes used with left sidebar Events calendar */

.eventmonthyear {
	font-family: "Arial Black", sans-serif; 
	color: #990000	;
	}

.eventdate { 	
	font-weight: bold; 
	color: #990000	;
	}

.eventtitle { 	
	font-weight : bold;
	}
	
/* Following FAQ classes for mailbox.html */	
.faq {
	font-family: "Times New Roman", Times, serif;
	font-weight: bold; 
	color: Maroon;
	margin-left: 2em;
	margin-right: 2em;
}

.faq-answr {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	color: Navy;
	margin-left: 4em;
	margin-right: 4em;
}

/* header defines a bordered header */
.header {font-family: Arial, sans-serif; 	
	font-size: 14pt;
	font-weight: bold;
	color: #990000;
	border-right-color: Black;
	border-right-style: solid;
	border-right-width: 3px;
	border-top-color: Black;
	border-top-style: solid;
	border-top-width: 2px;
	}


/* Newsheader for "Current News & Info" header */

.newsheader {font-family: Arial, sans-serif; 	
	font-size: 2em;
	font-weight: bold;
	background: #010057;
	color: #FFF8DC;
	border-right-color: #FFF8DC;
	border-right-style: outset;
	border-right-width: 2px;
	border-top-color: #FFF8DC;
	border-top-style: outset;
	border-top-width: 2px;
	}

.imagepopuptip {
	color:Teal;
	font-size:0.7em;
}

.qualtrics {
	float: right;
	width: 250px;
	border: thin silver solid;
	margin: 1.0em;
	padding: 0.5em;
	font-size: 0.8em;
	color:#003399;
	}
/* Sectionheader defines a boxed light-green shaded area */
.sectionheader { background-color: #CCCC99;  
	border: thin solid Black;	
	font-size: 16pt;
	font-weight: bold;	
	}

.sidebartext {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
}

.sidebarlinks {font-family: Arial, Helvetica, sans-serif; 	
	font-size: 0.8em;
	}

.sidebarheader {font-family: Arial, sans-serif; 	
	font-weight: bold;
	background: #010057;
	color: #FFF8DC;
	border-right-color: #FFF8DC;
	border-right-style: outset;
	border-right-width: 2px;
	border-top-color: #FFF8DC;
	border-top-style: outset;
	border-top-width: 2px;
	}

/* Defines a blue-shaded header used in sidebar containers */
.sidebarheaderblue {
	font-weight: bold;
	width:13em;
	padding: 1px 1px 1px 3px;
	background: #010057;
	color: #FFF8DC;
	border-right-color: #FFF8DC;
	border-right-style: outset;
	border-right-width: 2px;
	border-top-color: #FFF8DC;
	border-top-style: outset;
	border-top-width: 2px;
	}

/* Defines a maroon-shaded header used in sidebar containers */
.sidebarheaderred {
	font-weight: bold;
	width:13em;
	padding: 1px 1px 1px 3px;
	background: #990000;
	color: #FFF8DC;
	border-right-color: #FFF8DC;
	border-right-style: outset;
	border-right-width: 2px;
	border-top-color: #FFF8DC;
	border-top-style: outset;
	border-top-width: 2px;
   }

.sidebartitle { 	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-weight : bold;
	}

/* Next two classes pertain to Web site titles & descriptions */
/* e.g., for the Other Crop Info Web page */
.sites dt {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	}

.sites dd {font-family: Arial, sans-serif; 	
	font-size: 10pt;
	color: #4E6B93;
	font-weight: bold;  
	}
	
.subHeader {
  color: white;
  background-color: black;
  font-size: 109%;
  text-align: center;
  margin: 0;
  padding: 0.5ex 0;
}

.subHeader a {
  color: white;
  background-color: black;
  text-decoration: none;
  font-weight: bold;
  margin: 0;
  padding: 0 1ex;
}

.subHeader a:hover {
  color: black;
  background-color: white;
}

/* Thumbnail image, left float */
.thumbnail {
	float: left;
	width: 265px;
	border: thin silver solid;
	margin: 1.0em;
	padding: 0.5em;
	font-size: 0.8em;
	color:#003399;
}

/* Thumbnail image, right float */
.thumbnailright {
	float: right;
	width: 265px;
	border: thin silver solid;
	margin: 1.0em;
	padding: 0.5em;
	font-size: 0.8em;
	color:#003399;
}

.TipsDisclaimers {
	font-family: "Times New Roman", Times, serif;
	font-size:18px;
	color: maroon;
	margin-left: 8%;  
	margin-right: 8%;
	} 
	
.title {  
	font-family: Verdana, sans-serif;
	font-weight: bold;
	}

.txt120pct {
	font-size:120%;
}

.txt80pct {
	font-size: 80%;
	}
	
.txt70pct {
	font-size: 70%;
	}
	
/*====== ELEMENT IDs ======*/

	/* Styles imported from Lightbox.css */
#lightbox
	{ position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; }
#lightbox img
	{ width: auto; height: auto;}
	
#lightbox a img
	{ border: none; }

#outerImageContainer
	{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }

#imageContainer
	{ padding: 10px; }

#loading
	{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }

#hoverNav
	{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }

#imageContainer>#hoverNav{ left: 0;}

#hoverNav a
	{ outline: none;}

#prevLink, #nextLink
	{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }

#prevLink 
	{ left: 0; float: left;}

#nextLink 
	{ right: 0; float: right;}

#prevLink:hover, #prevLink:visited:hover 
	{ background: url(file://///Mac/Home/Documents/Office/Web/agronomy/ext/corn/cafe/js/images/prevlabel.gif) no-repeat left 15%; }

#nextLink:hover, #nextLink:visited:hover 
	{ background: url(file://///Mac/Home/Documents/Office/Web/agronomy/ext/corn/cafe/js/images/nextlabel.gif) no-repeat right 15%; }

#imageDataContainer
	{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData
	{	padding:0 10px; color: #666; }

#imageData #imageDetails
	{ width: 70%; float: left; text-align: left; }	

#imageData #caption
	{ font-weight: bold;	}

#imageData #numberDisplay
	{ display: block; clear: left; padding-bottom: 1.0em;	}			

#imageData #bottomNavClose
	{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay
	{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
	/* End of styles imported from Lightbox.css*/
	

/* Used for displaying floating containers, variable width */
	#floatingcontainerleft
		{
		float: left;
		border: 1px solid #999;
		margin: 15px 15px 15px 15px;
		padding: 5px;
		color: #194081;
		
		}	
/* Used to bold 'dt' elements within 'floatingcontainerleft' divs */
	#floatingcontainerleft dt {
		font-weight: bold;
		}

/* Used for displaying floating containers, variable width */
	#floatingcontainerright
		{
		float: right;
		clear: right;
		width: 15em;
		border: 1px solid #999;
		margin: 15px 15px 15px 15px;
		padding: 5px;
		color: #194081;
		}	

/* Used for displaying floating images, variable width */
	#floatingimageleft
		{
		float: left;
		clear: left;
		border: 1px solid #999;
		margin: 15px 15px 15px 15px;
		padding: 5px;
		font-size: 0.8em;  
		color: #194081;
		}	

/* Used for displaying floating images, variable width */
	#floatingimageright
		{
		float: right;
		clear: right;
		border: 1px solid #999;
		margin: 15px 15px 15px 15px;
		padding: 5px;
		font-size: 0.8em;  
		color: #194081;
		}	

#googlesidebar {
	float:right;
	clear:right;
	width:200px;
	margin: 15px;
	padding: 10px;	
	}

#leftsidebar {
	float:left;
	clear:left;
	width:12em; 
	margin-top:15px;
	padding-left:5px;
	padding-right:5px;
	padding-top:10px;
	padding-bottom:10px;
		}

#rightsidebar {
	float:right;
	clear:right;
	background: #cccc99 url(file://///Mac/Home/Documents/Office/Web/agronomy/ext/corn/cafe/pix/gradienttan.png) repeat-x;
	width:15em;
	margin:15px;
	padding-top:10px;
	padding-left:7px;
	padding-right:7px;
	padding-bottom:10px;
	border: thin solid #99b2cc;
	border-style: outset outset outset outset;
	}

/* This media query targets small devices no wider than 640px. 
	One online source suggests such code needs to be placed at 
	the end of the stylesheet so that it overwrites previous rules. */
	
@media only screen and (max-device-width: 640px) {
	.nodisplay {
		display: none;
	}
}