/*@charset "utf-8";*/


/* Pay_Bill */


/*#sba_rad .fieldname{width:15%; margin-top: 5px; }*/
/*#new_acc .fieldname{width:32%;}*/
/*#sba_rad .select_margin,#new_acc .select_margin{height:auto; margin:0 0 5px;}*/

/*.vsc { margin: 1% 0;}
.vsc img{width:100%; display:none; margin:20px 0 10px;}*/

/*#new_acc .fielddiscription > select{ width: 120px; margin-left: 3%; margin-top: 0; }
#crcd{display:none;}
.dvmd_txt{margin: 0 0 12%;}
.no_txt_space{margin-bottom:1%;}
.no_txt_space_adr{margin-bottom:4%;}
#new_acc input,#new_acc select,#crcd input,#crcd select,#sba_rad select{width:auto;}*/

/* Pay_Bill */

/*newly added*/
/*.fielddiscription.fieldwidth{ 	margin-left: 0px; }
.mleft {  margin-left: 1px;  } 

						 .span11.savpay{ width: 98%; margin-left: 0px; }
						 .savpaychk {  float: left;  width: 50%; }
						 #new_acc .span6 { margin-left: 0px;}
					   
.paydetk_width { width: 15%; }
.paydetk_wid { width: auto; }
.row-fluid [class*="span"] {   margin-left: 0; }*/

/*newly added*/

/*#clck h5 {  cursor: default; }
#app_div { display:block;    }

.v_320 { display: block;  padding-bottom: 0;  padding-top: 0; }
	.exp_320{display:none;}
.downarrowcollapse { display: none;    }*/

/*view sample cheq*/
/*.pybilhdrmrgn { margin-top:5px; }
.paybillheader {
	background-color: #005596;
	border-radius: 3px 3px 0 0;
	color: #FFFFFF;
	height: 18px;
	margin: 0 2px;
	padding: 5px;
	width: 115px;
}*/

/*.paybillshw, .paybillhde { cursor: pointer; float: left; }

#shwclck { margin-right:2%; }
.pvsc { margin: 1% 0;}
.pvsc img{width:100%; display:none; margin:5px 0;}

#hshwclck { margin-right:2%; }
.hpvsc { margin: 1% 0;}
.hpvsc img{width:100%; display:none; margin:5px 0;}

.fivewalletlimit-section {
	background-color: #fee8ef;
	width: 80%;
	height: 6rem;
	margin-left: 1em;
	padding: 0em;
	line-height: normal;
	margin-top: 0.8em;
}

	.fivewalletlimit-section-exclimination {
		width: 10%;
		vertical-align: top;
		float: left;*/
		/*border: 0.125rem solid red;*/
	/*}

	.fivewalletlimit-section-message {
		text-align: left;
		margin-left: 10%;
		padding: 1em;
		border: 0.125rem solid #fee8ef;
	}*/



/*@media (max-width: 480px) 
{*/

/* Pay_Bill */
	/*.row-fluid .span6 {width: auto;}
	.fieldname { width: 37%;}*/
	/*.v_320{display:block; padding-bottom: 0; padding-top: 0;}*/
	/*.v_320 { display: none;  padding-bottom: 0;  padding-top: 0; }
	.exp_320{display:block;}
	#app_div { display:none;    }    
	.otsc{cursor:pointer; }
	#clck.pybl {padding: 0 0 0 4%;}
	#sd_dpk {width: 40%;}
	#pb_pack {margin-bottom: 5px;}
	#sba_rad .fieldname.pbk {width: 40%;}
	#pb_actk,#rnk {width: 37%;}
	#crcd .rowfluid .fielddiscription.sts { width: 50%;}
	#crcd .rowfluid .fielddiscription.sts select { width: 100%;}
	#new_acc .fielddiscription > select{margin-left:0;}
	.btn{min-width: auto;}*/
	/* Pay_Bill */
	/*newly added*/
/*.fielddiscription.fieldwidth{ 	width: auto; }

.savpaychk {  float: left;  width: auto; }*/
/*newly added*/
/*.radio.floatleft { width:80%; }
.radio.inline + .radio.inline, .checkbox.inline + .checkbox.inline {  margin-left: 5%; }

#clck h5 {   cursor: pointer; }
.downarrowcollapse { display: inline-block;    }

	.fivewalletlimit-section {
		margin-left: 1.5em;
		width: 90%;
		height: 9rem;
		display: block;
		justify-content: center;
		align-items: center;
	}

	.alert-image {
		display: flex;
		vertical-align: middle;
		width: 40px;
		height: 40px;
	}
}

@media (min-width: 481px) and (max-width: 640px) 
{*/
	/* Pay_Bill */
	/*.logoutbtn{display: block; padding-right: 10px; font-size: 12px;}
	#sba_rad .fieldname{width:24%;}
	#pb_pack {margin-bottom: 5px;}
	#pb_actk,#rnk {width: 20%;}
	#new_acc .fielddiscription > select{margin-left:0;}
	.dvmd_txt { margin: 0 0 3%;}
	.span6.greycontainer.right{margin-left:0;}
	.left {display: none !important;}
	.right {display: none !important;}*/
	/* Pay_Bill */

	/*.fivewalletlimit-section {
		margin-left: 1.5em;
		width: 90%;
		height: 9rem;
		display: block;
		justify-content: center;
		align-items: center;
	}

	.alert-image {
		display: flex;
		vertical-align: middle;
		width: 40px;
		height: 40px;
	}
}


@media (min-width: 641px) and (max-width: 980px) 
{*/

/* Pay_Bill */
	/*.span6.left {width: 55%;}
	#sba_rad .fieldname{width:24%;}
	#pb_pack {margin-bottom: 5px;}
	#pb_actk,#rnk {width: 35%;}
	#new_acc .fielddiscription > select{margin-left:0;}
	.dvmd_txt { margin: 0 0 3%;}
	.span6.greycontainer.right{margin-left:0;}
	#crcd .rowfluid .fielddiscription.sts { width: 50%;}
	#crcd .rowfluid .fielddiscription.sts select { width: 100%;}*/
	/* Pay_Bill */

	/*.fivewalletlimit-section {
		margin-left: 1.5em;
		width: 90%;
		height: 9rem;
		display: block;
		justify-content: center;
		align-items: center;
	}

	.alert-image {
		display: flex;
		vertical-align: middle;
		width: 40px;
		height: 40px;
	}
}*/

/*added css content for making Responsiveness Mobill Icons*/ 
/*on 19 Nov 2018*/

 /*input[type="image"] {
			margin: 2px 5px;
		}

			input[type="image"]:last-child {
				margin-right: 0;
			}*/

.paybill-header {
	/*width: 10.5rem;*/
	height: 3.2rem;
	margin: 1rem;
	color: #222;
	text-align: center;
	/* Header - H2 */
	font-family: "BerninaSans";
	font-size: 28px;
	font-style: normal;
	font-weight: 300;
	line-height: 32px; /* 114.286% */
	letter-spacing: -0.5px;
}

/* PROGRESS STEP STYLES */
.paybill-progress-steps {
	display: flex;
	justify-content: center;
	margin: 2rem 0;
}

.paybill-progress-step-check {
	height: 1rem;
}

.progress-step {
	display: flex;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 3rem;
	justify-content: center;
}

/*.progress-step {
	width: 2.5rem;
	height: 2.5rem;
}
*/

.progress-step-text {
	align-self: center;
}

.atmcard-warning {
	display: inline-block;
	line-height: 2rem;
	font-size: 1.4rem;
}

.atmCardList {
	width: 20rem;
}

.underline {
	text-decoration-line: underline;
}

.progress-step-check {
	width: 2.4rem;
	height: 2.4rem;
	padding-top: 0.6rem;
	padding-left: 0.5rem;
	border-radius: 2.5rem;
}

.progress-current {
	background-color: #007db9;
	color: #FFF;
}

.progress-not-current {
	background-color: lightgray;
	color: #222;
}

.progress-connect-gray {
	width: 2.5rem;
	height: 0.01rem;
	margin-top: 1.5rem;
	border: solid 0.1rem rgba(77, 77, 77, 0.2);
}

.progress-connect-blue {
	width: 2.5rem;
	height: 0.01rem;
	margin-top: 1.5rem;
	border: solid 0.1rem #007db9;
}
/* PROGRESS STEP STYLES ENDS */

body {
	/*background: url("Images/sky01.jpg") repeat scroll 0 0 #121210;*/
	background: repeat scroll 0 0 #E9E9E9;
	margin: 0;
	padding: 0;
}

.paybill-card-label {
	color: #4D4D4D;
	/* Input Label */
	font-family: BerninaSans;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px; /* 114.286% */
	display: flex;
}

.paybill-card-form input[type="text"], .paybill-card-form input[type="email"], .paybill-card-form select {
	width: -webkit-fill-available;
	height: 4.6rem;
	border: #4D4D4D66 solid 0.1rem;
	margin: 0.8rem 0 2rem 0;
	padding-left: 1rem;
	font-family: "BerninaSans";
	font-size: 14px;
}

.paybill-btn-blue {
	/*height: auto;*/
	font-family: "BerninaSans";
	font-size: 14px;
	font-weight: 600;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.14;
	letter-spacing: normal;
	color: #007db9 !important;
/*	padding: 0.5rem;*/
	/*border: none;*/
	outline: none;
	background-color: #FFF;
	border-bottom: 1px solid rgba(0, 125, 185, 0.30);
}

.blue-text-pb {
	color: #007DB9;
	font-family: BerninaSans;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 16px;
	text-transform: capitalize;
	display: block;
	align-items: center;
	text-decoration: underline rgba(0, 125, 185, 0.30) !important;
	-webkit-text-decoration: underline rgba(0, 125, 185, 0.30) !important;
	text-underline-offset: 5px;
	position: relative;
	top: 0px;
}

.clear-pb {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 32px;
	align-self: stretch;
	padding-bottom: 32px;
}

.centeralign.text {
	color: #626262;
	text-align: center;
	font-family: BerninaSans;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: -0.22px;
	gap: 8px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding-top: 8px;
}

.red-text {
	color: #EB161E;
	text-align: center;
	font-family: "BerninaSans";
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: -0.22px;
	padding-top: 8px;
}


.paybill-btn-blue:hover {
	/*	text-decoration: underline;
	text-underline-offset: 0.5rem;*/
}

.blacktextbold {
	color: #121719;
	padding-bottom: 5px;
	font-size: 30px;
	font-weight: bolder;
	text-align: center;
}

.paybill-center-align {
	color: #222;
	text-align: center;
	font-family: BerninaSans;
	font-size: 24px;
	font-style: normal;
	font-weight: 300;
	line-height: 32px;
	letter-spacing: -0.22px;
	display: flex;
	justify-content: center;
	padding-bottom: 15px;
}

.paybill-btn {
	padding: 0.9rem 0.23rem;
	border-radius: 2.5em;
	height: auto;
	display: block;
	border: solid 0.1rem #007db9;
	color: #007db9;
	text-align: center;
	font-weight: bold;
}


.paybill-btn-red {	
	width: auto;
	color: #fff;
	border: none;
	text-align: center;
	font-weight: normal;
	font-family: 'BerninaSans';
	font-size: 14px;
	min-width: 130px;
	display: flex;
	min-width: 140px;
	padding: 15px 30px;
	justify-content: center;
	align-items: center;
	gap: 10px;
	border-radius: 30px;
	background: var(--Primary-Palette-Primary-Red, #EB161E);
}

	.paybill-btn-red:hover, .btn-red-big:hover, .paybill-btn-red:focus, .btn-red-big:focus, .paybill-btn-submit:hover, .btn-red-big:hover {
		box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.2);
		border: none;
		background-color: #bb1218;
		color: #fff;
	}

	.paybill-btn-red:disabled,
	input[type="text"]:disabled,
	input[type="email"]:disabled,
	select:disabled,
	.autopay-btn-red:disabled,
	.disabled {
		box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.2) !important;
		border: 1px solid var(--Neutrals-Medium-Gray, #959595) !important;
		background-color: #fff !important;
		color: #959595 !important;
	}

/*select#PaymentAccount option {
	background: rgba(0, 125, 185, 0.10);
}*/
/*Begin Footer Buttons*/
.paybill-btn-group {
	margin-top: 20px;
	display: flex;
}

.paybill-btn-group {
	display: flex;
}

.cl-2 {
	justify-content: space-between;
}
/* End Footer buttons */
.leftdv-pb {
	width: 60%;
	Text-align: center;
	float: left;
}

.rightdv-pb {
	width: 40%;
	Text-align: right;
	float: right;
}
/* Form elements*/
form-dropdown-pb {
	display: flex;
	height: 46px;
	padding: 13px 16px;
	justify-content: space-between;
	align-items: center;
	align-self: stretch;
}
/* DatePicker*/
.datepicker:focus::placeholder {
	color: transparent;
}

/*mobile sticky footer*/
.mobile-bottom-buttons {
	width: 100%;
	background: #fff;
	height: auto;
	padding: 2rem 2rem;
	position: fixed;
	bottom: 0% !important;
	box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.2);
	left: 0;
}

	.mobile-bottom-buttons .paybill-btn-red {
		width: 15rem;
		height: 5rem;
		padding: 1.5rem 0.8rem;
	}

	.mobile-bottom-buttons .autopay-btn-blue {
		align-self: center;
	}

.paybill-enroll-end-buttons {
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-content: center;
	vertical-align: middle;
}

.datetext {
	width: 80px;
	height: 7px;
	padding: 0px !important;
	margin-top: -5px;
	font-size: 10px;
}



.pickericon {
	margin-top: -7px;
	padding-left: 2px;
}

.optionval {
	display: visible;
}

.sliderbar {
	display: none;
}

.newlineclick {
	display: inline;
	margin: 0px !important;
	text-align: left;
}

.ui-datepicker-trigger {
	margin: 0 0 0 2px;
}
/************************************************/
/**************Alert and Warning icons***********/
/************************************************/
.paybill-alert-info {
	color: #2d363b;
	background-color: #d9edf7;
	border-color: #d9edf7;
	font-size: 14px;
	font-weight: normal;
	padding-top: 1rem;
	padding-bottom: 1rem;
	font-family: 'BerninaSans';
	margin-top: -15px;
	margin-bottom: 15px;
	display: flex;
	align-items: center;
}

.atm-alert-info {
	color: #2d363b;
	background-color: #007DB91A;
	border-color: #007DB91A;
	font-size: 14px;
	font-weight: normal;
	padding-top: 1rem;
	padding-bottom: 0.2rem;
	font-family: 'BerninaSans';
	margin-top: -15px;
	margin-bottom: 15px;
	display: flex;
	align-items: center;
	line-height: 2rem;
}


.under-payment-warning {
	color: #2d363b;
	/*	background-color: #d9edf7; */
	background: rgba(253, 183, 20, 0.10);
	border-color: #d9edf7;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	font-family: 'BerninaSans';
	display: flex;
	/*min-height: 38px;*/
	/*padding: 8px 10px;*/
	align-items: center;
	/*gap: 10px;*/
	align-self: stretch;
	margin-bottom: 15px;
	margin-bottom: 1.5rem;
	padding-top: 1.2rem;
	padding-bottom: 1.2rem;
	margin-top: -1rem;
}

.atm-payment-alert {
	color: #2d363b;	
	border-color: #d9edf7;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	font-family: 'BerninaSans';
	display: flex;	
	align-items: center;	
	align-self: stretch;	
}

.atm-icon {
	width: 2rem;
	height: 2rem;
	padding: 0px;
	margin: 0 1.2rem 2.5rem 1.2rem;	
}

.underpayment-icon {
	width: 2.1rem;
	height: 2.1rem;
	padding: 0px;
	margin: 0 1.6rem 0 1.2rem;
	color: #FDB7141A;
}

.min-payment-error {
	color: #EB161E;
	font-family: BerninaSans;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px;
	letter-spacing: -0.22px;
	display: flex;
	align-items: center;
	margin-bottom: 1.5rem;
	/* padding-top: 1.2rem; */
	padding-bottom: 1rem;
	margin-top: -1rem;
	margin-left: -0.5rem;
}

input#PaymentAmount.payAmt-validation-error {
	border: 1px solid #E80C4D;
}

input#emailId.email-validation-error {
	border: 1px solid #E80C4D;
}

.currency-icon > input[type="text-control"].input-validation-error {
	border: 1px solid #E80C4D;
}
.minpayment-alert-icon {
	width: 16px;
	height: 16px;
	margin-right: 8px;
	margin-left: 8px;
}

/*****Input text box with $ sign *******/
.text-control {
	display: flex;
	width: -webkit-fill-available;
	height: 34px;
	padding: 0px 12px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #555;
	background-color: #fff;
	background-image: none;
	border: 1px solid #6961619e;
	border-radius: 4px;
	padding-left: 25px;
	font-family: 'BerninaSans';
}


.currency-icon {
	position: relative;
}

	.currency-icon > i {
		position: absolute;
		display: flex;
		top: 33%;
		/*	transform: translate(0, -50%);*/
		pointer-events: none;
		width: 25px;
		height: 34px;
		text-align: center;
		font-style: normal;
		font-family: 'BerninaSans';
		font-size: 14px;
		padding-left: 1rem;
		align-items:inherit;
	}

	.currency-icon > input[type="text-control"] {
		padding-left: 18px;
		padding-right: 0;
	}

.currency-icon input[type="text"] {
		padding-left: 18px;
}


.tooltiptext.tooltiptext-top {
	width: 25rem;
	margin-right: 55px;
}

@media (min-width: 400px) and (max-width: 767px) {
	.info-icon {
		width: 2rem !important;
		height: 2rem !important;
	}
}

@media (min-width: 767px) and (max-width : 1190px) {
	.tooltiptext-top::after {
		position: absolute !important;
		left: 31% !important;
	}
}
@media (min-width: 1200px) {
	.tooltiptext-top::after {
		position: absolute !important;
		left: 45% !important;
	}
}

	.disabled-textlink, .disabled-textlink:hover {
		color: #959595;
		text-decoration: none;
	}


	/*********************************************/
	/************ Check Box **********************/
	/********************************************/
	.checkbox-gray {
		background-color: rgba(77, 77, 77, 0.05);
		height: auto;
		align-items: baseline;
	}

	.autopay-checkbox-text {
		padding-left: 1rem;
		font-size: 1.4rem;
		display: inline-block;
		margin: 0.5rem 0 0 4rem;
		width: 61.8rem;
		line-height: 2.4rem;
	}

	.autopay-checkbox-info-text {
		padding-left: 1rem;
		font-size: 1.4rem;
		display: inline-block;
		width: 61.8rem;
		line-height: 2.4rem;
	}

	.autopay-checkbox {
		position: absolute;
		margin-top: 1rem !important;
		margin-left: 2rem !important;
		/*margin-right: 1.6rem !important;*/
	}

		.autopay-checkbox input[type=checkbox]:checked {
			background-color: #003a5d;
		}
	/****** Date PickerIcon *****/

	.ui-datepicker {
		/*width: 43%;
	border-right: 1px solid #4D4D4D;
	border-bottom: 1px solid #4D4D4D;
	border-left: 1px solid #4D4D4D;
	background: #FFF;*/
	}


	.ui-datepicker-header {
		background: none;
		background-color: transparentMailS;
		color: black;
		border: none;
		margin-top: 21px;
	}

	.ui-datepicker .ui-datepicker-title {
		font-family: BerninaSans;
		font-size: 16px;
		font-weight: 600;
		font-stretch: normal;
		font-style: normal;
		line-height: 1.5;
		letter-spacing: -0.25px;
	}

	.ui-datepicker table {
		background-color: white;
		margin-top: 21px;
		width: 98%;
	}

	.ui-widget-content {
		border-right: 1px solid #4D4D4D;
		border-bottom: 1px solid #4D4D4D;
		border-left: 1px solid #4D4D4D;
		background: #FFF;
		width: 798px;
	}

	.ui-datepicker th {
		font-family: BerninaSans;
		font-size: 14px;
		font-weight: normal;
	}

	.ui-datepicker td {
		font-family: BerninaSans;
		font-size: 14px;
		font-weight: normal;
		padding-left: 35px;
	}

	.ui-datepicker th.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
		height: 32px;
		width: 32px;
		margin-left: 7%;
		/*opacity: 0.4;*/
		font-family: BerninaSans;
		font-size: 14px;
		font-weight: normal;
		font-stretch: normal;
		font-style: normal;
		line-height: 1.43;
		letter-spacing: normal;
		text-align: center;
		background: none;
		background-color: white;
		color: black;
		border: none;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.ui-icon.ui-icon-circle-triangle-e {
		background-image: url('../../Images/arrow-right-gray.png');
		background-position: initial;
	}

	.ui-icon.ui-icon-circle-triangle-w {
		background-image: url('../../Images/arrow-left-gray.png');
		background-position: initial;
	}

	.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
		width: 5em;
	}

	.ui-datepicker-next:hover {
		background-color: transparent;
		border: none;
	}

	.ui-datepicker-prev:hover {
		background-color: transparent;
		border: none;
	}

	.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active::before {
		/*height: 32px;
	width: 32px;*/
		content: "";
		display: block;
		border: 2px solid #007db9; /* Border color of the circle */
		border-radius: 2rem; /* Create a circular shape */
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #007db9;
		color: white;
	}

	.ui-state-highlight {
		content: "" !important;
		display: block !important;
		border: 2px solid #007db9 !important;
		border-radius: 50% !important;
		display: flex !important;
		justify-content: center !important;
		align-items: center !important;
		color: black !important;
	}

	td a.ui-state-default.ui-state-highlight.ui-state-active {
		color: white !important;
	}

	td a.ui-state-default.ui-state-highlight {
		color: #007db9 !important;
	}

	.paymentDate {
		position: relative;
	}

		.paymentDate .datepicker {
			padding-right: 30px;
		}

		.paymentDate .icon {
			position: absolute;
			right: -10px;
			top: 31%;
			/*width: 20px;*/
			height: 20px;
			margin: 10px 0px 0px -32px;
			display: inline;
			vertical-align: middle
		}

	.DisplayNone {
		display: none;
	}

	form-container {
		padding: 54px 40px;
	}

	.hideSlectOption {
		display: none;
	}

	/* invalid alert box*/
	input#PaymentDate.datepicker.hasDatepicker.input-alert-error {
		border: 1px solid #E80C4D;
	}

	/* invalid alert box for paymentMethod.*/
	select#PaymentAccount.validation-error {
		border: 1px solid #E80C4D;
	}

	#PaymentAccount.validation-error {
		border: 1px solid #E80C4D;
	}

	.linkText {
		font-size: 14px;
		text-decoration: underline rgba(0, 125, 185, 0.30) !important;
	}

	/*------------------------------------------------------------------------
	StyleSheet used for pages: 
		1. PaymentConfirmation
		2. PaymentError
		3. PaymentSummary

	Author: Maxim Kaloty
	Date: 12/19/2023
-------------------------------------------------------------------------*/
	.container-pb {
		padding: 40px 54px;
		font-family: 'BerninaSans';
	}

		.container-pb:before,
		.container-pb:after {
			line-height: 0;
			content: "";
		}

		.container-pb:after {
			clear: both;
			padding: 40px 54px;
		}

	.row {
		display: inherit;
		flex-wrap: wrap;
		margin: 0 20px;
	}

	[class*="span"] {
		float: left;
		min-height: 1px;
		margin-left: 0px;
	}

	.col-lg-1 {
		width: 8.33%;
	}

	.col-lg-2 {
		width: 16.66%;
	}

	.col-lg-3 {
		width: 25%;
	}

	.col-lg-4 {
		width: 33.33%;
	}

	.col-lg-5 {
		width: 41.66%;
	}

	.col-lg-6 {
		width: 50%;
	}

	.col-lg-7 {
		width: 58.33%;
	}

	.col-lg-8 {
		width: 66.66%;
	}

	.col-lg-9 {
		width: 75%;
	}

	.col-lg-10 {
		width: 83.33%;
	}

	.col-lg-11 {
		width: 91.66%;
	}

	.col-lg-12 {
		width: 100%;
	}

	.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
		float: left;
		box-sizing: border-box;
	}

	.inline-flex {
		display: inline-flex;
	}

	.text-left-pb {
		text-align: left;
	}

	.text-right-pb {
		text-align: right;
	}

	.text-center-pb {
		text-align: center;
	}

	.v-align {
		vertical-align: middle;
	}

	.imgIcon {
		display: inline-block;
		vertical-align: middle;
	}

	.h2-pb {
		font-size: 28px;
		font-style: normal;
		font-weight: 300;
		line-height: 32px;
		letter-spacing: -0.5px;
		display: inline-block;
		color: #000;
	}

	.nowrap-pb {
		text-wrap: nowrap;
	}

	.h3-pb {
		font-size: 24px;
		line-height: 32px;
		font-style: normal;
		letter-spacing: -0.22px;
		display: inline-block;
		color: #222;
	}

	.h4-pb {
		font-size: 20px;
		font-style: normal;
		line-height: 28px;
		letter-spacing: -0.25px;
		color: #222;
		align-self: stretch;
		font-weight: 300;
	}

	.h5-pb {
		font-size: 16px;
		font-style: normal;
		font-weight: 600;
		line-height: 24px;
		letter-spacing: -0.25px;
		color: #222;
	}

	.p-pb {
		color: #222;
		font-family: BerninaSans;
		font-size: 16px;
		font-style: normal;
		font-weight: 400;
		line-height: 24px;
		letter-spacing: -0.22px;
	}

	.amt-bold-pb {
		font-size: 16px;
		font-style: normal;
		font-weight: 700;
		line-height: normal;
		letter-spacing: -0.08px;
	}

	.label-pb {
		padding-top: 10px;
		font-size: 16px;
		font-style: normal;
		font-weight: 400;
		line-height: 24px;
		letter-spacing: -0.22px;
		color: #222;
	}

	.btn-pb {
		display: inline-flex;
		min-width: 140px;
		padding: 15px 30px;
		justify-content: center;
		gap: 10px;
		border-radius: 30px;
		background: var(--Primary-Palette-Primary-Red, #EB161E);
		border: none;
		text-transform: capitalize;
		color: #FFF !important;
		text-align: center;
		font-size: 14px;
		font-style: normal;
		line-height: 16px;
		text-decoration: none !important;
	}

		.btn-pb:hover {
			background-color: #BB1218;
			opacity: 1;
			border-radius: 23px;
			text-decoration: none !important;
			box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.2);
			position: relative;
			left: -1px;
			animation: slide 15s ease-in-out 5s normal;
		}


	.btn-white {
		display: inline-flex;
		padding: 15px 30px;
		justify-content: center;
		gap: 10px;
		border-radius: 30px;
		border: 1px solid var(--Primary-Palette-Primary-Red, #EB161E);
		background: var(--Primary-Palette-Primary-Red, #FFF);
		text-decoration: none !important;
		text-transform: capitalize;
		color: #EB161E !important;
		text-align: center;
		font-size: 14px;
		font-style: normal;
		line-height: 16px;
	}

	hr {
		height: 1px;
		background: rgba(77, 77, 77, 0.20);
	}

	.warning-span {
		padding: 14px 10px;
		background: rgba(253, 183, 20, 0.10);
	}

	.warning-pb {
		gap: 10px;
		align-self: stretch;
		font-size: 14px;
		font-style: normal;
		font-weight: 400;
		line-height: 20px;
		letter-spacing: -0.22px;
		display: flex
	}

	.warning-icon {
		padding: 7px 10px 0px 0px;
		float: left;
	}

	.alert-pb {
		gap: 10px;
		align-self: stretch;
		font-size: 14px;
		font-style: normal;
		font-weight: 400;
		line-height: 20px;
		letter-spacing: -0.22px;
		display: flex;
		font-family: 'BerninaSans';
	}

	.alert-icon {
		padding: 0px 10px 0px 0px;
		float: left;
	}

	.alert-span {
		padding: 14px 10px;
		background: rgba(232, 22,30, 0.1);
	}

	.padRSlabel-pb {
		padding: 15px 0 0 0;
	}

	/*Defining the padding of 24px for spacing*/
	.padding-24l {
		padding-left: 24px;
	}

	.padding-24B {
		padding-bottom: 24px;
	}

	.padding-24T {
		padding-top: 24px;
	}

	.padding-24R {
		padding-right: 24px;
	}


	.hidden-lg-pb {
		display: none;
	}

	.bold-text {
		color: #222;
		font-family: "BerninaSans";
		font-size: 16px;
		font-style: normal;
		font-weight: 600;
		line-height: 24px;
		letter-spacing: -0.22px;
	}

	.pb-modal-container {
		padding: 30px 30px 30px 30px;
	}

	.p-small {
		display: block;
		justify-content: center;
	}

	/*===========================================================*/
	/* For Mobile View */
	/*===========================================================*/
	@media (max-width: 767px) {
		.container-pb {
			padding: 36px 20px;
		}

		.row {
			display: inherit;
			flex-wrap: wrap;
		}

		.col-sm-1 {
			width: 8.33%;
		}

		.col-sm-2 {
			width: 16.66%;
		}

		.col-sm-3 {
			width: 25%;
		}

		.col-sm-4 {
			width: 33.33%;
		}

		.col-sm-5 {
			width: 41.66%;
		}

		.col-sm-6 {
			width: 50%;
		}

		.col-sm-7 {
			width: 58.33%;
		}

		.col-sm-8 {
			width: 66.66%;
		}

		.col-sm-9 {
			width: 75%;
		}

		.col-sm-10 {
			width: 83.33%;
		}

		.col-sm-11 {
			width: 91.66%;
		}

		.col-sm-12 {
			width: 100%;
		}

		.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
			position: relative;
			float: left;
			box-sizing: border-box;
		}

		.align-centre {
			text-align: center;
		}

		.align-right {
			text-align: unset;
		}

		.v-align {
			vertical-align: middle;
		}

		.h3-pb {
			font-size: 24px;
			line-height: 32px;
			letter-spacing: -0.22px;
			display: block;
		}

		.h4-pb {
			font-size: 20px;
			font-style: normal;
			line-height: 28px;
			letter-spacing: -0.25px;
		}

		.p-pb {
			font-size: 16px;
			line-height: 24px;
			letter-spacing: -0.22px;
		}

		.label-pb {
			padding-top: 0px;
			text-align: left;
		}

		.bold-text {
			color: #222;
			font-family: "BerninaSans";
			font-size: 16px;
			font-style: normal;
			font-weight: 600;
			line-height: 24px;
			letter-spacing: -0.22px;
		}

		.btn-pb {
			display: inline-flex;
			min-width: 140px;
			padding: 15px 30px;
			justify-content: center;
			align-items: center;
			gap: 10px;
			align-self: stretch;
			border-radius: 30px;
			background: var(--Primary-Palette-Primary-Red, #EB161E);
			border: none;
			width: 78%;
			text-transform: capitalize;
			color: #FFF !important;
			text-align: center;
			font-size: 14px;
			font-style: normal;
			font-weight: 600;
			line-height: 16px;
			width: 78%;
		}

		.btn-white {
			display: inline-flex;
			min-width: 140px;
			padding: 15px 30px;
			justify-content: center;
			gap: 10px;
			border-radius: 30px;
			border: 1px solid var(--Primary-Palette-Primary-Red, #EB161E);
			background: var(--Primary-Palette-Primary-Red, #FFF);
			text-transform: capitalize;
			color: #EB161E !important;
			text-align: center;
			font-size: 14px;
			font-style: normal;
			font-weight: 600;
			line-height: 16px;
			text-decoration: none;
			width: 78%;
		}

		/*spacing*/
		.padding-sm-24l {
			padding-left: 24px;
		}

		.padding-sm-24B {
			padding-bottom: 24px;
		}

		.padding-sm-24T {
			padding-top: 24px;
		}

		.padding-sm-24R {
			padding-right: 24px;
		}


		/*---------------------------------*/
		.paybill-alert-info {
			line-height: 2rem
		}


		.paybill-header {
			font-family: BerninaSans;
			font-size: 24px;
			font-weight: 300;
			letter-spacing: -0.22px;
		}

		.paybill-center-align {
			font-family: BerninaSans;
			font-size: 20px;
			font-style: normal;
			font-weight: 300;
			line-height: 28px;
		}

		.mobile-bottom-buttons {
			width: 100%;
			background: #fff;
			height: auto;
			padding: 20px 20px;
			position: fixed;
			bottom: 0.5%;
			box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.2);
		}

			.mobile-bottom-buttons .paybill-btn-red {
				width: 15rem;
				height: 5rem;
				padding: 1.5rem 0.8rem;
			}

			.mobile-bottom-buttons .blue-text-pb {
				align-self: center;
				top: 0;
			}

		.pb-modal-container {
			padding: 20px 20px 20px 30px;
		}

		.p-small {
			text-align: center;
		}

		.btm-modal-btns {
			padding-top: 2.4rem;
		}
	}

	@media (min-width: 768px) {
		.padding-30L {
			padding-left: 30px;
		}
	}


	@media all and (min-width: 400px) and (max-width: 768px) {

		.ui-widget-content {
			width: 88vw;
		}

		.ui-datepicker td {
			font-family: BerninaSans;
			font-size: 14px;
			font-weight: normal;
			padding-left: 0px;
		}

		.info-icon-mobile {
			width: 3rem !important;
			height: 3rem !important;
		}		
	}


	@media all and (max-width:400px) {

		.ui-widget-content {
			width: 82.8vw;
		}

		.ui-datepicker td {
			font-family: BerninaSans;
			font-size: 14px;
			font-weight: normal;
			padding-left: 0px;
		}

		.terms-condition label {
			font-size: 12px !important;
		}
	}

	@media all and (max-width:300px) {
		.terms-condition label {
			font-size: 10px !important;
		}
	}

	/*-----------------------------------------------------------------*/
	.form-pb {
		display: flex;
		flex-direction: column;
		width: 100% !important;
		/*border: 1px solid blue;*/
	}

	.NoPaymentMethodsSaved {
		float: left;
		margin-top: 20px;
		margin-bottom: 30px;
		font-weight: 400;
		font-family: BerninaSans;
		font-size: 14px;
	}

	.floatRight {
		float: right;
	}

	.NoPaymentMethodsSavedBtn {
		width: auto;
		color: #fff;
		border: none;
		text-align: center;
		font-weight: normal;
		font-family: 'BerninaSans';
		font-size: 14px;
		min-width: 130px;
		display: flex;
		min-width: 140px;
		padding: 15px 50px;
		justify-content: center;
		margin: 0px !important;
		float: right;
		align-items: center;
		gap: 10px;
		border-radius: 30px !important;
		background: var(--Primary-Palette-Primary-Red, #EB161E);
	}

		.NoPaymentMethodsSavedBtn:disabled {
			box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.2);
			border: 1px solid var(--Neutrals-Medium-Gray, #959595) !important;
			background-color: #fff;
			color: #959595;
		}

	.hidden-btn {
		display: block;
	}

	.floatRight-velocity-button {
		margin-left: 52% !important;
	}

	.addNewPaymentAccount {
		margin-left: 70px !important;
	}

	@media (max-width: 730px) {
		.addNewPaymentAccount {
			margin-left: 0px !important;
		}

		.NoPaymentMethodsSaved {
			Display: none;
		}

		.NoPaymentMethodsSavedBtn {
			width: 100% !important;
			margin: 8px 0px 20px 0px !important;
		}
	}

/*--------------------------------------------------------Purl Payment--------------------------------------------------------------------------*/
.nofuturedate-warning {
	color: #2d363b;
	background-color: lightblue;
	border-color: #d9edf7;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	font-family: 'BerninaSans';
	display: flex;
	/*min-height: 38px;*/
	/*padding: 8px 10px;*/
	align-items: center;
	/*gap: 10px;*/
	align-self: stretch;
	margin-bottom: 15px;
	margin-bottom: 1.5rem;
	padding-top: 1.2rem;
	padding-bottom: 1.2rem;
	margin-top: -1rem;
}

.futuredatewarning-icon {
	width: 4rem;
	padding-left: 1rem;
	padding-right: 1rem;
	color: #FDB7141A;
	font-family: Tahoma;
}

.purlpay-card-label {
	color: #000000;
	font-style: normal;
	display: flex;
	letter-spacing: -0.22px;
}

.NoPaymentMethodsSavedBtn {
	width: 100% !important;
	margin: 8px 0px 20px 0px !important;
}
#cardform label {
	cursor: auto;
}
.modal-container-pbill label {
	cursor: auto;
}
.paybill-card-form label {
	cursor: auto;
}