@font-face {
    font-family: 'sans-serif2';
    src: url('../webfonts/custom_font3.woff') format('woff');
    font-style: normal;
}
body{
	font-family: 'sans-serif2',sans-serif;
}
/*double scroll*/
.doubleScroll-scroll-wrapper{
	margin: auto;
}
/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #888; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555; 
}

.signature-pad--body{
	    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border: 1px solid #c5c5c5;
    width: fit-content;
}
/*pageloader*/
.page-loader{
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	left:0;
	background-color:#f3f3f3;
	z-index:999999999;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
	-webkit-box-pack:center;
	-ms-flex-pack:center;
	justify-content:center;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex
}.page-loader__spinner{
	position:
	relative;
	width:50px;
	height:50px	
}
.page-loader__spinner svg{
	-webkit-animation:rotate 2s linear infinite;
	animation:rotate 2s linear infinite;
	-webkit-transform-origin:center center;
	transform-origin:center center;
	width:100%;
	height:100%;position:absolute;top:0;left:0
}.page-loader__spinner svg circle{
	stroke-dasharray:1,200;stroke-dashoffset:0;
	-webkit-animation:dash 1.5s ease-in-out infinite,color 6s ease-in-out infinite;animation:dash 1.5s ease-in-out infinite,color 6s ease-in-out infinite;
	stroke-linecap:round
}

/*steper start*/
.waves-effect {
	position: relative;
}
label.invalid {
	font-size: 12.8px;
	font-size: .8rem;
	font-weight: 500;
	color: red!important;
	top: 50px!important
}

label.invalid.active {
	-webkit-transform: translateY(0)!important;
	-ms-transform: translateY(0)!important;
	transform: translateY(0)!important
}

ul.stepper .wait-feedback {
	left: 0;
	right: 0;
	top: 0;
	z-index: 2;
	position: absolute;
	width: 100%;
	height: 100%;
	text-align: center;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center
}

ul.stepper .step {
	position: relative;
	list-style: none
}

ul.stepper .step.feedbacking .step-new-content>:not(.wait-feedback) {
	opacity: .1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)"
}

ul.stepper .step:not(:last-of-type).active {
	margin-bottom: 2.25rem
}

ul.stepper .step:before {
	position: absolute;
	top: .75rem;
	counter-increment: section;
	content: counter(section);
	height: 1.75rem;
	width: 1.75rem;
	color: #fff;
	background-color: rgba(0, 0, 0, .3);
	-webkit-border-radius: 100%;
	border-radius: 100%;
	text-align: center;
	line-height: 1.75rem;
	font-weight: 400
}

ul.stepper .step.done:before,
ul.stepper .step.wrong:before {
	font-family: 'Font Awesome 5 free';
	font-weight: 900
}

ul.stepper .step.active:before {
	background-color: #4285f4
}

ul.stepper .step.done:before {
	content: '\f00c';
	font-size: 1rem;
	background-color: #00c851
}

ul.stepper .step.wrong:before {
	content: '\f071';
	font-size: 1.1rem;
	background-color: #ff3547
}

ul.stepper>li:not(:last-of-type) {
	margin-bottom: .625rem;
	-webkit-transition: margin-bottom .4s;
	-o-transition: margin-bottom .4s;
	transition: margin-bottom .4s
}

ul.stepper .step-title {
	margin: 0 -1.3rem;
	cursor: pointer;
	padding: .9688rem 2.75rem 1.5rem 4rem;
	display: block
}

ul.stepper .step-title:after {
	content: attr(data-step-label);
	display: block;
	position: absolute;
	font-size: .8rem;
	color: #424242;
	font-weight: 400
}

ul.stepper .step-title:hover {
	background-color: rgba(0, 0, 0, .06)
}

ul.stepper .step.active .step-title {
	font-weight: 500
}

ul.stepper .step-new-content {
	position: relative;
	display: none;
	height: calc(100% - 132px);
	width: inherit;
	overflow: visible;
	margin-left: 41px;
	margin-right: 24px
}

ul.stepper>.step:not(:last-of-type):after {
	content: '';
	position: absolute;
	top: 3.125rem;
	left: .8438rem;
	width: .0625rem;
	height: 40%;
	height: calc(100% - 38px);
	background-color: rgba(0, 0, 0, .1);
	-webkit-transition: all .4s;
	-o-transition: all .4s;
	transition: all .4s
}

ul.stepper>.step.active:not(:last-child):after {
	height: 93%;
	height: calc(100% - 12px)
}

ul.stepper>.step[data-last=true] {
	margin-bottom: 0
}

ul.stepper>.step[data-last=true]:after {
	height: 0;
	width: 0
}

ul.stepper .step-actions {
	display: -webkit-box;
	-webkit-box-pack: start
}

ul.stepper .step-actions .btn-flat:not(:last-child),
ul.stepper .step-actions .btn-large:not(:last-child),
ul.stepper .step-actions .btn:not(:last-child) {
	margin-right: .3125rem
}

ul.stepper .step-new-content .row {
	margin-bottom: .4375rem
}

ul.stepper .md-form label {
	left: .875rem
}

ul.stepper .md-form .validate {
	margin-bottom: 0
}

@supports not (-webkit-touch-callout:none) {
	.layout-fixed .wrapper .sidebar{
		    height: calc(100vh - 166px) !important;
	}
}

@media only screen and (min-width:993px) {
	ul.stepper.horizontal {
		position: relative;
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-webkit-justify-content: space-between;
		-ms-flex-pack: justify;
		justify-content: space-between;
		min-height: 20rem;
		margin-left: -1.5rem;
		margin-right: -1.5rem;
		padding-left: 1.5rem;
		padding-right: 1.5rem;
		overflow: hidden
	}
	ul.stepper.horizontal:before {
		content: '';
		background-color: transparent;
		width: 100%;
		min-height: 5.25rem;
		position: absolute;
		left: -3px;
		-webkit-border-top-left-radius: 2px;
		border-top-left-radius: 2px
	}
	ul.stepper.horizontal:first-child {
		margin: 0;
		padding: 0;
	}
	ul.stepper.horizontal .step {
		position: static;
		margin: 0;
		width: 100%;
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center;
		height: 5.25rem!important
	}
	ul.stepper.horizontal .step:not(:last-of-type):after {
		content: '';
		position: static;
		display: inline-block;
		width: 100%;
		height: .0625rem
	}
	ul.stepper.horizontal>.step:last-of-type,
	ul.stepper.horizontal>.step[data-last=true] {
		width: auto!important
	}
	ul.stepper.horizontal>.step.active:not(:last-of-type):after {
		content: '';
		position: static;
		display: inline-block;
		width: 100%;
		height: .0625rem
	}
	ul.stepper.horizontal .step.active .step-title:before {
		background-color: #4285f4
	}
	ul.stepper.horizontal .step.done .step-title:before {
		font-family: 'Font Awesome 5 Free';
		font-weight: 900;
		content: '\f00c';
		font-size: 1rem;
		background: #00c851
	}
	ul.stepper.horizontal .step.wrong .step-title:before {
		font-family: 'Font Awesome 5 Free';
		font-weight: 900;
		content: '\f071';
		font-size: 1.1rem;
		background-color: #ff3547
	}
	ul.stepper.horizontal .step-title {
		line-height: 5.25rem;
		height: 5.25rem;
		margin: 0;
		padding: 0 1.5625rem 0 4.0625rem;
		display: inline-block;
		max-width: 13.75rem;
		white-space: nowrap;
		overflow: hidden;
		-o-text-overflow: ellipsis;
		text-overflow: ellipsis;
		-ms-flex-negative: 0;
		-webkit-flex-shrink: 0;
		flex-shrink: 0
	}
	ul.stepper.horizontal .step:before {
		content: none
	}
	ul.stepper.horizontal .step .step-title:before {
		position: absolute;
		top: 1.7813rem;
		left: 1.1875rem;
		counter-increment: section;
		content: counter(section);
		height: 1.75rem;
		width: 1.75rem;
		color: #fff;
		background-color: rgba(0, 0, 0, .3);
		-webkit-border-radius: 100%;
		border-radius: 100%;
		text-align: center;
		line-height: 1.75rem;
		font-weight: 400
	}
	ul.stepper.horizontal .step-title:after {
		top: .9375rem
	}
	ul.stepper.horizontal .step-new-content {
		position: absolute;
		height: calc(100% - 84px);
		top: 6rem;
		left: 0;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
		margin: 0;
		padding: 1.25rem 1.25rem 4.75rem
	}
	ul.stepper.horizontal .step-actions {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		padding: 20px;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: reverse;
		-webkit-flex-direction: row-reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse
	}
	ul.stepper.horizontal .step-actions .btn-flat:not(:last-child),
	ul.stepper.horizontal .step-actions .btn-large:not(:last-child),
	ul.stepper.horizontal .step-actions .btn:not(:last-child) {
		margin-left: .3125rem;
		margin-right: 0
	}
	ul.stepper.horizontal .step-actions,
	ul.stepper.horizontal .step-new-content {
		padding-left: 2.5rem;
		padding-right: 2.5rem
	}
}
ul.horizontal-fix li a {
	padding: .84rem 2.14rem;
}
/*steper end*/

@-webkit-keyframes dash {
	0% {
		stroke-dasharray: 1, 200;
		stroke-dashoffset: 0
	}
	50% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -35px
	}
	100% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -124px
	}
}

@keyframes dash {
	0% {
		stroke-dasharray: 1, 200;
		stroke-dashoffset: 0
	}
	50% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -35px
	}
	100% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -124px
	}
}

@-webkit-keyframes color {
	0%,
	100% {
		stroke: #ff6b68
	}
	40% {
		stroke: #2196F3
	}
	66% {
		stroke: #32c787
	}
	80%,
	90% {
		stroke: #FF9800
	}
}

@keyframes color {
	0%,
	100% {
		stroke: #ff6b68
	}
	40% {
		stroke: #2196F3
	}
	66% {
		stroke: #32c787
	}
	80%,
	90% {
		stroke: #FF9800
	}
}
.txt{
    cursor: pointer;
    min-height: 12px;
    display: block;
}

.txt_order{
    cursor: pointer;
    min-height: 12px;
    display: block;
}

.txt_transfer{
    cursor: pointer;
    min-height: 12px;
    display: inline-block;
}

.select_input_transfer{
	cursor: pointer;
	min-height: 12px;
    padding: 7px 40px 7px 12px;
    width: 100%;
    border: 1px solid #E8EAED;
    border-radius: 5px;
    background: white;
    box-shadow: 0 1px 3px -2px #9098A9;
    cursor: pointer;
    transition: all 150ms ease;
    color: #5A667F;
}

.select_input_status{
	cursor: pointer;
	min-height: 12px;
    padding: 7px 40px 7px 12px;
    width: 100%;
    border: 1px solid #E8EAED;
    border-radius: 5px;
    background: white;
    box-shadow: 0 1px 3px -2px #9098A9;
    cursor: pointer;
    transition: all 150ms ease;
    color: #5A667F;
}

.product_cus_wrapper{
	position: relative;
	text-align: center;
	padding-bottom: 25px;
}

.product_cus_wrapper:hover > .product_cus_name2{
	bottom: 5px;
	background: #f1f1f1;
  background: rgba(241, 241, 241, .45);
  transition: bottom .5s ease-in-out;
  z-index: 0;
}

.product_cus_name2{
	position:absolute;
    bottom:-5px;
    width:100%;
    z-index: -10;
}
#assc_appl_sign, #assc_appl_sign3, #assc_appl_sign2, #appl_soa,#assc_appl_sign4{
		position: absolute;
    opacity: 0;
}
.was-validated #assc_appl_sign.form-control:invalid ~ .signature-pad--body,
.was-validated #assc_appl_sign2.form-control:invalid ~ .signature-pad--body,
.was-validated #assc_appl_sign3.form-control:invalid ~ .signature-pad--body,
.was-validated #assc_appl_sign4.form-control:invalid ~ .signature-pad--body,
#appl_soa.is-invalid ~ .signature-pad--body{
	border: 1px solid red;
}
.cert_file_a{
	border: 1px solid #ddd;
	padding: 5px;
	display: block;
}

.font-red{
	color: red;
}

.font-green{
	color:green;
}