/*
    --- Color Guide
    Crimson     : #Ff1726   Normal Red
    Torch Red   : #Fc3240   Bright Red
    Mine Shaft  : #292929   Dark Gray
    Squirrel    : #908679   Dull Goldish Gray
    Tundora     : #4D4D4D   Normal Gray
    Dusty Gray  : #999999   Light Gray
    Seashell    : #c23030   Dull Red
*/


/* ------------- Subscription Payment Page Styling ------------- */
/*-- Designer: Sanju | Purpose: Subscription Payment Page Design | Dated: Nov 30, 2017 --*/

body{font-family: 'futura_bk_btbook';}
.subscription-page div, .subscription-payment-page div{-webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;}
.payment-status-content, .activate-subscription-header, .plan-is-right, .younique-plan-description, .plan-renews-description, .auto-renewal-header, .payment-method-content, .add-credit-card-body, .add-credit-card-header, .add-credit-card-content, .card-row, .have-promo-code, .your-card-charged, .apply-subs-promo-code, .add-credit-card-number, .renewal-switch, .add-credit-card-block, .credit-card-already-added, .container-row, .profile-content-area, .address_item, .shipping-address-actions, .address-person-name, .address-full, .add-address-btn, .form-padding-20{ width:100%; float:left;}
.payment-status-content{ border-bottom:solid #e5e5e5 1px;  padding-bottom:32px; margin-bottom:54px;}
.activate-subscription-header{color:#292929; font-size:40px; line-height:40px; margin-bottom:0;  font-family: 'futura_bk_btbook'; text-align:center;}
.plan-is-right{color:#4d4d4d; font-size:16px;  font-family: 'futura_bk_btbook'; text-align:center;  margin-bottom:0; padding-top:12px; }

.subscription-payment-page .packages-content-area{ padding:60px 80px 74px 80px; }
.subscription-page .packages-content-area{ padding:39px 80px 44px 80px; margin-bottom:40px;}
.subscription-page .packages-content-area > p{ margin-bottom:42px;}
.payment-status-content-left{ width:360px; padding:50px; float:left; background-color:rgba(229, 229, 229, 0.30); margin-right:50px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.payment-status-content-right{ width: calc(100% - 410px); float:right;}
.width-961{ width:960px; margin:0 auto;}
.younique-plan-name{font-family: 'futura_md_btmedium'; font-weight:500; text-transform:uppercase; font-size:18px;}
.younique-plan-price{font-size:55px; padding-top:31px; line-height:60px; font-weight:600; color:#292929; text-transform:uppercase; font-family: 'futura_md_btmedium'; margin:0;  letter-spacing: -7px;}
.younique-plan-validation{color:#4d4d4d; font-size:18px; padding-top:7px;  font-family: 'futura_bk_btbook'; margin-bottom:31px;}
.younique-plan-description { font-size: 14px; color: #4d4d4d; line-height: 18px; border-bottom: 1px solid #e5e5e5; border-top: 1px solid #e5e5e5; padding: 30px 0;}
.plan-renews-description .renew-content-left{width: calc(100% - 30%); float:left; padding-right:37px;}
.plan-renews-description .renew-content-right{width:30%; float:right;}
.plan-renews-description .renew-content-left > h2, .renew-content-left > p{color:#4d4d4d; font-size:12px; font-family: 'futura_bk_btbook';}
.plan-renews-description .renew-content-left > h2{margin-bottom:0;}
.renew-content-left > p{line-height:15px; padding-top:4px; margin-bottom:0;}
.renew-content-left > p a{color:#ff1726;}
.auto-renewal-header{font-family: 'futura_md_btmedium'; font-weight:500; text-transform:uppercase; font-size:10px; padding-bottom:0; margin-bottom:0;}
.select-payment-method-header{color:#4d4d4d; font-size:16px; /* font-family: 'futura_bk_btbook'; */ margin-bottom:0; padding-bottom:28px; border-bottom:1px solid #e5e5e5;}
.subscription-page .select-payment-method-header{font-size:18px; font-weight:500;}
.payment-credit-card, .payment-paypal{ float:left; width:50%}
.payment-paypal{ border-left:1px dotted #1a1a1a;}
.payment-method-content{padding:25px 17px 25px 17px;}
.payment-credit-card label, .payment-paypal label{color:#292929 !important; font-size:13px; text-transform:Uppercase;  font-family: 'futura_bk_btbook';}
.credit-card-type-icon{width:175px; height:28px;  background-image: url("../../images/younique-sprite.png"); background-repeat:no-repeat; background-position:-35px 0; margin-left:26px; margin-bottom:0; margin-top:5px;}
.payment-paypal .credit-card-type-icon{ background-position:-210px 0; width:44px; height:28px;}
.payment-paypal{padding-left:20%;}
.add-credit-card-header{ padding:15px; background:#f7f7f7; font-size:15px; color:#292929; border:1px solid #e5e5e5;}
.add-credit-card-body{ padding:20px 15px; border:1px solid #e5e5e5; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.add-credit-card-left{ width:50%; float:left;}
.input-label{color:#292929; font-size:14px; padding-bottom:2px;}
.page-template-profile .input-label{line-height:11px;}
.subscription-page .form-input, .subscription-payment-page .form-input, .profile-input, .select-input-style select{border:1px solid #b2b2b2; border-radius:2px; padding:10px 10px 9px 10px !important; width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.add-credit-card-body .card-row + .card-row{ margin-top:21px;}
.card-row .add-credit-card-left{ padding-right:7px;}
.card-row .add-credit-card-left + .add-credit-card-left{ padding-left:7px; padding-right:0;}
.expiration-date-left{ width:70%; float:left;}
.expiration-date-right{ width:25%; float:right;}
.expiration-date-right .add-credit-card-left{ width:100%;}

.your-plan-none h4 { font-size: 24px; text-align: center;}

.have-promo-code{ color:#292929; font-size:13px; padding:39px 0 0 0;}
.have-promo-code a{ color:#ff1726;}
.your-card-charged{ padding:35px 0 25px 0;}
.your-card-charged h6{color:#292929; margin-bottom:0;font-size: 14px; font-weight: 500;}
.your-card-charged p{ color:#4d4d4d; line-height:15px; font-size:12px; padding-top:6px; margin-bottom:0;}
.btn-primary, input.button.btn-primary, html .woocommerce input.button.btn-primary, html .woocommerce-page input.button.btn-primary{ border:none !important;}
.min-width-246{min-width:246px;}
.subs-apply-promo{ width:230px; float:left;}
.subs-apply-promo .form-input{width:calc(100% - 80px); border-radius: 2px 0 0 2px; -moz-border-radius: 2px 0 0 2px; -ms-border-radius: 2px 0 0 2px }
.subs-apply-promo .btn{ float:right; min-width:80px; border-top-left-radius: 0; border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -webkit-border-bottom-left-radius: 0; -ms-border-top-left-radius: 0; -ms-border-bottom-left-radius: 0;}
.add-credit-card-number .form-input{padding-right:60px !important;}
.add-credit-card-number{position:relative;}
.card-icon{width: 44px; height: 28px; position:absolute; background-image: url("../../images/younique-sprite.png"); background-position: -36px -2px; left: 45px; top: 12px;}
/* .card-icon{ width: 44px; height: 28px; position:absolute;  background-image: url("../../images/younique-sprite.png");} */
/* .credit-card-type-icon{ background-position:-210px 0; width:44px; height:28px;} */
.already-added{position:relative;}
/* .card-icon{width:44px; height:28px; position:absolute;  background-position: -36px -2px; background-image: url("../../images/younique-sprite.png"); margin:0; left: 45px; top: 14px;} */

.already-added [type="radio"]:checked + label, .already-added [type="radio"]:not(:checked) + label{ padding-left:85px;}
.delete-credit-card{width:14px; height:14px; position:absolute;  background-position: -90px -46px; background-image: url("../../images/younique-sprite.png"); margin:0; right: 15px; top: 20px; cursor:pointer;}
.already-added [type="radio"]:checked + label:before, .already-added [type="radio"]:not(:checked) + label:before{ width:16px; height:16px;}
.already-added [type="radio"]:checked + label:after, .already-added [type="radio"]:not(:checked) + label:after{width: 10px; height: 10px;}
.padding-top-zero{padding-top:0}
.credit-card-already-added .expiration-date, .credit-card-already-added .expiration-date-right{ float:left; width:100%;}
.credit-card-already-added .add-credit-card-left{ width:151px; padding-right:0;}
.credit-card-already-added .card-row{ padding:0 40px 0 45px; /* border-top:1px solid #e5e5e5;  margin-top:28px;*/}
.card-total-amount{ width:148px; padding-top:7px; margin-left:30px; float:left; font-size:13px; color:#4d4d4d;}
.card-total-amount span{ color:#292929; font-size:15px;}
.pay-now-btn{ width:100px; float:right;}
.pay-now-btn .btn{ min-width:100%;}
.credit-card-already-added .add-credit-card-body{ padding:20px 0;}
.credit-card-already-added .apply-subs-promo-code{ padding:0 40px 0 45px;}
.paypal-content .have-promo-code{ width: 100%; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;}
.paypal-icon{position:relative; width:100%; float:left; margin:0; padding:0 0 0 50px;}
.paypal-icon:before{width:44px; height:28px; position:absolute; content:"";  background-position: -210px -2px; background-image: url("../../images/younique-sprite.png"); margin:0; left: -3px; top: 0;}
.paypal-content .have-promo-code p{margin:0; padding:7px 15px 0 15px; float:left; line-height: 11px;}
.paypal-content .card-total-amount{ font-size:20px; margin-left:0; width:300px; max-width: 100%; padding-top:14px; line-height:16px;}
.paypal-content .card-total-amount span { color: #292929; font-size: 20px; font-weight:500; font-family: 'futura_md_btmedium';}
.paypal-content .card-row{padding:16px 15px 0 15px;}
.paypal-content .pay-now-btn{}

@media(max-width:991px){
.subscription-page .packages-content-area{margin-bottom:0;}
}
@media(max-width:780px){
.width-961, .payment-status-content-left{ width:100%; float:left;}
.payment-status-content-left{margin-right:0; margin-bottom:25px;}
.payment-status-content-right{ width: calc(100% - 0px);}
.subscription-payment-page .packages-content-area{padding:35px 20px 17px 20px}
}
@media(max-width:700px){

	.add-credit-card-left, .expiration-date-right, .expiration-date-left, .payment-credit-card, .payment-paypal, .plan-renews-description .renew-content-right, .subs-apply-promo, .credit-card-already-added .add-credit-card-left, .card-total-amount, .pay-now-btn{ width:100%;}
	.card-row .add-credit-card-left{padding-right:0;}
	.card-row .add-credit-card-left + .add-credit-card-left{padding-left:0; margin-top:21px;}
	.expiration-date-left .add-credit-card-left{ width:50%; padding-right:7px;}
	.expiration-date-left .add-credit-card-left + .add-credit-card-left{ padding-right:0; padding-left:7px; margin-top:0;}
	.card-security-code{ margin-top:21px;}
	.payment-paypal{ padding-left:0; padding-top:25px; margin-top:25px; border-left:none; border-top: 1px dotted #1a1a1a;}
	.plan-renews-description .renew-content-left{width: calc(100% - 0px); padding-right:0;}
	.payment-status-content-left{padding:25px;}
	.plan-renews-description .renew-content-right{padding-top:25px;}
	.auto-renewal-header{ width:50%; float:left; padding-top: 6px;}
	.renewal-switch{ width:auto; float:right;}
	.younique-plan-price{padding-top:0;}
	.younique-plan-validation{margin-bottom: 16px;}
	.younique-plan-description{ padding:15px 0;}
	.payment-status-content{margin-bottom: 27px;}
	.min-width-246{ min-width:100%;}
	.apply-subs-promo-code, .credit-card-already-added .card-row{padding-right:15px; padding-left:15px;}
	.card-total-amount{margin-left:0; padding: 15px 0;}
	.credit-card-already-added .card-security-code{ margin-top:0;}
	.paypal-content .card-total-amount{ width:100%; float:left;}
	.paypal-content .card-total-amount{margin-bottom:15px;}

}
/*
.onoffswitch{position:relative;width:61px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;}
.onoffswitch-checkbox{display:none;}
.onoffswitch-label{display:block;overflow:hidden;cursor:pointer;border:1px solid #999999;border-radius:100px; margin-top:3px;}
.onoffswitch-inner{display:block;width:200%;margin-left:-100%;transition:margin 0.3s ease-in 0s;}
.onoffswitch-inner:before, .onoffswitch-inner:after{display:block;float:left;width:50%;height:23px;padding:0;line-height:23px;font-size:11px;color:white;font-family:Trebuchet, Arial, sans-serif;font-weight:bold;box-sizing:border-box;}
.onoffswitch-inner:before{content:"On"; font-family: 'futura_bk_btbook'; text-transform:uppercase; padding-left:10px;background-color:#339966;color:#FFFFFF;}
.onoffswitch-inner:after{content:"Off"; font-family: 'futura_bk_btbook'; text-transform:uppercase; padding-right:10px;background-color:#f7f7f7;color:#999999;text-align:right;}
.onoffswitch-switch{display:block;width:15px;height:15px;margin:4px;background:#FFFFFF;position:absolute;top:0;bottom:0;right:34px;border:1px solid #999999;border-radius:100px;transition:all 0.3s ease-in 0s;}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner{margin-left:0;}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch{right:0px;}
*/
.subscription-page .gdlr-item.gdlr-main-content {
    margin-bottom: 40px;
}
.gdlr-item-start-content{padding-top:40px;}
.subscription-page .gdlr-item{ margin-left:0; margin-right:0;}
.dialog-content-position{width:451px !important;}
.dialog-content-position .dialog-body p{ margin-bottom:0; line-height:24px !important;}
.dialog-footer .btn + .btn{margin-left:13px;}
.dialog-footer .btn{cursor:pointer;}
.add-address-container-row .col-profile .input-label, .add-address-container-row .col-profile-100 .input-label { padding-bottom: 2px;}
.add-address-container-row .container-row { padding-bottom:10px;}
#deactivate-subscription-dialog ul.reason-content{ float:left; width:100%;}

/* one item */
.packages-block:first-child:nth-last-child(1) {
    width: 31.80%;
}

/* two items */
.packages-block:first-child:nth-last-child(2),
.packages-block:first-child:nth-last-child(2) ~ .packages-block {
  width: 31.80%;
}

/* three items */
.packages-block:first-child:nth-last-child(3),
.packages-block:first-child:nth-last-child(3) ~ .packages-block {
     width: 31.80%;
}