@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;500;600;700;800;900;1000&display=swap');
*{box-sizing: border-box;margin: 0; padding: 0;}
html {line-height:1.5;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;-ms-overflow-style: scrollbar;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
html,body {width: 100%;height: 100%;}
body{font-family: 'Nunito', sans-serif;}
img{max-width: 100%;}
ul li {list-style: none;}
a {text-decoration: none; cursor: pointer;}
.b-none {border: 0!important}
.m-l-5 {margin-left: 5px!important}
.m-l-10 {margin-left: 10px!important}
.m-l-15 {margin-left: 15px!important}
.m-l-20 {margin-left: 20px!important}
.m-r-5 {margin-right: 5px!important}
.m-r-10 {margin-right: 10px!important}
.m-r-15 {margin-right: 15px!important}
.m-r-20 {margin-right: 20px!important}
.m-r-30 {margin-right: 30px!important}
.m-t-5 {margin-top: 5px!important}
.m-t-10 {margin-top: 10px!important}
.m-t-15 {margin-top: 15px!important}
.m-t-20 {margin-top: 20px!important}
.m-t-30 {margin-top: 30px!important}
.m-t-40 {margin-top: 40px!important}
.m-t-50 {margin-top: 50px!important}
.m-b-0 {margin-bottom: 0!important}
.m-b-5 {margin-bottom: 5px!important}
.m-b-10 {margin-bottom: 10px!important}
.m-b-15 {margin-bottom: 15px!important}
.m-b-20 {margin-bottom: 20px!important}
.m-b-24 {margin-bottom:24px!important}
.m-b-30 {margin-bottom: 30px!important}
.text-center{text-align: center !important;}
.font_sz{font-size: 14px;}
.font-default{font-size: 16px;}
.font_szlg{font-size: 22px;}
.color_black { color: #252525;}
.color_grey {color: #989898;}
.color_blue{color: #003366;}
.color_green{color: #03624c;}
.font_wt8{font-weight: 800;}
.font_wt7{font-weight: 700;}
.font_wt6{font-weight: 600;}
.payout_loader{display: flex;min-height: 100vh;align-items: center;justify-content: center;}
.payout_loader img{position: relative;z-index: 2;}
.payout_loading_mask{position: fixed;left: 0;right: 0;top: 0;bottom: 0;z-index: 1;background: rgba(255,255,255,1);}
/* .payout_container{display: flex;min-height: 100vh;align-items: center;justify-content: center;  background-color: #2563eb;mask: url("./../images/bg.svg") no-repeat left top;}
.payout_inner_section{width: 500px;box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);border-radius: 10px;background:#ffff;margin:20px 0;border:3px solid #fff;position: relative;} */
.payout_container {
  position: relative;
  display: flex;
  min-height: 100vh;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* Masked background layer */
.payout_container::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #0e2ac0;
  -webkit-mask: url("./../images/bg.svg") no-repeat left top;
  mask: url("./../images/bg.svg") no-repeat left top;

  z-index: 0;
}

/* Content stays above */
.payout_inner_section {
  width: 500px;
  background: #ffffff;
  border-radius: 10px;
  box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
  border: 3px solid #fff;
  margin: 20px 0;
  position: relative;
  z-index: 1;
}

.head_content{float: left;width: 100%;background: linear-gradient(93.88deg, #03624c 3.36%, #03624c 97%), #D9D9D9;border-radius: 10px 10px 0px 0px;padding: 10px 15px;}
.img_logo{float: left;width: 50px;height: 50px;background:#fff;border-radius: 10px;display: none;}
.img_logo img {float: left;border-radius: 10px;height: 50px;}
.title{float: left;/* width: calc(100% - 50px);padding-left: 15px; */width: 100%;padding: 0 10px;}
.title_name{float: left;width: 100%;font-weight: 400;font-size: 18px;color: #FFFFFF;}
.content_name{float: right;}
.content_number {float: left;width: 100%;font-weight: 400;font-size: 15px;color: #B8CADB;margin: 5px 0 0;}
.amt_payable{float: left;color: #606060;font-size: 16px;margin:12px 0 0;}
.right_amt{float: right;font-size: 32px;}
.total_amount{float: left;width: 100%;padding: 10px 25px;border-bottom: 6px solid #f7f6f9;}
.payout_section{float: left;width: 100%;padding: 25px 25px;border-bottom: 6px solid #f7f6f9;position: relative;}
.payout_status_section{float: left;width: 100%;padding: 75px 25px 100px;border-bottom: 6px solid #f7f6f9;position: relative;}
.total_amnt_txt {float: left;width:100%;font-size: 12px;text-transform: uppercase;color: #606060;font-weight: 500;}
.pay_mode_name{float: left;width: 100%;font-size: 18px;color: #03624c;text-transform: capitalize;}
.pay_mode_number{float: left;width: 100%;font-size: 16px;color: #989898;}
.payment_each_card{display: flex;width: calc(50% - 15px); background: #f0f8ff;border-radius: 7px; padding: 40px 15px; margin-top: 15px;border:2px solid #f0f8ff;}
.payment_each_card:hover .debit_card{padding-left: 10px; transition: all .5s ease-in-out;}
.payment_each_card:hover .card_arrow_b{padding-left: 10px;}
.payment_each_card:hover .card_arrow_b {animation: slide1 1s ease-in-out infinite;}
.payment_each_card:hover,.payment_each_card.active{border-color:#03624c}
.debit_card_text_head{ float: left;width: 100%; margin-left: 10px;}
.debit_card_option{font-size: 10px;line-height: 12px;color: #989898;}
.input_area_set{padding:0px;display: flex;flex-direction: row;justify-content:space-between;}
.width_100{float: left;width: 100%;}
.m-t-10{margin-top: 10px !important;}
.account_section{float: left;width:100%;margin: 10px 0;}
.input_each_area{float: left;width: calc(50% - 10px);margin-right: 10px;margin-top: 18px;position: relative;}
.input_each_area.upivpa{width:100%;margin-right:0;}
.input_each_area label{float: left; width: 100%; font-size: 14px;color: #989898;margin-bottom: 8px;}
.input_each_area input{float: left;width: 100%;background: #F7FAFC; border-radius: 4px; outline: none;appearance: none;border: 1px solid #F7FAFC;padding: 10px;font-size: 14px;color:#666;}
.payment_radio {display: flex;width:100%; }
.payment_radio label { margin-right: 10px; width:calc(33.33333% - 10px); }
.radio-input:checked + .payment {border-color: #2260ff;box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);color: #2260ff;}
.radio-input:checked + .payment_mode:before {transform: scale(1);opacity: 1;background-color: #2260ff;border-color: #b5bfd9;}
.radio_submit{border: 1px solid #036; cursor: pointer; background: linear-gradient(0deg, #03624c, #03624c), #C4C4C4;border-radius: 6px;padding: 16px 60px;color: #FFFFFF;display: inline-block; width: 100%;}
.radio_submit:hover{color: #036;background: #FFFFFF;}
.input_each_area input.radio-input,.radio-input {float: left;position: absolute;display: none;}
.payment_mode {display: flex;align-items: center;justify-content: center; width:100%;border-radius: 0.5rem;border: 2px solid #b5bfd9; background-color: #fff;box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); transition: 0.15s ease;cursor: pointer;position: relative;padding:15px 5px;}
.payment_mode:before { content: "";position: absolute; display: block;width: 0.75rem;height: 0.75rem;border: 2px solid #b5bfd9;background-color: #fff;border-radius: 50%; top: 0.25rem;left: 0.25rem;opacity: 1;transform: scale(1);transition: 0.25s ease;}
.payment_mode:hover {border-color: #2260ff;}
.payment_mode:hover:before {transform: scale(1);opacity: 1;}
.payment_mode img {float: left;height:40px;}
.pay_footer_area{display: flex; width: 100%;background: #fff; padding:15px 15px; border-radius:0 0 10px 10px; font-size: 12px;justify-content: center;}
.pay_footer_area img{margin-left: 5px;}
.otp_logo{float: left;width:100%;}
.otp_logo img { width: 100px;}
.payout_status{float: left;width:100%;}
.payout_status img { width: 200px;}
.success{color:#20BE79;}
.failed{color:#CE0000;}
.pending{color:#20BE79;}
.otp_verfi{float: left; width: 100%; font-weight: 700;}
.mb_num{float: left; width: 100%; text-align: center;}
.num{float: left; width: 100%;}
.get_otp_btn{ display: inline-block; border-radius: 7px; border: 1px solid #03624c;transition: all .5s; background: #03624c;box-shadow: 0 15px 30px rgba(31,102,168,.15); font-weight: 600;font-size: 16px;line-height: 20px;color: #fff;padding:15px 20px;min-width:80%;text-transform: uppercase;}
.get_otp_btn:hover{background-color: #fff; color: #03624c;}
.otp_input {width: 40px; height:auto; border: none; border-bottom: 1.5px solid #d2d2d2;margin: 0 10px; text-align: center;font-size: 16px;}
input:focus {  outline: none;}
.otp_input:focus{outline: none; border-bottom: 1.5px solid #03624c;}
.entr_otp_num{float: left; width: 100%;} 
.paylink_description{font-size: 12px;color: #888;float: left;width:100%;}
.pay_pop_mainselect {color: #fff;padding: 0px;border-radius:0 7px 7px 0;font-size: 13px;position:absolute;right:0;width:170px;top:0;bottom:0;}
.pay_pop_atual {color: #535353;font-size: 16px;padding:7px 8px;border: 2px solid #f0f8ff;border-radius:0 7px 7px 0;cursor: pointer;height:100%;font-size: 14px;}
.pay_pop_disabled {background-color: #e6e6e6!important;cursor: default!important;}
.pay_pop_separator {font-weight: 700;color: #282828!important;cursor:default!important;background-color:transparent!important;}
.pay_pop_background {background-color: #fff}
.pay_pop_mainselect .arrow {border: solid #808080;border-width: 0 1px 1px 0;padding: 3px;float: right;pointer-events: none;}
.pay_pop_mainselect .up {transform: rotate(-135deg);-webkit-transform: rotate(-135deg);margin-top: 10px;transition: all .2s ease}
.pay_pop_mainselect .down {transition: all .2s ease;transform: rotate(45deg);-webkit-transform: rotate(45deg);margin-top:5px}
.pay_pop_ul_mobile {width: 80% !important;position: fixed !important;top: 5% !important;left: 10% !important;border: 0px !important;height: 90% !important;margin: 0px !important;overflow-y: scroll;z-index: 10 !important;max-height:100%!important;}
.pay_pop_ul_bg{position: fixed;width: 100%;height: 100%;top: 0px;left: 0px;background-color: rgba(0, 0, 0, 0.8); z-index: 9;}
.pay_pop_ul_mobile li{padding:20px!important;}
.stop-scrolling {height: 100%;overflow: hidden;}
.pay_pop_ul_inner {position: absolute!important;margin-top:0px;padding: 0;display: none;border: 1px solid #e1e1e1;border-radius: 8px;display: none;z-index: 1;max-height: 200px;overflow-x: auto;bottom: auto !important;}
.pay_pop_ul_inner li {cursor: pointer;list-style: none;color: #353535;padding:9px 15px 9px 10px;font-size:14px;float: left;width:100%;}
.pay_pop_ul_inner li img{float: left;margin-right: 11px;position: relative;width:17px;}
.pay_pop_ul_inner li input{padding: 0px;border: 0px;border-bottom-color: transparent;border-bottom-style: none;border-bottom-width: 0px;border-bottom-color: currentcolor;border-bottom-style: none;border-bottom-width: 0px;color: black;height: 38px;width: 100%;background-color: transparent;font-size: 10pt;font-weight: bold;}
.pay_pop_ul_inner li:hover {background-color: #eee}
.nofocus{background-color: rgba(255, 255, 255, 0.1) !important;padding: 0px !important;border-bottom: 1px solid #e1e1e1;}
.upi_suffix_section{position: relative;float: left;width:100%;}
.innerinput{padding: 0px 9px 0px 10px;font-weight: 400;}
.pay_pop_ul_inner li input.pay_pop_input,.pay_pop_input{font-weight: 400;padding: 5px 10px;}
.input_each_area .upi_suffix_section input{padding-right:185px;}
.otp_error{float: left;width:100%;margin:5px 0 0;font-size:12px;text-align: center;color:#ff0000;}
.error_popup_bg{float: left;width:100%;background: rgba(7,40,83,0.5);position:absolute;bottom:0px;top:0;left:0;right:0;}
.error_popup{float: left;width:100%;text-align: center;position:absolute;bottom:0px;background:#fff;padding:50px 15px;left:0;right:0;box-shadow: 0 -7px 10px 0 rgba(23,26,30,.15);}
.error_popup_img{float: left;width:100%;}
.error_popup_img img{width: 50px;}
.error_popup_text{float: left;width:100%;font-size:15px;color:#777;margin:30px 0 0;}
.error_popup_close{float:left;position:absolute;right:10px;top:10px;cursor: pointer;z-index:10;color:#888;font-size:20px;font-weight:500;background: #eee;width: 25px;height: 25px;line-height: 23px;text-align: center;border-radius:50%;}
.pop_show_error{font-size:11px;padding:3px 0px;float: left;width:auto;position: absolute;top:calc(100% - 1px);left:0;z-index:10;color:#ff0000;line-height: 12px;}
.m-lr-5{margin-left: 5px!important;margin-right: 5px!important;}
.footer_img_filter{filter: brightness(0) saturate(100%) invert(67%) sepia(4%) saturate(4%) hue-rotate(323deg) brightness(93%) contrast(99%);}
footer img{filter: brightness(0) saturate(100%) invert(67%) sepia(4%) saturate(4%) hue-rotate(323deg) brightness(93%) contrast(99%);height: 20px;}
.grecaptcha-badge{display: none!important;}
@media (max-width:767px) {
    .payout_container{background: none;}
}