
/* ## Member Account ## */

.accountBlocks { position:relative; min-height:1px; margin:0 0 15px 0;}
.accountBlocks .inner {margin: 0 -10px;}
.accountBlocks .blockhdng {
	position:relative;
	display:inline-block;
	font-size:20px;
	left:0;
	margin:0;
	padding:3px 0;	
	font-weight:bold;
	color:#1C345D;
	text-transform:uppercase;
}
.accountBlocks .blockhdng span {text-transform:uppercase;}

.accountLogin .accountBlocks .inner {margin: 0 -20px;}
.accountLogin .accountBlocks .blockhdng  {left:-10px;}
.accountLogin.home .accountBlocks .blockhdng  {left:0;}

.accountBlocks.accountLandingDetailsWrpr .inner {margin:0; position:relative; min-height:35px;}
.accountBlocks.accountLandingDetailsWrpr .inner + .inner {margin:20px 0;}
.accountBlocks.accountLandingAddressWrpr .inner {margin:0;}
.accountBlocks .inner.margin0  {margin:0;}


.floatLeft {float:left; display:inline;}
.floatRight {float:right; display:inline;}

.multiColumn {}
.multiColumn .halfColumn {float:left; display:inline; width:49%;}
.multiColumn .rightColumn {float:right;}

.accountLogin {}
.accountLogin .halfColumn {width:46%;}
.accountLogin.home {background:none;}

.accountBlocks .cartwrpr  {margin:0; padding:0;}
.accountBlocks .multipleShips {border-bottom:0; padding:0; margin:0;}

.formTable {vertical-align:top;}
.formTable th {width:100px; padding:0 12px 7px 0; background-color:transparent; vertical-align:top; font-weight:bold;}
.formTable td {padding:0 0 7px 0; vertical-align:top;}
.formTable td td {padding:0 2px 0 0;}

.formTable .req {font-weight:bold;}
.formTable .error {font-weight:bold; color:#f00;}

.formTable .securityCode {padding:7px 5px 7px 0; border:1px solid #a8c6e0;}
.formTable input.text {}

dl.forms {float:left; display:inline; width:100%; margin:0 0 10px 0; padding-top:5px;}
dl.forms dt {float:left; clear:left; /* width:33%; */ margin:0; padding:0 7px 0 0; text-align:left; font-weight:600; font-size:14px;}
dl.forms dt.full {width:90%; clear:both; text-align:left;}

dl.forms dd {float:left;/*  width:67%; */	margin: 0 0 3px;	padding:0 5px 0 7px; word-wrap: break-word;}
dl.forms dd.clear {padding:0; margin:0;}
dl.forms dd.full {width:90%; clear:both;}
dl.forms dd.clear {width:90%; clear:both; float:none;}
dl.forms dd.help {padding-top:2px;}
dl.forms dl {float:none; display:block; margin:0;}



dl.forms .req {font-weight:bold;}
dl.forms .error {font-weight:bold; color:#f00;}
dl.forms .optional {font-weight:normal;}

dl.forms label {vertical-align:top;}
dl.forms input.text {width: 160px;}
dl.forms textarea {}

dl.forms dd.longEmail {padding:0; width:100%;}




.formRow {margin:0 0 2px 0;}
.formRow label {display:inline-block; margin:0 0 4px 0;}
.formRow input.text {width:210px; margin:0 0 7px 0;}
.formRow input.full {width:93%;}
.formRow .req, .formRow .fieldreq {padding:0 0 0 12px; background-position:0 2px;}
.formRow .error, .formRow .fieldred {padding:0 0 0 12px; background-position:0 2px;}

.forms fieldset {margin:0; border:0; padding:0;}
.formRow .formLabel {display:block; font-weight:normal;}

.formsColumn .formRow .formLabel {float:left; display:inline; width:120px; margin-right:10px;}

.multiCol .colWrap {float:left; display:inline;}
.multiCol2 .colWrap {width:48%;}
.multiCol .ratio35	{width:34%;}
.multiCol .ratio40	{width:39%;}
.multiCol .ratio60	{width:59%;}
.multiCol .ratio65	{width:64%;}


/* Members */
.accountLogin label {margin-bottom:5px;}

.currentAccount {/* margin-bottom:20px; */}
.currentAccount .userName, .currentAccount .password, .currentAccount .saveLogin{width:216px;margin:10px auto 0 auto;}
.currentAccount .saveLogin {margin-bottom:15px;}
.currentAccount .accountDesc {float:left;}
.currentAccount .requiredAlertWrpr {padding-top:2px;}
.currentAccount a.note {display:inline-block; font-style:italic; font-weight:500;}

.accountRegisterWrpr {margin-top:20px;}


.accountAddressWrpr {}
.accountRegisterDetailsWrpr {margin-bottom:15px;}
.accountRegisterAddressWrpr {margin-bottom:15px;}
.accountRegisterNewsletterWrpr {}
.accountRegisterNewsletterWrpr .emailFormat {padding-left:13px;padding-top:5px;margin-bottom:10px;}
.accountRegisterNewsletterWrpr .emailFormat label {margin-right:8px;}
.accountRegisterNewsletterWrpr .lists table{margin-left:6px;}
.accountRegisterNewsletterWrpr .salesUpdates {margin-bottom:15px;}


.accountLandingDetailsWrpr {padding:2rem 0; min-height:0 !important; position:relative; border-bottom:1px solid #b4b8bf;}
.accountLandingDetailsWrpr .formRow .formLabel,
.accountLandingAddressWrpr .formRow .formLabel {width:auto; font-weight:600;}

.membersNewsletterRegWrpr .emailFormat{padding-left:12px;padding-top:5px;}
.membersNewsletterRegWrpr .lists {padding-left:10px;padding-top:5px;padding-bottom:5px;}
.membersNewsletterRegWrpr .lists table {padding-left:0px;margin-left:-3px;}
.membersNewsletterRegWrpr .formRow {margin-bottom:15px;}

.accountLandingDetailsWrpr .formRow strong {margin-right:10px;}


/* login member tooltip classes */

.membershipToolTipWrpr {display:none; width:240px; left:745px !important;z-index:1000; color:#333;text-transform:none;}
.membershipToolTipShadow {background: url(/cms/images/core/memberTooltipbacktop.png) no-repeat top left;padding: 10px 13px 1px 13px; }
.membershipToolTopShadowBottom {background: url(/cms/images/core/memberTooltipbackbottom.png) no-repeat top left;width:240px;height:16px;}
.membershipToolTipWrpr h5 {font-size:14px; margin-bottom:6px;}
.membershipToolTipDate {font-size:11px; font-weight:bold;}
.membershipToolTipName {font-size:14px; font-weight:bold;margin-bottom:14px;}
.membershipToolLeftRailWrpr {float:left;width:69px;padding-right:5px;display:none;}
.membershipToolLeftRailWrpr img {border:1px solid #000;margin-bottom:5px;}
.membershipToolRightRailWrpr {}
.membershipToolRightRailWrpr .welcome{margin-bottom:5px;}
.membershipToolRightRailWrpr p{line-height:1.4em;}
.membershipToolTipWrpr .membershipLogout {position:absolute;bottom:16px;right:8px;}
.hdrwrpr a.memberHoverOn, .hdrwrpr a.memberHoverOn:link, .hdrwrpr a.memberHoverOn:visited {color:#fff; text-decoration:none;}
.hdrwrpr a.memberHoverOn:hover {color:#fff; text-decoration:none;}
.hdrwrpr a.memberHoverOn:active {color:#fff; text-decoration:none;}
.membershipToolTipWrpr a:hover {color:#000;}


.emailFormatLists label {font-weight:bold;}
.emailFormatLists em.form-req{font-weight:bold;margin: 0 4px 0 0px;}
.suContentSelection {margin-left:12px;}

.card {border:1px solid #d7d7d7; margin: 0 0 10px;
	-webkit-box-shadow: 3px 3px 4px 0px rgba(50, 50, 50, 0.10);
	-moz-box-shadow:    3px 3px 4px 0px rgba(50, 50, 50, 0.10);
	box-shadow:         3px 3px 4px 0px rgba(50, 50, 50, 0.10);	
}
.cardTop {padding:15px;}
/*.cardTop img {float:left;}*/
.cardImg {float:left; margin:0 15px 10px 0;}
.cardInfo { 
	float:right;
	text-align: right;
	width:180px;
}
.cardName {font-size:14px; font-weight:600; display: block; margin-bottom:5px;}
.cardNumber {font-size:16px; display: block;}
.cardBottom {padding:10px 15px; text-align:right; font-size:14px; font-weight:bold; border-top:1px solid #d7d7d7;}
.cardBottom input {background:none; border:none; font-weight:bold; color:#636363;}
.cardBottom input:hover, .cardBottom input:focus  {text-decoration:underline;}

.formContent {
  overflow-wrap: break-word;
  word-wrap: break-word;
  -ms-word-break: break-all;
  word-break: break-all;
  word-break: break-word;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;	
}

.accountLandingDetailsWrpr .btnWrapper {margin-top:10px;}
.label-pseudo {display:block; height:31px;}

/*  Address book Restyling and Payment Method Styling  */

.address-flex{display: flex; justify-content: flex-start; margin: 10px 0; flex-wrap: wrap;}
.address-details,
.addnew-address{width: calc(100% - 20px); box-shadow: 0px 0px 3px 1px rgba(0,0,0,.25); margin:10px; padding: 10px; display: flex; flex-direction: column; min-height:1px !important;}
.address-flex span{display: block; word-break: break-word;}
.address-btn-wrapper,
.payment-btn-wrapper{display: flex;  flex-wrap: wrap;  justify-content: space-between; align-items: center; margin-top: auto;}
.address-btn-wrapper{justify-content: flex-start;}
.address-btn-wrapper .btn,
.payment-btn-wrapper .btn {padding: 5px 10px; font-weight: 500; font-size: .8em; min-width: auto; margin: 5px 5px 5px 0;}
.payment-btn-wrapper .btn{min-width: 75px;}
.wallet-btn-wrapper .btn {
	padding: 5px 10px;
	font-weight: 500;
	font-size: .8em;
	min-width: auto;
	width: 100%;
	margin: 5px 5px 5px 0;
}
.addnew-address{border: 0; color: #fff; background: url(/cms/images/svg/plus.svg) no-repeat #3A6129; background-size: 20px; background-position: 5%; padding: 20px 10px 20px 30px; text-align: center; align-items: center; width: calc(100% - 20px); }
.manage-payments .addnew-address{width: calc(100% - 20px)}
.payment-btn-wrapper .btn:first-child,
.address-btn-wrapper .btn:first-child,
.payment-btn-wrapper .btn:nth-child(2),
.address-btn-wrapper .btn:nth-child(2){width: 47%;}
.set-default.btn{width: 100%; background: #1e3b68; }
.set-default.btn:disabled{background: url('/cms/images/svg/checkbox.svg') no-repeat #3A6129; background-size: 15px; background-position: 5px 50%;}
.cardlist-flex{display: flex; margin: 20px 0; flex-wrap: wrap;}
.cardlist-item{width: calc(100% - 20px); box-shadow: 0px 0px 3px 1px rgba(0,0,0,.25); margin:10px; padding: 10px; display: flex; flex-direction: column; }
.cardlist-item .edit-card{margin-top:10px;}
.cardlist-item .address-list{margin-top: 10px; }
.cardlist-item .address-list ul.card-list{margin:10px 0;}
.cardlist-inner.wallet span.card-name {
	min-height: 75px;
}
.cardlist-inner.wallet span {
	display: block;
	padding: 0 10px 0 10px;
}
.supportedPayments{margin: 0 10px;}
.cardlist-flex .payment-btn-wrapper{justify-content: space-between;}
.supported-wrapper{display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start;}
.supported-wrapper .supportedPayments img{margin-top: 0;}
.card-name img{width: 50px;}
.default-info span{word-break: normal; font-size: .7em; font-style: italic; line-height: 1em; display: block; margin: 5px 0;}

.addnew{background:#fff; border: 0; margin-bottom: 10px;}
.addnew img{margin-right: 10px;}
.card-list *{word-break: break-all;}
.security-code{ position: relative; }
.security-code .whatsthis{position: absolute; font-size:.8em; font-style:italic; top: 3px; right: 5px; }
.flex-title{display: flex; flex-direction: column; align-items: center; justify-content: flex-start; }
.address-input{display: flex; align-items: center; justify-content: flex-start;}
.address-input span{ font-weight: bold; margin-left: 15px; color: #555; }
.creditCardFields.borderup{ border: 1px solid #ccc; padding:10px; }
.card-address1{display: block; word-break: break-word;}

.newaddress .btnWrapper{margin: 10px 0;}



/* Members Cart Item Details */

.orderHistory .cartItemDetails{display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; flex-direction: column;}
.orderHistory .cartItemDetails .contentExtra{display: block;}


@media only screen and (min-width:48em) {
	.accountBlocks.grid_5 {width:43%;}
	.accountBlocks.prefix_1 {margin-left:7%;}
	.accountBlocks.suffix_1 {margin-right:7%;}
	
	.accountBlocks .padLeft {padding-left:2.7%;}
	.accountBlocks .padRight {padding-right:2.7%;}

	.address-details, .addnew-address, .cardlist-item{width: calc(100% * (1/2) - 20px);}
	.flex-title{display: flex; flex-direction:row;}


	.orderHistory .cartItemDetails{flex-direction: row; justify-content: space-between; flex-wrap: nowrap; align-items: center;}

}

@media only screen and (min-width:60em) {
	.accountLandingDetailsWrpr .btnWrapper {position:absolute; right:0; bottom:0;}
	.address-details, .addnew-address, .cardlist-item{width: calc(100% * (1/3) - 20px); margin-top: 25px;}
	.cardlist-item{margin-top: 10px;}
	.manage-payments .addnew-address{width: calc(100% * (1/2) - 20px)}
}
/* ## 16px baseline (479px) m = medium ## */
@media only screen and (max-width:29.938em){
	.accountBlocks .inner {margin: 0 0;}
	.accountBlocks .blockhdng {left:0;}
	
	.accountLogin .accountBlocks .inner {margin: 0 0;}
	.accountLogin .accountBlocks .blockhdng  {left:0px;}	
	
	label.pseudo {display:none;}
	.label-pseudo {display:none;}
	
	.accountBlocks {min-height:0 !important;}
}

@media only screen and (min-width:11.250em) and (max-width:47.938em) {
	.cardInfo { 
		float:left;
		text-align: left;
		width:100%;
	}
	.accountBlocks .inner {margin:0;}
	.currentAccount {margin-bottom: 0;}
	.currentAccount .inner {padding-bottom:0;}
	.accountBlocks.grid_5.prefix_1 {min-height:0 !important; padding-top:80px;  }
	
	.accountLogin {background:none;}
	
}

@media only screen and (min-width:30em) and (max-width:47.938em) {
	.billingAddress .grid_5 {width:50%;}	
}

@media only screen and (min-width:11.250em) and (max-width:1199px) {
	.accountDetailsWrpr .grid_8 .grid_6 {width:100%;}
}

@media only screen and (min-width:30em) {
	.accountBlocks .w390 {width:100%; max-width:390px;}

}

.accountBlocks h4 {font-size:18px; }

.welcome-msg {
	color:#27468c; 
	font-weight:500; 
	position:absolute; 
	top:85px; 
	left:10px; 
	font-size:16px;
	line-height:1.2;
}

@media only screen and (min-width:48em) {
	.welcome-msg {top:60px; right:40px; left:auto; }
}

@media only screen and (min-width:65em) {
	.accountDetailsWrpr	.buttons .btn {min-width:300px;}
}

.table-uses {width:100%;}
.table-uses th {text-align:left;}
.table-uses td:last-child {width:50px;}

@media only screen and (min-width:30em) {
	.table-uses td:last-child {width:auto;}
}

.accountBlocks h3.order-date {font-size:1em; text-transform:none;}
.accountBlocks h3.order-date span {font-weight:500;}

.accountBlocks .blockhdng.address-book {margin-bottom:10px;}
.accountBlocks .blockhdng.address-book span {text-transform:none; font-weight:normal;}

@media only screen and (min-width:30em){
	.state-zip .state-field {padding-left:0;}
	.state-zip .zip-field {padding-right:0;}	
}
@media only screen and (min-width:30em) and (max-width:47.99em){
	.grid_6.state-zip {width:100%;}
}
@media only screen and (min-width:30em) and (max-width:63.99em){
	.two-column .grid_6.state-zip {width:100%;}
}
@media only screen and (min-width:48em) and (max-width:63.99em){
	.two-column .state-zip {padding-right:10px;}
	.two-column .state-zip .state-field {padding-right:2.7%;}
	.two-column .state-zip .zip-field {padding-left:2.7%;}
}	
@media only screen and (min-width:75em){
	.accountLogin .accountBlocks .blockhdng {font-size:24px;}
}	