body{background:white;}
.lds-ring {
  display: inline-block;
  position: relative;
  width: 18px;
  height: 18px;
  font-size:16px;
  margin:0 auto;
}
.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 18px;
  height: 18px;
  margin: 0px;
  border: 2px solid #fff;
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: #fff transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.lds-facebook {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-facebook div {
  display: inline-block;
  position: absolute;
  left: 8px;
  width: 16px;
  background: #0F358A;
  animation: lds-facebook 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
}
.lds-facebook div:nth-child(1) {
  left: 8px;
  animation-delay: -0.24s;
}
.lds-facebook div:nth-child(2) {
  left: 32px;
  animation-delay: -0.12s;
}
.lds-facebook div:nth-child(3) {
  left: 56px;
  animation-delay: 0;
}
@keyframes lds-facebook {
  0% {
    top: 8px;
    height: 64px;
  }
  50%, 100% {
    top: 24px;
    height: 32px;
  }
}

.lds-grid {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-grid div {
  position: absolute;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #0F358A;
  animation: lds-grid 1.2s linear infinite;
}
.lds-grid div:nth-child(1) {
  top: 8px;
  left: 8px;
  animation-delay: 0s;
}
.lds-grid div:nth-child(2) {
  top: 8px;
  left: 32px;
  animation-delay: -0.4s;
}
.lds-grid div:nth-child(3) {
  top: 8px;
  left: 56px;
  animation-delay: -0.8s;
}
.lds-grid div:nth-child(4) {
  top: 32px;
  left: 8px;
  animation-delay: -0.4s;
}
.lds-grid div:nth-child(5) {
  top: 32px;
  left: 32px;
  animation-delay: -0.8s;
}
.lds-grid div:nth-child(6) {
  top: 32px;
  left: 56px;
  animation-delay: -1.2s;
}
.lds-grid div:nth-child(7) {
  top: 56px;
  left: 8px;
  animation-delay: -0.8s;
}
.lds-grid div:nth-child(8) {
  top: 56px;
  left: 32px;
  animation-delay: -1.2s;
}
.lds-grid div:nth-child(9) {
  top: 56px;
  left: 56px;
  animation-delay: -1.6s;
}
@keyframes lds-grid {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}

/* Absolute Center Spinner */
.full_page_loader {
    display:none;
  position: fixed;
  z-index: 999;
  height: 2em;
  width: 2em;
  overflow: show;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

/* Transparent Overlay */
.full_page_loader:before {
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
    background: radial-gradient(rgba(20, 20, 20,.5), rgba(0, 0, 0, .5));

  background: -webkit-radial-gradient(rgba(20, 20, 20,.5), rgba(0, 0, 0,.5));
}

/* :not(:required) hides these rules from IE9 and below */
.full_page_loader:not(:required) {
  /* hide "loading..." text */
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.full_page_loader:not(:required):after {
  content: '';
  display: block;
  font-size: 10px;
  width: 1em;
  height: 1em;
  margin-top: -0.5em;
  -webkit-animation: full_page_loader_spinner 150ms infinite linear;
  -moz-animation: full_page_loader_spinner 150ms infinite linear;
  -ms-animation: full_page_loader_spinner 150ms infinite linear;
  -o-animation: full_page_loader_spinner 150ms infinite linear;
  animation: full_page_loader_spinner 150ms infinite linear;
  border-radius: 0.5em;
  -webkit-box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0;
box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes full_page_loader_spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes full_page_loader_spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-o-keyframes full_page_loader_spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes full_page_loader_spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}



.custom-page .logo-home .top-homew .right p img{
    max-height:50px;
    max-width:50px;
}

.summary_area{display:none;}
.proced-pay-btn-container{display:flex;width:100%}
.select-points .points-boxs .left .cash p:nth-child(2) span.amount_text{font-size: 22px;color: #3DAA31;font-weight: bold;}
.proced-pay-btn a{width:auto;margin:0 auto;line-height: 30px;}
.upi_link{display:contents;}
.upi_link{width:100%;display:flex;line-height: 40px;}

.upi_link p {
    margin: 0px;
    font-size: 14px;
    color: #000000;
    width: 69%;
}

.upi_link p span {
    display: block;
    font-weight: 700;
}

.upi_link a i {
    float: right;
    text-align: right;
    color: #0A22F5;
    font-size: 20px;
    line-height: 40px;
}

.upi_link a {
    font-size: 11px;
    color: #0A22F5;
    font-weight: bold;
    width: 16%;
}

.upi-transtion ul li {
    width: 100%;
    background: rgba(255, 255, 255, 0.67);
    margin-bottom: 5px;
    display: block;
    padding: 2px 10px;
    align-items: center;
}

.credit-card-details ul button {
    background: rgba(10, 34, 245, 1);
}

.select-box select{background-color:white;}
.card-body-bnk ul li img {    background: white;
    padding: 3px;
    border-radius: 8px;}

.twid_points{
    padding: 10px 20px;
    display:flex;
    background:white;
    margin:0;
}
.twid_points_bottom_container{
    border-top:1px dashed grey;
    padding: 5px 20px;
    display: flex;
    background: white;
    margin: 0;
    margin-bottom: 15px;
    color:black;
    font-weight:600;
    
}

.twid_points_amount{color:#3DAA31}

.twid_points_select{width:10%;position: relative;  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;}
.twid_points_text_container{width:85%;font-size:16px;color:#EB8221;font-weight: 600;}

/* Hide the browser's default checkbox */
.twid_points_select input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.twid_points_select .checkmark {
  position: absolute;
  top: 3px;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #eee;
}

/* On mouse-over, add a grey background color */
.twid_points_select:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.twid_points_select input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.twid_points_select .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.twid_points_select input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.twid_points_select .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.twid_points_select_label {
      display: block;
  position: relative;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.bank_select, .wallet_select{text-align: center}
.bank_select span, .wallet_select span{overflow:hidden;text-overflow:ellipsis;height:20px;white-space: nowrap}
.card-body-bnk ul li img{min-height: 45px;min-width: 45px}

.modal-confirm {		
	color: #434e65;
	width: 525px;
        text-align: left;
}
.modal-confirm .modal-content {
	padding: 10px;
	font-size: 16px;
	border-radius: 5px;
	border: none;
}
.modal-confirm .modal-header {
	background: white;
	/*border-bottom: none;*/   
	position: relative;
        border-bottom: 1px dashed grey;
	text-align: left;
	border-radius: 5px 5px 0 0;
	padding: 0;
        font-weight: 900;
}
.modal-confirm h4 {
	text-align: left;
	font-size: 36px;
	margin: 10px 0;
}
.modal-confirm .form-control, .modal-confirm .btn {
	min-height: 40px;
	border-radius: 3px; 
}
.modal-confirm .close {
	position: absolute;
	top: 15px;
	right: 15px;
	color: #fff;
	text-shadow: none;
	opacity: 0.5;
}
.modal-confirm .close:hover {
	opacity: 0.8;
}
.modal-confirm .icon-box {
	color: #fff;		
	width: 95px;
	height: 95px;
	display: inline-block;
	border-radius: 50%;
	z-index: 9;
	border: 5px solid #fff;
	padding: 15px;
	text-align: center;
}
.modal-confirm .icon-box i {
	font-size: 58px;
	margin: -2px 0 0 -2px;
}
/*.modal-confirm.modal-dialog {
	margin-top: 80px;
}*/
.modal-confirm .btn, .modal-confirm .btn:active {
	color: #fff;
	border-radius: 1px;
	background: #FB641B !important;
	text-decoration: none;
	transition: all 0.4s;
	line-height: normal;
        margin: 10px auto;
	padding: 6px 20px;
	min-width: 150px;
	border: none;
        width:100%;
}
.modal-confirm .btn:hover, .modal-confirm .btn:focus {
	background: #FB8300 !important;
	outline: none;
}

#modal_error_message_title{
    font-size: 16px;
    font-weight:600;
}

.modal-confirm .modal-content{margin-top:50%;}

.modal-confirm .modal-body{
    padding:10px 0 0 0 !important;
}

.modal-confirm{
    padding:15px;
}

#modal_error_message_txt{text-align: left;}

.trigger-btn {
	display: inline-block;
	margin: 100px auto;
}
/*#paymentOptionsModal .modal-dialog .modal-body{background:#fff}
#paymentOptionsModal .modal-body{
    height: auto;
    padding-bottom: 30px !important;
    flex: none;
    border-radius: 5px !important;
}*/

#errorMessageModal .modal-confirm .modal-content{background:white;height:auto;}
.modal-confirm h4 {font-size: 26px;}

#otp{
  padding-left: 15px;
  letter-spacing: 37px;
  border: 0;
  background-image: linear-gradient(to left, grey 70%, white 0%);
  background-position: bottom;
  background-size: 50px 1px;
  background-repeat: repeat-x;
  background-position-x: 35px;
  width: 300px;
  min-width: 300px;
  text-align: left;
  margin:0 auto;
}

.number-input .otp{padding:left;}
.number-input .mobile-num{background:none;border:0}

.payment-accordin div#accordion .card .card-body .visa-cards .bank-logo{    display: flex;
    position: absolute;
    width: 34px;
    top: 7px;
    z-index: 10;
    vertical-align: middle;
    height:34px;
    align-items: center;
    justify-items: center;
}
.payment-accordin div#accordion .card .card-body .visa-cards .bank-logo img{width:34px;max-height: 34px;}
.bank_select_border img{border:1px solid blue !important; }
.bank_select img{border:1px solid white; padding:2px;}


.select-points .points-boxs .left .cash p:nth-child(3) {
    font-size: 22px;
    color: #3DAA31;
    font-weight: bold;
}

.select-points .points-boxs .left .cash p:nth-child(3) span {
    padding-left: 10px;
    font-size: 12px;
    color: #5A5656;
    font-weight: normal;
}
.select-points .points-boxs:nth-child(3) {
    padding-bottom: 0px;
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.select-points .points-boxes-container .points-boxs:last-child {
    padding-bottom: 8px;
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
.mycheck-box-cu .head-bnk{  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.mycheck-box-cu .dbs-bnk {min-width: 126px;}

.footer_logo{    
/*    position: fixed;
    left: 0;
    bottom: 0;*/
    width: 100%;
    color: white;
    text-align: center;
    background:transaparent;
}

.footer_bottom_fixed{
    position: fixed;
    /*left: 0;*/
    bottom: 0;
    width: 100%;
    color: white;
    text-align: center;
    background:transparent;
}

.footer_logo_relative
{    
    position:relative;
    background:transparent;
    width: 100%;
    color: white;
    text-align: center;
    margin-top:100px;
    margin-bottom:100px;
}

.footer_logo_relative_less_margin{
    margin-top:30px !important;
}

.footer_logo img{
    height:35px;
}

.fixed-bnt{
    z-index:100;
}

.custom-page .logo-home .top-homew{display:block;}
.custom-page .logo-home .top-homew .right{width:auto;}
.custom-page .logo-home .top-homew .left img{max-height: 55px;max-width: 130px;}
.custom-page .logo-home .top-homew .right p:nth-child(2) {width:auto;padding:0 10px;text-align:center;}

.payment-accordin div#accordion .card-header a.card-link{padding:10px 20px;}

.card-updated{padding:0 10px }
.add-button{padding:0;margin-top:0px;}
.add-button a{padding-top:0;padding-bottom: 0;}
.credit-card-details ul button{padding:12px;}
.payment-credits .payment-name .arrow{width:20px;}
.card-body-bnk ul li span{font-size:11px;}
.paymetn-againbtn a{width:80%;text-align:center;}
.success-tick-circle-image,.failed-tick-circle-image{display:none;font-size:60px;}
.success-tick-circle-image i{border-radius: 75px;color: white;padding: 20px;background-image: linear-gradient(#8acf9e, #50a663);}
.failed-tick-circle-image i{background: #ff5a5a;border-radius: 75px;color: white;padding: 20px 40px;background-image: linear-gradient(#ff8585, #ff5050);}
.success-tick-image,.failed-tick-image{display:block;margin:0 auto;}
.card-select-icon i{color:blue;}
.card-unselect-icon i{color:lightgray;}
.card-body-bnk ul li{padding-bottom:10px;}

.payment-accordin div#accordion .card .card-body .visa-cards .radio-btn{top:14px;}
.payment-accordin div#accordion .card .card-body .visa-cards img.visa-img{width:30px;top:9px;}

.invalid_card{outline:auto;outline-color:red !important;color:red !important;}

.loader_line {
	background-color:#111;
	overflow: hidden;
  width: 100%;
  height: 4px;
  position: fixed;
  top: 0; left: 0;
  display: flex;
  align-items: center;
  align-content: center; 
  justify-content: flex-start;  
	z-index: 100000;
}

.loader_line_element {
	height: 3px;
	width: 100%;
	background: #A5D6A7;

}

.loader_line_element:before {
	content: '';
	display: block;
	background-color: #4CAF50;
	height: 3px;
	width: 0;
  animation: getLoaderWidth 3s ease-in infinite;
}

.total-bill-summary{margin-bottom:150px;}

@keyframes getLoaderWidth {
	100% { width: 100%; }
}


@media only screen and (max-width: 767px) {
    .tatal-bill {
        margin-bottom: 30px;
    }
}

/* Desktops */
@media only screen and (min-width: 1000px) {
    body{padding:0}
    .custom-page{width:100%; max-width:400px;}
    .custom-page .logo-home{max-width: 400px; display:flex;margin:0 auto}
    .select-points{border-radius: 0;background:white;}
    .select-points-container{max-width:400px;margin:0 auto}
    .custom-page .logo-home .top-homew .right{padding:5px 10px;}
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

#view_offer_details{background:hsla(0, 0%, 0%, 0.62)}
#view_offer_details .modal-header{border-bottom: 1px solid lightgrey;}
#view_offer_details .offer-section-heading{padding-top:15px;font-size:14px; font-weight:600}
#view_offer_details .modal-dialog{background: none;max-width:500px;}
#view_offer_details .modal-dialog .modal-body{padding:10px !important;padding-top:0 !important;border-radius: 0;background: none;}
#view_offer_details .modal-dialog .modal-header{margin-bottom:0px !important;font-size:18px;background:white;margin:10px;width:auto;position:relative;font-weight:600;}
#view_offer_details .modal-dialog .modal-header .offer-close{position:fixed;top:20px;right:20px;}
#view_offer_details .modal-dialog .modal-body .offer-details{background:white;}
#view_offer_details .modal-content {
   margin-top:50%; 
}  
#view_offer_details .offer-details{max-height: 400px;overflow: scroll;}