﻿/*****Personal Area*******/

/*Cancel Popup*/
.cancel_sub_popup { display: none; text-align: center; }
    .cancel_sub_popup .popup { max-width: 550px; width: 100%; border-radius: 5px; }
/*End Cancel Popup*/

.like_a { margin: 0; padding: 0; font-size: 100%; vertical-align: top; background: transparent; text-decoration: none; color: inherit; font-weight: 100; border: none; cursor: pointer; }
.left { float:left!important;}
.red_button { border: none; padding: 5px 15px; text-align: center; color: #fff; cursor: pointer; font-family: 'Heebo',sans-serif; font-size: 1.2em; font-weight: 700; vertical-align: bottom; box-sizing: border-box; border-radius: 0; }

.personal_register { }
    .personal_register form .form_border { border: 1px solid #a2a2a2; padding: 20px 10px; box-sizing: border-box; width: 100%; margin-bottom: 10px; }
.all_tables_conti { width: 100%; padding: 15px 30px; box-sizing: border-box; }

.payment_method_conti form > ul > li input { border: 1px solid #a2a2a2; }

.register_conti  form .form_border > ul > li { width: 24%; margin-left: 1.3%; position: relative; float: right; }
    .register_conti  form .form_border > ul > li input { width: 100%; font-size: 17px; color: #1b1b1b; border: 2px solid #afb1b3; padding: 7px 10px; }
    .register_conti  form .form_border > ul > li button { width: 100%; background-color: #f26522; border-radius: 20px; border: none; }
    .register_conti  form .form_border > ul > li:last-child { margin: 0; }

.personal_nav { padding: 20px 0; box-sizing: border-box; color: #386990; font-size: 2em; }
    .personal_nav ul { }
        .personal_nav ul li { float: right; margin-left: 20px; }
            .personal_nav ul li:last-child { margin-left: 0; }
            .personal_nav ul li button { line-height: 100%; height: auto; }
            .personal_nav ul li a { font-weight: 100; }
                .personal_nav ul li a.active { font-weight: 700; }
/*Main*/
.register_conti { }
    .register_conti form .form_border > ul { max-width: 80%; }
        .register_conti form .form_border > ul > li { width: 24%; margin-left: 1.3%; position: relative; }
            .register_conti form .form_border > ul > li button { width: 100%; background-color: #386990; border-radius: 0;display:block;line-height:38px;padding:0 10px;box-sizing:border-box; }
            .register_conti form .form_border > ul > li .update_p { color: #4bb902; display: block; padding-top: 13px; box-sizing: border-box; background-color: transparent; border: none; border-radius: 0; cursor: pointer; width: auto; }
                .register_conti form .form_border > ul > li .update_p:hover, .personal_register form .form_border > ul > li .update_p:focus { outline: 0; color: #26255f; }
/*End Main*/
/*My Subscriptions*/
.my_subscriptions { }
    .my_subscriptions form { border: 1px solid #a2a2a2; padding: 20px; box-sizing: border-box; margin-bottom: 20px; }
        .my_subscriptions form > h2 { font-size: 2em; margin-bottom: 20px; font-weight: 700; }
        .my_subscriptions form .subscription_conti { margin-bottom: 40px; }
            .my_subscriptions form .subscription_conti li { font-weight: 500; font-size: 1.5em; padding-bottom: 20px; }
                .my_subscriptions form .subscription_conti li strong { }
                .my_subscriptions form .subscription_conti li span { color: #aadaed; }
                .my_subscriptions form .subscription_conti li a { font-weight: 300; color: #a2a2a2; }

        .my_subscriptions form .choose_period { }
            .my_subscriptions form .choose_period button { display: inline-block; color: #fff; background-color: #4bb902; border-radius: 20px; vertical-align: top; margin: 35px 20px 0 0; }
            .my_subscriptions form .choose_period input { border: 1px solid #a2a2a2; }
            .my_subscriptions form .choose_period ul li button { margin-top: 0; }

    .my_subscriptions .promotion {font-size:1.5em;margin-bottom:20px; }
        .my_subscriptions .promotion > strong { }
        .my_subscriptions .promotion > span > span {font-size:0.75em; }
    .my_subscriptions .promotion > a {color:#4bb902; font-weight:500;text-decoration:underline;}
        .my_subscriptions .promotion > a:hover, .my_subscriptions .promotion > a:focus {color:#f26522; }

.extend_sub_popup {position:fixed;width:100%;height:100%;top:0;right:0;z-index:10000;overflow-y:auto; padding:50px 10px 0 10px;box-sizing:border-box;background-color:rgba(56, 105, 144, 0.8);display:none;}
    .extend_sub_popup .popup { position:relative;width:100%;max-width:550px;background-color:#fff;border-radius:10px;padding:40px 20px;box-sizing:border-box;margin:0 auto;}
        .extend_sub_popup .popup .close_popup { position:absolute;left:10px;top:10px;}
        .extend_sub_popup .popup > h2 { display:block;text-align:center;font-size:1.5em;margin-bottom:20px;font-weight:500;}
        .extend_sub_popup .popup > p { text-align:center;display:block;font-size:1.2em;margin-bottom:20px;line-height:120%;}
        .extend_sub_popup .popup .buttons_conti { }
            .extend_sub_popup .popup .buttons_conti > ul {text-align:center; }
                .extend_sub_popup .popup .buttons_conti > ul > li { display:inline-block;vertical-align:middle;width:40%;}
        .extend_sub_popup .popup .buttons_conti  > ul > li > * { display:block;padding:10px !important;font-size:1.2em;font-weight:500;color:#fff !important;height:auto;line-height:normal;border-radius:5px;width:100%;border:none;cursor:pointer;}
                    .extend_sub_popup .popup .buttons_conti > ul > li > *.button1 {background-color:#4bb902; }
                        .extend_sub_popup .popup .buttons_conti > ul > li > *.button1:hover, .extend_sub_popup .popup .buttons_conti > ul > li > *.button1:focus {opacity:0.8; }

.loader {display:none; border: 5px solid #f3f3f3; border-top: 5px solid #3498db; border-radius: 50%; width: 10px; height: 10px; animation: spin 2s linear infinite; vertical-align: top; margin-top: 3px; }
    .loader.active { display: inline-block; }
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
/*End My Subscriptions*/

/*Payment Methods*/
.payment_method_conti { }
    .payment_method_conti form { border: 1px solid #a2a2a2; padding: 20px; box-sizing: border-box; }
        .payment_method_conti form > h2 { font-size: 2em; margin-bottom: 20px; font-weight: 700; }
            .payment_method_conti form > h2 span { color: #aadaed; }
        .payment_method_conti form ul { max-width: 400px; width: 100%; }
        .payment_method_conti form > ul > li { float: right; width: 100%; position: relative; margin-bottom: 10px; }
            .payment_method_conti form > ul > li:nth-child(2) { width: 60%; margin-left: 2%; }
            .payment_method_conti form > ul > li:nth-child(3) { width: 38%; }
            .payment_method_conti form > ul > li input { border: 1px solid #a2a2a2; width: 100%; padding: 8px 10px; box-sizing: border-box; font-size: 17px; font-family: 'Heebo',sans-serif; color: #1b1b1b; }
            .payment_method_conti form > ul > li i { position: absolute; color: #a2a2a2; top: 10px; font-size: 1.2em; left: 10px; pointer-events: none; }
        .payment_method_conti form ul li [data-role='cc-date'] { padding: 0 10px; font-size: 17px; line-height: 43px; }
            .payment_method_conti form ul li [data-role='cc-date'] input { padding: 0; }
            .payment_method_conti form ul li [data-role='cc-date'] > ul { line-height: 1; }
        .payment_method_conti form .error { color: #386990; font-weight: 700; margin-bottom: 10px; }
        .payment_method_conti form .massage { color: green; font-weight: 700; margin-bottom: 10px; }
        .payment_method_conti form button { background-color: #386990; }
/*End Payment Methods*/

/**/
.choose_period_conti { }
.tbl { display:table;width:100%;table-layout:fixed;max-width:700px;}
.tbl > * { display:table-cell;vertical-align:middle;padding-left:10px;box-sizing:border-box;}
    .tbl button { margin: 0 !important; width: 100%; background-color: #386990 !important; border-radius: 0 !important; display: block; line-height: 38px; padding: 0 10px; box-sizing: border-box; color:#fff !important;}

/*****End Personal Area*******/

@media only screen and (max-width : 500px) {
    .register_conti form .form_border > ul {max-width:100%;}
}