/* 	[ COPYRIGHT CONTEGRO  - Intelligent Website Content Management ]   */
/* 	[ http://www.contegro.com ]   */



/* -----[ eCard ]--------------------------------------------------------------------- */

/*
		Do not change class names. Alter attributes as required.
		Prefix with Continer ID to apply style to individual containers.
*/

/* === [ GLOBAL STYLE ] === */

.eCard {
	position: relative;
	clear: both;
	width: auto;
	height: auto;
	margin: 10px 0px;
	vertical-align: top;
	height: 1%;
}
	.eCard input[type=checkbox],
	.eCard input[type=radio] {
		border: none;
	}
.eCardPreview,
.eCardDisplay {
	position: relative;
	clear: both;
	height: 1%;
	padding: 20px 0px;
}

	/* === [ Step 1, Step 2, Step 3 Surrounding Div ] === */
	.eCardStep {
		position: relative;
		display: block;
		clear: both;
		height: 1%;
		padding: 0px 0px 50px 0px;
	}
	.eCardStep1,
	.eCardStep2,
	.eCardStep3 {
		position: relative;
		display: block;
		clear: both;
		height: 1%;
		padding: 0px 0px 10px 0px;
	}
	
		/* === [ Add Step 1, Step 2, Step 3 background image ] === */
		.eCardStep1 span,
		.eCardStep2 span,
		.eCardStep3 span {
			color: #666;
			text-transform: capitalize;
		}
.eCard .ImageSelector {
	position: relative;
	display: block;
	clear: both;
	height: 1%;
}
		/* === [ DIV ] === */
			.eCard .ImageSelector table {
				position: relative;
				text-align: center;
				display: block;
				margin: 0px;
				padding: 0px;
				width: 100%;
			}
		/* === [ TD ] === */
			.eCard .ImageSelector td {
				vertical-align: top;
				text-align: center;
			}
			.eCard .ImageSelector td input {
				display: none;
			}
			.eCard .ImageSelector td:hover {
			}
		/* === [ Surrounding DIV of Image ] === */
			.eCard img.ThumbBorder {
				vertical-align: top;
				padding: 4px 4px 4px 0;
			}
			.eCard img.ThumbBorder:hover {
				padding: 4px 4px 4px 0;
				cursor: hand;
			}
				/* === [ IMG ThumbBorderOn] === */
					.eCard img.ThumbBorderOn {
						padding: 0;
						border: 2px solid #969997;
						cursor: hand;
					}
		/* === [ Title ] === */
			.eCard .eCardTitle {
				font-size: 1.1em;
				margin: 3px 0px 6px 0px;
				font-weight: bold;
				text-transform: lowercase;
			}
			.eCard .eCardTitle {
				font-size: 1.1em;
				margin: 3px 0px 6px 0px;
				font-weight: bold;
				text-transform: lowercase;
			}

/* === [ Form ] === */

.eCardForm {
	position: relative;
	display: block;
	clear: both;
	height: 1%;
	padding: 5px 10px 10px 10px;
	background: #EFEFEF;
}

/* === [ Custom Message ] === */
	.eCardGreeting1 {
		position: relative;
		display: block;
		float: left;
		width: 45%;
		min-height: 150px;
		clear: none;
		margin: 0px 10px 0px 0px;
		padding: 10px;
		background: #EFEFEF;
	}
		.eCardGreeting1Title h4 {
			display: block;
			clear: none;
			padding: 2px 0 0 0;
			text-transform: capitalize;
		}
		.eCardGreeting1Title input[type=checkbox] {
			display: block;
			float: left;
			clear: none;
			margin: 0 6px 0 0;	
		}

/* === [ Pre-Written Message ] === */
	.eCardGreeting2 {
		position: relative;
		display: block;
		float: right;
		width: 45%;
		min-height: 150px;
		clear: none;
		margin: 0px 10px 0px 0px;
		padding: 10px;
		background: #EFEFEF;
	}
		.eCardGreeting2Title h3 {
			display: block;
			clear: none;
			padding: 2px 0 0 0;
		}
		.eCardGreeting2Title input[type=checkbox] {
			display: block;
			float: left;
			clear: none;
			margin: 0 6px 0 0;	
		}
		.eCardBoxHolderTop {
			display: block;
			clear: both;
		}
		.eCardGreeting2Message {
			display: block;
			clear: both;
			padding: 8px 10px;
			margin: 6px 0px 0px 0px;
			border: 1px solid #CCCCCC;
			background: #FFFFFF;
		}
		
		.ConfirmationView {
			font-size: 1.2em;	
		}

	/* === [ Field Grouping ] === */
		.eCardLabelGroup {
			float: left;
			width: 48%;
			clear: none;
			margin: 4px 10px 0px 0px;
		}

		/* === [ Checkbox | RadioButton Table ] === */
			.CustomCheckbox,
			.CustomRadio {
				font-size: 1.1em;
				margin: 0px 0 4px 0px;
				float: left;
			}
			.CustomCheckbox label,
			.CustomRadio label {
				margin: 0px 12px 0px 3px;
			}
			.CustomCheckbox input {
			}

/* === [ Border and Spacing ] === */
.eCard fieldset {
	position: relative;
	display: block;
	float: left;
	clear: both;
	border: none;
}

	/* === [ Legend Text ] === */
		.eCard fieldset legend {
			font-size: 1.3em;
			margin: 8px 0px 8px -8px;
			padding: 0px;
			font-weight: bold; 
		}
	
	/* === [ Lable Text ] === */
		.eCard label.EnquiryLabel {
			font-size: 1em;
			position: relative;
			display: block;
			float: left;
			clear: both;
			width: 130px;
			padding-right: 5px;
			margin-bottom: 2px;
		}
		
	/* === [ Form Fields ] === */
		.eCard input, 
		.eCard select {
			position: relative;
			font-family: sans-serif;
			font-size: 1.1em;
			margin: 0 6px 0 0;
			border: #999 1px solid;
		}
		.eCard textarea {
			position: relative;
			font-family: sans-serif;
			font-size: 1.1em;
			width: 250px;
			height: 50px;
			border: #999 1px solid;
		}

	/* === [ Error Text ] === */
		.EnquiryError {
			position: relative;
			display: block;
			float: left;
			clear: left;
			font-size: 0.9em;
			min-width: 250px;
		}

	/* === [ Button ] === */
		.eCard input.EnquiryButton {
			position: relative;
			display: block;
			float: right;
			clear: none;
			margin: 0px;
			padding: 10px 0px;
			width:auto;

		}
		.eCard input.ChangeButton{
			position: relative;
			display: block;
			float: left;
			clear: none;
			padding: 10px 0px;
			width:auto;
		}
		.eCard input.SendButton{
			display: block;
			float: right;
			clear: none;
			padding: 10px 0px;
			width:auto;
		}		
		
	/* === [ Required Marker ] === */
		.RequiredMarker {
			font-weight: bold;
			font-size: 1.3em;
			color: #CC0000;
		}	
		
/* === [ PAGING ] ============================== */

 /* Displays at the Top of list */
.eCard .OrderingTop,
.eCard .OrderingBottom {
	margin: 1em 0 ;
	font-size: 90%;
	height:auto;
	clear: both;
	line-height: 1.5em;
	margin-bottom: 30px;
}
 /* Numbers */
 	.eCard .OrderingTop a,
	.eCard .OrderingBottom a {
		padding: 0 0.3em;
		text-decoration: none;
		line-height: 1.5em;
	}
	.eCard .OrderingTop a:hover,
	.eCard .OrderingBottom a:hover {
		background-color: #CCCCCC;
		padding: 0 0.3em;
	}
 /* Selected Page */
	.eCard .SelectedPage {
		background: #CCCCCC;
		color: #FFFFFF;
		margin: 0 0.2em;
		padding: 0 0.3em;
		text-decoration: none;
	}
 /* Next and Back */
	.eCard .OrderingTop a.OrderingNext, 
	.eCard .OrderingTop a.OrderingBack,
	.eCard .OrderingBottom a.OrderingNext, 
	.eCard .OrderingBottom a.OrderingBack {
		border: 0;
		text-transform: uppercase;
		background-repeat: no-repeat;
	}
	.eCard .OrderingTop a.OrderingNext,
	.eCard .OrderingBottom a.OrderingNext {
		background-image: url(/Templates/RachaelHale/_images/icon_next.gif);
		background-position: right;
		padding: 0 1.2em 0 0;
	}
	.eCard .OrderingTop a.OrderingBack,
	.eCard .OrderingBottom a.OrderingBack {
		background-image: url(/Templates/RachaelHale/_images/icon_back.gif);
		background-position: left;
		padding: 0 0 0 1.2em;
	}
	.eCard .OrderingTop a.OrderingNext:hover, 
	.eCard .OrderingTop a.OrderingBack:hover,
	.eCard .OrderingBottom a.OrderingNext:hover, 
	.eCard .OrderingBottom a.OrderingBack:hover {
		background-color: transparent;
		border: 0;
	}