/* OnePlan Pesticide Application Recordkeeping style sheet
 * Version for HTML 4.01 Transitional DOCTYPE,
 * 2 column layout done with CSS rather than tables
 * Started from 2007-04-20 OPMain3.css
 * Last revision: 2009-03-31
*/
/* COLOR TABLE
 * rgb(255,255,204)  	OP straw
 * rgb(247,232,128) 	OnePlan mustard (CMYK)
 * rgb(204,153,68)	OP pale orange
 * rgb(185,90,55) 	OP orange
 * rgb(152,15,13) 	OnePlan Red (CMYK)
 * rgb(102,0,0) 	dark red
 * rgb(102,102,0) 	#660 OP green
 * rgb(127,153,72) 	OP light green
 * rgb(153,204,153) 	#9C9 OP spring green
 */
body {
  font-family :  Arial, Verdana, Sans-Serif;
  	/* The body background provides the "ground" with all page
	 * content shown over container/banner/nav/footer colors. */
  color: black; background-color: white;
  margin: 0; padding: 0;
  font-size: 100%;
}
/* the id definitions provide for the overall page layout */
#container {
	color: black;
	background-color: rgb(204,153,68);	/* #C94 */
	margin: 0;	/* screen space at a premium for some of our forms */
	border: 1px solid rgb(152,15,13);
}
#banner {
  color: white;
  background-color: rgb(185,90,55);
  border-bottom: 1px solid rgb(102,0,0);
  padding: 1px 5px 0;
}
#nav {
  font-size: 0.8em;
  float: left;
  color: black;
  width: 120px;
  margin-left: 6px;
  padding-top: 1em;
  border: none;
}
#content {
  font-size: 0.8em;
  margin: 0 0 0 140px;	/* 3-col used 110px right */
  padding: 0 0 0 0.5em;
  border-bottom: 1px solid rgb(152,15,13);
  background-color: white;
  /* CSS hack to set minimum height.  IE6 treats "height" as "min-height" */
  height: 600px;
}
/*	CSS hack for minimum height, part 2:
	Other browsers recognize the child-selector and apply it as more
	specific. */
html>body #content {
	height: auto;
	min-height: 600px;
}
#nonav {	/* thin, "style only" LH column */
  float: left;
  width: 15px;
  border: none;
}
#nonav-content {	/* to go with above */
	font-size: 0.8em;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid rgb(152,15,13);
	background-color: white;
}
#footer {
  clear: both;
  color: rgb(152,15,13);
  background-color: rgb(255,255,204);
  padding: 1em;
  text-align: center;
  border-top: 1px solid rgb(215,24,0);
  font-size: 0.8em;
}

.logo { float:right }

/* floating navigation links, for pages that need max width */
/* put inside #content */
div.floatNav, div.floatRightNav {
	background-color: rgb(217,162,93);
	color: black;
	width: 120px;
	margin: 0;
	padding: 0.5ex 1em;
	border: 1px solid rgb(152,15,13);
	/* fix the undead hasLayout bug, exposed in IE7 */
	position:relative;
}
div.floatNav { float: left; }
div.floatRightNav { float: right; }

/* default elements and adjustments */
/* consider using em units... */
p {	margin: 10px 10px 15px 10px; }
p.cspace { margin: 10px 60px 25px; text-align:center}
.tight { margin-top: 0; margin-bottom: 0; }
.narrow { margin: 10px 60px 15px; }
.cntr { text-align: center }
/* Canonical CSS centering: equal margins. Firefox doesn't like it, though */
.cntr2 { margin-left: auto; margin-right: auto; }
/* border cells in a table (IE won't render row-wise, but 2nd way works) */
.bord, tr.bord td, .std td.bord { border-top: 4px solid rgb(152,15,13); }
/* ignores 0 width, so work around the damage */
.hideRtBorder, table.std .hideRtBorder { border-right: 1px solid white; }
.noBorder { border: none; }


/* general anchors */
#tilltemp { margin:8px; }
#content a, #content a:link,
#nonav-content a, #nonav-content a:link,
#tilltemp a, #tilltemp a:link {
	color: rgb(102,0,0);
}
#content a:active, #content a:visited,
#nonav-content a:active, #nonav-content a:visited,
#tilltemp a:active, #tilltemp a:visited {
	color: rgb(152,15,13);
}

/* basic HTML elements */
h1 {
	text-align: center;
	font-size: 1.2em;
	font-weight: bold;
}
h2, .nextStep {
	font-size: 1.1em;
	font-weight: bold;
	margin-left: 10px;
}
h2 a.EditLink {	/* edit link in the same line as h2 heading */
	font-size: 0.9em;
	font-weight: normal;
	padding-left: 3em;
}
h3 {
	font-size: 1.0em;
	font-weight: bold;
	margin-left: 10px;
}
h4 {
	font-size: 0.95em;
	color: rgb(102,0,0);
}
li {
	margin-bottom: 0.5em;
	margin-right: 0.5em;	/* added 2006-02-21 */
}
.TopCenterHeader {
	background-color: rgb(247,232,128);
	color: black;
	font-size : 1.0em;
	font-weight : bold;
	text-align: center;
	padding: 5px;
	/* left margin negates that in #content */
	margin: 0 0 0 -0.5em;
}
.TopHeader {
	background-color: rgb(185,90,55);
	color: white;
	font-size:  0.8em;
	font-weight : bold;
	margin: 2px 8px;
}
a.TopHeader:link, a.TopHeader:visited {
	background-color: rgb(185,90,55);
	color: white;
}
a.Saver:link, a.Saver:visited {
	background-color: rgb(185,90,55);
	color: white;
	font-size:  0.8em;
	font-weight: bold;
	float:right;
}
.TextHeading, .TextHeading a:link, .TextHeading a:visited {
	color : rgb(102,0,0);
	font-weight :  bold;
}
.LeftNav {
	color: rgb(102,0,0);
}
.LeftNavActive {
	color : white;
	font-weight : bold;
}
.LeftNavGray {
	color: rgb(149,47,47);
}
p.LeftNav {
	margin: 0 0 1.0em 0.5em;
	text-indent: -0.5em;
}
p.LeftNavNoIndent {
	margin: 0 0 1.0em 0;
	text-indent: 0;
}
p.LeftNavLogin {	/* for login box */
	margin: 0 0 1.0em 0.2em;
	text-indent: 0;
	font-size:0.9em;
}
.tbLogin {	/* keep login textboxes small */
	width: 115px;
}
p.LeftNav a:link, p.LeftNavLogin a:link,
p.LoginBox a:link {
	color: rgb(102,0,0)
}
p.LeftNav a:visited, p.LeftNavLogin a:visited,
p.LoginBox a:visited {
	color: rgb(152,15,13)
}
p.LoginBox {
	font-size: 0.9em;
	font-weight : bold;
	margin: 0;
	padding: 0;
}
div.LoginBox {
	border: 1px dotted rgb(152,15,13);
	padding: 3px;
	margin-bottom: 1ex;
}
.white { color: White; }

td.RightCol {
	background-color : rgb(204,153,68);
}
td.RightCol_Plan {
	background-color : #FFC;	
}
td.PlanDetail {
	font-size: 0.9em;
}

.TextBulletPoint {
	color : #660;
	font-weight : bold;
}

.outline {	/* for tables, typically */
	border: groove 1px black;
}

	/*************************************************************
	 * REVIEW font-size SPECS BELOW HERE IN LIGHT OF CASCADE, with
	 *	BODY at 100%, #content and #nav at 0.8em
	 *************************************************************/

/* used in <dl><dt><dd> list for plan summary, and in
   FarmsteadActionItemDetail.ascx */
.SectionHeading {
	color: rgb(102,0,0);	/* was black */
	font-size : 1.0em;
	font-weight : bold;
}
.SectionSubHeading {
	color : rgb(152,15,13);	/* was #660 */
	font-size : 0.9em;
	font-weight : bold;
}
dt.SectionSubHeading {
	margin-top: 1.5ex;	/* replaces non-schematic <br><br> */
}
.SectionText {
	color: black;
	font-size : 0.8em;
}
/* for hidden / expandable sections, and their controls */
.hide {
	display: none;
}
a.toggle, a.toggle img {
	text-decoration: none; border: none;
}
/* extra small font for calendar controls */
.smallCal {
	font-size: 0.75em;
}
.smallCalGrayed {
	font-size: 0.75em;
	color: #666;
	background-color: #DDD;
}
.devnote {
	color: Fuchsia;
	font-weight: bold;
	font-style: oblique;
}
.ErrorText {
	color : Red;
	font-weight: bold;
}
/* to go with editable datagrids */
.TableHeader, td.TableHeaderCell {
	background-color: rgb(152,15,13);
	color: white;
	text-align: center;
	font-weight: bold;
}
#content tr.TableHeader th a:link,
#content .TableHeader th a:visited,
#content tr.TableHeader th a,
#nonav-content tr.TableHeader th a:link,
#nonav-content .TableHeader th a:visited,
#nonav-content tr.TableHeader th a {
	color: white;
	text-decoration: underline;
}
	
/* need an override of the default <td> color, though */
tr.TableHeader td { color: white; }
.TableCellAlternating { background-color: rgb(255,255,204); }
.TableCellNormal { background-color: white; }
/* buttons force it larger, but we want Update/Cancel pair
   stacked as tight as can be */
.EditCmdColumn { line-height: 0.1em; }
.firstletter {	/* pseudo-illumination */
	float:left;
	color: white;
	background-color:rgb(152,15,13);
	font-size:2.2em;
	line-height:75%;
	padding: 2px;
	margin: 2px 6px 2px 2px;
	font-family: Times, Georgia, serif;
}
table.std {
	border-collapse: collapse;
	border: 1px solid black;
	margin-top: 2ex;
}
.floatLeft {
	 float: left;
	 clear: left;
	 margin-right: 0.5em;
}
table.std td {
	border: 1px solid black;
	padding: 2px 4px;
}
td.parm { width: 3em; }
td.fill, table.std td.fill {
	/* to be filled-in on a printed form */
	border: 2px solid rgb(152,15,13);
	padding: 0.5ex 1em;
}
td.rtb {
	text-align: right;
	font-weight: bold;
}

/* CSS-only extended title tooltips
 * Usage:
 * <a class="tipLink" href="whatever">Some link text
 * <span>...and a longer treatise that will display as a tooltip for it.</span></a>
 */
a.tipLink { 
	position: relative; 
	z-index:4; 
} 
/* IE needs a "background-color" of some sort */
a.tipLink:hover { z-index:5; background-color: transparent;} 
/* only display the <span> in an <a> on hover */
a.tipLink span { display: none; }
a.tipLink:hover span {
	display:block;
	position:absolute;
	top:1.5em; left:1em;
	/* could be trouble with, or without width...
	width:10em;	*/
	border:1px solid rgb(152,15,13);
	background-color: white;
	color: black;
	padding:4px;
	text-decoration:none;
}
/* coming from a table cell, width is set by that */
td a.tipLink:hover span {
	top: 2ex; left: -3em;
	width: 110%;
}
/* IE6 won't see this; Fx will. Want bigger because it's measured off the
	anchor text, but not so big that the "full cell" goes past window size */
html>body td a.tipLink:hover span {
	width: 130%;
}

/* Stepwise process styling, first employed on Rotations.aspx */
/* similar to h2 and TextHeading for a */
.enabled, .disabled {
	font-size: 0.9em;
	margin-left: 10px;	
}
.disabled {
	font-style: italic;
	color: Gray;	/*  rgb(102,102,102) or #666 ? */
}
.nextStep {
	font-size: 1.0em;
	font-weight: bold;
	margin-left: 10px;
}
.enabled a:link, .enabled a:visited {
	color : rgb(102,0,0);
}
.nextStep a:link, .nextStep a:visited {
	color : rgb(102,0,0);
	font-weight :  bold;
}

/* popover info bubbles */
div.popover {
	/* must set the display:none locally, else it won't work on first click */
	/* display:none; */
	position:absolute;
	z-index: 10;
	width: 300px;	/* height expands as needed */
	border:1px solid rgb(152,15,13);
	background-color: white;
	color: black;
	padding:4px;
}
div.closeX {	/* pseudo close control at upper right */
	float:right;
	color: gray;
	font-weight: bold;
	padding: 0 2px;
	margin: 0 0 0 3px;
	border:1px solid gray;
	cursor:hand;	/* for some old IE versions? */
	cursor:pointer;
}
a.popover {
	outline:none;
	text-decoration:underline;
	cursor:hand;
	cursor:pointer;
}
.errFloatAnchor {
	position:relative;
}
.errFloat {	/* block element to float next to errFloatAnchor */
	position:absolute;
	left: 120px;
	top: 50px;
	z-index: 10;
	width: 200px;	/* height expands as needed */
	border:2px dotted white;
	padding: 0.5ex 0.5em;
	color: white;
	background-color: rgb(152,15,13);
}

/* PAR form styling */
.emph { font-weight: bold; }
span.lft, label.lft {
	float: left;
	width: 8em;
	text-align: right;
	margin-right: 1em;
}
span.lft12, label.lft12 {
	float: left;
	width: 12em;
	text-align: right;
	margin-right: 1em;
}
label.suffix, span.suffix {	/* provide space for mult. elems. in line */
	margin-right: 2em;
}
#submitbutton {
	margin-top: 0.5ex;
	width: 6em;
}
.req {
	color: red;
	font-weight: bold;
}
hr.sep {
	color: rgb(152,15,13);
	margin: 3ex 25% 2ex;
}

/* Print-only specifications */
@media print {
    #nav, a.Saver, .noprint { display: none; }
	#content { margin-left: 1em; }
	#container { margin: 1px; }	/* avoids cropping of contents' borders */
	#container, #content { border: none; }
	#banner p.TopHeader { font-size: 1.5em; }
	p.TopCenterHeader { font-size: 2em; }
}
/* screen-only spec to stack elements that are float:left and inline,
	for side-by-side printing.  This goes on the 2nd, inline element */
@media screen {
	.clearLeftScreenOnly { clear: left; }
	.printOnly { display: none; }
}
/* proximity error-messaging with validators, etc. */
span.spotErrorAnchor { position: relative; }
span.spotError { display: block; }
span.spotError, div.spotError {
	position: absolute;
	top: 2ex; left: -10em;
	width: 15em; height: auto;
	border: 1px dotted red;
	background-color: white;
	color: red;
	z-index: 10;
}