#body {
	min-height: 100vh !important;
	/*This is for SmartAdmin-prod.min min-height1190px   12/06/2020*/
}
#merchantinfocompanyname{
	font-size: 20px;
}
:root {
	
	--hue: 220;
	--sat: 100;
	--light: 50;
}
.hello{
	font-weight: 700;
}
.mr-8{
	margin-top: 8px;
}

.error-a{
float: right;
padding: 14px;
font-size: 15px;
}

.alert-warning {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}


.alert {
    position: relative;
    padding: 1.4rem 1.6rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
}

.error-link{
	cursor: pointer;
    font-size: 16px;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

/* css changes for Page title Word break 12/06/2020 */
.wordWrap2{
	word-break: break-all;
	width: 100%;
}

.wordWrap{
	word-break: break-all;
	width: 290px;
}
.mr-5{
	margin-right: 5px;
}
.my-10{
	margin-top: 8px;
}

.pl-40{

	padding-left: 44px;
}
.mx-10{
	margin-left: 10px;
}
.z-2{
	zoom: 1.5;
}

.l-30{
	line-height: 30px;
}
.va-b{vertical-align: bottom};

.py-0{
padding-top: 0 !important;
}
td a + a {
	margin-left: 3px !important;
 } 

 
.mx-30{
	margin-right: 30px;
}
.pageHeadingColor{
	font-size: 30px;
	line-height: 52px;
	vertical-align: middle;
}

.cus-width{
	display: inline !important;
	width:76% !important;

	
}

.borderUpDown{
    border-top: 1px solid #D3D3D3;
    border-bottom: 1px solid #D3D3D3;
    
}

.cusHeader{
	
	  --h: var(--hue);
	
	
		background: hsl(var(--h), calc(var(--sat) * 1%), calc(var(--light) * 1%));
	  
	 
	  --switch: calc((var(--light) - var(--threshold)) * -100%);
	  color: hsl(0, 0%, var(--switch));
	  
	
	  --border-light: calc(var(--light) * 0.7%);
	  --border-alpha:calc((var(--light) - var(--border-threshold)) * 10);
	  
	  border:.2em solid hsla(var(--h), calc(var(--sat) * 1%), var(--border-light), var(--border-alpha));
	}

.dropzoneheight {
	min-height: 100px;
}

.loginpagemargin {
	margin-top: 150px;
}
.error{
	color: #b94a48;
	border-color: #b94a48 !important;
}
.logoimg {
	width: 290px;
	
}

#addressinput {
	height: 30px;
}

.padding-45 {
	padding-left: 50px
}

.m-4 {
	margin: 5% !important;
}

/*
.radiomargin {
margin-top: 39px
}

@media screen and (max-width: 767px) {
.radiomargin {
    margin-top: 15px
}
}

@media screen and (max-width: 991px) {
.radiomargin {
    margin-top: 15px;
    padding-left: 0px;
}
}

@media screen and (max-width: 768px) {
.radiomargin {
    margin-top: 39px;
}
} */

.facebook {
	color: #3C5A99;
}

.twitter {
	color: #38A1F3;
}

.pinterest {
	color: #c8232c
}

.linkedin {
	color: #0077B5
}

.iconalign {
	vertical-align: middle;
}

.dropzonewidth {
	min-width: 100px;
	min-height: 100px;
}


/* .checkboxcolor{
position: absolute;
top: 3px;
left:0;
display: block;
outline: 0;
border-width: 1px;
border-style: solid;
background: #fff;
} */


/* input[type="checkbox"] {
visibility: hidden;
} */


/* input[type="checkbox"] label:before {
border: 1px solid #333;
content: "\00a0";
display: inline-block;
font: 16px/1em sans-serif;
height: 16px;
margin: 0 .25em 0 0;
padding: 0;
vertical-align: top;
width: 16px;
background: #fff;
}
input[type="checkbox"]:checked ~ label:before {
content: "\00a0";
background: #fff;
color: #fff;
content: "\2713";
text-align: center;
}
input[type="checkbox"]:checked ~ label:after {
content: "\00a0";
font-weight: bold;
background: #fff;
}

input[type="checkbox"]:focus ~ label::before {
  outline: rgb(59, 153, 252) auto 5px;
  background: #fff;
} */

.groupborder {
	/* border-left-color: #9cb4c5;
border-left-style: solid;
border-left-width: 5px;
padding-left: 10px; */
	margin-left: 20px;
	position: relative;
}

.sideborder {
	position: absolute;
	top: 0px;
	bottom: 10px;
	left: -20px;
	border-left-color: #9cb4c5;
	border-left-style: solid;
	border-left-width: 5px;
	padding-left: 10px;
}


/* .groupborder:nth-child(2) .sideborder{
bottom: 10px;
}

.groupborder:nth-child(3) .sideborder{
bottom: 10px;
} */


/* .groupborder:nth-child(4) .sideborder{
bottom: 20px;
}
.groupborder:nth-child(5) .sideborder{
bottom: 20px;
}
.groupborder:nth-child(6) .sideborder{
bottom: 40px;
} */

.mb-20{
	margin-bottom: 25px !important;
}
.my-5{
	margin-top: 5px;
}
.center-align{
position: relative;
top: 27px;
margin-left: -15px;
}

.checkboxheight {
	padding: 6px !important;
	margin-top: 1px;
}

.checkboxheight ::after {
	content: '\f00c';
	padding: 6px !important;
}

.aligncenter {
	vertical-align: middle;
	/* vertical-align: sub; */
	vertical-align: -webkit-baseline-middle;
	margin-top: 10px;
}

@media screen and (max-width: 768px) {
	input {
		margin-bottom: 20px;
	}
}

@media screen and (max-width: 768px) {
	label.radio {
		margin-bottom: 30px;
	}
	td a  {
		margin-bottom: 3px !important;
	 } 
}

@media screen and (max-width: 768px) {
	label.checkbox {
		margin-bottom: 10px;
	}
}

.aligncenter2 {
	vertical-align: middle;
	/* vertical-align: sub; */
	vertical-align: -webkit-baseline-middle;
	margin-top: 39px;
}

.loginbacground {
	background-color: #eaeaea !important;
}

.extrabackground {
	background-color: #eaeaea !important;
}

.toolbarheight {
	background-color: #404040;
	border-color: #383838;
	height: 69px;
}

.companyname {
	font-size: 40px;
	color: #fff;
	line-height: 52px;
	vertical-align: middle;
}
.txt-white{
	color: #fff !important;
}


.companynamediv {
	margin-top: 11px;
}

.footerborder {
	/* border-bottom: 1px solid */
	border-bottom: 1px solid rgba(0, 0, 0, .1);
}

.inputmargin {
	margin-top: 23px;
}

.margincheckbox {
	margin-top: 10px;
}

.widgetheight {
	min-height: 90px !important
}

.margintop3 {
	margin-top: 30px
}

.borderp {
	border-top: 1px solid #D3D3D3;
	border-bottom: 1px solid #D3D3D3;
	padding-left: 10px;
	margin-left: 0px
}

.borderbottom {
	border-bottom-color: #383838;
	border-bottom-style: solid;
	border-bottom-width: 5px;
	margin-left: 10px;
	margin-right: 10px;
}

.fontssize {
	font-size: 13px;
	font-weight: 500
}

.padd {
	padding-top: 23px
}

.margintop4 {
	margin-top: 5px
}

.orderbox {
	border-left: 1px solid #cac8c8;
	min-height: 400px;
	box-shadow: -3px 0px 4px #D3D3D3;
	padding-bottom: 500em;
	margin-bottom: -500em;
}

.payeeinfo {
	background-color: #f9fbfd;
	min-height: 400px;
	padding-bottom: 500em;
	margin-bottom: -500em;
}

.hideoverflow {
	overflow: hidden;
}

.previewfooter {
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	background-color: rgba(248, 248, 248, 0.9);
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.urlredirect-text{
	padding: 10px;
    font-size: 15px;
}

.marginsocialicons {
	margin-top: 10px;
}

.receiptlogoborder {
	border-bottom-color: rgba(0, 0, 0, .1);
	border-bottom-style: solid;
	border-bottom-width: 1px;
	margin-left: 10px;
	margin-right: 10px;
}

.wellclass {
	margin-left: 2px;
}

.my-10{
	margin-top: -10px;
}

.lh-35{
	line-height: 35px;
}

.pr-10{
	padding-right: 14px;
}

.ml-auto{
	margin-left: auto;
}

.d-flex {
	display: flex;
}

.mr-auto{
	margin-left: auto;
}

.mr-20{
	margin-right: 20px;
}

.mr-15{
margin-right: 12px;
}
.lh-90{
	line-height: 88px;
}
.close{
	opacity: 2.2 !important;
}
.scrollerY-400{
overflow-y: auto;
height: 400px;	
}

/*
.tooltip::before {
position: relative;
display: inline-block;
border-bottom: 1px dotted black;
/* If you want dots under the hoverable text */


/* } */

*/
/* Tooltip text */


/* .tooltip .tooltiptext {
visibility: hidden;
width: 120px;
background-color: black;
color: #fff;
text-align: center;
padding: 5px 0;
border-radius: 6px;

position: absolute;
z-index: 1;
} */


/* Show the tooltip text when you mouse over the tooltip container */


/* .tooltip:hover .tooltiptext {
visibility: visible;
} */

.customdiv {
	position: absolute;
	z-index: 49;
	top: 5px;
	left: 5764px;
}

.dz-message {
	display: none
}

.dropzonetext {
	padding-top: 20px;
}

.datecolor {
	color: #404040;
}

.paidbox {
	background-color: #404040;
	color: #ffffff;
	font-size: 18px;
	padding: 10px;
	
}
.mar-t-12{
	margin-top: 123px;
}
table1 {
	border: 1px solid #404040;
}

.tr1 {
	border: 3px solid #404040;
}

td1 {
	border: 1px solid #404040;
}

thead1 {
	border: 1px solid #404040;
}

td{
	white-space: nowrap;
}

.datefont {
	font-size: 15px;
}

.templatefooter {
	background-color: #404040;
	color: #ffffff;
	padding-top: 7px;
	padding-right: 14px;
	padding-bottom: 15px;
	padding-left: 14px;
	border-top: 1px solid #383838;
}

.borderfooter1 {
	border-top: 1px solid #404040;
	margin-right: 2px;
	margin-left: 2px;
	padding-top: 10px;
}

.logo2 {
	float: right;
}

@media screen and (max-width: 767px) {
	.logo2 {
		float: left;
	}
}

.receiptalign {
	float: right;
}

@media screen and (max-width: 767px) {
	.receiptalign {
		float: left;
	}
}

.boxalign {
	float: right;
}

@media screen and (max-width: 767px) {
	.boxalign {
		float: left;
	}
}

.datealign {
	float: left
}

.toolbarheight3 {
	padding-top: 7px;
	padding-right: 14px;
	padding-bottom: 15px;
	padding-left: 14px;
}
.receiptHeader{
	background-color: #356635;
}

.l-40{
	line-height: 40px;
}

.pad-l-20{
	padding-left: 24px;
}

button:disabled{
	cursor: not-allowed;
}
.inputtypeFile:disabled{
	cursor: not-allowed;
}
.templatefooter3 {
	background-color: #356635;
	color: #ffffff;
	padding-top: 7px;
	padding-right: 14px;
	padding-bottom: 15px;
	padding-left: 14px;
	border-top: 1px solid #8ac38b;
}
.ver-base{
vertical-align: sub;
}

.l-h-25{
	line-height: 25px;
}
.paidbox3 {
	background-color: #356635;
	color: #ffffff;
	font-size: 18px;
	padding: 10px;
	
}

.datecolor3 {
	color: #356635;
}

.font-20 {
	font-size: 20px
}

.thead3 {
	border: 3px solid #356635
}

.receiptborder {
	border-bottom: 1px solid #356635;
	margin-left: 0px;
	margin-right: 0px;
}

.toolbarheight4 {
	background-color: #305d8c;
	border-color: #9cb4c5;
	padding-top: 7px;
	padding-right: 14px;
	padding-bottom: 15px;
	padding-left: 14px;
}

.templatefooter4 {
	background-color: #305d8c;
	color: #ffffff;
	padding-top: 7px;
	padding-right: 14px;
	padding-bottom: 15px;
	padding-left: 14px;
	border-top: 1px solid #9cb4c5;
}

.paidbox4 {
	background-color: #305d8c;
	color: #ffffff;
	border: 5px solid #fff;
	font-size: 25px;
	padding: 10px;
	margin-right: 20px
}

.datecolor4 {
	color: #305d8c;
}

.thead4 {
	border: 3px solid #305d8c
}

.borderfooter {
	border-top: 1px solid #305d8c;
	margin-right: 2px;
	margin-left: 2px;
	padding-top: 10px;
}

.margint-35{
	margin-top: 35px;
}

.receipttop {
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	background-color: #D3D3D3;
	font-size: 18px;
	margin-left: 0px;
	margin-right: 0;
	margin-top: 5px;
}

.topblank {
	background-color: #D3D3D3;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	background-color: #D3D3D3;
	font-size: 18px;
	margin-left: 0px;
	margin-right: 0;
	min-height: 35px;
}

.templatefooter2 {
	background-color: #c26565;
	color: #ffffff;
	padding-top: 7px;
	padding-right: 14px;
	padding-bottom: 15px;
	padding-left: 14px;
	border-top: 1px solid #953b39;
}

.toolbarheight2 {
	background-color: #c26565;
	border-color: #953b39;
	padding-top: 7px;
	padding-right: 14px;
	padding-bottom: 15px;
	padding-left: 14px;
}

.paidbox2 {
	background-color: #c26565;
	color: #ffffff;
	font-size: 18px;
	padding: 10px;
	
}

.datecolor2 {
	color: #c26565;
}

.thead2 {
	border: 3px solid #c26565
}

.btnmargin {
	margin-top: 23px;
}

.tablefont {
	font-weight: normal !important
}

th {
	font-weight: normal
}


/* .tablescroll {
    width: 1186px;
    overflow-x: visible
} */

.borderfooter3 {
	border-top: 1px solid #D3D3D3;
	margin-right: 2px;
	margin-left: 2px;
	padding-top: 10px;
}

.lftalign {
	padding-left: 0px;
}

.leftalign {
	margin-left: 5px;
}


/* .nu-table-body {
    overflow-x: auto;
    max-width: 400px ! important;
} */

.logomargin {
	margin-bottom: 10px
}

.aligntop {
	margin-top: 38px;
}

.logomargin {
	margin-top: 10px;
}

.headerleft {
	margin-left: 12px;
}

.bcground {
	background-color: #ffffff !important
}


/* .widgetheight {
    min-height: 90px !important;
    max-height: 90px !important;
} */

.headerleftcal {
	margin-left: -20px;
}

.margintop2 {
	margin-top: 85px
}

.fixheader {
	margin-left: 0px !important;
}

tr.border_bottom  {
	border-bottom: 1px solid #ddd;
  }


/* .label1 {
    padding-left: 40px;
} */

.switch1 {
	margin-right: 50px
}

.sidemargin {
	margin-left: -47px;
}

.margintop {
	margin-top: 20px
}

.margintopaddbtn {
	margin-top: -23px
}

.font-1{
	font-size: 1.3rem;
}

.btnpadding {
	padding-top: 20px;
}

.topp {
	padding-top: 15px;
}

.addbtn {
	padding: 8px 12px 8px 12px !important;
}

.sidescroll {
	overflow: auto;
	height: 340px;
}

.tableinput {
	border-top: 0px;
	border-left: 0px;
	border-right: 0px;
	height: 24px;
}

.previewlogo {
	height: 50px;
	width: auto;
}


/* preview page */

.centeralign {
	text-align: center !important;
}

.centeralign img {
	display: inline;
}

.rightalign {
	float: right;
}

.leftalign {
	float: left;
}

.dropzone {
	min-height: 100px;
	padding: 0px;
}

#merchantinfobanner {
	background-size: contain;
	background-repeat: repeat;
}

.widgetheight {
	min-height: 69px !important;
}

#wellleftborder {
	border-left: 10px solid #396365 !important;
}

.fontswell {
	font-weight: 700;
	font-size: 2em;
}

.fontsizefooter {
	font-size: 10px;
}

.wizardheight {
	font-size: 12px !important;
	height: 37px !important;
	padding-bottom: 39px !important;
	line-height: 42px !important;
}

.lineheightwizard {
	line-height: 37px !important;
}

.fontsizebtn {
	font-size: 10px;
}

.addbtn {
	position: absolute;
	right: 44%;
	top: 21px;
	z-index: 999;
}

.margintopaddbtn {
	position: relative;
	top: 8px;
	left: 0;
}

.radiobtnpadding {
	padding-right: 20px;
}
.pl-33{
	padding-left: 33px;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	margin: 0;
}
input[type=date]::-webkit-inner-spin-button,
input[type=date]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	margin: 0;
}

.validationcolor {
	color: #b94a48
}
/* line height for merchant name on end user pages 15/06/2020 */

.my-class1{
	/* line-height: 20px;  */
	font-size: 22px;
	overflow-wrap: break-word;
	/* margin-top: 40px; */
}

.my-class2{
	line-height: 52px;
	 font-size: 36px	
}

.smalladdbtn {
	border: none !important;
	padding: 0px !important;
	background: none !important
}

.lh-72{
	line-height: 72px;
}
.mt-10{
	margin-top: 10px;
}

.mt-5{
	margin-top: 5px;
}

.p-0{
	padding: 0;
}

.label-align{
	vertical-align: text-top;
}

.labelAlign{
	line-height: 28px;

}

.borderheight {
	min-height: 260px !important
}

.footerpadding {
	padding-left: 10px;
	padding-right: 10px;
}

.paymentpagehieght {
	min-height: 400px !important;
}

.btn-align-center{
	vertical-align: -webkit-baseline-middle;

}
.ml22{
	margin-left: -22px;
}

.font-14{
	font-size: 14px;
	font-weight: bold;
	margin-top: 10px;
}

.my-60{
	margin-top: 60px;
}

.my-50{
margin-top: 50px;
}

.fs-i{
	font-style: italic;
	color: #b94a48;
	font-size: 14px;
}

.my-25{
	margin-top: 25px;
}

.my-20{
	margin-top: 20px;
}

.modal-btn{
top: -30px;
position: relative;
opacity: 1 !important;
}
.mb-15{
	margin-bottom: 15px !important
}

.mb-25{
	margin-bottom: 25px !important
}

.ml-16{
margin-left: 16px;
}

img {
    max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}
.cus-searchbox{
width:30rem !important;
font-size: 12px !important;
}

.linkhide a {
	display: none;
}
.customerrormsg {
	color: #b94a48
}
/* Css added for button going in next line 12/06/2020 */

.whiteSpace{
	white-space: nowrap 
}
#orderbox {
	background-color: #ffffff !important
}

#paymentbox {
	background-color: #f9fbfd
}

.fontpayment {
	font-size: 20px;
	font-weight: bold
}

.url_link {
	color: white;
	font-weight: bolder;
	font-size: 15px;
}

.breadcrumb_link {
	color: #305d8c !important;
}

tbody tr:last-child:not(.tr1) {
	border-bottom: 1px solid rgb(221, 221, 221);
}

.invalid {
	color: #b94a48;
}

a.dot {
	/* opacity: 0; */
	width: 0px;
	height: 0px;
	border-radius: 50%;
	border: 2px solid black !important;
	padding: 0px !important;
	color: black;
	margin-top: 20px;
	margin-right: -1px;
}

li.dot {
	content: '.';
	height: 5px;
	width: 5px;
}

.info-icon {
	position: absolute;
	bottom: calc(50% - 13px);
	left: 115px;
}

.mb-20{
margin-bottom: 20px;	
}


.margiT2{
	margin-top: 0px;
}

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

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

.text-align-r{
	text-align: right;
	}
.ml-7{
	margin-left: 7px;
}	
.fontSize-14{
font-size: 14px;
}


.headeCls{
display: block;
height: 49px;
margin: 0;
padding: 0 13px 0 0;
background-image: none;
background-color: #3aae97;
}	


#group_logo_in_group_list {
	width: 33px;
}

.bg-white{
	background:#ffffff;
	min-height: 100vh;
}

.bg-card{
	padding: 48px 40px 36px;
	border: 1px solid #dadce0;	
	border-radius: 8px;
	min-height: 570px;
	
}

.marginY-40{
	margin-top: 40px;
	margin-bottom: 40px;
}

.heading{
color: #202124;
font-family: 'Google Sans',arial,sans-serif !important;
}

.f-14{
	font-size: 14px;
}

.float-r{
	float: right;
}

.receipt-heading{
line-height: 30px;
font-size: 18px;
word-break: break-all;
color:#fff;
}

.receipt-heading2 {
    line-height: 35px;
    font-size: 25px;
    word-break: break-all;
    color: #fff;
}

.ml-20{
	margin-left: -20px;
	margin-top: 10px;
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
	/* Line Height Decreased for Merchant Name Issue on Webfront Payment Page 15/06/2020 */
 .my-class1{
	 line-height: 20px; 
	 font-size: 18px;
	 overflow-wrap: break-word;
	 margin-top: 55px;
 }
 
 .my-class2{
	 line-height: 52px;
		 font-size: 18px	
 }
	}

@media only screen and (max-width: 768px) {
	.my-class1{
		line-height: 20px; 
		font-size: 18px;
		overflow-wrap: break-word;
		margin-top: 55px;
	}
	
	.my-class2{
		line-height: 52px;
			font-size: 18px	
	}
		.margiT2{
				margin-top: 5px;
		}
		.ml-20{
			margin-left: -20px;
			margin-top: 10px;
		}

		.pl-40{
		
			padding-left: 0px;
		}
		.mx-10{
			margin-left: 1px;
		}
		
		.font-1{
		font-size: 1rem;
		}
		
		.text-align-l{
			text-align: left;
			}
			
			.text-align-r{
				text-align: left;
				}
		
		
		}

@media only screen and (max-width: 600px) {
			.margiT2{
					margin-top: 0px !important;
			}
			
			.text-align-l{
				text-align: left;
				}
				
			.text-align-r{
					text-align: left;
			}
			
			
}	

/* for fitting in tht webfront tittle in header: Added by Shruti 31_03_2020*/
@media (max-width:480px){
	.pageHeadingColor {
		font-weight: 700
	}

	.align_text{
		margin-top: 42px;
	}
	
	.marchant_name{
		font-size: 14px;
	}

	.float-l{
		float: left;
	}
	/* Line Height Decreased for Merchant Name Issue on Webfront Payment Page 15/06/2020 */
	.my-class1{
		line-height: 12px; 
		font-size: 14px;
		overflow-wrap: break-word;
		margin-top: 55px;
	}
	
	.my-class2{
		line-height: 52px;
			font-size: 18px	
	}

	.ml-20{
		margin-left: -20px;
	}

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

	.margincheckbox {
		margin-top: 10px;
	}

	.pr-10{
		padding-left: 14px;
	}
	}

	.my-class2{
		color: rgb(255, 255, 255) !important; 
		mix-blend-mode: difference;
	  }
	
	  .my-class1{
		color: rgb(255, 255, 255) !important; 
		mix-blend-mode: difference;
	  }