/* THESE ARE STYLES FOR THE CART AND CHECKOUT PAGE LAYOUT */

/* for two column checkout use this: 
.checkoutColumn{float:left; width:50%;} 
*/

/*container around shopping cart page*/
#ShoppingCartContainer{float:left; clear:both; width:565px;  margin-top:20px;}

/*container around checkout page*/
#CheckoutContainer{float:left; clear:both; width:565px;}

/* //////////////////////////////// GENERAL STYLES //////////////////////////////////////// */
.colorBlack{color:#000000;}
.w30{width:30px;}
ul li.w150{width:150px;}
ul li.w120{width:120px;}
ul li.fl{float:left; clear:none;}
.fl{float:left; clear:none;}
.fr{float:right;}
.cb{clear:both;}
ul li.mt20{margin-top:20px;}
ul li.mt10{margin-top:10px;}
.mt5{margin-top:10px;}
.ml0{margin-left:0px;}
.ml10{margin-left:10px;}
ul li.mb20{margin-bottom:20px;}
.db{display:block}
.red{color:#ae0101}
.dn{display:none;}
.pb5 { padding-bottom:5px; }
.mb10 { margin-bottom:10px; }
.mr10 { margin-right:10px; }
.pr10{padding-right:10px;}
.pl10{padding-left:10px;}
.mp0{margin:0px; padding:0px;}
label.fn { float:none; clear:none; }
.msgText{ color:#cc0000; font-weight:bold;}
.updateDeleteBtns{  margin-right:5px; margin-top:5px;  background-color:#efefef; cursor:pointer;  border:1px solid #cccccc; font-size:1em; display:inline;}

/* ////////////////////////////////////////////////////////
///////////////////// FORM SECTION TITLES /////////////////
////////////////////////////////////////////////////////// */

h2.FormSectionTitle{ font-weight:normal; font-size:18px; padding:0px; margin:0px 0px 0px 0px; clear:both; }


/* 
////////////////////////////////////////////////////////////////////////
/////////////////////////// FORM STYLES ////////////// /////////////// //////////////////////////////////////////////////////////////// */
form { margin:0px; padding:0px; }
.InputForm { overflow:hidden; background-color:#efefef;  border:1px solid #cccccc; padding:10px; margin:0px 0px 0px 0px;}
.InputForm h2 { margin-top:0px; margin-bottom:0px; }
.InputForm h3 { font-size:14px; font-weight:normal; }
.Form {padding:0px;list-style:none; display:block; overflow:hidden; width:100%; margin:0px;}
.Form li { margin:0px 0px 0px 0px; overflow:hidden; clear:both; font-weight:normal; padding:3px;}
.Form li.required { color:#993333;}
.Form li.required label{ color:#993333;}
.Form label { width:120px; float:left; text-align:right; display:block; vertical-align:middle; padding:2px 5px 2px 0px; color:#000000; }
.Form li.fullSpan label{width:100%; clear:both; float:none; text-align:left;}
.Form li.fullSpan{ padding-left:128px; }
.Form input { padding:2px; float:left; display:block; margin:0px 0px 0px 0px; vertical-align:middle; border:1px solid #666666; }

.Form textarea { padding:0px; float:left; display:block; margin:0px 0px 0px 0px; font-size:11px; vertical-align:middle; border:1px solid #666666; font-family:Arial, Helvetica, sans-serif; font-size:1em;}

.Form select { float:left; display:block; margin:0px 0px 0px 0px; font-size:11px; }
.Form a { font-weight:normal; font-size:12px;  }

.required em { color:#000000; font-style:normal; }
.validation-failed { border:2px solid #993333; font-size:11px; vertical-align:top;}
.Form li.ratingSelection input{ float:none; display:inline; margin-right:5px; border:0px; }
.Form li.ratingSelection label.inline{ display:inline; float:none; width:auto; margin:0px 0px 0px 0px} 
/* Contact Page */
#ContactForm.InputForm { width:543px; margin-bottom:10px;  }
#ContactForm p { width:95%; }
#ContactForm li{margin-bottom:0px;}
/* Account Info */
#AccountForm { margin-bottom:10px; }
#AccountForm.inputForm table tr td.firstColumn { width:100px; }
InputForm.NoStyle{border:0px ; background-color:transparent;  }


/* Account Login*/
#AccountLoginForm.InputForm {  }
#AccountLoginForm ul.Form{}

/* forgot password form*/
#ForgotPasswordForm.InputForm { }


/* Account Info */
#CheckoutInfoForm { margin-bottom:10px; }
#CheckoutInfoForm.inputForm table tr td.firstColumn { width:100px; }

/* Shipping Info */
#ShippingForm { margin-bottom:10px; }
#ShippingForm.inputForm table tr td.firstColumn { width:100px; }

/* Billing Info */
#BillingForm { margin-bottom:10px; }
#BillingForm.inputForm table tr td.firstColumn { width:100px; }

/* Payment Info */
#PaymentForm{  margin-bottom:10px; }
#PaymentForm.inputForm table tr td.firstColumn { width:100px; }

/* Create Account */
#CreateAccountForm{}
#CreateAccountForm .Form li { margin:5px 0px 0px 0px; clear:both;}
#CreateAccountForm {margin-bottom:10px; }
#CreateAccountForm.InputForm{ border:0px; background-color:#FFFFFF; padding:0px;}

/* Account Login */
#AccountLoginForm { margin-bottom:10px; }
#AccountLoginForm.inputForm table tr td.firstColumn { width:100px; }

#SendToFriendForm label{width:180px;}
#SendToFriendForm.InputForm{ width:500px;}





/* 
////////////////////////////////////////////////////////////////////////////////
//////////////////////////////// BUTTONS /////////////////////////////////////// 
////////////////////////////////////////////////////////////////////////////////
*/
/* Specify a width on .CartBtn to expand the entire width of the form */
.EditCartBtn { background-color:#ae0101; color:#ffffff; border:1px solid #000000; cursor:pointer; } 
.ContinueShoppingBtn { background-color:#ae0101; color:#ffffff; border:1px solid #000000; cursor:pointer; }
#CalculateBtn {margin-left:5px; display:inline; float:left; width:130px;}  
.CartBtn { background-color:#999999; color:#FFFFFF; font-weight:bold; border:1px solid #000000; font-size:11px; cursor:pointer; overflow:visible; display:block; width:281px; margin:0px auto 10px auto; clear:both; } 
.SubmitBtn { margin-top:10px; margin-bottom:10px; display:block; float:right; }
.QuantityBtn { font-size:10px; float:left; width:45px; padding:0px; margin:0px; } 
.MyAccountBtn { background-color:#999999; color:#FFFFFF; font-weight:bold; border:1px solid #000000; font-size:11px; cursor:pointer; overflow:visible; display:block; margin:0px auto 10px 95px; clear:both; } 
.ShoppingCartBtn { background-color:#999999; color:#FFFFFF; font-weight:bold; border:1px solid #000000; font-size:11px; cursor:pointer; overflow:visible; display:block; width:239px; margin:10px auto 10px auto; clear:both; } 

/* ///////////////////////////////////  HISTORY TABLE //////////////////////////////////////////////// */

.historyTable tr td{border-bottom:1px solid #cccccc; padding-top:10px; padding-bottom:10px;}

/* ////////////////////////////////// FIELDS //////////////////////////////////////////////////////// */

.Username { width:120px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Password { width:120px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }

.Destination { width:100px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Method { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Company { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Business { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Name { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.FirstName { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.LastName { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.EmailAddress { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Email { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Address { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Address2 { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.City { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.State { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Country { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Province { width:180px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Zip { width:50px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.reviewDescript{ width:250px; height:100px;}
.HomePhone { width:120px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.WorkPhone { width:120px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.WorkPhoneExt { width:40px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Fax { width:100px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.Comments { width:250px; height:200px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }

.CardType { width:140px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.CardNumber { width:140px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.CardExpMonth { width:40px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.CardExpYear { width:60px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }
.CardSecurityCode { width:40px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }

#AccountLoginForm .Email { width:140px; background-image:url(images/bg-textinput.gif); background-repeat:repeat-x; background-position:top; }

/* 
/////////////////////////////////////////////////////////////////////////////////////////
////////////////////MY ACCOUNT PAGE LAYOUT (ADVANCED COSMETIC STYLE ) ///////////////////
////////////////////////////////////////////////////////////////////////////////////// */
#MyAccountLeftColumn { width:48%; float:left; overflow:hidden; }
#MyAccountRightColumn { width:48%; float:right; overflow:hidden; }
#MyAccountRightColumn label { width:85px; float:left; display:block; vertical-align:middle; padding:2px 0px 2px 0px; color:#000000; }

/*
//////////////////////////////////////////////////////////////////////////////// 
//////////////////////////////// SHOPPING CART ///////////////////////////////// 
////////////////////////////////////////////////////////////////////////////////
*/
#ShoppingCartColumn {}
#ShoppingCart{ margin:0px 0px 0px 0px; padding:0px;  overflow:hidden; clear:both; height:1%; } 
#ShoppingCart.pr10{padding-right:10px;}
#ShoppingCart table { font-size:12px; width:100%; padding:0px; margin:0px;}
#ShoppingCart h2{}

/* Heading Row */
#ShoppingCart thead tr th { padding:5px; border-bottom:1px solid #DDDDDD; border-top:0px solid #aaaaaa; background-color:#efefef } 
.h_ItemDesription { text-align:left; }
.h_ItemPrice { text-align:center; } 
.h_ItemQuantity { text-align:center; width:140px; } 
.h_ItemTotal { text-align:center; } 

/* Content Rows */
#ShoppingCart tbody tr { vertical-align:top; } 
#ShoppingCart tbody tr.AltRow { vertical-align:top; background-color:#ECECEC; } 
#ShoppingCart tbody tr td { border-bottom:1px solid #DDDDDD; padding:10px; } 



#ShoppingCart table tbody tr td.cartSeparator{ background-color:#f0efe6; color:#000000;}

#ShoppingCart tbody tr td.divider { border:0px; height:0px; } 
.ItemImage { text-align:center; } 
.ItemImage img { border:0px solid red; } 
.ItemDescription { text-align:left;  } 
.ItemDescription ul { list-style:none; list-style-image:none; padding:0px; margin:5px 0px 0px; }
.ItemPrice { text-align:center; }
.ItemQuantity { text-align:center;  }  
.ItemQuantityChkout { text-align:center; } 
.ItemQuantityTextBox { background-color:#eeeeee; margin-bottom:5px; width:25px; font-size:11px; text-align:center; } 
.ItemEdit { text-align:center; }
.ItemEdit a { font-size:12px; }
.ItemTotal { text-align:center; } 

/* Totals */
#totalsContainer{ width:100%; float:left; padding-bottom:0px; clear:both;}
#Totals { width:48%; float:right; font-size:12px;  list-style:none; text-align:right; background-color:#efefef; border:1px solid #cccccc; border-top:0px; display:inline; margin-top:0px;padding:0px;} 
#Totals li { text-align:right; } 
#Totals label {}
#OrderSubTotal { color:#990000; padding:5px; margin:0px; background-color:#FFFFFF; border-bottom:1px solid #cccccc; } 
#ShippingCost{ color:#990000; padding:5px; }
#OrderTotal { color:#ae0101; font-weight:bold; border-top:1px solid #cccccc; padding:5px; background-color:#FFFFFF; } 
#CalculateShipping { margin-top:0px; padding:10px; background-color:#FFFFFF;}
#CalculateShipping label{ display:block; margin-bottom:5px;}
#CalculateShipping h1 { display:block; margin:0px; border-bottom:1px dashed #aaaaaa; padding:5px; text-align:center; font-size:12px; margin:0; } 
#CalculateShipping span { text-align:right; margin:0px; padding:5px; display:block; } 
#CalculateShipping .zipInput { width:50px; margin-right:5px; margin-left:5px; }  
#ShippingMethod_1{  overflow:hidden; padding:10px; height:1%; }




/* Existing Members */
#membershipOptions{ width:100%; float:left; margin-top:20px;}
#ExistingMembers h2{ }
#ExistingMembers{ width:48%; float:left; margin:0px;  display:inline; }
#ExistingMembers label { width:70px; float:left; display:block; vertical-align:middle; text-align:left; padding:2px 0px 2px 0px; color:#000000; }
#ExistingMembersForm { background-color:#efefef; border:1px solid #cccccc;   }
#ExistingMembersForm p{margin:0px; padding:0px; }
#ExistingMembersForm.inputForm table tr td.firstColumn { }
#ExistingMembersForm .Form li {}


/* New Customers */

#NewCustomers { width:48%; float:right; }
#NewCustomersForm {  background-color:#efefef; padding:10px;  border:1px solid #cccccc; }
#NewCustomersForm p{ margin:0px; padding:0px;}
#NewCustomersForm.inputForm table tr td.firstColumn { width:100px; }
#NewCustomersForm .Form li { margin:5px 0px 0px 0px; clear:both; float:left; width:239px; }