/* CSS Document styles for pages with RFQ or other forms that need to be bigger than the body text 
   including CONSUMABLES pages, which aren't forms but are too big for my dinky body */
/* Keep footer at bottom of window - the settings in THIS css work when there is LOTS of text in the document
   If there's not much text, then check out 'home_shortText.css'  */
   
@import url("searchform.css");    

/* ZERO MARGINS 
--------------------------------------------------------*/
html, body, p, img, h1, h2, h3, h4, ul, ol, li { margin: 0; padding: 0; border: 0;}
/* sets document size so footer can be stuck at bottom of window */
/* from http://www.sitepoint.com/forums/showpost.php?p=1239966&postcount=3 */
/* commented backslash hack \*/
html, body { height: 100%; }
/* end hack*/	
html, body { margin: 0; padding: 0; }
body { text-align: center; }
/* this defines the document, which holds all other divs */
#document { min-height: 100%; width: 100%; margin: auto; position: relative; text-align: left;} 	
* html #document { height: 100%;
	width: 100%;/* box model hack for ie5.+*/
	w\idth:100%; }
/* force scrollbars vertically; ie7 doesn't need this, ff does */
HTML {
   overflow-y: scroll;
   overflow: -moz-scrollbars-vertical;
}
 
/* LAYOUT
--------------------------------------------------------------------------- */
/* put images in, center layout */
body { text-align: center; min-width: 800px; background-color: #Ffffff;  
	font-family: Verdana, Arial, Helvetica, sans-serif;	
	}
/* unfortunately I've got a div that does nothing but put the shadow in */	
#shadow { background-image: url(../images/shadow.png);background-position: 50%;background-repeat: repeat-y; 
	}
/* holds everything; probably a duplicate of 'document' div */
#container { margin: 0 auto; 
	min-height: 800px;
	height: auto !important;
	height: 800px;
	width: 700px; text-align: left; background-color: #Ffffff;} 

/* HEADER 
--------------------------------------------------------------------------------- */
#header { padding: 20px 0 0 0; height: 50px; background-color: #Ffffff; } 
#header .strapline { font-family: Arial, Helvetica, sans-serif; font-size: 8pt; color: #999999; text-align: right; 
					 display: block;}	
#header .logo {	float: left; }


/* HEADER SEARCH FORM
------------------------------------------------------------- */
/*text for searchstring field*/
input.txt {color: #769c27; border: 1px solid #769c27; font-family: "Courier New", Courier, monospace; font-size: 8pt;
	padding: 0 0 2px 3px; width: 100px;}
 /*text for GO button*/
input.btn {color: #769c27;	font-size: 7pt; font-weight: bold;
	border-right: 1px solid #769c27; border-bottom: 1px solid #769c27; background-color: #afd865;
	padding: 0 5px 0 4px; width: 28px; margin-left: 5px;}
/*text for 'search'*/	
label.label {color: #666666; font-size: 9pt; padding-right: 5px;}

	
/* HEADER LINKS
---------------------------------------------------------- */	
#header a { text-decoration: none;}
#header a:link { color: #666666;}
#header a:visited { color: #999999;}
#header a:hover, #header a:focus { color: #afd865; outline: 0;}	


/* banana inner pages
-------------------------------------------------------------------------------*/
#banana { margin: 30px 0 25px 0; clear: both; overflow: hidden;	} 


/* BODY  right column  490 - 420 = 70
------------------------------------------------------------- */
#body {	width: 490px; float: right;	margin: 0 0 20px 0;	}
#body .heading { background-image: url(../images/background_heading.jpg); height: 33px;
	background-repeat: repeat-x; background-color: #769c27; color:#FFFFFF;
	font-family: Arial, Helvetica, sans-serif; font-size: 12pt; letter-spacing: 0.25em;
	padding: 8px 0 1px 1em;	margin-bottom: 12px;}
#body p { font-family: Verdana, Arial, Helvetica, sans-serif; color: #666666; font-size: 10pt; line-height: 1.5;
	margin-bottom: 12px; width: 420px; padding-left: 1em; }
#body ul { padding: 0 0 0 1em; margin: 0; list-style: none; font-size: 10pt; color: #666666;
	line-height: 14pt; width: 420px; margin-bottom: 12pt;	}
#body ul li { background: url(../images/bullet_green.gif) no-repeat 0 5pt; 
	padding-left: 1.5em; padding-bottom: 5px; }
#body ol { list-style-type: decimal; font-size: 10pt; color: #666666; line-height: 14pt;
	padding: 0 70px 0 1em; margin: 0 0 12pt 2em; }
#body ol li { padding-bottom: 10px; }
/* for last item in list, gives more space below line */
.li { margin:0 0 0.85em 0; } 

h1, h2, h3 { font-family: Arial, Helvetica, sans-serif; }
h1 { font-size: 1em; color:#333333;  margin-bottom: 0.75em; }
h2 { font-size: 0.9em; color: #666666; margin-bottom: 0.75em; }
h3 { font-size: 0.9em; color: #999999; margin-bottom: 0.75em; }


/* BODY & WIDEBODY & FOOTER LINKS 
----------------------------------------------------------- */
#body a, #footer a, #widebody a { text-decoration: none;}
#body a:link, #footer a:link, #widebody a:link { color: #769c27;}
#body a:visited, #footer a:visited, #widebody a:visited { color: #999999; border-bottom: 1px dashed #999999;}
#body a:hover, #footer a:hover, #widebody a:hover,
#body a:focus, #footer a:focus, #widebody a:focus { color: #afd865; border-bottom: 1px dashed #afd865; outline: 0;}	


/* MENU  -- on the RFQ page there is no left menu, so I removed the ul definitions
------------------------------------------------------------- */
#menu {	width: 185px; margin-right: 25px; float: left; }
#menu p { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt; }
#menu a { text-decoration: none; color: #666666; }
#menu p a:visited, #menu p a:hover { color: #d7ecb2;}


/* WIDEBODY -- div to hold forms. must be after the menu/body divs 
---------------------------------------------------------------------------- */
#widebody { clear: both; text-align: left; padding: 0}	
#widebody p {font-size:10pt; line-height: 1.5; margin-bottom: 12px;}



/* CONSUMABLES
---------------------------------------------------------------------- */

/*use for head name on consumables pages*/
.headtype {font-weight: bold; padding: 5px 0; border-top: 1px solid #e8d586; border-bottom: 1px solid #e8d586;}

/*put lines at top and bottom of table heading*/
td.line {border-top: 1px solid #e8d586; border-bottom: 1px solid #e8d586;}

/* line at top of h2 */
h2.line {border-top: 1px solid #e8d586;}

/*use for note at bottom of table*/
#content p.small {font-size: 0.85em;}

.white { color:#FFFFFF; }

.small { color: #999999; } /*dunno why, but cannot actually change the size! so changed color */

/* SPECIALS
--------------------------------------------------------------- */
.clearit { clear: both; width: 100%; }
.red {color: #FF0000;}
.center {text-align: center; }
/* SPACE at top */
.space5 { padding-top: 5px; }
.space10 { padding-top: 10px; }
.indent220 { padding-left: 220px; }  /* use in widebody div to move text over to (closely) match what is in the normal body div */

.bodytext { width: 490px; margin: 0 0 20px 210px; }
.bodytext p { margin-left: 1em; }


/* NO PRINT elements
-----------------------------------------------------------*/
/* I don't actually have a class defined. I just add 'noprint' to the class of an element that I don't want to print. Then in the print.css, .noprint is set to display:none, so those items don't print. */
.noprint { }

/* HIDE elements 
---------------------------------------------------------- */
/* for form's hidden field, to trap spambots. This hides element so user doesn't see it, but a spam bot would, and would put info in the field. In that case, the formmail script should throw it away */
.hide { display: none; }


/*FOOTER 
------------------------------------------------------------ */
#clearfooter { clear: both; width: 100%; }
#footer { width: 100%; position: absolute; border-bottom: solid 5px #afd865; padding-top:20px;	
	background-image: url(../images/shadow.png);background-position: 50%;background-repeat: repeat-y;
	}	
#footer p { font-family: Arial, Helvetica, sans-serif; font-size: 8pt; color: #666666; text-align: center; 
	padding: 0 0 5px 0;	}