/*
    --- 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 Page Styling ------------- */
/*-- Designer: Sanju | Purpose: Subscription Page Design --*/

body.subscription-page {background:#f7f7f7}
.packages-content-area{-webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;}
.browser-center{ width:1140px; margin: 0 auto;}
.packages-question, .packages-content, .packages-content-area, .packages-header, .packages-pricing, .packages-validation, .packages-description, .packages-subscribe-button{width:100%; float:left; }
.packages-content{display:table; text-align:center;}
.packages-block{ width:31.80%; /*display:table-cell;*/  display:inline-block; border: 1px solid #e5e5e5; border-radius:4px; position:relative; padding:62px 30px 30px 30px; -moz-border-radius:4px; -ms-border-radius:4px; overflow:hidden; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;}
.packages-content-area{ background:#fff; padding:70px 80px 74px 80px; /*margin:80px 0;*/ border-radius:4px; -moz-border-radius:4px; -ms-border-radius:4px; border:1px solid #e5e5e5;}
.packages-header{background-color:#b2b2b2; text-transform:uppercase; position:absolute; left:0; top:0; }
.packages-header h1{color:#fff; margin:21px 0; font-size:16px; font-weight:600;   font-family: 'futura_md_btmedium'; letter-spacing: 1px; }
.packages-pricing{ font-family: 'futura_md_btmedium';}
.packages-pricing h4{ font-size:55px; font-weight:600; position: relative; color:#292929; text-transform:uppercase; font-family: 'futura_md_btmedium'; margin:0; padding:45px 0 57px 0; border-bottom:1px solid #e5e5e5;}
.packages-description{margin-top:22px;}
.packages-pricing .packages-validation{ font-size:18px; text-transform:capitalize; font-family: 'futura_bk_btbook'; font-weight:400; color:#4d4d4d;}
.packages-description{min-height: 88px; margin-bottom:43px; overflow-x: hidden; overflow-y:auto; min-height: 255px;}
.packages-description p{font-size:14px; color:#4d4d4d; font-family: 'futura_bk_btbook'; text-align: left; line-height:22px; letter-spacing:0.2px; margin-bottom:0;}
.subscription-page .packages-description p{line-height:17px;}
.younique-primary-btn{background:#ed1a26; color:#fff; border-radius:2px; }
.younique-btn{height:48px; line-height:23px; text-align:center; outline:none; border:none; padding:12px 48px; letter-spacing:1px; cursor:pointer;}
.packages-subscribe-button button{ min-width:100%;}
.packages-block + .packages-block{margin-left:2.30%;}
/* .packages-block:last-child{float:right;} */
.packages-content-area > h3{ font-size:40px; font-family: 'futura_bk_btbook'; text-align:center; margin-bottom:0; color:#292929;}
.packages-content-area > p{color:#4d4d4d; font-family: 'futura_bk_btbook'; text-align:center; font-size:16px; padding-top:4px; margin-bottom:78px;}

.silver-package{background-color:rgba(178, 178, 178, 0.10)!important;}
.silver-package .packages-header{background:#b2b2b2 !important;}
.silver-package .packages-subscribe-button .younique-primary-btn{ background:#b2b2b2;}

.gold-package{background-color:rgba(199, 166, 0, 0.10)!important;}
.gold-package .packages-header{background:#c7a600 !important;}
.gold-package .packages-subscribe-button .younique-primary-btn{ background:#c7a600;}

.platinum-package{background-color:rgba(255, 23, 38, 0.10)!important;}
.platinum-package .packages-header{background:#ff1726 !important;}
.platinum-package .packages-subscribe-button .younique-primary-btn{ background:#ff1726;}

.packages-question{padding-top:45px;}
.packages-question h6{ color:#292929; font-size:20px; font-family: 'futura_bk_btbook'; font-weight:400; text-align:center; margin-bottom:5px;}
.packages-question ul{ color:#4d4d4d; font-size:13px; margin:0; padding:0; text-align:center; font-family: 'futura_bk_btbook';}
.packages-question ul li{ list-style:none; display:inline-block; position:relative;}
.packages-question ul li.email, .packages-question ul li.call{ padding-left:25px;}
.packages-question ul li.email:before, .packages-question ul li.call:before{content:""; height:16px; width:16px; position:absolute; top:3px; left:0; background-image: url("../../images/younique-sprite.png"); background-repeat:no-repeat;}
.packages-question ul li.email:before{ background-position:0 2px;}
.packages-question ul li.call:before{ background-position:0 -21px;}
.packages-question ul li a{ color:#ff1726;}
.or{ padding:0 10px;}
.width-893{width:893px; margin:0 auto;}

.subscribed-two-plan-576{width: 576px; margin:0 auto;}
.subscribed-two-plan-576 .packages-block{width:283px;}
.subscribed-two-plan-576 .packages-block + .packages-block{margin-left: 10px;}
.subscribed-one-plan-283{width:283px; margin:0 auto;}
.subscribed-one-plan-283 .packages-block{width:100%;}

@media(max-width:780px){
	.width-893{ width:100%}
	.browser-center{ width:95%}
	.packages-content-area{padding:35px 20px 17px 20px !important; margin-top:0;}
	.packages-block{padding:62px 15px 15px 15px;-webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;}
	.packages-block + .packages-block{margin-left:0; margin-top:20px;}
	.packages-content-area > p{margin-bottom:40px;}

	.packages-question{padding-top: 25px;}
	.subscription-page .container{max-width:100%;}
	.packages-block{ width:33.0%}
	.subscription-page .younique-btn{ white-space:nowrap; width:100%; float:left; margin-top:0; padding: 12px 0;}
	.packages-block + .packages-block{margin-top:0; margin-left:0.5%}
}

@media(max-width:760px){
	.packages-block, .subscribed-two-plan-576, .subscribed-two-plan-576 .packages-block, .width-586, .subscribed-plan-content .susbscribe-plan-col{ width:100% !important;}
	.packages-question h6{text-align:left;}
	.packages-question ul li{ width:100%; float:left; text-align:left;}
	.packages-block + .packages-block, .subscribed-two-plan-576 .packages-block + .packages-block{margin-left:0}
	.packages-block + .packages-block{margin-top:20px; margin-left:0}
	.packages-content-area > p{font-size:12px;}
	.packages-content-area > h3{font-size:28px;}
	.thank-you-content-area{padding: 20px 20px 24px 20px !important;}
	.subscribed-plan-content .susbscribe-plan-col + .susbscribe-plan-col{padding-left:0 !important; padding-top:20px;}
	.subscribed-plan-content{text-align:center;}
}

.subscription-page .younique-btn{-webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;}

/* Thank You Page UI */
.start-yourjournety, .your-payment, .payment-check-icon, .payment-successful, .thankyou-plan-content,.subscribed-plan-content, .thank-you-content-area, .thank-you-status-content{ width:100%; float:left;}
.start-yourjournety{text-align:center;}
.start-yourjournety .btn{ margin:0 auto; width:256px;}
.payment-status-header{color:#808080; text-transform:uppercase; text-align:center; font-size:12px;}
.payment-check-icon{position:relative; height:85px; float:left;}
.payment-check-icon:before{width: 85px; height: 85px; content:""; background-image: url("../../images/younique-sprite.png"); background-position: 2px -42px; position:absolute; left:50%; margin-left:-43px; }
.payment-successful{font-size:32px; color:#292929; text-align:center; margin-bottom:0;}
.your-payment{font-size:14px; color:#292929; text-align:center; margin-bottom:0;}
.your-payment span{color:#009933;}
.subscribed-plan-content .susbscribe-plan-col{ width:33.3%; float:left;}
.subscribed-plan-content p{margin:0;}
.subscribed-plan-heading{font-size:12px; color:#999999;}
.subscribed-plan-name{font-size:14px; color:#292929;}
.width-586{width:586px; margin:0 auto}
.thank-you-content-area{ background:#fff; padding:70px 80px 74px 80px; margin:0; border-radius:4px; -moz-border-radius:4px; -ms-border-radius:4px;}
.thank-you-status-content{ padding-bottom:32px; }
.subscribed-plan-content{padding:40px 0; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; margin-bottom:40px;}
.line-strike { text-decoration: line-through; font-size: 20px; color: #808080; float: left; margin-top: 28px; }
.subscribed-plan-content .susbscribe-plan-col + .susbscribe-plan-col{ padding-left:70px;}
.packages-pricing  .line-strike{ width:100%; text-align:center; position: absolute; left:0; top:-8px;}
.gdlr-item-start-content{padding-bottom:40px;}
.subscription-page .expiration-date-left .form-input{border: 1px solid #b2b2b2 !important; color: #888 !important;}
.add-credit-card-number .card_icon{top: 29px;}