/* TURKEY FLAT - Order styles */
/*Name:Order Styles*/
/*Order:3*/

/* 	
	----------------------------------------------------------------------
	MAILING LIST SIGN UP:
	---------------------------------------------------------------------- 
*/

/* 	
	----------------------------------------------------------------------
	FORM HEADING
	Bit of specialised styling for the headings in the order page.
	---------------------------------------------------------------------- 
*/
.formLayout h2 {
	margin-bottom:0 !important;
}
.formLayout {
	float:left;
}

/* 	
	----------------------------------------------------------------------
	TABLE LAYOUT
	Table for listing the customers selection
	---------------------------------------------------------------------- 
*/
#wineSelection {
	width:535px;
}
#wineSelection th,
#wineSelection tr,
#wineSelection td {
	padding:0.6em 0.4em 0.4em 0.4em;
	border-bottom:1px solid #cccccc;
	vertical-align:top;
}
#wineSelection thead th {
	background-color:#E3DFB9;
}
#wineSelection tbody th {
	font-size:1.3em;
	color:#918D78;
}
/* INDIVIDUAL COLUMNS */
#wineSelection .pricePerDozen,
#wineSelection .pricePerBottle {
	width:6em;
}
#wineSelection td.quantity,
#wineSelection th.quantity {
	width:4em;
}
#wineSelection input.quantity {
	width:3em !important;
	margin-bottom:0;
	margin-top:-4px!important;
}
#wineSelection .total {
	text-align:right;
	width:4em;
}
/* WINE NAME */

#wineSelection td.name label{
	width:95%;
}
#wineSelection td.name strong {
	display:block;
	width:100%;
}
#wineSelection td.name span {
	color:#666666;
	font-size:0.85em;
}

/* 	
	----------------------------------------------------------------------
	TOTALS
	A definition list and the flash file for displaying the carton contents.
	---------------------------------------------------------------------- 
*/
#totals {
	border-top:1px solid #cccccc;
	padding:1em 0;
	float:left;
	width:535px !important;
}
#totals dl {
	float:left;
	margin-left:0.4em;
	float:left;
	width:40%;
}
#totals dt {
	float:left;
	width:120px;
	margin-right:10px;
	padding-right:10px;
	font-size:1.2em;
	font-style:italic;
	padding-bottom:0.2em;
}
#totals dd {
	padding:0.2em 0 0.5em 0;
	clear:right;
	height:1.2em;
	color:#A00E02;
}
/* THE TOTAL PRICE */
#totals dt.price {
	font-size:1.5em;
	padding-bottom:0;
}
#totals embed {
	width:220px;
}
/* CARTON */
#cartons {
	float:left;
}


/* 	
	----------------------------------------------------------------------
	CONTROLS
	Controls displayed at the bottom of the form
	---------------------------------------------------------------------- 
*/
#controls {
	border-top:1px solid #cccccc;
	float:left;
	width:535px !important;
	text-align:right;
	padding-top:1em;
}
#controls p {
	width:270px;
	float:left;
	text-align:left;
}
#controls button {
	margin-left:0.5em;
}

/* 	
	----------------------------------------------------------------------
	ORDER PROGRESS
	An unordered list for displaying the current step in the order
	process.
	---------------------------------------------------------------------- 
*/
 .orderProgress {
	list-style-type:none;
	margin:1em 0 1em 0;
	border-top:1px solid #cccccc;
	float:left;
	width:100%;
}
 .orderProgress li {
	display:inline;
}

.orderProgress li {
	display:inline;
}

 .orderProgress li.current {
	background-color: #990000;
	color: #FFFFFF;
}

 .orderProgress a {
	text-decoration:none;
	padding:0.3em 10px 0.3em 9px;
	float:left;
	background-color:#E3DFB9;
	width:114px;
	text-align:center;
}

/* 	
	----------------------------------------------------------------------
	CONTENT BOXES, FIELDSETS & LABELS
	The various parts that make up the basic components of our order
	forms.
	---------------------------------------------------------------------- 
*/


fieldset {
	border:0;
}
.contentBox {
	border:1px solid #999999;
	margin-bottom:1em;
	padding:1em 1em 1em 1em !important;
}
html>body .contentBox {
	padding:1em 1em 0 1em;
}
.contentBox legend {
	font-size:1.2em;
	border-bottom:1px solid #cccccc;
	float:left;
	width:100%;
	margin-bottom:0.8em;
	padding-bottom:0.2em;
}
/* labels and inputs */
label,
input,
textarea,
select,
input.radio {
	float:left;
	margin-bottom:1em;
	font-size:1em;
}
label {
	width:140px;
	clear:left;
}
/* Backgrounds for all the inputs */
input,
textarea {
	border:1px solid #ABAB58;
	padding:0.2em 0.4em;
	padding:0.2em;
	background-image:url(../images/input_bkg.gif);
	clear:right;
}
/* Widths for the inputs */
input.widest {
	width:200px;
	margin-right:100px;
}
input.wide {
	width:100px;
	margin-right:200px !important;
}
input.narrow {
	width:50px;
}
input.small {
	width:3em !important;
}
label.lonely {
	width: auto;
}
input.lonely {
	clear: right !important;
	margin-right: auto;
	border: 0;
}
label.inline {
	width:auto;
	padding:0.3em 0.8em 0 1.2em;
	clear:none;
}
textarea.full {
	width:498px;
	height:8em;
	font-size:1em;
	font-family: Verdana, Helvetica, Arial, sans-serif;
}
select.widest {
	margin-right:80px;
}
/* Something tricky with the strong tag */
.contentBox label strong {
	color:#666666;
}
input.radio {
	margin-right:40px;
	border:0!important;
	clear:none;
	background-image:none;
}
/* Tricky layout for payment options */
div.option {
	float:left;
	border:1px solid #cccccc;
	margin-bottom:1em;
	width:452px;
	padding:1em 5% 0.7em 5%;
}
div.option label.option {
	width:auto !important;
	padding:0 !important;
}
div.option input.radio {
	margin-right:200px;
}
.option p {
	clear:both;
}
/* Disabled chunks of the form */
.disabled input.widest,
.disabled input.wide,
.disabled input.narrow,
.disabled input.small,
.disabled select {
	color:#666666;
	background-color:#eeeeee !important;
	background-image:none !important;
}
.disabled label,
.disabled p {
	color:#666666;
}
/* Shipping Destination */
#shippingDestination label {
	clear:none !important;
	width:190px;
}

/* 	
	----------------------------------------------------------------------
	CONFIRMATION FORM
	Some particular styles for displaying the plain text details to be 
	confirmed at the end of an order.
	---------------------------------------------------------------------- 
*/
#confirmForm h3 {
	margin-bottom:0.5em;
	font-size:1.2em;
}
#confirmForm #wineSelection {
	width:505px !important;
}
#confirmForm #totals {
	width:505px !important;
}
#confirmForm .contentBox {
	width:505px;
	padding:1em 15px 0 15px;
	float:left;
}
#confirmForm .box {
	width:49%;
	float:left;
}
#confirmForm #listSub label {
	float:left !important;
	width:auto !important;
	clear:none !important;
}
#confirmForm .check {
	float:left !important;
	clear:none !important;
}
#confirmForm .orderUpdate {
	
}
#confirmForm #orderUpdate label {
	width:85% !important;
	padding-left:0.5em;
	clear:none;
}
#confirmForm #orderUpdate button {
	float:right;
}