﻿/*Form Style Sheet*/

/*this form is going to be smaller, less colorful and have more preset options than before,
 *hopefully making it easier for the user, also will have validation script and html****/


#ShortFormArea
	{top: 132px;
	 left: 190px;
	 position: absolute;
	 width: 475px;
	}

#ProductFormArea
	{margin-top: 10px;
	 margin-left: 10px;	 
	 width: 475px;
	}

#FormArea	
	{top: 130px;
	 left: 180px;
	 position: absolute;
	 width: 700px;
	}



table.form	
	{border: 1px solid rgb(123, 171, 189);
	 font-family: Arial, Helvetica, sans-serif;
	 font-size: 8pt;
	 font-weight: normal;
	 background-color: rgb(255, 255, 255);
	}

table.form_request {	
	border: 1px solid rgb(220, 220, 220);
	margin: 5px;
	padding: 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	font-weight: normal;
	background-color: rgb(255, 255, 255);
	}

table.inset {
	margin-left: 70px;
	}

	
.custom {
	border: 1px outset rgb(123, 171, 189);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	font-weight: normal;
	background-color: rgb(201, 215, 221);   /*rgb(220, 230, 245);*/
	}
	
#custom {
	margin: 5px;
	}
	
#padTop {padding-top: 20px;}

.head
	{font-size: 10pt;
	 font-weight: bold;
	 line-height: 1.25em;
	 padding: 10px 0px;
	}

.checkboxes
	{line-height: 2em;
	 align: absbottom;
	}

td.Top
	{font-size: 12pt;
	 padding-top: 5px;
	 padding-left: 10px;
	}

td.img
	{background-image: url('../images/ButterflyFade.gif');
	 background-repeat: no-repeat;
	 padding-left: 20px;
	 color: rgb(80, 80, 80);
	 width: 185px;
	 border-style: dotted;
	 border-width: 2px;
	 border-color: rgb(123, 171, 189);
	}

img.pad
	{padding: 0px 0px 5px 20px;
	}


lable, label
	{font-family: Arial, sans-serif;
	 font-weight: normal;
	 font-size: 8pt;
	}


.smallTxt	
	{font-family: Arial, sans-serif;
	 font-weight: normal;
	 color: rgb(110, 110, 110);
	 font-size: 7.5pt;
	 padding-left: 15px;
	 padding-top: 10px;
	 padding-bottom: 10px;
	}

.medTxt	
	{font-family: Arial, sans-serif;
	 font-weight: normal;
	 font-size: 8pt;
	 line-height: 1.5em;	 
	}

.SubHeadingBlue	
	{font-family: Arial, sans-serif;
	 font-weight: bold;
	 color: rgb(32, 110, 172);
	 font-size: 8pt;
	 text-indent: 2em;
	 line-height: 1.25em;
	}

.SubHeadingGreen	
	{font-family: Arial, sans-serif;
	 font-weight: bold;
	 color: rgb(123, 171, 189);
	 font-size: 8pt;
	 text-indent: 2em;
	 line-height: 1.25em;
	}

select
	{font-size: 8pt;
	 border-style: inset;
	 border-color: rgb(123, 171, 189);
	 border-width: 1px;
	 background-color: white;
	}

select#Title, select#JobTitle, #countrySelect, #stateSelect, #countrySelect2
	{margin-left: 20px;
	}

#stateSelect2
	{margin-left: 3px;
	}

.formInputField {
	border: 1px inset rgb(123, 171, 189);
	background-color: white;
	margin-left: 20px;
	margin-right: 20px;
	}
		 
label
	{padding-left: 10px;
	}
	
.inset label {
	padding: 0;
	}

input.formInputField2 
		{border: 1px inset rgb(123, 171, 189);
		 background-color: white;
		 margin-left: 5px;
		 }

input.formInputField3
		{border: 1px inset rgb(123, 171, 189);
		 background-color: white;
		 }

input.formInputField4 {
	border: 1px inset rgb(123, 171, 189);
	background-color: white;
	margin-left: 20px;
	}


input.formInputButton {
	border: 2px outset rgb(123, 171, 189);
	background-color: rgb(32 ,110 ,172);
	color: white;
	font-size: 9pt;
	font-weight: bold;
	}

/*** this is for the js greying out of 'Next' for forms with multiple pages **/
input.formButtonGreyed {
	border: 2px solid rgb(190, 190, 190);
	background-color: rgb(220, 220, 220); 
	color: rgb(150, 150, 150);
	font-size: 9pt;
	font-weight: bold;
	}	
	
/*this does not work in IE*/
input.formInputButton:hover {
	border: 2px inset rgb(32 ,110 ,172);
	background-color: rgb(123, 171, 189);
	color: white;
	font-size: 9pt;
	font-weight: bold;
	cursor: pointer;
	}


/***********Side Information on Product Order Form****/


.sideInfo
	{border-style: double;
	 border-color: rgb(123, 171, 189);
	 margin-top: 10px;
	 margin-left: 3px;
	}

.fade
	{background-color: rgb(233, 242, 249);
	 width: 215px;
	}


/***********Collapsable Menues ***********************/




#menuShipping
		{display: none;}

#specialInstructions
		{display: none;}

.SubHeadingBlue	a
	{font-family: Arial, "san serif";
	 font-weight: bold;
	 color: rgb(32, 110, 172);
	 font-size: 8pt;
	 text-indent: 2em;
	 line-height: 1.25em;
	 text-decoration: underline;
	}

.SubHeadingBlue	a:hover
	{font-family: Arial, "san serif";
	 font-weight: bold;
	 color: rgb(123, 171, 189);
	 font-size: 8pt;
	 text-indent: 2em;
	 line-height: 1.25em;
	 text-decoration: underline;
	}

/********Product Reference Collapsable Menu************/


.menuHead
		{font-family: Arial, Helvetica, "san serif";
		  font-weight: bold;
		  font-size: 9pt;
		  color: rgb(32, 110, 172);
		  text-decoration: none;
		  padding-left: 15px;
		  padding-top: 2px;
		  padding-bottom: 2px;		  
		  line-height: 2em;
		  }

.menuTitle
		{font-family: Arial, "san serif";
		 font-weight: bold;
		 font-size: 11pt;
		 line-height: 1.5em;
		 color: rgb(32, 110, 172); 
		 text-align: center;
		 }

				  
td.menuBorder
		{border-style: solid;
		  border-color: white;
		  border-width: 1.5px;
		  }

#collapse
		{border-style: solid;
		  border-color: white; /*rgb(32, 110, 172);*/
		  border-width: 1px;
		  width: 215px;
		  background-color: rgb(225, 245, 213);
		  }
		  
.menuProducts
		{margin-left: 10px;
		  font-family: Arial, Helvetica, "san serif";
		  font-weight: normal;
		  font-size: 8pt;
		  color: rgb(32, 110, 172);
		  text-decoration: none;
		  }

td.NumberColumn
		{width: 55px;
		}
		
#menuBilling, #menuExpression, #menuCell, #menuSpecialty, #menuProteinRef, #menuEnzyme {
	display: none;
	}
		


/**********T-shirt Order Form STYLES***********/

.ShirtHeading
	{background: url('../images/BrickWallPattern.gif');
	 color: black;
	 font-size: 30pt;
	 font-weight: bold;
	 font-family: Impact, "Arial Black", Arial, "san serif";
	 padding-left: 30px;
	}

.ShirtSubHeading
	{font-size: 18pt;}


.TshirtForm
	{font-family: Arial, Helvetica, "san serif";
	 font-size: 8pt;
	 font-weight: normal;
	 color: black;
	}

.ShirtText	
	{font-family: Arial, "san serif";
	 font-weight: bold;
	 color: black;
	 font-size: 8pt;
	 line-height: 1.5em;
	 padding-left: 30px;
	 padding-top: 10px;
	 padding-bottom: 5px;
	}

.ShirtTextSmall	
	{font-family: Arial, "san serif";
	 font-weight: normal;
	 color: black;
	 font-size: 8pt;
	 line-height: 1.5em;
	 padding-left: 30px;
	 padding-top: 5px;
	}

.sideInfoShirt
	{border-style: solid;
	 border-color: rgb(50, 50, 50);
	 margin-top: 13px;
	 border-width: 1px;
	}

.ShirtImage
	{background: url('../images/ShirtDesign.gif') no-repeat black;
	}

table.ShirtChart
	{border: black 1pt solid;
	 font-family: Arial, Helvetica, "san serif";
	 font-size: 9pt;
	 font-weight: normal;
	 text-align: center;
	 }

table.ShirtChart td
	{border-left: black 1pt solid;
	 border-bottom: black 1pt solid;}

.TablePadLeft
	{padding-left: 25px;}
	
.confirmationHeading
	{font-family: Myriad, 'Myriad Pro', Arial, Helvetica, "san serif";
	 font-size: 20pt;
	 font-weight: bold;
	 color: rgb(32, 110, 172);
	}
	
/******************* styles for legal form **************/

#license {
	margin-top: 10px;
	width: 510px;
	border: 2px outset rgb(230, 230, 230); /*rgb(32, 99, 129) */
	background: rgb(201, 215, 221);
	text-align: center;
	}
	
#license table {
	text-align: left;
	margin: 10px;
	font-size: 9pt;
	}

	
td.accept_bar {
	background: rgb(211, 225, 231);
	padding: 5px 0;
	font-weight: bold;
	text-align: right;
	line-height: 1em;
	border: outset 1px rgb(250, 250, 250);
	}

td.accept_bar input {
	font-weight: bold;
	margin: 0 10px;
	}
	
#license iframe {
	width: 470px;
	height: 400px;
	background: rgb(255, 255, 255);
	margin-bottom: 10px;
	}
	
#print_button {
	float: left;
	margin-left: 5px;
	background-image: url('../images/printer_icon.gif');
	background-repeat: no-repeat;
	background-position: 2 2 ;
	padding-left: 27px;
	padding-top: 5px;
	padding-right: 7px;
	font-size: 8pt;
	font-weight: bold;
	height: 19px;
	line-height: 1em;
	}

/* ie hack for displaying print button at correct height */
* html  #print_button {height:24px;}

.accept_bar a {
	text-decoration: none;
	color: rgb(50, 50, 50);
	}	
	
.accept_bar a:link #print_button, .accept_bar a:visited #print_button	{
	background-color: rgb(230, 230, 250);
	border: 1px outset rgb(250, 250, 250);
	cursor: default;
}
	
.accept_bar a:hover #print_button {
	border: 1px inset rgb(250, 250, 250);
	background-color: rgb(220, 220, 240);
	cursor: pointer;
}	

.accept_bar a:active #print_button	{
	background-color: rgb(230, 230, 250);
	border: 1px outset rgb(250, 250, 250);
	cursor: default;
}
	

	
.pad_form_msg {
	padding: 20px 20px 0px 20px;
	font-size: 8pt;
	}
	
.form_divider {
	height: 1px;
	width: 430px;
	margin: 10px 20px;
	padding: 0;
	background: url('../images/blue_pix.gif') repeat-x; /*rgb(201, 215, 221);*/
	text-align: center;
	}
	
.error {
	height: 15px;
	background-image: url('../images/orange_exclaim.gif');
	background-repeat: no-repeat; 
	background-position: 5 0;
	background-color: rgb(255, 247, 192);
	color: rgb(237, 142, 7);
	margin-left: 20px;
	margin-right: 90px;
	padding-left: 20px;
	font-size: 8pt;
	font-weight: bold;
	}
	 