﻿body { overflow: hidden; font-family: 'Roboto', sans-serif; font-size: 15px; }
.col-main { width: 100%; position: relative; }
.payment-main { padding: 15px 15px; max-width: 468px; margin: 0 auto; }
.payment_wrapper { display: block; }
.payment_tabs { display: flex; margin-left: 16px; }
.payment_tabs li { float: left; margin-right: 50px; position: relative; }
.payment_tabs li div { background-color: #fff; border-radius: 5px; border: 1px solid #eee; display: block; position: relative; cursor: pointer; }
.payment_tabs li img { width: 100%; display: block; }
.payment_tabs li input[type="radio"] { display: block; width: 100%; position: absolute; opacity: 0; height: 100%; z-index: 989898; cursor: pointer; }
.payment_tabs li label { display: block; width: 180px; padding: 10px 0; box-shadow: 0 0 5px #eee; border: 1px solid #eee; border-radius: 10px; position: relative; cursor: pointer; }
.payment_tabs li input:checked ~ label { border: 1px solid #2671eb; box-shadow: 0 0 5px #2671eb; background: #e7f2ff; }
.payment_tabs li label::after { content: ""; position: absolute; width: 25px; height: 25px; background: #2671eb; border-radius: 50px; top: -13px; right: -13px; display: none; }
.payment_tabs li label::before { content: ""; position: absolute; width: 10px; height: 5px; background: transparent; border-left: 2px solid #fff; border-bottom: 2px solid #fff; top: -5px; right: -7px; z-index: 99; transform: rotate(-45deg); display: none; }
.payment_tabs li input:checked ~ label::before,
.payment_tabs li input:checked ~ label::after { display: inline; }
.payment_tabs li { list-style: none!important; }
#div_payment .payment_tabs li label { display: block; padding: 10px 0; border-radius: 10px; position: relative; cursor: pointer; width: 100%; }
.tab-wrapper { margin-top: 3px; }
.field_row { display: block; margin-bottom: 30px; }
.field_row label { display: block; margin-bottom: 10px; }
#payer_name { padding: 12px; display: block; max-width: 100%; width: 460px; font-size: 15px; color: #3d4043; border: solid 1px #a6d0ff !important; outline: none; }
#payer_name ::placeholder { color: #3d4043; }
#card_name { width: 500px; }
.field_set { display: flex; width: 100%; }
.field_set .field_row { display: flex; width: 100%; margin-right: 0px; }
#cnumber { width: 500px; }
.mr-0 { margin: 0 !important; }
.title_2 { font-size: 18px; font-weight: bold; }
.btn_startpay { display: inline-block; margin: 0 auto; background: #2671eb; color: #fff; padding: 10px 15px; border-radius: 5px; margin-top: 10px; font-size: 16px; }
.text_center { text-align: center; }
.cls_card_number { float: left; width: 224px; height: 45%; }
.cls_card_expiry { float: left; width: 100px; margin-left: 15px; height: 45%; }
.cls_card_cvc { float: left; width: 80px; margin-left: 15px; height: 45%; }
#div_card_payment .tab_container, .title_2 { padding: 0px 20px!important; }
#div_download_leads { font-family: 'Roboto', sans-serif!important; }
.notify_container { display: block; padding: 5px 20px; border-radius: 5px; position: relative; margin-bottom: 10px; }
.green_notify { background: #effeed; border: 1px solid #e2e6ee; }
.notify_icon { float: left; width: 64px; height: 36px; }
.notify_icon img { width: 100%; }
.notify_msg { margin-top: 0px; }
.notify_msg h2 { font-weight: bold; font-size: 12px; }
.notify_msg p { color: #333; line-height: 20px; font-size: 15px; }
.notify_close { position: absolute; top: 50%; transform: translateY(-50%); right: 20px; width: 15px; }
.download_lead_inner_div { display: block; background: #fff; }
.search_period { display: block; width: 100%; padding: 0px 0 5px 0; margin-bottom: 0px; }
.search_period_left h3, .search_period_right h3 { font-weight: bold; font-size: 20px; color: #000; margin-bottom: 25px; margin-top: 25px; }
.search_period_left h5, .search_period_right h5 { font-weight: normal; font-size: 13px; color: #878a95; margin-bottom: 10px; }
.lbl_lead_count span { font-weight: normal; font-size: 1.7em; color: #578df0; display: inline-block; }
.file_format_div { display: block; }
.file_format_div ul li { width: 49%; border: 1px solid #eaeaea; padding: 10px 10px; border-radius: 5px; margin-bottom: 10px; }
.file_format_div_img { width: 42px; max-width: 100%; float: left; margin-right: 15px; }
.file_format_div ul li label { font-size: 1em; font-weight: bold; position: relative; top: 4px; }
.file_format_div ul li label span { display: block; font-size: 12px; }
.file_format_div li { list-style: none!important; }
.file_format_div label { font-size: 15px; }
.excel_li { cursor: pointer; }
.csv_li { cursor: pointer; margin-left: 15px; }
#card_errors { color: red; margin-top: -10px; font-size: 14px; min-height: 30px; margin-bottom: 8px; }
.search_period_left { margin-left: 0px; }
.file_format_div { padding: 0px; }
.cls_dwn_btn_files { margin-top: 30px; display: flex; margin-left: -40px; }
#div_download_leads { width: 100%!important; max-width: 468px!important; margin: 0 auto!important; margin-top: 30px !important; }
.mb_35 { margin-bottom: 35px; }
.cardnumber-lbl-flx-div { width: 100%; height: 50px; margin-bottom: -22px; display: flex; }
.cardnumber-lbl-flx-div div { flex-grow: 1; }
.cardnumber-input-flx-div { height: 68px; justify-content: space-between; }
.cardnumber-input-flx-div div { flex-grow: 1; }
#div_notify_msg { position: relative; min-height: 35px; display: flex; align-items: center; }
.notify_msg { margin-left: 15px; }
.card-no-main { float: left; width: 294px; margin-right: 15px; }
.card-date-main { float: left; width: 148px; margin-right: 15px; }
.card-cvv-main { float: left; width: 130px; }

/*stripe design*/
.StripeElement { border: 1px solid #a6d0ff; padding: 12px; display: block; max-width: 100%; }
.ElementsApp { font-size: 16px!important; }
.submit_btn_paynow { height: 42px; margin-top: 15px; border-radius: 5px; color: white; border: 0; cursor: pointer; transition: all 0.2s ease; display: block; box-shadow: 0px 4px 5.5px 0px rgba(0, 0, 0, 0.07); width: 100%; background-color: #2671eb; }
.form-row, #submit_btn { }
.col { font-size: 16px; width: 100%; }
.col input { color: #32325d; width: 98%; font-size: 16px; -webkit-font-smoothing: antialiased; border: 1px solid #f9fafd; padding: 10px 20px; border-radius: 4px; margin: 5px; box-shadow: 0 0 1px #eee; height: 45px; }
.form-row.inline { display: flex; }
.paynow-btn-strip { font-family: sans-serif; background-color: #4084f0; width: 100%; text-align: center; padding: 14px 0; color: #fff; border-radius: 4px; font-size: 16px; border: 0px; cursor: pointer; }
/*stripe design*/

.form-blocK { display: flex; width: 100%; }
.cls_lds_cnt { font-size: 40px; font-weight: bold; margin-left: -1px; }
.cls_excel { cursor: pointer; margin-left: 0px!important; }
.cls_csv { cursor: pointer; margin-left: 0px!important; }
.cls_lbl_not_fnd { color: #ff3d00; }

.cls_bacK_to { text-align: center; display:none;}
.cls_bacK_to a { display: block; color: #fff; text-decoration: none; border: none; background: #5c91fe; width: 100%; height: 40px; line-height: 42px; font-size: 15px; font-weight: 500; border-radius: 1px; margin-top: 15px; -webkit-transition: 0.2s all; transition: 0.2s all; }
.cls_bacK_to a:hover { opacity: 0.8; }
.pd { padding: 0px 20px; }

.cls_bacK_to_stripe { text-align: center; margin-top: 20px; display:none; }
.cls_bacK_to_stripe a { display: block; color: #fff; text-decoration: none; border: none; background: #4084f0; width: 100%; height: 44px; line-height: 47px; font-size: 14px; font-weight: 500; border-radius: 1px; margin-top: 15px; -webkit-transition: 0.2s all; transition: 0.2s all; border-radius: 5px; }
.cls_bacK_to_stripe a:hover { opacity: 0.8; }
.cls_bacK_to_paypal { text-align: center; margin-top: 20px; display:none; width:100%; }
.cls_bacK_to_paypal a { display: block; color: #fff; text-decoration: none; border: none; background: #4084f0; height: 44px; line-height: 47px; font-size: 14px; font-weight: 500; border-radius: 1px; margin-top: 15px; -webkit-transition: 0.2s all; transition: 0.2s all; border-radius: 5px; margin: auto;}
.cls_bacK_to_paypal a:hover { opacity: 0.8; }
.cls_pay_form { border: 1px solid #e1e1e1; margin-top: 40px; padding: 33px 15px 40px 15px; }
.pay_pal_btn { width: calc(100% - 50px); }

@media (max-width:560px) {
.payment-main { padding: 0px; margin-top: 15px !important; }
.card-no-main { width: 350px; margin-right: 5px; }
.card-date-main { width: 170px; margin-right: 5px; }
.card-cvv-main { float: left; width: 130px; }
.cls_card_number { width: 230px; }
.cls_card_expiry { width: 100px; margin-left: 10px; }
.cls_card_cvc { width: 74px; margin-left: 10px; }
.StripeElement { padding: 10px 8px; }
#payer_name { padding: 10px 8px; }
#card_errors { margin-top: -15px; min-height: 30px; margin-bottom: 8px; }
.payment_tabs { margin-left: 0px; }
payment_tabs li { margin-right: 42px; }
.file_format_div ul li { width: 44%; }
.csv_li { margin-left: 10px; }
#div_download_leads { margin-top: 8% !important; }
}
@media (max-width:480px) {
.payment-main { padding: 0px; margin-top: 15px !important; }
.card-no-main { width: 350px; margin-right: 5px; }
.card-date-main { width: 170px; margin-right: 5px; }
.card-cvv-main { float: left; width: 130px; }
.cls_card_number { width: 230px; }
.cls_card_expiry { width: 100px; margin-left: 10px; }
.cls_card_cvc { width: 74px; margin-left: 10px; }
.StripeElement { padding: 10px 8px; }
#payer_name { padding: 10px 8px; }
#card_errors { margin-top: -15px; min-height: 30px; margin-bottom: 8px; }
.payment_tabs { margin-left: 0px; }
payment_tabs li { margin-right: 42px; }
.file_format_div ul li { width: 44%; }
.csv_li { margin-left: 10px; }
#div_download_leads { margin-top: 8% !important; }
}
@media (max-width:360px) {
.payment-main { padding: 0px; margin-top: 25px !important; }
.card-no-main { width: 350px; margin-right: 5px; }
.card-date-main { width: 170px; margin-right: 5px; }
.card-cvv-main { float: left; width: 130px; }
.cls_card_number { width: 240px; }
.cls_card_expiry { width: 100px; margin-left: 10px; }
.cls_card_cvc { width: 74px; margin-left: 10px; }
.StripeElement { padding: 10px 8px; }
#payer_name { padding: 10px 8px; }
#card_errors { margin-top: -15px; min-height: 30px; margin-bottom: 8px; }
.payment_tabs { margin-left: 0px; }
payment_tabs li { margin-right: 42px; }
.file_format_div ul li { width: 44%; }
.csv_li { margin-left: 10px; }
#div_download_leads { margin-top: 13% !important; }
}
