/* 
	Document:				am-op.css
	Creation date:			27 November 2007
	Created by:				Gemma Leigh
	This version:			*** Commented for development ***
	Deployment version:		Sitename/css/am-op.css
	Notes:					Account Management and Order Process styles
	-----------------------------------------------------------------
	Contents of this file:
	-----------------------------------------------------------------
	
	Generic styles
	Forms
	Tables
	
	Account Management
	- 01 Sign In
	- 02 Your Account
	- 03 Address Book
	- 04 Wish List
	- 05 Orders
	- 05 Order details
	
	Shopping bag
	Forgotten Password
	
	Order Process
	- 01 - Sign in
	- 02 - Delivery details
	- 03 - Multi delivery details
	- 04 - Review
	- 05 - Payment
	- 06 - Confirmation
	
	Sign in / Register
	- 01 Sign in/Register
	- 02 Account created
	
	Error messages
	
*/

/* =Generic styles
-----------------------------------------------------------------------------*/
.order-process,
.account-management,
.signin-register,
.email-me			{ padding-top: 24px;}

.link-inline		{ display: inline !important; position: relative; left: 15px;}
.link-newline		{ display: inline; margin-left: 10px; padding-top: 10px; }


/* =Form styles
-----------------------------------------------------------------------------*/
/* Account information - wider label container*/
.account-information .form-row 			{ width: 460px; float: left;}
.account-information .label-container	{ width: 180px;}

/* =Table styles
-----------------------------------------------------------------------------*/
/* shift items inside table cells to the left */
table th h3,
table td p 		{ padding: 0 10px 0 10px;}
table td select	{ margin-left: 10px;}

/* shift first header back */
table th.first h3{ padding:0 10px 0 0;}

/* Table text colours */
table h3		{ color: #313230;}
table ,p
table label		{ color: #313230;}
table .shade	{ background: #F5F5F5;}

/* Table cell widths */
.w-80			{ width: 80px;}
.w-100			{ width: 100px;}
.w-140			{ width: 140px;}
.w-160			{ width: 160px;}
.w-180			{ width: 180px;}
.w-200			{ width: 200px;}
.w-260			{ width: 260px;}
.w-280			{ width: 280px;}
.w-320			{ width: 320px;}
.w-520 			{ width: 520px;}
.w-620			{ width: 620px;}
.w-660			{ width: 660px;}
.w-760			{ width: 760px;}
.w-800			{ width: 800px;}
.w-960			{ width: 960px;}

/* =Item tables
-----------------------------------------------------------------------------*/
.item-table										{ width: 960px; float: left;}

.account-management .item-table					{ border-top: 1px solid #CCC; margin-top: 21px; margin-bottom: 56px; }
.account-management .order-details .item-table	{ margin: 0; }

.account-management .public-item-table 			{ margin-bottom: 20px !important;}
.account-management .shopping-item-table		{ margin-bottom: 0px !important;}

.item-table th,
.item-table td 									{ border-bottom: 1px solid #CCC;}

.item-row,
.item-table th									{ padding: 16px 0 16px 0;}
.item-table td 									{ padding: 16px 0 16px 0; vertical-align: top; color: #313230;}
table .shade a                                  { border-bottom:2px solid #F5F5F5;}

/* Used when there is a dropdown in the cell*/
.item-table tr.shipping-method td 				{ padding: 20px 0 19px 0; vertical-align: top; color: #313230;}

/* Right aligned text in table cells*/
.item-table tr .review-total h3,
.item-table tr .review-total p 					{ float: right; padding: 0 20px 0 0;}

/* Alter line height to allow for large text */
.item-table tr .review-total h3					{ line-height: 17px;}
.item-table tr .review-total h3 span.default-text	{ font-size:24px; }

/* Product images*/
.item-table td.item-image						{ text-align: center; padding: 10px 0 10px 0;}
/* Line up links*/
.item-table p a									{ display: inline; padding-top: 3px;}

/* Total cost row */
.item-table tr.total-row td 					{ vertical-align:top;/* padding: 5px 0 5px 0;*/ }
/* Total cost cell */
.item-table tr td.total 						{ border-bottom: 2px solid #FFF;/* padding: 15px 0 15px 0;*/}
.item-table tr.total-row td   					{ border-bottom: 2px solid #CCC; border-top: 2px solid #CCC;}
.item-table tr.total-row td.total				{ border-bottom: 2px solid #FFF; border-top: 2px solid #CCC;}
.item-table tr.promo-row td,
.item-table tr.grand-row td   					{ border-bottom: 2px solid #CCC;}
.item-table tr.promo-row td.total,
.item-table tr.grand-row td.total				{ border-bottom: 2px solid #CCC !important;}

/* simulate table cells */
.item-row 						{ color: #999;  float: left; width: 960px; clear: both;}
.item-row-top				 	{ padding: 25px 0 25px 0; }
.item-row-bott				 	{ padding: 16px 0 16px 0; }

.item-row .w-160,
.item-row .w-800				{ float: left;}

.item-row .checkbox-container	{ margin: 0; padding: 0;}
.item-row .w-800 .checkbox 		{ margin-right: 15px;}
.item-row .w-800 textarea 		{ clear: both; float: left; margin: 10px 0 0 0;}
.w-800 .width-input-160			{ margin-right: 20px;}

/* set text colours */
/*.shipping-wrapper h3			{ color: #999;}*/
.shipping-wrapper p,
.shipping-wrapper label 		{ color: #313230;}
.shipping-wrapper p.item-code 	{ font-size: 0.857em; color: #797979; padding-top: 2px;}
.shipping-wrapper td p a.edit	{ padding: 4px 0 0 0; display: block;}


/* =Account management
-----------------------------------------------------------------------------*/
/* Your Account (start page)*/
.account-management .am-titles		{ padding-top: 40px;}
.four-col-layout .four-col h2 		{ padding-left: 20px;}
.four-col-layout p 					{ margin-top: -4px; padding-right: 20px;}
.four-col-noborder h2,
.four-col-layout h2					{ font-size: 1.909em; line-height: 1.143em; text-transform: uppercase; margin-bottom: 12px; }
.four-col-noborder 					{ width: 240px; float: left;}
.border .four-col 					{ width: 219px; float: left; padding-left: 20px; border-left: 1px solid #ccc; min-height: 120px;} /* see ie.css */

/* Your Account details*/
/* Date of birth styles */
.account-management .width-select-50 { width: 50px; float: left; margin-right: 10px;}
.account-management .width-select-75 { width: 75px; float: left; }
.account-management .width-select-60 { width: 60px; }

/* Address Book */
.account-information .two-col-layout .second-col{ width: 320px; float: left; padding-left: 40px; border: none;}
.account-information .two-col-layout fieldset	{ float:none; clear: both;}

.account-management .notice		{ padding-top: 14px; }
.account-management .notice h4	{ padding-top: 2px; padding-bottom: 10px;}
.account-management .notice p	{ color: #999;}

/* Wish list*/
.account-management .item-table td.item-image	{ text-align: center; padding: 10px 0 10px 0;}
.account-management .item-table p.item-code 	{ font-size:0.786em; padding-top: 5px; color: #797979;}

/* Orders */
.account-management p.red,
.account-management p.amber,
.account-management p.green { padding-left: 26px; display: block;}

.account-management p.red	{ background: url(../images/bullet-red.gif) 8px 4px no-repeat;}
.account-management p.amber	{ background: url(../images/bullet-amber.gif) 8px 4px no-repeat;}
.account-management p.green	{ background: url(../images/bullet-green.gif) 8px 4px no-repeat;}

.account-management .item-table .status-date{ padding-left: 28px;}

/* Order Details */
/* Order status*/
.order-details p.red		{ padding-left: 18px; background: url(../images/bullet-red.gif) 0% 45% no-repeat;}
.order-details p.amber		{ padding-left: 18px; background: url(../images/bullet-amber.gif) 0% 45% no-repeat;}
.order-details p.green		{ padding-left: 18px; background: url(../images/bullet-green.gif) 0% 45% no-repeat;}

.order-details .print-order td 					{ border: none;}
.order-details .order-details-title 			{ padding: 2px 0 0 0;}
.order-details .order-details-title p.underline { padding: 12px 0 15px 18px;}
.order-details td.w-660 p 						{ margin-right: 20px;}

/* Shopping bag */
.shopping-item-table 							{ margin-top: 12px !important; }
.shopping-item-table th							{ padding: 16px 0 16px 0;}
.shopping-item-table tr.total-row td   			{ vertical-align: middle; border-top: none; padding: 17px 0 17px 0;} 
.shopping-item-table tr.total-row td.total		{ border-bottom: 2px solid #313230; border-top: 1px solid #CCC;}

.account-management .button-wrapper .button-wrapper-inner {width:640px; float:left; padding-right:20px}

/* Details under shopping bag*/
.shopping-info 				{ margin-top: 60px;}

.shopping-info .first-col 	{ width: 420px; padding: 0;}
.shopping-info .second-col 	{ width: 520px; float: left; border: none; } 

.shopping-info h4 			{ margin-bottom: 2px;}
.shopping-info h4.tight		{ margin-bottom: 4px;}
.shopping-info p			{ margin-right: 10px; color: #999;}
.shopping-info .wrapper		{ width: 100%; float: left; clear: both; margin-bottom: 10px;}

.shipping-method-box		{ width: 50%; float: left;}
.shipping-method-box p 		{ padding-top: 1px;}

.gift-options 				{ width:260px; float:left; padding:0; border-left: 1px solid #ccc; border-right: 1px solid #ccc; position: relative; z-index: 1; padding-left: 20px;}
.gift-options .hide-border	{ position: absolute; left: -2px; top: 0; color: #000; z-index: 3; height: 8px; width: 2px; background: #000 url(..images/black1x1.gif) top left no-repeat;}
.gift-options p 			{ margin-top: 16px;}

.payment-options			{ width:200px; float:left; margin-left: 20px;}
.payment-options .divider 	{ width: 100%; margin: 0 0 10px 0; padding-bottom: 20px;}

/* Forgotten password */
.account-management .forgotten-password 				{ margin-bottom: 150px;}
.account-management .forgotten-password .first-form-row { padding-top: 10px;}

/* =Order Process pages
-----------------------------------------------------------------------------*/
.button-wrapper-border	{ width: 960px; float: left; clear: both; padding-top: 20px; border-top: 1px solid #CCC; }
.button-wrapper			{ width: 960px; float: left; clear: both; padding-top: 20px;}

/* Sign in*/
.order-process .two-col-layout h2.primary	{ line-height: 1.4; padding-top: 1px; }

/* Delivery details */
.faux-three-col 				{ margin-bottom: 20px; }
.faux-three-col .second-col 	{ width: 318px; border-left: 1px solid #ccc; border-right: 1px solid #ccc; position: relative; z-index: 1; }
.faux-three-col .error-alert	{ margin-right: 0;}
/* Cover the border in the middle */
.faux-three-col .hide-border	{ position: absolute; left: -2px; top: 0; color: #000; z-index: 3; height: 5px; width: 325px; /*background: #000 url(..images/black1x1.gif) top left no-repeat;*/ }

.order-process .three-col-layout .first-col select					{ width: 100%; margin-top: 2px; margin-bottom: 18px;}

.order-process .first-col .list-links								{ width: 100%; float: left; clear: both; margin-bottom: 20px;}
.order-process .first-col .list-links li 							{ width: 100%; float: left; clear: both;} 
.order-process .first-col .list-links li.li-button 					{ margin-top: 2px; margin-bottom: 12px; }

.order-process .first-col .width-select-address 					{ width: 298px;}

.order-process .three-col-layout .second-col .checkbox-container,
.order-process .three-col-layout .third-col .checkbox-container		{ margin: 0;}
.order-process .three-col-layout .second-col .checkbox-container p 	{ padding-left: 30px;}

.checkbox-container textarea 		{ clear: both; float: left; margin: 10px 0 0 0;}

/* Multi delivery details */
.order-process .shipping-wrapper				{ width: 960px; float: left; margin-bottom: 45px;}
.order-process .shipping-wrapper-promo			{ width: 960px; float: left; margin-bottom: 0;}
.order-process .last							{ margin-bottom: 0;}

.shipping-wrapper .item-number h3.top			{ margin-top: 0; padding-top: 3px; padding-bottom: 23px !important;}

/* Order 1 text */
.shipping-wrapper .item-number					{ padding-top: 10px; border-bottom: 2px solid #FFF;}

.shipping-wrapper .item-number h3.primary		{ padding-bottom: 10px; color: #FFF; position: relative; top: -12px;}
.shipping-wrapper .item-number .default-text		{ margin-left: 2px;}

/* Review delivery */
.shipping-wrapper .item-row 					{ border-bottom: 1px solid #ccc;}
.shipping-wrapper .w-620 input					{ margin-right: 20px;}
.shipping-wrapper .button-wrapper-880 			{ width: 880px; float: left; clear: both; padding-top: 20px;}

/* Grand total figures */
.item-table tr.total-row td.total	{ border-bottom: 2px solid #313230 !important; padding: 16px 0 14px 0;}
.item-table tr.total-row td.total p { line-height: 24px;}

.item-table tr.grand-row td 		{ vertical-align: middle; }
.item-table tr.grand-row td h3		{ color: #FFF; position: relative; top: 2px;}
.item-table tr.grand-row td.total	{ font-size: 18px;}

/* Shipping methods*/
.order-process .four-col-layout p 	{ margin-top:0px;}

/* Payment */
.payment .form-row 					{ width: 520px; float: left;} 
.payment .two-col-layout .second-col,
.two-col-layout .notice				{ border: none !important;}
.payment .label-container			{ width: 200px; padding-bottom:19px; }
.payment .input-container 			{ width: 320px; padding-bottom:19px; }

.payment .input-container select.width-input-320{ width: 26.7em;/*width: 320px;*/ margin-bottom: 5px;}

.payment h3.primary 				{ margin-top: -2px; }
.payment p 							{ color: #999;}
/*.payment .form-row p 				{ color: #FFF;}*/
.payment .divider					{ margin: 2px 0 20px 0; padding-bottom: 5px; display: block;}
.payment .billing 					{ padding-top: 5px; padding-bottom: 10px;}

.payment .item-table				{ margin: 22px 0 20px 0; padding: 0;}

.payment .item-table tr.total-row td.total { padding: 15px 0 15px 0; }

.payment .item-table tr.total-row td{ vertical-align: middle;}
.payment .item-table h3.primary 	{ padding-top: 4px; color: #FFF;}
.payment .item-table td 			{ border-top-width: 1px !important; border-bottom-width: 1px !important; }
.payment .item-table td.total		{ border-bottom-width: 2px !important; font-size: 18px;}

.payment .form-row h4				{ padding-bottom: 24px; }
.payment .required-inline			{ display: block;text-transform:none; float:right; padding-top:1px}
.payment #ccid-number				{ position: relative; top: 0px; left: 10px;}
.payment .width-select-75 			{ width: 6.3em; float: left; margin-right: 10px;}

.payment .error-alert				{ margin: 6px 20px 18px 0; }

/* Confirmation pages */
.three-col-bottom 					{ margin-top: 60px;}
.three-col-bottom .second-col 		{ border-left: 1px solid #ccc;}

#main-content .confirmation 						{ margin-bottom: -5px;}
#main-content .confirmation h3.secondary			{ padding:0 0 12px 0; margin: 0;}

/* =Sign in
-----------------------------------------------------------------------------*/
.order-process .one-col-intro h2.primary,
.account-management .one-col-intro h2.primary	{ padding-bottom: 8px; margin: 0; }
.order-process .one-col-intro h3.secondary,
.account-management .one-col-intro h3.secondary	{ padding:0 0 15px 0; margin: 0;}

/* Account created */
.three-col-bottom 					{ margin-top: 60px;}
.three-col-bottom .second-col 		{ border-left: 1px solid #ccc;}


/* =Error messages
-----------------------------------------------------------------------------*/
/*Wider alert on wider form pages*/
.account-information .error-alert	{ width: 460px;}
