/*
	Document   : dow_contact
	Created on : May 17, 2010, 4:03:08 PM
	Author     : ran
	Description:
		Purpose of the stylesheet follows.
*/

/*
	TODO customize this sample style
	Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/


/* Positions the contact form so it doesn't interfere with any other content, as well as a z-index above any other elements on the page */
#contactFormContainer
{
	position: absolute;
	width: 1000px;
	height: 0;
	z-index: 999;
}

/* Hides the whole contact form until needed */
#contactForm
{
	/*height: 330px;*/
	width: 559px;
	margin: 0 auto;
	background: #F0F1EC no-repeat 241px 11px;
	border: 1px solid #929191;
	display: none;
	padding: 30px 12px 40px 29px;
	text-align: left;
	color: #333;
	-moz-border-radius-bottomright:10px;
	-webkit-border-bottom-right-radius:10px;
	-moz-border-radius-bottomleft:10px;
	-webkit-border-bottom-left-radius:10px;
	-moz-box-shadow: 1px 1px 10px white;
}

#contactForm h3
{
	font-family: Arial;
	font-size: 24px;
	color: #3D8AB7;
}

/* Loading indicator that will appear while the ajax magic is happening */
#contactForm .loader
{
	display: none;
	background: url(../images/ajax-loader.gif) no-repeat center;
	height: 40px;
	width: 230px;
	margin-top: 220px;
	float: right;
}

#contactForm .error,
#contactForm .dowError/*The class "error" conflicts with an "error" class already defined in "messages.css", so I'm using "dowError" instead. But this should really be fixed in "messages.css" by making the class definition more specific to where it's being used. ( Written by Ran, 2010-06-03 ) */
{
	border: 2px solid;
	border-color: #f25003;
	background: #fff0f0;
}

#contactForm .errorDescription
{
	color: #D00;
	padding-left: 5px;
}

/* Some styling for the contact button */
#contactFormContainer .contactShow,
#contactFormContainer .contactHide
{
	height: 28px;
	width: 183px;
	margin: 0 auto;
	cursor: pointer;
	position: relative;
	left: -108px;
	-moz-box-shadow: 1px 1px 10px white;
	-moz-border-radius-bottomright:6px;
	-webkit-border-bottom-right-radius:6px;
	-moz-border-radius-bottomleft:6px;
	-webkit-border-bottom-left-radius:6px;
}
#contactFormContainer .contactShow
{
	background: url(../images/btn_get_weekly_deal_alerts_down_2.png);
}
#contactFormContainer .contactHide
{
	background: url(../images/btn_get_weekly_deal_alerts_close.png);
}

/* Hides the darkening layer for the Modal effect. The z-index is necessary for layering purposes, and be sure to keep the positioning/height/width the same */
#backgroundPopup
{
	display: none;
	position: fixed;
	_position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	background: #000;
	z-index: 998;
}

#contactForm input,
#contactForm textarea
{
	border: 2px solid #CCC;
	font-family: Verdana,Geneva,sans-serif;
	font-size: 16px;
	height: 28px;
	line-height: 28px;
	padding: 4px 4px 0;
	width: 243px;
	-moz-border-radius:4px;
	background-color:#e0f1fe;
	color:#3e69e5;
}
#contactForm textarea:focus,
#contactForm input:focus
{
	border: 2px solid #dcdbdb;
}
#contactForm input
{
	background-position: 0px -20px;
}
#contactForm textarea
{
	height: 114px;
}

#contactForm .submit
{
	border: none;
	background: url(../images/btn_sign_me_up.png);
	width: 78px;
	height: 21px;
	padding: 0;
	cursor: pointer;
}
#contactForm .submit:active
{
	/*TODO*/
}

#contactForm label
{
	font-family: Arial;
	font-size: 11px;
	text-transform: uppercase;
}

#contactForm p
{
	padding-bottom: 8px;
}

#contactForm .input_boxes
{
	width: 204px;
}