/*----------------------------------------------------
File:			ecalc.css
Description:	Stylesheet for the Food Service Help pages.
Contents:		1. Food Service Help Container
				2. Food Service Help Main Page Styles
				3. Energy Savings Calculator

1.	Food Service Help Container & Global Syles
------------------------------------------------------*/
h1 {
	font: normal 24px Arial, sans-serif;
	padding: 5px 0;
	text-align: left;
}

p {
	font: normal 12px Arial, sans-serif;
	padding: 5px 0;
	text-align: left;
}


#content_container {
	margin-left: 15px;
	width: 590px;
}

#ecalc_container {
	width: 590px;
	background-color: #000000;
	margin-top: 5px;
	margin-right: 0;
	margin-bottom: 10px;
	margin-left: 0;
}
#ecalc_container h1 {
	color: #F8D14E;
}


	/* Content Column */
	#ecalc_container td.ecalc_content {
	width: 462px;
	color: #FFFFFF;
}
#energycalc-main-para {
	color: #FFFFFF;
	width: 580px;
}


		#ecalc_container td.ecalc_content h1 { width: 462px; }

		#ecalc_container h2 { margin-bottom: -10px; }

		#ecalc_container h3 { 
			border-bottom: 1px dashed #bfbfbf; 
			color: #174801;
			font: bold 16px Arial, sans-serif;
			margin: 0 10px 3px 0;
			padding-bottom: 3px; 
		}

		#ecalc_container h5 {
			color: #000;
			font: bold 14px Arial, sans-serif;
			margin-bottom: 0px;
			padding: 5px 0 0 0;
			text-align: left;
		}

		#ecalc_container blockquote {
			background-color: #eee;
			color: #000;
			font: italic 12px Arial, sans-serif;
			margin: 5px 0 10px 10px;
			padding: 10px;
		}

		#ecalc_container td.ecalc_content ol { margin: 5px 0 5px 28px; padding: 0; }
			#ecalc_container ol li { margin: 0 0 10px 0; padding: 0; }

		#ecalc_container .guide_listing,
		#ecalc_container .prod_list,
		#ecalc_container .links_list { list-style: none; margin: 5px 0 5px 3px; padding: 0; }

			#ecalc_container .prod_list { float: left; margin: 10px 0 5px 25px; width: 500px; }

			#ecalc_container .guide_listing li,
			#ecalc_container .prod_list li,
			#ecalc_container .links_list li { 
				background: transparent url("../site_images/green_bullet.gif") no-repeat 0px 4px;
				color: #666;
				font: normal 11px Arial, sans-serif; 
				padding-left: 8px;
			}

				#ecalc_container .guide_listing li a,
				#ecalc_container .prod_list li a, 
				#ecalc_container .links_list li a { font-size: 12px; }

		#ecalc_container .prod_img { border: 1px solid #eee; float: left; margin: 5px; padding: 3px; }
		#ecalc_container .float_right { float: right; }
		#ecalc_container .stacked { clear: both; }

		/*----------------------------------------------------------------------------------- 
			Content Module
				- Used for small distinct content areas
				- For specific widths, specify a width class (i.e. cm_whole, cm_half, 
				  cm_third).
				- Specify the cm_noborder class if the content shouldn't have a border.
		-------------------------------------------------------------------------------------*/
		#ecalc_container .content_module {
			background-color: #fff;
			border: 1px solid #eee;
			display: block;
			float: left;
			margin: 0 5px 5px 0;
			padding: 0;
			text-align: left;
		}
			
			#ecalc_container .content_module p { color: #666; font-size: 11px; padding: 0 5px 5px 10px; }
				#ecalc_container .content_module p strong { color: #000; font-size: 12px; }
			#ecalc_container .content_module a { font-weight: bold; display: block; text-decoration: none; text-align: center; }
			#ecalc_container .content_module a img { border: none; display: block; }
			
			#ecalc_container .cm_noborder { border: none; }
			#ecalc_container .cm_whole { clear: both; width: 100%; }
			#ecalc_container .cm_half { float: left; width: 50%; }
			#ecalc_container .cm_third { width: 30%; }
		/* End Content Module */

		/*----------------------------------------------------------------------------------- 
			Step Container
				- Used for guides containing ordered components with large numbers
		-------------------------------------------------------------------------------------*/
		#ecalc_container .step_container { border-bottom: 1px dashed #bbb; float: left; margin: 5px 0; padding: 5px; width: 462px; }

			#ecalc_container .step_container .step_content  { float: left; margin: 0; padding-top: 5px; width: 427px; }

				#ecalc_container .step_container .step_content h4 { margin: 0; padding: 0; }
				#ecalc_container .step_container .step_content img { border: 1px solid #eee; margin: 15px 0 20px 0; padding: 2px; }

				#ecalc_container .step_container .step_content ul { margin: 0; padding: 5px 0 5px 25px; }
					.step_container .step_content ul li { margin: 0; padding: 0; }

			#ecalc_container .step_container .step_num {
				color: #ddd;
				float: left;
				font: normal 36px Arial, sans-serif;
				margin-right: 5px;
				padding: 0;
			}
		/* End Step Container */

		/*-----------------------------------------------------------------------------------
			Preview Container
				- Used for guides containing seperate modules with an image (preview) on the 
				  left side and text to the right.
		-------------------------------------------------------------------------------------*/
		#ecalc_container .preview_container {
			border: 1px solid #eee;
			clear: both;
			float: left;
			margin: 5px 0;
			padding: 5px;
			width: 452px;
		}

			#ecalc_container .preview_container .pc_content { display: block; float: left; width: 80%; }
			#ecalc_container .preview_container img { border: none; display: block; float: left; width: 20%; }
		/* End Preview Container */


	/* End Content Column */
		
	/* Category Links & Quick Links Column */
/*	#ecalc_container a.resource_cat {
		background: transparent url("../site_images/ecalc/ecalc_features.jpg") no-repeat;
		display: block;
		float: left;
		height: 50px;
		margin: 3px 0;
		position: relative;
		text-decoration: none;
		width: 150px;
	}
		
		#ecalc_container a.resource_cat#buying_guide			{ background-position: 0px 0px; margin-right: 6px; }
		#ecalc_container a.resource_cat#guides_suggestions		{ background-position: 0px -50px; margin-right: 6px; }
		#ecalc_container a.resource_cat#measuring_calculating	{ background-position: 0px -100px; margin-right: 6px; }
		#ecalc_container a.resource_cat#webstaurant_tv			{ background-position: 0px -150px; }
		#ecalc_container a.resource_cat#other_resources		{ background-position: 0px -200px; }

		#ecalc_container a.resource_cat:hover span { color: #B3DA56; cursor: pointer; }

		#ecalc_container a.resource_cat span {
			background: transparent url("../site_images/ecalc/resource_cat_arrow.gif") no-repeat right;
			color: #fff;
			font: bold 12px Arial, sans-serif;
			padding-right: 8px;
			position: absolute;
			right: 3px;
			bottom: 1px;
		}

	#ecalc_container a#videos_link {
		background: transparent url("../site_images/ecalc/ecalc_videoslink.jpg") no-repeat;
		cursor: pointer;
		display: block;
		float: right;
		height: 168px;
		margin: 5px 0;
		position: relative;
		text-decoration: none;
		width: 150px;
	}

		#ecalc_container a#videos_link span {
			color: #fff;
			font: bold 13px Arial, sans-serif;
			padding-right: 8px;
			position: absolute;
			left: 13px;
			bottom: 60px;
		}

	#ecalc_container td.ecalc_ql { width: 156px; }

		#ecalc_container td.ecalc_ql h1 { 
			border-bottom: 1px solid #bbb;
			clear: both;
			font: bold 12px Arial, sans-serif;
			margin: 0 0 0 10px;
			padding: 5px 0 0 0;
		}

		#ecalc_container td.ecalc_ql p { 
			font: normal 11px Arial, sans-serif;
			margin: 0 0 0 10px;
			padding: 5px 0 0 0;
		}

		#ecalc_container .ecalc_ql #ecalc_search { 
			background-color: #393939;
			display: block;
			float: right;
			height: 30px;
			margin-bottom: 2px;
			width: 150px; 
		}

		* html #ecalc_container .ecalc_ql #ecalc_search { margin-right: -4px; }

			#ecalc_container .ecalc_ql #ecalc_search form { 
				display: block;
				height: 24px;
				margin: 3px 0 0 3px;
				position: relative;
				width: 145px; 
			}

				#ecalc_container .ecalc_ql #ecalc_search form #text_input { 
					background: #fff url("../site_images/ecalc/ecalc_form_elements.gif") repeat-x 0px -22px;
					border: 1px solid #bbb;
					color: #454545;
					font: italic 11px Arial, sans-serif;
					height: 24px;
					left: 0;
					padding: 4px 3px 0 3px;
					position: absolute;
					width: 114px; 
				}

				#ecalc_container .ecalc_ql #ecalc_search form #submit_btn { 
					background: #fff url("../site_images/ecalc/ecalc_form_elements.gif") repeat-x 0px 2px;
					border: none;
					color: #000;
					font: bold 12px Arial, sans-serif;
					height: 24px;
					position: absolute;
					right: 1px;
					text-align: center;
					width: 26px;
				}

				* html #ecalc_container .ecalc_ql #ecalc_search form #submit_btn { margin-right: -1px; }

		#ecalc_container .ecalc_ql_links, 
		#ecalc_container #recipe_abbr { float: left; list-style: none; margin: 0 0 5px 12px; padding: 0; }

			#ecalc_container .ecalc_ql_links li,
			#ecalc_container #recipe_abbr li { 
				background: transparent url("../site_images/green_bullet.gif") no-repeat 0px 4px; 
				line-height: 14px; 
				padding-left: 8px; 
			}

				#ecalc_container .ecalc_ql_links li a { font: normal 11px Arial, sans-serif; }

				#ecalc_container #recipe_abbr li { font: bold 11px Arial, sans-serif; position: relative; width: 100%; }

					#ecalc_container #recipe_abbr li span { 
						color: #444;
						font-weight: normal;
						left: 48px;
						position: absolute;
						width: 85px;
					}

		#ecalc_container td.ecalc_ql a.resource_cat#buying_guide,
		#ecalc_container td.ecalc_ql a.resource_cat#guides_suggestions,
		#ecalc_container td.ecalc_ql a.resource_cat#measuring_calculating,
		#ecalc_container td.ecalc_ql a.resource_cat#webstaurant_tv,
		#ecalc_container td.ecalc_ql a.resource_cat#other_resources { margin-left: 10px; margin-right: 0; }   */
	/* End Category Links & Quick Links Column */


/*----------------------------------------------------
2. Food Service Help Main Page Styles
------------------------------------------------------*/
/*#ecalc_container a#recipe_resizer,
#ecalc_container a#ask_us {
	background: transparent url("../site_images/ecalc/ecalc_features.jpg") no-repeat;
	display: block;
	float: left;
	height: 80px;
	margin-top: 5px;
	position: relative;
	text-decoration: none;
	width: 306px;
}

	#ecalc_container a#recipe_resizer span,
	#ecalc_container a#ask_us span {
		color: #fff;
		cursor: pointer;
		font: bold 14px Arial, sans-serif;
		position: absolute;
		top: 0;
	}

	#ecalc_container a#recipe_resizer { background-position: 0px -250px; margin-right: 6px; }

	#ecalc_container a#ask_us { background-position: 0px -330px; }

#ecalc_container #featured,
#ecalc_container #monthly_tip {
	border: 1px solid #e6e6e6;
	display: block;
	float: left;
	height: 78px;
	margin-top: 5px;
	text-decoration: none;
	width: 304px;
}

	#ecalc_container #featured h1,
	#ecalc_container #monthly_tip h1 { color: #174801; font: bold 12px Arial, sans-serif; padding: 3px 3px 0 0; }

	#ecalc_container #featured p,
	#ecalc_container #monthly_tip p { padding: 3px 3px 3px 0; }

	#ecalc_container #featured a img,
	#ecalc_container #monthly_tip a img { border: none; }

	#ecalc_container #featured img,
	#ecalc_container #monthly_tip img { border: none; float: left; margin: 3px; }

	#ecalc_container #featured p.view_more{ 
		background: transparent url("../site_images/green_bullet.gif") no-repeat right;
		font: normal 12px Arial, sans-serif; 
		margin-right: 10px;
		padding-right: 8px;
		text-align: right;
	}

	#ecalc_container #featured  { margin-right: 6px; }

#ecalc_container .guide_cats {
	float: left;
	list-style: none;
	margin: 5px 3px 0 3px;
	padding: 0 0 10px 0;
	width: 150px;
}

	#ecalc_container .guide_cats.last_row { margin-right: 0; width: 144px; }

	#ecalc_container .guide_cats li { 
		background: transparent url("../site_images/green_bullet.gif") no-repeat 0px 3px; 
		line-height: 14px; 
		padding: 0 0 0 8px; 
	}

		#ecalc_container .guide_cats li a { font: normal 11px Arial, sans-serif; }  */

/*----------------------------------------------------
3. Energy Savings Calculator
------------------------------------------------------*/
#ecalc_container #energy_calc {
	border: 1px solid #ddd;
	height: 300px;
	margin: 5px 0;
	position: relative;
	width: 618px;
	background-color: transparent;
	background-image: url(../images/calculator_bgd_large.jpg);
	background-repeat: no-repeat;
	background-position: 0px 300px;
}

	#ecalc_container #energy_calc p {
		color: #252525;
		font: bold 14px Arial, sans-serif;
		height: 31px;
		line-height: 31px;
		margin: 0;
		padding: 0;
		position: relative;
	}

	#ecalc_container #energy_calc #ec_form { 
		left: 118px;
		position: absolute;
		top: 10px;
		width: 370px;
	}

	#ecalc_container #energy_calc .ec_formelement { 
		background: #fff url("../images/ecalc/ecalc_form_elements.gif") repeat-x 0px -22px;
		border: 1px solid #84A7D2;
		color: #454545;
		font: italic 14px Arial, sans-serif;
		height: 25px;
		padding: 2px 3px; 
	}

		#ecalc_container #energy_calc p#ec_resultholder {
	bottom: 0;
	color: #298602;
	left: 118px;
	line-height: 32px;
	margin: 5px 0;
	position: absolute;
	font-family: Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;
		}

		#ecalc_container #energy_calc p span#ec_result {
	color: #757575;
	line-height: 24px;
	margin-left: 5px;
	font-family: Arial, sans-serif;
	font-size: 20px;
	font-weight: bold;
		}

		#ecalc_container #energy_calc p .ec_formelement { left: 45%; position: absolute; }

	#ecalc_container #energy_calc #ec_formhr { 
		border-top: 2px dashed #a6a6a6;
		height: 3px;
		line-height: 3px;
		margin: 10px 0;
		width: 370px;
	}

	#ecalc_container #energy_calc table {
	padding: 0;
	margin-top: -15px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}

	#ecalc_container #energy_calc table tr th { 
		color: #252525;
		font: bold 14px Arial, sans-serif;
		height: 31px;
		line-height: 31px;
		padding-right: 10px;
		text-align: left;
	}

	#ecalc_container #energy_calc table tr td { 
		color: #252525;
		font: bold 14px Arial, sans-serif;
		height: 31px;
		line-height: 31px;
	}
	
