* { margin: 0px; padding: 0px; /*font-family: 'Noto Sans', sans-serif;*/ box-sizing: border-box;}
body {width: 100%;display: flex;flex-direction: column;justify-content: center;align-items: center;background-color: #fbfbfb;color: #222;font-family: "Open Sans", sans-serif;font-weight: normal;background: linear-gradient(-45deg, rgba(147, 26, 222, 0.83) 0%, #1cceead1 100%); position: relative;}
.main_section { background-image: url(../img/background.jpg); background-repeat: no-repeat; background-size: cover; width: 100%;}

.main_div {display: flex;flex-direction: column;height: 100vh;padding: 30px;align-items: center;justify-content: center;}

.logo_a {display: flex;align-items: center;margin-bottom: 20px;color: #fff;text-decoration: none;font-size: 27px;font-weight: 600;}
.logo_a img {padding-right: 10px; width: 50px; float: left;}
.logo_a:hover { color: #fff; }

.main_div_inner {width: 400px;background-color: #1f2937f7;border: 1px solid #374151;border-radius: 7px;padding: 30px 28px 30px 28px;}
.main_div_innerin { }
.main_div_innerin h1 {color: #fff;font-size: 25px;font-weight: 600;margin-bottom: 20px;}
.main_div_innerin p {color: #fff;font-size: 14px;font-weight: 300;margin-bottom: 0px;padding: 13px 16px 16px 16px;letter-spacing: 0.5px;line-height: 22px;border: 1px solid #ffffff1a;border-radius: 5px;}
.main_div_innerin p span {color: #3382f6; font-weight: 500; }

.form {width: 100%;float: left;}
.form > div {width: 100%;float: left; display: flex; flex-wrap: wrap;}
.form > div > label {color: #fff;font-size: 14px;font-weight: 400;margin-bottom: 5px;}
.form > div > input {background-color: #374151;border: 1px solid #4a5669;margin-bottom: 15px;color: #fff;font-size: 14px;font-weight: 400;height: 42px;}

.remember_me {width: 100%;display: flex;float: left;flex-direction: row;justify-content: space-between;}
.remember_me div {display: flex;align-items: center;}
.remember_me input {float: left;width: 17px;height: 17px;}
.remember_me label {float: left;color: #ffffff9c;font-size: 14px;font-weight: 400;margin: 0px;padding-left: 10px;}
.remember_me a {float: right;color: #3382f6;font-size: 14px;font-weight: 500;}

.loginlink { }
.loginlink button {width: 100%;margin-top: 25px;background-color: #3382f6;height: 42px;}
.loginlink p {color: #ffffffa6;font-size: 14px;font-weight: 300;margin: 18px 0px 0px 0px;text-align: center;padding: 0px 0px 0px 0px;letter-spacing: normal;line-height: normal;border: 0px solid #ffffff1a;border-radius: 0px;}
.loginlink p a {font-size: 14px;font-weight: 600;color: #3382f6;}


.registerlink { }
.registerlink button {width: 100%;margin-top: 4%;background-color: #3382f6;height: 42px;}
.registerlink p {color: #ffffffa6;font-size: 14px;font-weight: 300;margin: 18px 0px 0px 0px; text-align: center; padding: 0px 0px 0px 0px;letter-spacing: normal;line-height: normal;border: 0px solid #ffffff1a;border-radius: 0px;}
.registerlink p a {font-size: 14px;font-weight: 600;color: #3382f6;}

.main_div_inner_register {width: 510px;}

.main_div_inner_register .form > div > input { margin-bottom: 10px ;}

.fname_lname {display: flex;justify-content: space-between; flex-wrap: wrap;}
.fname_lname > div { width: 48%; float: left;}
.fname_lname > div > label {color: #fff;font-size: 14px;font-weight: 400;margin-bottom: 5px;}
.fname_lname > div > input {background-color: #374151;border: 1px solid #4a5669;margin-bottom: 10px;color: #fff;font-size: 14px;font-weight: 400;height: 42px;}

.country_select {position: relative;}
.country_select > div {position: relative;width: 100%;}
.country_select > div > select {background-color: #374151;border: 1px solid #4a5669;margin-bottom: 10px;color: #fff;font-size: 14px;font-weight: 400;height: 42px;}
.country_select > div > select option {color: #fff;}


.country_select .form-select { background-image: none}
.country_select  > div:after{width: 0;height: 0;border-left: 8px solid transparent;border-right: 8px solid transparent;border-top: 8px solid #53a7ff;position: absolute;top: 32%;right: 3%;content: "";z-index: 98;}


.mobile {display: flex;justify-content: space-between;flex-direction: column;}
.mobile > div {width: 100%;float: left;display: flex;}
.mobile > div input { background-color: #374151; border: 1px solid #4a5669; margin-bottom: 10px; color: #fff; font-size: 14px; font-weight: 400; height: 42px;  }
.mobile > div input[name=country_code] {background-color: #3382f6;width: 17%;border-radius: 7px 0px 0px 7px;border-right: none;text-align: center;font-weight: 600;font-size: 16px;}
.mobile > div input[name=mobile] {width: 83%;border-radius: 0px 7px 7px 0px;}

.password { }
.password > div {position: relative;width: 100%;}
.password > div > input {background-color: #374151;border: 1px solid #4a5669;margin-bottom: 10px;color: #fff;font-size: 14px;font-weight: 400;height: 42px;}
.password > div svg {position: absolute;top: 19%;right: 3%;filter: invert(48%) sepia(79%) saturate(2476%) hue-rotate(202deg) brightness(118%) contrast(119%);}
.password > div svg:hover { cursor: pointer;}

.msg { border-radius: 5px;margin-top: 2%; flex-direction: column;}
.msg p {color: #fff;font-size: 14px;font-weight: 400;text-align: center;margin: 0px;padding: 2% 2% 2% 2%; display: none; border-radius: 5px;} 
.msg .error { background-color: #ff3838d1; }
.msg .success { background-color: #27ae60c7; }

.error_msg {display: flex;width: 100%;background-color: #ff3838d1;color: #fff;font-size: 14px;font-weight: 400;text-align: center;margin: 0px;padding: 1% 2% 1% 2%;border-radius: 5px;margin-bottom: 3%;margin-top: -3%;justify-content: center;align-items: center;} 


.main_div_inner_register_sucess {width: 40%;}
.main_div_inner_register_sucess .loginlink > a { width: 100%; margin-top: 25px; background-color: #3382f6; height: 42px; }

.main_div_dashboard  {display: flex;flex-direction: column;height: 100vh;align-items: center;justify-content: center;padding: 10px;}



.btn_com {font-size: 14px;text-align: center;color: #ffffffed;text-decoration: none;padding: 4px 12px 6px 12px;display: block;border-radius: 7px;background: linear-gradient(360deg, #0096aed1 0%, #1cceead1 100%);line-height: normal;}

.top_bar {width: 100%;height: 70px;float: left;background-color: #1f2937;border-radius: 0px 0px 0px 0px; display: flex;align-items: center;justify-content: center;background: linear-gradient(175deg, #1f2937 0%, #0a121e 100%);}
.top_bar_in {width: 1300px;display: flex;align-items: center;justify-content: space-between;flex-direction: row;}
.top_bar_in .menu_names {width: 100%;display: flex;align-items: center;justify-content: space-between;}
.top_bar_in .menu_names .left {width: 30%;}
.top_bar_in .menu_names .right {width: 70%;display: flex;flex-wrap: wrap;justify-content: flex-end;align-items: center;}

.top_bar_in .menu_names .left .product_image_design {width: 170px;}
.top_bar_in .menu_names .left .product_image_design:before {font-family: FontAwesome;content: "\f205";font-size: 16px;position: relative;padding-right: 6px;bottom: -1px;}
.top_bar_in .menu_names .left .product_image_design:hover { color: #fff;}
.top_bar_in .menu_names .left .login { width: 125px;}
.top_bar_in .menu_names .left .login:hover { color: #fff;}

.top_bar_in .menu_names .right .time_remaining {color: #ffffffed;text-decoration: none;padding: 0px 20px 0px 0px;margin: 0px;}
.time_remaining .remaining_dates {color: #7a84e8;font-weight: 600;font-style: italic;font-size: 14px;}

.top_bar_in .menu_names .right .packages { }
.top_bar_in .menu_names .right .packages:hover { color: #fff;}
.top_bar_in .menu_names .right .logout {margin-left: 5px;background: linear-gradient(360deg, #c60f33 0%, #f5365c 100%);}






/* Expire Page */
.expire_main { width: 50%; display: flex;flex-direction: column;height: 100vh;padding: 30px;align-items: center;justify-content: center;}
.expire_div {width: 100%;float: left;padding: 3% 2% 5% 2%;background-color: #fff;border: 1px solid #efefef;border-radius: 8px;text-align: center;}
.expire_div p { color: #111; font-size: 15px; text-align: center; padding-top: 1%;}
.expire_div p span { color: #3382f6; font-size: 14px; font-weight: 500;text-decoration: underline; display: block; margin-top: 5px; }
.expire_div img {width: 125px;}


.button {
    color: #ffffff;
    text-decoration: none;
    padding: 15px 35px 15px 35px;
    border-radius: 30px;
    background: linear-gradient(360deg, #0096aed1 0%, #1cceead1 100%);
    border: none;
    text-transform: uppercase;
    margin-top: 19px;
    font-size: 15px;
}



.expire_div button:hover { cursor: pointer;}

/* Packages Page */
.packages_main {width: 90%;display: flex;height: auto;padding: 50px 30px 0px 30px;align-items: center;justify-content: center;flex-direction: column; margin-bottom: 100px;}
.packages_div {
    width: 100%;
    float: left;
    /* padding: 3% 2% 5% 2%; */
    background-color: #fff;
    /* border: 1px solid #efefef; */
    border-radius: 8px;
    text-align: center;
    /* display: flex; */
    /* justify-content: space-between; */
    align-items: center;
}
.packages_div_in {width: 100%;float: left;display: flex;justify-content: space-between;}

.packages_div_in .features_services {width: 40%;display: flex;align-items: flex-start;flex-direction: column;}
.packages_div_in .features_services .topbar {width: 100%;height: 146px;display: flex;border-radius: 8px 0 0 0;align-items: center;justify-content: center;padding: 7% 0 7% 0;background: rgb(255, 255, 255);background: linear-gradient(270deg, rgba(255, 255, 255, 1) 0%, rgb(222 222 222) 100%);}
.packages_div_in .features_services .topbar p {color: #13143a;font-size: 25px;text-transform: uppercase;font-weight: 500;margin: 0px;}


.packages_div_in .pkg_1 {width: 18%;display: flex;align-items: flex-start;flex-direction: column;}
.packages_div_in .pkg_2 {width: 24%;display: flex;align-items: flex-start;position: relative;top: -20px;flex-direction: column;overflow: hidden;}
.packages_div_in .pkg_3 {width: 18%;display: flex;align-items: flex-start;flex-direction: column;}

.packages_div_in .pkg .topbar {width: 100%;display: flex;padding: 0% 0% 0% 0%;flex-direction: column;align-items: center;justify-content: center;} 
.packages_div_in .pkg_1 .topbar {height: 146px;background: rgb(255, 255, 255);background: linear-gradient(270deg, rgba(255, 255, 255, 1) 0%, rgb(222 222 222) 100%);} 
.packages_div_in .pkg_2 .topbar {height: 166px;background: linear-gradient(180deg, #2c2d5c 0%, #121339 100%);border-radius: 8px 8px 0 0;padding: 0% 0% 0% 0%;} 
.packages_div_in .pkg_3 .topbar {height: 146px;background: rgb(255, 255, 255);background: linear-gradient(270deg, rgba(255, 255, 255, 1) 0%, rgb(222 222 222) 100%);border-radius: 0 8px 0 0;} 




.packages_div_in .pkg .topbar .pkg_name {color: #fff;font-size: 16px;text-transform: uppercase;font-weight: 500;margin: 0px;}
.packages_div_in .pkg .topbar .pkg_price {color: #fff;font-size: 30px;text-transform: capitalize;font-weight: 500;margin: 0px;line-height: 32px;}
.packages_div_in .pkg .topbar .pkg_term {color: #fff;font-size: 14px;text-transform: capitalize;font-weight: 100;margin: 0px;margin-bottom: 4px;}

.packages_div_in .pkg_1 .topbar .pkg_name {color: #13143a;}
.packages_div_in .pkg_1 .topbar .pkg_price {color: #13143a;}
.packages_div_in .pkg_1 .topbar .pkg_term {color: #13143a;}

.packages_div_in .pkg_3 .topbar .pkg_name {color: #13143a;}
.packages_div_in .pkg_3 .topbar .pkg_price {color: #13143a;}
.packages_div_in .pkg_3 .topbar .pkg_price span { font-size: 13px; text-transform: lowercase; }
.packages_div_in .pkg_3 .topbar .pkg_term {color: #13143a;} 

.packages_div_in .pkg .topbar .months {display: flex;margin-bottom: 5px;}  
.packages_div_in .pkg .topbar .months span {width: 50px;color: #fff;font-size: 14px;text-transform: capitalize;font-weight: 500;background-color: #db456a;margin: 0 1px 1px 1px;padding: 4px 5px 4px 5px;border-radius: 8px;cursor: pointer;user-select: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;}
.packages_div_in .pkg .topbar .months .selected { background-color: #758be8; } 
/* .packages_div_in .pkg .topbar .months span:not(:last-child)::after { content: " | "; color: #000000; font-size: 13px; font-weight: 600; padding: 0px 3px 0px 1px; position: relative; top: -2px; } */



.packages_div_in .pkg_2 .topbar .pkg_name {font-size: 24px;}
.packages_div_in .pkg_2 .topbar .pkg_price {font-size: 38px;line-height: 32px;}
.packages_div_in .pkg_2 .topbar .pkg_price span { font-size: 13px; text-transform: lowercase; }
.packages_div_in .pkg_2 .topbar .extra {width: 77%;color: #4aceed;font-size: 14px;text-transform: capitalize;font-weight: 600;display: block;/* background-color: #bf25ff; */margin-top: 0px;margin-bottom: 10px;}
.packages_div_in .pkg_2 .topbar .extra .was {font-size: 12px;font-weight: 400;}
.packages_div_in .pkg_2 .topbar .best_selling {position: absolute;background-color: #db456a;color: #fff;font-size: 14px;font-weight: 400;padding: 6px 0px 6px 0px;text-align: center;transform: rotate(313deg);top: 22px;left: -42px;width: 160px;}

.packages_div_in .content {margin-top: 0px;width: 100%;display: flex;flex-direction: column;} 

.packages_div_in .content p {/* display: flex; *//* height: 60px; */text-align: left;color: #787878;font-size: 13px;font-weight: 500;/* margin: 0px; *//* padding: 0% 3% 0% 3%; *//* border-bottom: 1px solid #dbdbdb; *//* align-items: center; */}



.packages_div_in .content .fea {display: flex;height: 70px;margin: 0px;padding: 0% 3% 0% 3%;border-bottom: 1px solid #dbdbdb;align-items: center;background: rgb(255, 255, 255);}
.packages_div_in .content .fea .icon {display: flex;width: 8%;justify-content: flex-start;}
.packages_div_in .content .fea .icon img { width: 30px;}
.packages_div_in .content .fea .text {display: flex;width: 92%;flex-direction: column;align-items: flex-start;}
.packages_div_in .content .fea .text .t1 {color: #121339;font-size: 13px;font-weight: 600;margin: 0px;padding: 0% 0% 0% 2%;}
.packages_div_in .content .fea .text .t2 {color: #121339c4;font-size: 11px;font-weight: 600;margin: 0px;padding: 0% 0% 0% 2%;}
.packages_div_in .content .fea .text .t1 a { text-decoration: none; color: #2a4c9d; }
.packages_div_in .content .fea .text .t1 span {color: #ffffff;background-color: #df0000;font-size: 12px;font-weight: 600;border-radius: 20px;padding: 1px 7px 1px 7px;}

.packages_div_in .content .fea .icon img {width: 30px;float: left;}



.packages_div_in .features_services .content .ttl {display: flex;height: 70px;color: #484848;font-size: 15px;font-weight: 500;text-transform: uppercase;border-top: 1px solid #dbdbdb;background: rgb(255, 255, 255);background: linear-gradient(270deg, rgba(255, 255, 255, 1) 0%, rgb(222 222 222) 100%);padding: 0% 3% 0% 3%;align-items: center;margin: 0px;}

.packages_div_in .features_services > div.content > p:nth-child(9) { border-top: 0px solid #dbdbdb !important; }

.packages_div_in .pkg .content {margin-top: 0px;display: flex;align-items: center;}
.packages_div_in .pkg .content .icon_div {height: 70px;width: 100%;margin-top: 0px;display: flex;align-items: center;justify-content: center;background-color: #ededed;padding: 0% 4% 0% 4%;border-bottom: 1px solid #dbdbdb;background: rgb(255, 255, 255);background: linear-gradient(270deg, rgba(255, 255, 255, 1) 0%, rgba(241, 243, 242, 1) 100%);}

.packages_div_in .pkg .content .icon_div_text {display: flex;flex-direction: column;}
.packages_div_in .pkg .content .icon_div_text .icon {margin-top: 1px;}
.packages_div_in .pkg .content .icon_div_text span {color: #787878;font-size: 13px;font-weight: 400;background-color: #e8e8e8;padding: 0px 6px 0px 6px;border-radius: 6px;margin-top: 3px;}

.packages_div_in .pkg .content .icon_div .icon {width: 27px;height: 27px;border-radius: 4px;display: flex;align-items: center;justify-content: center;background: rgb(48,192,144);background: linear-gradient(162deg, rgba(48,192,144,1) 0%, rgba(19,157,137,1) 100%);}
.packages_div_in .pkg .content .icon_div .icon .fas {color: #fff;font-size: 13px;}

.packages_div_in .pkg .content .icon_div .icon_dis {color: #fff;font-size: 13px;background: #d8d8d8;background: linear-gradient(162deg, #d8d8d8 0%, #c6c6c6 100%);}
.packages_div_in .pkg .content .icon_div .icon_dis .fas {color: #fff;font-size: 13px;}

.packages_div_in .pkg .content .icon_div_empty {height: 70px;float: left;padding: 0px;}

.packages_div_in .buy_now_div {width: 100%;display: flex;justify-content: center;align-items: center;}

.packages_div_in .buy_now_div .buy_now_btn { text-decoration: none; width: 150px;color: #ffffff;font-size: 15px;text-transform: capitalize;font-weight: 600;display: block;border-radius: 30px;padding: 10px 0 11px 0;margin-top: 18px;margin-bottom: 0px;background: linear-gradient(45deg, #db456a, #aa1b3c);background-size: 400% 400%;transition: background 0.4s ease-in-out;} 
.packages_div_in .buy_now_div .buy_now_btn:hover { animation: rotateGradient 1s linear infinite; cursor: pointer; }


@keyframes rotateGradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}




.purchase_main { width: 60%;}
.packages_div_in .left {width: 60%;display: flex;flex-direction: column;padding: 25px 20px 20px 30px; position: relative;}
.packages_div_in .left .heading {text-align: left;margin-bottom: 17px;}
.packages_div_in .left .heading h5 {font-size: 20px;margin: 0px;text-align: center;}
.packages_div_in .left .buttons {display: flex;padding-bottom: 30px; justify-content: center;}
.packages_div_in .left .buttons a { }
.packages_div_in .left .buttons a img {width: 145px;margin-right: 4px;}
.packages_div_in .left .buttons a .paypal_button { }
.packages_div_in .left .buttons a .gpay_button {opacity: 0.5;cursor: not-allowed;}
.packages_div_in .left .buttons a .visa_button {opacity: 0.5;cursor: not-allowed;}
.packages_div_in .left .email {display: flex;justify-content: center;padding: 0px 0px 20px 0px;}
.packages_div_in .left .email a {text-align: center;color: #222;text-decoration: none;font-size: 13px;font-weight: 400;}
.packages_div_in .left .email a span {color: #5a5dc4;font-weight: 500;font-size: 13px;}

.packages_div_in .left .paypal_pay {display: flex;justify-content: center;padding-bottom: 25px; display: none;}



.packages_div_in .right {width: 40%;display: flex;flex-direction: column;padding: 25px 30px 20px 25px;}
.packages_div_in .right .package_heading {display: flex;}
.packages_div_in .right .package_heading h5 {font-size: 17px;display: flex;flex-direction: column;align-items: flex-start;}
.packages_div_in .right .package_heading h5 span {font-size: 12px;}
.packages_div_in .right .prices {background-color: #eaeaea;border-radius: 7px;display: flex;padding: 17px 25px 4px 25px;}
.packages_div_in .right .prices div {width: 100%;display: flex;flex-direction: column;}
.packages_div_in .right .prices div .price {display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 15px;}
.packages_div_in .right .prices div .price .p1 {
    font-size: 13px;
    font-weight: 500;
    margin: 0px;
}
.packages_div_in .right .prices div .price .p2 {
    font-size: 13px;
    font-weight: 400;
    margin: 0px;
    color: #545454;
}

.packages_div_in .right .prices div .subtotal {}
.packages_div_in .right .prices div .subtotal p { }
.packages_div_in .right .prices div .shipping { }
.packages_div_in .right .prices div .shipping p { }
.packages_div_in .right .prices div .tax {padding-bottom: 10px;border-bottom: 1px solid #d8d8d8;}
.packages_div_in .right .prices div .tax p { }
.packages_div_in .right .prices div .total { }
.packages_div_in .right .prices div .total p {font-size: 14px !important;font-weight: 700 !important;color: #2e2e2e !important;}




.invoices_main h1 {color: #ffffff;font-size: 34px;padding-bottom: 12px;text-transform: uppercase;font-weight: 700;margin-bottom: 35px;}
.invoices_main {width: 90%;display: flex;height: auto;padding: 50px 30px 0px 30px;align-items: center;justify-content: center;flex-direction: column; margin-bottom: 100px;}
.invoices_div { width: 100%; float: left; background-color: #fff; border-radius: 8px; text-align: center; align-items: center; } 
.invoices_div_in {width: 100%;float: left;display: flex;justify-content: space-between;padding: 2% 2% 2% 2%; flex-direction: column;}
.invoices_div_in p { font-size: 15px; text-align: left; color: #222; background-color: #ededed; border-radius: 5px; padding: 10px 15px 13px 15px; }

.invoices_div_in .invoice-table {width: 100%;border-collapse: collapse;background-color: #fff;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);} 
.invoices_div_in .invoice-table th, .invoice-table td {padding: 17px;text-align: left;font-size: 14px;border: 1px solid #ddd;text-align: left;} 
.invoices_div_in .invoice-table th {color: white;background: rgb(48, 192, 144);background: linear-gradient(180deg, rgba(48, 192, 144, 1) 0%, rgba(19, 157, 137, 1) 100%); text-transform: uppercase; text-align: center;} 
.invoices_div_in .invoice-table tr:nth-child(even) { background-color: #f9f9f9; } 
.invoices_div_in .invoice-table tr:hover { background-color: #f1f1f1; } 
.invoices_div_in .action-btn {padding: 8px 16px;font-size: 14px;color: #fff;border: none;cursor: pointer;border-radius: 4px;text-align: center;background: linear-gradient(270deg, #038093d1 0%, #0ca8c0d1 100%);} 
.invoices_div_in .action-btn:hover { background: linear-gradient(270deg, #027385d1, #0795abd1);}
.invoices_div_in .invoice-table .status { border-radius: 5px;padding: 4px 10px 5px 10px;color: #fff;font-size: 14px;}
.invoices_div_in .invoice-table .status_paid { background-color: #2dbd8f; }
.invoices_div_in .invoice-table .status_unpaid { background-color: #bb1e45; }


.invoice-container {
    width: 800px;
    height: 850px;
    margin: 20px auto;
    background: white;
    padding: 0;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    font-size: 14px;
    position: relative;
}
.invoice-container .header {
    background: linear-gradient(to right, #3b3b98, #8e44ad);
    color: white;
    padding: 20px 35px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.invoice-container .header h1 {
    margin: 0;
    font-size: 48px;
    font-weight: 400;
}
.invoice-container .company-logo {
    font-size: 20px;
    font-weight: bold;
    text-align: right;
}
.invoice-container .company-logo img {width: 200px;}
.invoice-container .details {
    padding: 10px 40px 30px 40px;
    display: flex;
    justify-content: space-between;
    background: linear-gradient(to right, #3b3b98, #8e44ad);
}
.invoice-container .details div {
    width: 33.33%;
}
.invoice-container .details p {
    margin: 0 0 10px 0;
    font-size: 19px;
    color: #fff;
    font-weight: 500;
}
.invoice-container .details p strong{
    margin: 5px 0;
    font-size: 14px;
    color: #fff;
    font-weight: 300;
}
.invoice-container .invoice-table {
    width: 95%;
    height: auto;
    border-collapse: collapse;
    margin: 0 auto;
    margin-top: 20px;
}
.invoice-container .invoice-table th {
    border: 1px solid #ddd;
    padding: 15px;
    text-align: left;
}

.invoices_main .invoice-table td { 
    border: 1px solid #ddd;
    padding: 15px;
    text-align: center;
}

table.invoice-table > tbody > tr:nth-child(1) > th:nth-child(1) { width: 55%; }
table.invoice-table > tbody > tr:nth-child(1) > th:nth-child(2) { width: 15%; text-align: center;}
table.invoice-table > tbody > tr:nth-child(1) > th:nth-child(3) { width: 15%; text-align: center;}
table.invoice-table > tbody > tr:nth-child(1) > th:nth-child(4) { width: 15%; text-align: right;}

table.invoice-table > tbody > tr:nth-child(2) > td:nth-child(2) { text-align: center; }
table.invoice-table > tbody > tr:nth-child(2) > td:nth-child(3) { text-align: center; }
table.invoice-table > tbody > tr:nth-child(2) > td:nth-child(4) { text-align: center; }


.invoice-table th {
    font-size: 15px;
    background: #f4f4f4;
    font-weight: 600;
    color: #444;
}
.summary-table {
    width: 95%;
    margin: 0 auto;
    margin-top: 15px;
    border-collapse: collapse;
}
.summary {
    padding: 15px;
    text-align: right;
    background-color: #333;
    text-align: right;
}

.summary-table td { padding: 8px 15px 8px 15px; border-bottom: 2px solid #fff;}
.summary-table td span { color: #fff;font-weight: 500; }

table.summary-table > tbody > tr:nth-child(1) > td:nth-child(1) { width: 55%; }
table.summary-table > tbody > tr:nth-child(1) > td:nth-child(2) { width: 15%; }
table.summary-table > tbody > tr:nth-child(1) > td:nth-child(3) { width: 15%; }
table.summary-table > tbody > tr > td:nth-child(4) { width: 15%; text-align: right; background-color: #8e44ad;}

.summary-table tr:last-child td {
    color: #444;
    font-weight: bold;
}
.footer {
    text-align: center;
    padding: 20px 0px 10px 0px;
    color: white;
    font-size: 14px;
    margin-top: 30px;
    position: absolute;
    bottom: 0px;
    width: inherit;
}
.footer .line1 {
color: #8d44ad;
font-weight: 400;
font-size: 16px;
padding: 10px 10px 10px 10px;
}
.footer .line2 {
background: linear-gradient(to right, #3b3b98, #8e44ad);
display: flex;
justify-content: space-between;
padding: 18px 20px 20px 20px;
}
.footer .line2 p { margin: 0px;}
.footer .line3 {
color: #3b3b98a3;
font-size: 12px;
padding: 5px 10px 5px 10px;
}





















.pkg_div {
    width: 17.6%;
    height: 330px;
    border-radius: 10px;
    background: linear-gradient(180deg, #ffffff 0%, #ededed 100%);
    box-shadow: 0px 5px 9px 1px #00000030;
}

.packages_main h1 {color: #ffffff;font-size: 34px;padding-bottom: 12px;text-transform: uppercase;font-weight: 700;margin-bottom: 60px;}

.packages_div .pkg_div_hi {width: 23%;height: 385px;display: flex;background: linear-gradient(180deg, #2c2d5c 0%, #121339 100%);position: relative;overflow: hidden;}
.packages_div .pkg_div_hi .title {font-size: 17px;font-weight: 400;color: #fbfbfb;}
.packages_div .pkg_div_hi .price {font-size: 36px;padding-bottom: 8px;font-weight: 400;color: #fbfbfb;}
.packages_div .pkg_div_hi img {width: 140px;}
.packages_div .pkg_div_hi .extra {padding-bottom: 5px;font-weight: 400;color: #fbfbfb;padding-top: 13px;}
.packages_div .pkg_div_hi label {position: absolute;background-color: #db456a;color: #fff;font-size: 13px;font-weight: 400;padding: 3px 0px 3px 0px;text-align: center;transform: rotate(313deg);top: 19px;left: -35px;width: 130px;}


.pkg_div_in {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 25px;
}
.pkg_div_in .title {
    color: #121339;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 100;
    margin: 0px;
}
.pkg_div_in .price {
    color: #121339;
    font-size: 34px;
    padding-bottom: 12px;
    text-transform: uppercase;
    font-weight: 300;
    margin: 0px;
}
.pkg_div_in img {
    width: 110px;
}
.pkg_div_in .extra {
    color: #121339;
    font-size: 16px;
    text-transform: capitalize;
    font-weight: 100;
    padding-top: 8px;
    margin: 0px;
}
.pkg_div_in .extra span {color: #ffffff;font-size: 13px;text-transform: capitalize;font-weight: 600;display: block;background-color: #bf25ff;border-radius: 10px;margin-bottom: 4px;}
.pkg_div_in button {
    color: #ffffffed;
    text-decoration: none;
    padding: 8px 20px 8px 20px;
    display: block;
    border-radius: 20px;
    background: linear-gradient(360deg, #0096aed1 0%, #1cceead1 100%);
    border: none;
    text-transform: uppercase;
    margin-top: 10px;
    font-size: 14px;
}
.pkg_div_in button:hover { cursor: pointer;}



.swal2-title { font-size: 15px !important; padding: 4% 2% 0% 3% !important; color: #111 !important;}
.swal2-styled.swal2-confirm {color: #ffffffed !important;padding: 8px 30px 8px 30px !important;border-radius: 7px;background: linear-gradient(360deg, #8e0000d1 0%, #ba0000d1 100%) !important;margin: 0px;}





/* Footer */
.footer_bar {width: 100%;float: left; position:fixed; bottom: 0; left: 0;  background-color: #1f2937;border-radius: 0px 0px 0px 0px;padding: 20px 25px 20px 25px;display: flex;align-items: center;justify-content: center;background: linear-gradient(175deg, #1f2937 0%, #0a121e 100%);}
.footer_bar_in {width: 1300px; display: flex;align-items: center;justify-content: space-between;flex-direction: row;}
.footer_bar_in .left {width: 50%;}
.footer_bar_in .left p {color: #fff;font-size: 14px; margin: 0px;} 
.footer_bar_in .right {width: 50%;}
.footer_bar_in .right p {color: #ffffff75;font-size: 12px;text-align: right; margin: 0px}





@media only screen and (max-width: 1100px) {
    .main_div_inner_register {}
    .main_div_inner {}

    .main { width: 96%; }
    .top_bar_in { width: 100%;}
}



@media only screen and (max-width: 768px) {
    .main_div_inner_register {}
    .main_div_inner {width: 90%;}

    .packages_div_in { flex-wrap: wrap; justify-content: center; gap: 15px;}
    .packages_main {width: 100%;}
    .pkg_div { width: 30%; height: auto; }
    .packages_div .pkg_div_hi { width: 30%; height: auto; }

}



@media only screen and (max-width: 500px) {
    .main_div_inner_register { width: 80%; }
    .main_div_inner {width: 100%; padding: 15px 17px 15px 17px;}

    .main_div_innerin h1 { text-align: center;}

    .main { margin-top: 2%; margin-bottom: 2%; padding: 4% 3% 4% 3%;}
    .top_bar { padding: 3% ; }
    .menu_names { flex-direction: column;}
    .menu_names .menus { flex-direction: column;}
    .menu_names .welcome {padding-bottom: 1%;}
    .menu_names .menus .time_remaining  {padding: 1% 0% 3% 0%;text-align: center;}

    .packages_div { padding: 3% 5% 5% 5%;}
    .packages_main h1 { margin-bottom: 3%; }
    .packages_main { height: auto; padding: 4%;}
    .pkg_div {width: 100%;height: auto;}
    .packages_div .pkg_div_hi {width: 100%;height: auto;}

}