/* styles for the store page */

@define detailsdatalabel: gradient( linear, 0% 0%, 0% 100%, from( #f2f2f2ef ), to( #cbcbcbce ) );
@define detailsdatalabelfocus: gradient( linear, 0% 0%, 0% 100%, from( #f2f2f2ff ), to( #cbcbcbde ) );
@define warningnotecolor: #d0a11c;
@define warningnotecolor2: #a77d05;
 
//
// Animations
//
@keyframes 'links-and-more-button-focus'
{
	from
	{
		background-color: gradient( linear, -15% 0%, 100% 0%, from( #fdfdfdee ), to( #adafafe0 ) ); 
	}

	50%
	{
		background-color: gradient( linear, -15% 0%, 100% 0%, from( #fdfdfdff ), to( #bdbfbfff ) ); 
	}

	to
	{
		background-color: gradient( linear, -15% 0%, 100% 0%, from( #fdfdfdee ), to( #adafafe0 ) ); 
	}
}


//
// App section button styles
//
CheckoutGiftRecipientFriend,
CheckoutAddFundsButton,
Button
{
	width: 100%;
	padding: 8px 7px 8px 7px;
	margin: 0px 0px 4px 0px;

	box-shadow: none;
	color: detailsdatalabelfocus;
	background-color: transparent_module;

	transition-duration: 0.23s;
	transition-property: border, background-color, color, box-shadow, transform;
	transition-timing-function: bigpicture-ease-in-out;
}

CheckoutAddFundsButton Label,
Button Label
{
	width: 100%;

	font-family: platformfont;
	font-size: 28px;
	margin-left: 5px;
	transform: translatex(0px);
	color: detailsdatalabelfocus;
	transition-property: transform, color;
	transition-duration: 0.2s;
	transition-timing-function: ease-in;
}

CheckoutAddFundsButton:focus Label, Button:focus Label
{
	color: #ffffff;
	transform: translatex(7px);
}

Button:disabled
{
	opacity: 0.5;
}

Button:disabled Label
{
	color: #777777ff;
}

CartLineItem:hover, CheckoutAddFundsButton:hover, Button:hover
{
	transition-duration: 0.23s !immediate;
	box-shadow: #eeeeee00 -3px -3px 6px 6px;
}

CheckoutAddFundsButton:hover Label, Button:hover Label
{
	transform: translatex(0px);
}

CheckoutGiftRecipientFriend:focus,
CheckoutAddFundsButton:focus,
Button:focus
{
	transition-duration: 0.23s;

	color: #082846FF;
	background-color: gradient( linear, 0% 0%, 100% 100%, from( #66c0f4ff ), to( #b6e1faff ) );

	animation-name: button-focus;
	animation-duration: longduration;
	animation-delay: shortduration;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

.AdvanceCheckout
{
	background-color: store_transparent_module;
	opacity: 0.5;
}

.FieldsValidated .AdvanceCheckout
{
	opacity: 1.0;
}

CartLineItem:descendantfocus #FinalPrice
{
	color: applabelselectedsolid;
}


//
// Validation styles
//
TextEntry.FailedValidation,
DropDown.FailedValidation,
ToggleButton.FailedValidation .TickBox
{
	background-color: error_bgcolor;
	color: #3c3c3cff;
}

TextEntry.FailedValidation:focus,
DropDown.FailedValidation:focus,
ToggleButton.FailedValidation:focus .TickBox
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #dbdcdd ), to( #fdfdfd ) );
}
ToggleButton.FailedValidation .TickBox:selected
{
	background-color: #ccccccff;
}

DropDown.FailedValidation
{
		background-image: url( "file://{images}/store/Icon_DropDownArrowFocus.png" );
		background-repeat: no-repeat;
}

//
// Controller
//
CheckoutController
{
	width: 100%;
	height: 100%;

	transform: translate3d( 0px, 1280px, 100px );
	opacity: 0.0;

	transition-property: transform, opacity;
	transition-duration: 0.3s;
	transition-timing-function: bigpicture-ease-in-out;
	transition-delay: 0s;
}

CheckoutController.Visible
{
	transform: translate3d( 0px, 0px, 0px );
	opacity: 1.0;
}

#Steps
{
	width: 100%;
	height: 100%;
}

#Status
{
	flow-children: down;
	width: 100%;
	height: 1010px;
	vertical-align: bottom;
	background-color: bgcolor;
	opacity: 0.0;

	transition-property: opacity;
	transition-duration: 0.4s;
	transition-timing-function: bigpicture-ease-in-out;
}

#Status.Waiting
{
	opacity: 0.6;
}
#Status.Error
{
	opacity: 1;
	background-color: #00000033;
}

.CartThrobber
{
	horizontal-align: center;
	opacity: 0.0;
	visibility: collapse;
	transition-property: opacity;
	transition-duration: 0.4s;
	transition-timing-function: bigpicture-ease-in-out;
}

#Status.Waiting .CartThrobber
{
	opacity: 1.0;
	visibility: visible;
}

#StatusText
{
	font-size: 32px;
	color: white;
	width: 1000px;
	text-align: center;
}
#StatusText a
{
	color: white;
}

.CenteringPanel
{
	align: center center;
	flow-children: down;
}
#Status.Error .CenteringPanel
{
	background-color: nontransparent_module;
	padding: 30px;
}


//
// Common Checkout Styles
//
.HorizontalRule
{
	height: 3px;
	width: 100%;
	margin: 10px 22px 10px;

	background-color: rule_color;
}

.VerticalRule
{
	height: 100%;
	width: 3px;
	height: 500px;
	margin-left: 0px;
	margin-right: 0px;

	background-color: gradient( linear, 0% 0%, 0% 100%, from( #21475700 ), color-stop( 0.35, #456673d0 ), color-stop( 0.85, #43626fd0 ), to( #21475700 ) );
}

.CheckoutTitleRow
{
	width: 100%;
	padding: 10px 140px 10px 70px;
	flow-children: right;
}

RemoteContent ShoppingCart .CheckoutTitleRow
{
	visibility: collapse;
}

#CheckoutWalletSection
{
	flow-children: right;
	horizontal-align: right;
	vertical-align: bottom;
}

.CheckoutWalletDescription
{
	color: #86be3e;
	font-size: 34px;
	line-height: 50px;
	margin-right: 8px;
}

#WalletBalance
{
	color: checkout_title_bg;
	font-size: 34px;
	line-height: 50px;
	font-weight: bold;
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #78ab38 ), to( #5e852b ) );
	border-radius: 8px;
	padding: 0px 4px;
}

.CheckoutHeader
{
	width: 990px;
}

.CheckoutTitle
{
	font-size: 48px;
	line-height: 70px;
	color: brightblue;
	white-space: nowrap;
	width: 990px;
	font-weight: light;
}

.CheckoutBody
{
	width: 100%;
	height: 100%;
	padding: 0px 70px 0px 70px;
	flow-children: right;


	font-size: 27px;
	width: 100%;
	line-height: 30px;
	color: #e4e4e4;
}

.CheckoutBodyLeftColumn
{
	width: 1000px;
	height: 850px;
	flow-children: down;
	padding: 34px 16px 0px 0px;
}

.CheckoutFormTextEntryLeft .CheckoutBodyLeftColumn
{
	opacity: 0.0;

	transition-property: opacity;
	transition-duration: 0.5s !immediate;
	transition-timing-function: bigpicture-ease-in-out;
}

.CheckoutBodyLeftColumn:descendantfocus
{
	//background-color: checkout_body_descendantfocus_bg;
}

.CheckoutBodyRightColumn
{
	width: 777px;
	height: 890px;
	flow-children: down;
	padding: 34px;
	padding-bottom: 0px;
}

.CheckoutFormTextEntry .CheckoutBodyRightColumn
{
	opacity: 0.0;

	transition-property: opacity;
	transition-duration: 0.5s !immediate;
	transition-timing-function: bigpicture-ease-in-out;
}

.CheckoutBodyRightColumn:descendantfocus
{
	//background-color: checkout_body_descendantfocus_bg;
}

#PaymentMethod 
{
	width: 100%;
}


//
// General Checkout Panel Styles
//
.CheckoutStep
{
	width: 100%;
	height: 1080px;
	transform: translateY( 132px );
	vertical-align: bottom;
	flow-children: down;

	background-image: url( "file://{images}/panel_background.png" );


	// transitions
	transform: translate3d( 0px, 1280px, 1000px );
	opacity: 0.0;
	saturation: 0.0;
	wash-color: #0000005f;

	transition-property: transform, opacity, saturation, wash-color;
	transition-duration: 0.3s;
	transition-timing-function: bigpicture-ease-in-out;
	transition-delay: 0s;
}

RemoteContent .CheckoutStep
{
//	transform: none;
}

.CheckoutStep.InStoreStack
{
	transform: translate3d( 0px, 70px, 0px );
	opacity: 1.0;
	saturation: 1.0;
	box-shadow: #000000aa -2px -2px 4px 4px;
}

RemoteContent .CheckoutStep.InStoreStack
{
	transform: none;
}

.CheckoutStep:descendantfocus
{
	transform: translate3d( 0px, 132px, 0px );
	opacity: 1.0;
	saturation: 1.0;
	wash-color: none;
	box-shadow: #000000aa -2px -2px 4px 4px;
}

RemoteContent .CheckoutStep:descendantfocus
{
	transform: none;
}

.SecondaryLabel
{
	color: #e4e4e466;
	font-size: 22px;
}	

//
// Shopping Cart
//
ShoppingCart.CheckoutStep
{
	transform: translate3d( 0px, 70px, 0px );
	opacity: 1.0;
}

ShoppingCart .CheckoutBody
{
	flow-children: none;
}

.EmptyCartSection
{
	width: 100%;
	height: 100%;
	opacity: 0.0;

	transition-property: opacity;
	transition-duration: 0.4s;
	transition-timing-function: linear;
}

.EmptyCart .EmptyCartSection
{
	opacity: 1.0;
}

#CartStatus
{
	max-width: 1300px;
	align: center top;
	margin-top: 300px;
	
	color: white;
	font-size: 32px;
}

.CartSection
{
	width: 100%;
	height: 100%;
	flow-children: right;

	opacity: 1.0;

	transition-property: opacity;
	transition-duration: 0.4s;
	transition-timing-function: linear;
}

.EmptyCart .CartSection
{
	opacity: 0.0;
}

CartLineItem:descendantfocus StorePrice #FinalPrice
{
	color: #161718f5;	
}

Button:focus StorePrice #FinalPrice
{
	color: #161718f5;	
}


#CartItemCount
{
	font-size: 32px;
	color: secondary_label;
	vertical-align: bottom;
	horizontal-align: right;
	margin-right: 770px;
	margin-left: 8px;
}

#LineItems
{
	flow-children: down;
	width: 100%;
	overflow: squish scroll;
	height: fit-children;
	padding: 12px 20px 12px 12px;
}

CartLineItem
{
	width: 100%;
	min-height: 84px;
	font-size: 26px;
	flow-children: down;
	padding: 8px 8px 0px 8px;
	margin-bottom: 12px;

	border-radius: 3px;
	background-color: transparent_module;
}

CartLineItem:focus
{
	background-image: url( "file://{images}/systemmenu/capsule_01_over.jpg" );
	background-position: 0px bottom;
	background-repeat: no-repeat;
	background-size: cover;

	animation-name: main-button-glow-movement-no-fill;
	animation-duration: longduration;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

#ItemName
{
	color: #67c1f5ff;
	white-space: nowrap;
	font-size: 30px;
	margin-left: 10px;
	max-width: 730px;
}

CartLineItem:focus #ItemName
{
	color: #ffffff;
}

CartLineItem .Loading
{
	opacity: 1.0;
}

.CartLineItemContents
{
	width: 100%;
	flow-children: down;

	transform: translatex( -7px );
	
	transition-property: transform;
	transition-duration: 0.2s;
	transition-timing-function: ease-in;
}

CartLineItem:descendantfocus .CartLineItemContents
{
	transform: translatex( 0px );
}

.CartItemNamePriceRow
{
	width: 100%;
	flow-children: right;
	padding: 0px;
}

#ItemPrice
{
	horizontal-align: right;
}

.CartItemCouponRow
{
	width: 100%;
	flow-children: right;
	padding: 0px 7px 0px 7px;
}

#CartItemCouponName
{
	color: secondary_label;
	font-size: 24px;
	white-space: nowrap;
}

#CartItemCouponSavings
{
	color: secondary_label;
	font-size: 24px;
	horizontal-align: right;
}

#Notes
{
	flow-children: down;
	padding: 0px 7px;
}

#Notes Label
{
	color: #faaf40;
	font-size: 24px;
	white-space: nowrap;
	margin-left: 10px;
}

#Notes Label.WarningNote
{
	color: warningnotecolor;
}

CartLineItem:descendantfocus #Notes Label.WarningNote
{
	color: warningnotecolor2;
}


#PurchaseNotes
{
	flow-children: down;
}

#PurchaseNotes Label
{
	color: secondary_label;
	font-size: 24px;
	margin-top: 14px;
}


.CartSubtotalSection
{
	width: 100%;
	padding: 16px;
	background-color: #00000033;
	flow-children: down;
	vertical-align: bottom;
	margin: 12px 0px 0px 0px;
	color: white;
	font-size: 26px;
}

CartNoteItem, CartNoteItem:hover
{
	width: 100%;
	box-shadow: fill box_shadow_off_color 0px 0px 0px 0px;
	transition-property: box-shadow;
	transition-timing-function: bigpicture-ease-in-out;
	transition-duration: 0.23s;
}

CartNoteItem Label, CartNoteItem:hover Label
{
	color: #faaf40;
	font-size: 21px;
	line-height: 26px;
	font-style: italic;
	transform: translatex(0px);
}

CartNoteItem.WarningNote #CartNoteItemButton
{
	background-color: gradient( linear, 100% 0%, 0% 0%, color-stop( 0.0, #b5901eff ), color-stop( 1.0, #a76819ff ) );
}

CartNoteItem #CartNoteItemButton
{
	flow-children: right;
	margin: 0px 0px 16px 0px;
	padding: 8px;
	height: fit-children;
}

CartNoteItem.WarningNote Label
{
	color: #f1f1f1ff;
}

CartNoteItem.WarningNote:descendantfocus Label
{
	color: warningnotecolor2;	
}

CartNoteItem #CartNoteItemIcon
{
	visibility: collapse;
}

CartNoteItem.WarningNote #CartNoteItemIcon
{
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-image: url( "file://{images}/store/icon_notice.png" );
	wash-color: #f1f1f1ff;
	width: 50px;
	height: 50px;
	vertical-align: center;
	margin-right: 10px;
	visibility: visible;
}

CartNoteItem.WarningNote:descendantfocus #CartNoteItemIcon
{
	wash-color: warningnotecolor2;
}

#CouponTotalRow, #SubtotalRow
{
	flow-children: right;
	width: 100%;
}

#CouponTotalRow Label
{
	font-size: 22px;
	color: secondary_label;
}

#CartSubtotal
{
	horizontal-align: right;
}

#CouponTotal
{
	horizontal-align: right;
}

.CartInstructions
{
	color: #e4e4e4;
	font-size: 26px;
	margin-bottom: 20px;
}
#PurchaseForSelfBtn,
#PurchaseForGiftBtn,
.AdvanceCheckout,
.ProminentButton
{
	background-color: store_transparent_module;
	height: 90px;
}
#PurchaseForSelfBtn:focus,
#PurchaseForGiftBtn:focus,
.AdvanceCheckout:focus,
.ProminentButton:focus
{
	background-color: store_active_module;

	animation-name: purchase-button-focus;
	animation-duration: longduration;
	animation-delay: shortduration;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

#PurchaseForSelfBtn Label,
#PurchaseForGiftBtn Label,
.AdvanceCheckout Label,
.ProminentButton Label
{
	color: #a3cf06;
	vertical-align: center;
	margin-left: 5px;
}
#PurchaseForSelfBtn:focus Label,
#PurchaseForGiftBtn:focus Label,
.AdvanceCheckout:focus Label,
.ProminentButton:focus Label
{
	color: #ffffff;
}

#PurchaseForSelfBtn:disabled Label,
#PurchaseForGiftBtn:disabled Label
{
	color: #313d02;
}


#PurchaseForGiftBtn
{
	margin-bottom: 40px;
}


//
// Verify Email
//
.VerifyInstructions
{
	font-size: 38px;
	line-height: 38px;
	margin: 0px 0px 14px 0px;
}

#CheckEmail, #Complete
{
	flow-children: down;
	opacity: 1.0;

	transition-property: opacity;
	transition-duration: 0.4s;
	transition-timing-function: bigpicture-ease-in-out;
}

.EmailVerified #CheckEmail
{
	opacity: 0.0;
}

#Complete
{
	opacity: 0.0;
}

.EmailVerified #Complete
{
	opacity: 1.0;
}

.VerifyHighlighted
{
	color: friendsingame_solid;
	margin: 24px 34px 24px 34px;
}


//
// Verify Shipping Address
//
.VerifyShippingAddressSubTitle
{
	padding-top: 20px;
	color: brightblue;
}

//
// Gift Recipient
//
CheckoutGiftRecipient
{
}

CheckoutGiftRecipient #Loaded
{
	flow-children: down;
}

CheckoutGiftRecipient .CheckoutBodyRightColumn
{
	flow-children: none;
}

.CheckoutGiftRegionWarningPanel
{
	margin-bottom: 18px;
	width: 100%;
	background-color: gradient( linear, 100% 0%, 0% 0%, color-stop( 0.0, #b5901eff ), color-stop( 1.0, #a76819ff ) );
	padding: 8px 7px 8px 7px;
	flow-children: right;
}

.CheckoutGiftRegionWarningText
{
	width: 100%;
}

.CheckoutReviewGiftRegionWarningText
{
	font-size: 16px;
	width: 100%;
}

.CartItemNamePriceRow .CheckoutGiftRegionWarningIcon
{
	background-size: 28px;
	width: 28px;
	height: 28px;
}

.CheckoutGiftRegionWarningIcon
{
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-image: url( "file://{images}/store/icon_notice.png" );
	wash-color: #f1f1f1ff;
	width: 55px;
	height: 55px;
	vertical-align: center;
	margin-right: 10px;
	visibility: visible;	
}

.CheckoutGiftRegionWarningText
{
	color: #f1f1f1ff;
}

.CheckoutGiftReceiptOptionWrapper
{
	flow-children: down;
	width: 100%;
}

.HowToSendTitle
{
	margin-bottom: 12px;
}

.GiftRecipientOptions
{
	height: 100%;
	flow-children: down;
	margin-left: 8px;

	opacity: 0.0;

	transition-property: opacity;
	transition-duration: 0.4s;
	transition-timing-function: linear;
}

.EmailMyGift #EmailMyGiftOptions,
.SendToFriend #SendToFriendOptions,
.SendToInventory #SendToInventory
{
	opacity: 1.0;
}

#EmailMyGiftBtn,
#SendToFriendBtn,
#SendToInventoryBtn
{
	background-color: gradient( linear, 85% 85%, 100% 100%, from( #09334dff ), to( #09334d00 ) );
}

.EmailMyGift #EmailMyGiftBtn,
.SendToFriend #SendToFriendBtn,
.SendToInventory #SendToInventoryBtn
{
	border-color: none;
	background-color: gradient( linear, 0% 100%, 100% 100%, from( #1579a0 ), to( #153b55 ) );
	padding-left: 10px;

}

.EmailMyGift #EmailMyGiftBtn:focus,
.SendToFriend #SendToFriendBtn:focus,
.SendToInventory #SendToInventoryBtn:focus
{
	background-color: gradient( linear, 0% 0%, 100% 100%, from( #66c0f4ff ), to( #b6e1faff ) );
}

.InlineLabel
{
	margin-top: 26px;
}

.InlineLabelInset
{
	margin-top: 26px;
}

.InlineTextEntry
{
	margin-bottom: 20px;
}	

.InlineTextEntryInset
{
	margin-bottom: 20px;
}	
	
CheckoutGiftRecipient TextEntry
{
	width: 100%;
	margin-top: 8px;
}

#SendToFriendsList
{
	flow-children: down;
	width: 100%;
	overflow: squish scroll;
	padding-right: 20px;
	padding-bottom: 150px;

	opacity: 1.0;
	opacity-mask-scroll-up: url( "file://{images}/library/scroll_data_mask_up.tga" );
	opacity-mask-scroll-down: url( "file://{images}/library/scroll_data_mask_down.tga" );
	opacity-mask-scroll-up-down: url( "file://{images}/library/scroll_data_mask_both.tga" );

}
#SendToFriendsList VerticalScrollBar
{
	margin-bottom: 150px;
}

CheckoutGiftRecipientFriend
{
	flow-children: right;
}

CheckoutGiftRecipientFriend Label
{
	vertical-align: center;

	font-size: 24px;
	font-weight: normal;
	transform: none;
	transition: none;
}

#SendToFriendName
{
	color: detailsdatalabelfocus;
}

CheckoutGiftRecipientFriend:descendantfocus #SendToFriendName
{
	color: #161718f5;
}

CheckoutGiftRecipientFriend AvatarImage
{
	width: 90px;
	height: 90px;

	border: 4px solid;
	border-radius: 8px;
	transform: translatex(0px);
	transition-property: transform;
	transition-duration: 0.2s;
	transition-timing-function: ease-in;
}

CheckoutGiftRecipientFriend:descendantfocus AvatarImage
{
	transform: translatex(7px);
}

.SendToFriendText
{
	flow-children: down;
}

#SendToFriendWishes
{
	font-size: 24px;
	color: #618fa2;
}

#SendToFriendOwns
{
	font-size: 24px;
	color: error_color;
}


.SendToFriendText
{
	margin-left: 8px;
	transform: translatex(0px);
	transition-property: transform;
	transition-duration: 0.2s;
	transition-timing-function: ease-in;
}

CheckoutGiftRecipientFriend:descendantfocus .SendToFriendText
{
	transform: translatex(7px);
}


//
// Gift Note
//
CheckoutGiftNote
{
}

CheckoutGiftNote #Loaded
{
	flow-children: down;
}

CheckoutGiftNote .CheckoutBodyRightColumn
{
	flow-children: down;
}

.GiftNoteHeader
{
	margin: 34px 0px 4px 0px;
}

.GiftMessageHeaderRow
{
	width: 100%;
	margin: 34px 0px 4px 0px;
	flow-children: right;
}

.GiftMsgRemaining
{
	horizontal-align: right;
}

#RecipientName
{
	width: 480px;
}

#GiftMessage
{
	height: 150px;
	width: 100%;
}

#Sentiment
{
	width: 480px;
}

#SentimentDropDownMenu
{
	width: 480px;
	height: 224px;
	overflow: squish scroll;
}

#Signature
{
	width: 480px;
}


//
// Payment Methods
//
CheckoutPaymentMethod #Loaded
{
	flow-children: down;
	opacity: 1.0;
}

CheckoutPaymentMethod .CheckoutBodyLeftColumn
{
	flow-children: right;
}

CheckoutPaymentMethod .CheckoutBodyRightColumn
{
	flow-children: down;
}

CheckoutPaymentMethodFields
{
	flow-children: down;
	width: fill-parent-flow( 1.0 );
}

#SecondaryMethod
{
	// hack to get around label not wrapping properly because parent is fill-parent-flow so label
	// desired size pass calculates to 1 line
	width: 460px;
}

.PaymentMethodHeader
{
	margin: 20px 0px 4px 0px;
}

#PaymentMethod
{
	width: 400px;
	margin-bottom: 20px;
}

#PaymentMethodDropDownMenu
{
	width: 400px;
	height: 294px;
	overflow: squish scroll;
}

#BankName
{
	width: 400px;
	margin-bottom: 20px;
}

#BankNameDropDownMenu
{
	width: 400px;
	height: 294px;
	overflow: squish scroll;
}

#SavePaymentInfo
{
	margin-top: 34px;

}
#LiveInCountryNoBilling
{
	height: fit-children;
}
#LiveInCountryNoBilling Label
{
	width: 400px;
}

#MustSavePaymentInfo
{
	margin-top: 34px;
}

#CreditCardFields
{
	visibility: visible;
	flow-children: down;
	margin-top: -20px;
}

#CreditCardNumber
{
	width: 400px;
}

.CreditCardExpirationRow
{
	flow-children: right;
}

#CreditCardMonth
{
	width: 100px;
	margin-right: 10px;
}

#CreditCardMonthDropDownMenu
{
	width: 100px;
	height: 480px;
	overflow: squish scroll;
}

#CreditCardYear
{
	width: 140px;
}

#CreditCardYearDropDownMenu
{
	width: 140px;
	height: 480px;
	overflow: squish scroll;
}

#CreditCardSecurityCode
{
	width: 100px;
}

#UpdatePayPalFields
{
	visibility: collapse;
	color: #cfb53fff;
}

#UpdateBankNameFields
{
	visibility: collapse;
	flow-children: down;
	color: #cfb53fff;
}

#PayPalFields
{
	visibility: collapse;
}

#ClickandBuyFields
{
	visibility: collapse;
}

#ClickandBuyFields Label
{
	height: 100%;
	margin: 20px 0px 4px 0px;
}


#PayPalFields Label
{
	margin: 20px 0px 4px 0px;
}

#NoPaymentDataFields
{
	width: 100%;
	visibility: collapse;
	padding: 20px 0px 4px 0px;
}

#WalletLow
{
	width: 450px;
}


//
// Billing Info
//
CheckoutBillingInfo .CheckoutBodyLeftColumn
{
	flow-children: none;
}

CheckoutBillingInfo .CheckoutBodyRightColumn
{
	flow-children: down;
}

//
// Shipping Info
//
CheckoutShippingInfo .CheckoutBodyLeftColumn
{
	flow-children: none;
}

CheckoutShippingInfo .CheckoutBodyRightColumn
{
	flow-children: down;
}


CheckoutShippingInfo .AddressValidationError
{
	font-size: 24px;
	color: warningnotecolor;
	margin-left: 80px;
}


.BillingInfoHeader
{
	margin: 34px 0px 4px 0px;
}

.CheckoutBillingInfoLeftColumn
{
	width: 600px;
	height: 500px;
	margin-right: 24px;
	flow-children: down;
}

.CheckoutShippingInfoLeftColumn
{
	width: 600px;
	height: 550px;
	margin-right: 24px;
	flow-children: down;
}

.BillingNameRow
{
	flow-children: right;
}

.BillingFirstNameColumn
{
	flow-children: down;
}

.BillingLastNameColumn
{
	margin-left: 24px;
	flow-children: down;
}

#FirstName, #LastName
{
	width: 290px;
}

#Address1, #Address2
{
	width: 100%;
}

#Country
{
	width: 600px;
}

#CountryDropDownMenu
{
	width: 600px;
	max-height: 340px;
}

.CheckoutBillingInfoRightColumn
{
	width: 250px;
	height: 550px;
	position: 624px 0px 0px;
	flow-children: down;
}

.CheckoutShippingInfoRightColumn
{
	width: 250px;
	height: 550px;
	position: 624px 0px 0px;
	flow-children: down;
}

#City
{
	width: 248px;
}

#StateControls
{
	flow-children: down;
}

#State
{
	width: 248px;
	height: 56px;
}

#State Label
{
	vertical-align: center;
}

#StateText
{
	width: 248px;
}

#StateDropDownMenu
{
	width: 248px;
	max-height: 400px;
}

#PostCode
{
	width: 248px;
}

#PhoneNumber
{
	width: 248px;
	vertical-align: top;
}

#LiveInCountry
{
	width: 700px;
	margin: 0px 0px 4px 0px;
	position: 0px 550px 0px;
}

#ShippingInfoShippingRestrictions
{
	position: 0px 550px 0px;
}

.PaymentMethodLogos
{
	margin-top: 45px;
	margin-left: 8px;
	flow-children: down;
}

#PaymentMethodLogoRows
{
	flow-children: down;
}

.PaymentMethodLogoRow
{
	width: 470px;
	margin-top: 8px;
	flow-children: right;
}

.PaymentMethodLogos Image
{
	width: 100px;
	height: 63px;
	margin-right: 16px;
	margin-bottom: 16px;

}


//
// Review
//
CheckoutReview .CheckoutBodyLeftColumn
{
	flow-children: down;
	height: 750px;
}

CheckoutReview .CheckoutBodyRightColumn
{
	flow-children: down;
	padding-bottom: 0px;
}

#CheckoutReviewLineItems
{
	flow-children: down;
	width: 100%;
	height: fill-parent-flow( 1.0 );
}

CheckoutReviewLineItem
{
	flow-children: down;
	width: 100%;
	padding: 12px;
	background-color: #00000033;
}




#RecurringSubscriptionDescription
{
	margin: 8px 12px 0px 12px;
	font-size: 24px;
	color: #cfb53fff;
}

#ItemWarning
{
	visibility: collapse;
}

.ReviewTotalSection
{
	width: 100%;
	padding: 20px;
	background-color: #00000033;
	flow-children: down;
	vertical-align: bottom;
	margin-bottom: -34px;

	color: #618fa2;
	font-size: 22px;
	text-align: right;
	width: 100%;
	text-align: right;
}

#SubscriptionText
{
	padding-top: 50px;
}

.ReviewTotal
{
	color: white;
	font-size: 30px;
}

.ReviewTotalRow
{
	flow-children: right;
	horizontal-align: right;
}

#ReviewSubTotal, #ReviewShipping, #ReviewTax, #ReviewTotal, #ConvertedReviewTotal
{
	width: 150px;
	text-align: right;
}

#ReviewConvertedTotalRow
{
	padding-top: 8px;
}

.PurchaseBtn
{
	margin-bottom: 30px;
}

.PaymentMethodReviewSection
{
	width: 100%;
	height: 100%;
	flow-children: down;

	padding-top: 30px;
}

.PaymentMethodReviewRows
{
	flow-children: down;
	font-size: 24px;
	line-height: 32px;
	margin-top: 5px;
	width: 100%;
}

.PaymentMethodReviewRow
{
	width: 100%;
	flow-children: down;
}
.PaymentMethodReviewRows .PaymentMethodReviewRow
{
	flow-children: right;
}

#ReviewPaymentMethodAmount1, #ReviewPaymentMethodAmount2
{
	color: #ffffff;
	horizontal-align: right;
}

.PaymentMethodReviewGap
{
	margin-top: 12px;
}

.PaymentMethodReviewHeader
{

	text-align: left;
	font-size: 24px;
	margin-right: 24px;
	margin-top: 15px;
	color: tcstatictext;
}

#ReviewPaymentMethod, #ReviewGiftOption, #ReviewAddress, #ReviewShippingAddress, #ReviewPhone
{
	width: 380px;
	font-size: 22px;
	line-height: 24px;
	margin-top: 5px;
}

#IncludesVat
{
	horizontal-align: right;
}

#ReviewCreditCardSecurityCode
{
	width: 120px;
	margin-bottom: 20px;
	margin-top: 10px;
}


//
// Confirmation
//
CheckoutConfirmation .CheckoutBodyLeftColumn
{
	flow-children: down;
}

CheckoutConfirmation .CheckoutBodyRightColumn
{
	flow-children: down;
}

.ConfirmationTextGap
{
	margin-top: 40px;
}

.ReceiptSection
{
	margin-top: 40px;
	margin-left: 0px;
	flow-children: down;
}

.ReceiptRow
{
	width: 750px;
	flow-children: right;
}

#ReceiptAccount, #ReceiptTotal, #ReceiptCode
{
	width: 450px;
	horizontal-align: left;
	margin-left: 30px;
	padding-top: 0px;
	padding-bottom: 20px;
}

.CheckoutConfirmationBtnGrouping
{
	flow-children: down;
	width: 100%;
}


//
// Add Funds Page
//
CheckoutAddFundsButton
{
	flow-children: right;
}

CheckoutAddFundsButton Label
{
	width: fit-children;
}

#MinRequredText
{
	horizontal-align: right;
	font-style: italic;
	font-weight: normal;
}


//
//  Checkout progress breadcrumbs
//
.CheckoutProgress
{
	opacity: 0.0;
	width: 770px;
	horizontal-align: left;
	flow-children: right;
	margin-left: 42px;
	margin-top: 24px;
}	

.CheckoutStep:descendantfocus .CheckoutProgress
{
	opacity: 1.0;
	margin-top: 24px;

}	

.CheckoutThisStep
{
	font-size: 21px;
	color: white;


}
.CheckoutOtherStep
{
	font-size: 22px;
	color: tcstatictext;
}

.CheckoutArrow
{
	background-image: url( "file://{images}/store/Icon_CheckoutArrow.png" );
	margin-top: 8px;
	background-repeat: no-repeat;
	background-position: 50% 50%;
}


DropDownMenu
{
	width: 324px;
	padding: 8px 8px;
}
DropDown
{
	min-height: 56px;
}


//
// Microtransaction auth
//
#MicroTxnAuthErrorSection
{
	width: 100%;
	height: 100%;
}

#MicroTxnAuthErrorSection Label
{
	max-width: 1300px;
	align: center top;
	margin-top: 300px;

	color: white;
	font-size: 32px;
}

CheckoutMicroTxnAuthLineItem
{
	flow-children: down;
	width: 100%;
}

CheckoutMicroTxnAuthLineItem #MainRow
{
	flow-children: right;
	width: 100%;
}

#ItemQuantity
{
	// use width so each description has equal spacing no matter how long quantity label is
	width: 100px;

	color: #79abc2;
	font-size: 24px;
	line-height: 27px; // vertically aligns text with description & price
}

.MicroTxnAuthDescription
{
	margin-bottom: 8px;
}

CheckoutConfirmation .CheckoutConfirmationBtnGrouping
{
	visibility: collapse;
}

CheckoutConfirmation.Microtransaction #ReturnToMicrotransaction,
CheckoutConfirmation.Library #GoToLibrarySection,
CheckoutConfirmation.Store #ReturnToStoreSection,
CheckoutConfirmation.Market #ReturnToMarketSection
{
	visibility: visible;
}

CheckoutConfirmation.Market #ReturnToMicrotransaction,
CheckoutConfirmation.Market #GoToLibrarySection,
CheckoutConfirmation.Market #ReturnToStoreSection
{
	visibility: collapse;
}