.checkout{
    padding:160px 0 30px;
    min-height:900px;
    background:linear-gradient( 360deg,rgba(196,33,33,0.245) 5.58%,rgba(0,0,0,0) 105.86% ),#111317;
    color:#fff
}
.checkout hr{
    opacity:.1;
    border-color:#fff
}
.checkout .steps{
    padding:3rem 0
}
.checkout .steps .step_title{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    margin-bottom:2.5rem
}
.checkout .steps .step_title .step_number{
    width:60px;
    height:60px;
    border:solid 2px var(--exl-checkout-accent);
    border-radius:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-right:1rem;
    font-size:1.5rem;
    font-weight:600
}
.checkout .steps .step_title h3{
    font-size:1.5rem;
    font-weight:600;
    margin-bottom:0;
    width:100%;
    max-width:calc(100% - 80px)
}
.checkout .steps .cta_register{
    font-weight:500;
    text-decoration:underline;
    cursor:pointer
}
.checkout .steps .cta_register:hover{
    color:var(--exl-checkout-primary)
}
.checkout .steps .text_logged{
    font-size:1rem;
    color:rgba(white,.8)
}
.checkout .steps .text_logged span{
    color:#fff
}
.checkout .steps .cta_prepaid{
    text-align:center;
    padding-top:2rem;
    font-size:1.2rem
}
.checkout .steps .cta_prepaid a{
    color:#fff;
    text-decoration:underline
}
.checkout .steps .cta_prepaid a:hover{
    color:var(--exl-checkout-primary)
}
.checkout .steps .cta_prepaid#step_1{
    padding-bottom:2rem
}
.checkout .col_payment_methods{
    flex-basis:0;
    flex-grow:1;
    max-width:100%;
    padding-left:10px;
    padding-right:25px;
    order:1
}
.checkout .col_actions{
    width:100%;
    max-width:370px;
    padding-left:25px;
    padding-right:10px;
    position:relative;
    order:2
}
.checkout .col_actions .actions h2{
    margin-bottom:1rem
}
.checkout .col_actions .actions .currentPlan{
    margin-bottom:1.5rem
}
.checkout .steps.set_plans .list_plans{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    align-items:stretch;
    justify-content:center;
    position:relative
}
.checkout .set_auth{
    width:100%;
    max-width:802px;
    margin-left:auto;
    margin-right:auto
}
.checkout .password-strength-meter p#passwordStrengthTextLabel{
    color:var(--exl-footer-social-link)!important
}
.checkout .card_plan{
    padding:0 22px;
    width:100%;
    max-width:360px;
    position:relative
}
.checkout .card_plan .badge_best{
    position:absolute;
    width:max-content;
    background-color:var(--exl-checkout-accent);
    color:#fff;
    font-size:.8rem;
    top:-12px;
    left:50%;
    transform:translateX(-50%);
    z-index:1;
    border-radius:1.5rem;
    padding:.2rem 1rem;
    font-weight:500;
    text-transform:uppercase
}
.checkout .card_plan .label_card{
    min-width:315px;
    height:100%;
    cursor:pointer
}
.checkout .card_plan .label_card .card_body .fake-input{
    position:absolute;
    top:10px;
    right:10px;
    opacity:0
}
.checkout .card_plan .label_card .card_body{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    background-color:var(--exl-bg-darker);
    border-radius:12px;
    border:solid 1px var(--exl-checkout-gray);
    padding:50px 30px 30px;
    position:relative;
    text-align:center;
    height:100%
}
.checkout .card_plan .label_card.selected{
    cursor:not-allowed
}
.checkout .card_plan .label_card.selected .card_body{
    box-shadow:1px 1px 20px 1px var(--exl-checkout-primary);
    border:3px solid var(--exl-primary-red-500);
    background-color:rgba(44,6,6,.4)
}
.checkout .card_plan.current_plan .label_card.selected .card_body{
    background-color:var(--exl-bg-darker)
}
.checkout .card_plan .label_card.selected .card_body .fake-input{
    opacity:1
}
.checkout .card_plan .label_card .card_body .title{
    font-size:1.3rem;
    text-transform:uppercase;
    font-weight:500;
    letter-spacing:.2em;
    margin-bottom:.8rem
}
.checkout .card_plan.current_plan .label_card .card_body .title{
    color:var(--exl-checkout-accent)
}
.checkout .card_plan .label_card .card_body .discount{
    font-size:1.3rem;
    color:var(--exl-primary-red-500);
    font-weight:500;
    min-height:26px;
    margin-bottom:.3rem
}
.checkout .card_plan .label_card.selected .card_body .discount{
    color:var(--exl-primary-red-500)
}
.checkout .card_plan .label_card .card_body .discount .old_discount{
    text-decoration:line-through;
    color:#fff;
    opacity:.5
}
.checkout .card_plan .label_card .card_body .price{
    font-size:2.8rem;
    font-weight:700;
    margin-bottom:1rem
}
.checkout .card_plan .label_card .card_body .price .month{
    font-size:1.2rem
}
.checkout .card_plan .label_card .card_body .description{
    font-size:.8rem;
    margin-bottom:1rem;
    opacity:.8
}
.checkout .card_plan .label_card .card_body .description .total-price.old{
    text-decoration:line-through;
    color:#fff;
    opacity:.5
}
.checkout .card_plan .label_card .card_body .action .button{
    display:inline-block;
    font-weight:400;
    text-align:center;
    white-space:nowrap;
    vertical-align:middle;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    border:0;
    padding:.75rem 1.5rem;
    font-size:1rem;
    font-weight:700;
    line-height:1.5;
    border-radius:.25rem;
    cursor:pointer;
    transition:all .25s ease-in-out
}
.checkout .card_plan .label_card .card_body .action .button.btn_primary{
    background-color:var(--exl-primary-red-600);
    color:#fff
}
.checkout .card_plan .label_card .card_body .action .button.btn_primary:hover{
    background-color:var(--exl-primary-red-800)
}
.checkout .card_plan .label_card.selected .card_body .action .button.btn_primary{
    cursor:not-allowed;
    background-color:transparent;
    color:var(--exl-primary-red-500)
}
.checkout .card_plan .label_card .card_body .coupon_action span{
    text-decoration:underline;
    font-weight:500;
    margin-bottom:.4rem;
    display:block;
    cursor:pointer
}
.loader{
    position:fixed;
    width:100%;
    height:100%;
    top:0;
    left:0;
    display:flex;
    background-color:rgb(0 0 0/80%);
    align-items:center;
    justify-content:center;
    z-index:9
}
.checkout .form-group label{
    display:table;
    font-weight:300;
    margin-bottom:.3rem
}
.checkout .form-group .form-control:not(textarea){
    background-color:#ffffff!important;
    border:solid 1px rgba(255,255,255,.5)!important;
    border-radius:8px!important;
    padding:0 15px
}
.checkout .card_question{
    background-color:var(--exl-bg-darker);
    color:#fff;
    border:solid 1px var(--exl-checkout-gray);
    border-radius:8px;
    padding:24px
}
.checkout .card_question p{
    margin:18px 0 16px
}
.checkout .card_question .social_link{
    display:inline-flex;
    align-items:center;
    gap:14px
}
.checkout .card_question .social_link a svg path{
    transition:all ease .3s
}
.checkout .card_question .social_link a:hover svg path{
    stroke:var(--exl-checkout-accent);
    text-decoration:none
}
.checkout .paymethods_select .card_paymethod{
    background-color:var(--exl-neutral-gray-1000);
    color:#fff;
    cursor:pointer;
    width:100%;
    border-radius:8px;
    border:solid 1px var(--exl-neutral-gray-800)
}
.checkout .paymethods_select .card_paymethod .paymethod_item{
    padding:15px;
    margin:0;
    width:100%;
    cursor:pointer
}
.checkout button#btnLogin{
    width:100%;
    height:48px;
    font-weight:600
}
.checkout .cc-input-container{
    padding:15px
}
.checkout .cc-input-container ul{
    list-style:none;
    padding:0
}
.checkout #stripeElements .stripe-cards-inputs{
    max-width:100%;
    margin-left:0
}
.checkout #stripeElements .stripe-cards-inputs .StripeElement{
    display:flex;
    align-items:center;
    background-color:#fff!important
}
.checkout #stripeElements .stripe-cards-inputs .__PrivateStripeElement{
    width:100%
}
.checkout button#btnRegister{
    width:100%;
    max-width:200px;
    height:48px;
    font-weight:600
}
.checkout .disabled{
    pointer-events:none;
    filter:grayscale(1)
}
.checkout .google_login{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    margin-bottom:-.8rem;
    margin-top:48px
}
.checkout .google_login .sub-heading-borderless{
    width:100%
}
.checkout .google_login .providerPreLinking{
    order:1;
    padding:15px 0
}
.checkout .google_login .btn-google{
    padding:0
}
.checkout .google_login .sub-heading-borderless+p.small.text-center.text-muted{
    width:100%;
    order:2;
    margin-bottom:0
}
.checkout .google_login .providerLinkingFeedback{
    order:2;
    margin-top:20px
}
.checkout .gateway_flags{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:flex-end
}
.checkout .gateway_flags .flag{
    width:55px;
    background-color:var(--exl-neutral-gray-200);
    height:30px;
    border-radius:5px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-right:10px;
    padding:0 5px
}
.checkout .gateway_flags .flag img{
    max-width:100%;
    height:auto;
    max-height:25px
}
.checkout .payment_disabled a{
    color:var(--exl-checkout-accent)
}
@media(max-width:768px){
    .checkout .card_plan{
        margin-bottom:30px
    }
    .checkout .card_plan:last-child{
        margin-bottom:0
    }
}
#btnUpdate{
    width:100%;
    max-width:200px;
    height:48px;
    font-weight:600
}
#frmGeneratePassword .modal .modal-dialog .modal-content{
    background-color:var(--exl-primary-lighter);
    color:#fff
}
#frmGeneratePassword .modal .modal-dialog{
    width:100%;
    min-height:calc(100% - 3.5rem);
    display:flex;
    align-items:center
}
#frmGeneratePassword .modal .modal-header{
    background-color:#1a1a1a!important;
    border-bottom:0
}
#cvv-field-container button.btn.btn-default{
    background-color:#8a0e10;
    color:#fff;
    font-weight:600;
    padding:5px 12px;
    border-radius:5px;
    border:0;
    margin-top:5px;
    font-size:.8rem;
    outline:none!important
}
.checkout_completed{
    padding:180px 0 120px;
    background:linear-gradient(0deg,rgba(196,33,33,0.24) 21.06%,rgba(0,0,0,0.00) 100%),#0B0C0F;
    background-blend-mode:difference,normal;
    min-height:900px
}
.checkout_completed .order{
    padding:14px;
    border-radius:8px;
    border:1px solid rgba(17,19,23,.5);
    background:rgba(17,19,23,.5);
    box-shadow:0 1px 1px 0 rgba(18,18,18,.3);
    color:#fff;
    font-size:20px;
    font-weight:400;
    line-height:30px;
    margin:25px 0 40px
}
.checkout_completed .support{
    text-align:center;
    font-size:18px;
    font-weight:400;
    line-height:32px
}
.checkout_completed .support a{
    color:var(--exl-footer-social-link)
}
.checkout_completed .order-confirmation{
    width:100%;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    color:#1bbc82;
    margin:52px 0 0;
    border-radius:4px;
    border:1px solid #0e5e41;
    background:rgba(10,70,49,.6);
    backdrop-filter:blur(6px)
}
.checkout_completed h4{
    margin:40px 0
}
.checkout .plan--price{
    padding:0;
    list-style:none
}
.checkout .plan--price-value{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
    -webkit-flex-direction:row;
    -ms-flex-direction:row;
    flex-direction:row;
    -webkit-box-pack:center;
    -webkit-justify-content:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-align:center;
    -webkit-align-items:center;
    -ms-flex-align:center;
    align-items:center;
    gap:8px;
    font-size:2.8rem;
    font-weight:700;
    line-height:54px
}
.checkout .plan--price-value .month{
    font-size:1.2rem
}
.checkout .plan--price-discounted{
    font-size:24px;
    font-weight:300;
    line-height:22px;
    text-decoration:line-through;
    color:var(--exl-neutral-gray-400)
}
.checkout .plan--price-coupon-applied{
    font-size:13px;
    font-weight:400;
    line-height:22px;
    color:var(--exl-primary-red-500)
}
.checkout .plan--price-coupon-applied__invalid{
    color:var(--exl-neutral-gray-400)
}
.checkout .plan--price-coupon-applied__selected{
    font-size:14px;
    color:var(--exl-sucess-green-400)
}
.checkout .plan--description{
    padding:0;
    list-style:none;
    font-size:14px;
    font-weight:400;
    line-height:24px;
    color:var(--exl-neutral-gray-500)
}
.checkout .plan--description .plan--promotional-price{
    font-weight:500;
    color:var(--exl-neutral-gray-400)
}
.checkout .plan--description-coupon-fullprice{
    font-size:14px;
    font-weight:500;
    line-height:18px;
    color:var(--exl-neutral-gray-200)
}
.checkout .plan--description-fullprice{
    font-size:14px;
    font-weight:400;
    line-height:18px;
    color:var(--exl-neutral-gray-400)
}
.plan--renewal-alert{
    display:block;
    color:var(--exl-neutral-gray-300)
}
